Posts

Showing posts with the label Chrome Extension

Material Design for the Chrome App/Ext Store

Image
    I don't work for Google but if I did I would show some love to the much needed chrome app & extension store. I would even take it further by making it have value to other browsers but that's another topic. Either way this article is able adding chrome's app/extensions to the play.google.com store. Taking the Google Play Layout and add Chrome App/Ext Using the Google Play's layout as a template but fitting the needs of the Chrome Store's needs BACKGROUND-COLOR: #FFC107 background-image : url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAQAAABKfvVzAAAABGdBT…DAS7ZcAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAABJRU5ErkJggg== ) ; } Original Look Note  The Google Play Layout has a minor bug where if you have a cropped screen in half of the window and scroll right it will sometime make the menu disappear. It will reappear when you scroll down, if this was on purpose why not make it like a side-nav component. Links

Project: DuckSauce Notes Part 5

     I've been secretly working on this project again (of course there's my game I am still working). However I wanted to take a step back and look at what this project has done for me. The biggest thing is that it has done is get me to question my work follow and think about how to improve it. This project must create files create templates clean up code build manual. New Approach     Working with the chrome work-space has its limits and it appears there is a method to set the contents of a particular however it is not implemented and is filed as a bug. This is a long outstanding bug so chances are slim. The guts https://github.com/GoogleChrome/chrome-app-samples/blob/master/samples/filesystem-access/js/app.js Reference https://www.npmjs.org/package/livereload https://github.com/livereload/livereload-extensions/tree/master/Chrome/LiveReload Resources https://github.com/GoogleChrome/chrome-app-samples/tree/master/samples/filesystem-access http://stackoverfl

Project: Aptitude-Words Update 1.2.5

Image
       Recently returned to my chrome extension because I had some features I wanted to see and needed improving. I like to pretend I'm the only person who really uses this extension because I really don't know who my users are or what they would like to see but I'm open to suggestions. There is stats for the extension on weekly users but I don't think much of it. You will need to re-enable with this update since I added Google Analytics but not using it yet. Features ( Live now!) Trash button (rather than click checkbox) Donation button (I'm doing this with all my free apps) This is a one time purchase in the app, I'm looking to get rich. Redrawing words after delete. In the Future  New Logo (working on the art with a material design look). Google Analytics (I'm curious to know what popular words ppl are captured.) Page to display - word of the day, logic to prevent bad words from showing so dont try it... Reordering words - Just a r

Chrome Extension Project: Aptitude Words Part 2

On my  previous article   I briefly introduced this project because it came to me when I had very little time but I knew if I didn't publish it at the time I probably wouldn't for another month. The project was finished as far as things going with a first wave of implementation and I have a lot of ideas to add on this project. This is application really for myself rather than any particular audience. With my design I looked at first how I wanted it to behave and its kinda interesting to see where I'll end up with this one. I don't let this project get in the ways of my high tasks and its really just for fun. So updates will probably minimal. You can get all the information about the project on Chrome marketplace . Future releases Categories - sometimes you need to organize them in a way to remember them. Removing - delete a whole category. Adding - Drag n' drop a word into a category Emails - Get weekly emails to let you know which words you use less ofte

Project: DuckSauce Notes Part IIII

     A lot of this article not going to make sense to people because it relates to my thoughts as I wrote them down and what I researched or tried to understand. Some of it is wrong, and looking back probably could have approached somethings better but that's just a natural way of learning.  Also a lot of my notes are going to appear as if I'm going in circles (or that's just how I see it). Previous articles can be found here . Day 1- 10/2/14     I started looking at the   chrome . devtools . panels . openResource , by resources I think the docs means a web page's resources not the devtool's resources (something that  work-spaces  might have access to).  The next part, "Requests DevTools to open a URL in a Developer Tools panel."  " The real power of  Work-spaces  lies in being able to map a local file to a URL (or “Network Resource”). Whenever Chrome loads the mapped URL, it displays the  work-space  folder contents in place of the network folder

Project: DuckSauce Notes Part III

    It's been a couple of weeks since I've released an update on this project, but much of it is due to the fact that I have completely reimplemented my approach. I now have a better understanding where browserify will come into place and where grunt will come into place. Most importantly I understand the v8 javascript engine which runs underneath the chrome browser; this is a major win for me. Here is my  previous article ... Day 1 Day 7: GruntJS LiveReload--Take Productivity to the Next Level | Openshift Blog I basically want to remove the need for LiveReload. Moving from CodeKit to Grunt Watch + LiveReload for Real-time JavaScript/LESS/SASS Compilation - Justin Klemm Another great example what LiveReload can do. Chrome Apps Office Hours: NodeJS in Chrome packaged apps - YouTube Example with Browserify but you can't using it against Grunt. Iced Blog - node js in chrome http://stackoverflow.com/questions/16788731/grunt-watch-multiple-files-compile-only

Chrome Extension Project: Aptitude Words

    I am currently working on two chrome extension projects, however this one is more of a warm up for what is ahead. Not to be confused with my other Chrome Project Ducksauce and not that I worked very long on this but I really should get back to my Unity project... So ignore these until I'm free again. Notes to self.      Don't using the create context menu code in a regular script because everytime you right click. There is a difference from the background page and the extension popup page. Each has it's own devtool and console page. For the background you have to click on the link provided in chrome://extensions/  for chrome. As for the popup you can just inspect it like you would with any page. However if you reload or update the extension the window for inspecting it closes. Question How do I use the storage in the popup as I would for the background page? How to communicate between popup.js and background.js in chrome extension? - Stack Overflow sending c

Project: DuckSauce Notes Part II

Working on the second part of my project... I now need to automate bootstrap builds and compare the bootstrap's unmodified version of bootstrap to the new styles that I have added or modified on the bootstrap compiled css. From there DuckSauce should separate the style changes and place them in a .less file and recompile, which will then override or append the proper styles. Day 3 Managing module dependencies - How To Node - NodeJS package.json  - More reading... Getting started - Grunt: The JavaScript Task Runner  - Docs, docs and more docs Moving from CodeKit to Grunt Watch + LiveReload for Real-time Compilation  - Lots of help Day 4 gruntjs/grunt-contrib-watch  - This is the direction I am heading now! No compatible version found: chalk@'0.4.0'   - Helping myself. This week had to cut my research a little short but I feel I am really close to a solution with little effect on my part since a lot what I need is already built and simply needs to be configured

Project: DuckSauce Notes

What is Ducksauce     Ducksauce is a small pet project I am working on to make everyday work easier with css and javascript cleanups. The hope is to automate those cleanups in controllable way I see fit, and to also make my code more scalable with third party libraries. Mission Listen to CSS changes and separate them into a .less file. Features  (Just for starters focusing on css cleanups) Console system to attach files/directories. Listen to CSS files Remove changes and separate into a less file. Compile new less files with Unmodified Third party styles (Overridering the css results) Log changes. Refresh page to see the changes? I would like this but it might get annoying. Day 1 Challenges: Listening to file, watch changes, find what those changes are. filesystems - Node.JS: How does "fs.watchFile" work? - Stack Overflow Node.js: Event Emitters and Listeners | Scribblings Accessing the File System in Node.js Observe file changes with node.js - Stack Ov