yellow team mailing list archive

[Thiago Veronezi <thiago@xxxxxxxxxxxx>]

Thiago Veronezi has proposed merging lp:~tveronezi/juju-gui/spritegen into lp:juju-gui.

Requested reviews:
  Juju GUI Hackers (juju-gui)

For more details, see:
https://code.launchpad.net/~tveronezi/juju-gui/spritegen/+merge/132077

Automatic sprite image generation

The Makefile will automatically generate the sprite png and css
files during the "make server" call for all the images under the 
"app/assets/images" folder.

https://codereview.appspot.com/6811050/

-- 
https://code.launchpad.net/~tveronezi/juju-gui/spritegen/+merge/132077
Your team Juju GUI Hackers is requested to review the proposed merge of lp:~tveronezi/juju-gui/spritegen into lp:juju-gui.

=== modified file '.bzrignore'
--- .bzrignore	2012-10-29 09:04:39 +0000
+++ .bzrignore	2012-10-30 11:48:52 +0000
@@ -19,3 +19,4 @@
 virtualenv
 yuidoc
 app/assets/manifest.appcache
+app/assets/sprite

=== modified file 'Makefile'
--- Makefile	2012-10-29 14:41:33 +0000
+++ Makefile	2012-10-30 11:48:52 +0000
@@ -7,10 +7,12 @@
 	node_modules/.bin node_modules/node-markdown node_modules/rimraf \
 	node_modules/mocha node_modules/d3 node_modules/graceful-fs \
 	node_modules/should node_modules/jshint node_modules/expect.js \
-	node_modules/express node_modules/yui node_modules/yuidoc
+	node_modules/express node_modules/yui node_modules/yuidoc \
+	node_modules/grunt node_modules/node-spritesheet
 TEMPLATE_TARGETS=$(shell bzr ls -k file app/templates)
 DATE=$(shell date -u)
 APPCACHE=app/assets/manifest.appcache
+SPRITEGEN-VERSION=1.0
 
 all: install
 
@@ -26,7 +28,7 @@
 	@ln -sf `pwd`/node_modules/yui ./app/assets/javascripts/
 	@ln -sf `pwd`/node_modules/d3/d3.v2* ./app/assets/javascripts/
 
-install: appcache $(NODE_TARGETS) app/templates.js yuidoc
+install: appcache $(NODE_TARGETS) app/templates.js yuidoc spritegen
 
 gjslint: virtualenv/bin/gjslint
 	@virtualenv/bin/gjslint --strict --nojsdoc --jslint_error=all \
@@ -48,6 +50,12 @@
 beautify: virtualenv/bin/fixjsstyle
 	@virtualenv/bin/fixjsstyle --strict --nojsdoc --jslint_error=all $(FILES)
 
+spritegen:
+	rm -Rf bin/sprite/
+	rm -Rf app/assets/sprite/
+	@node_modules/grunt/bin/grunt spritegen
+	mv bin/sprite app/assets/sprite/
+
 prep: beautify lint
 
 test: install

=== added file 'app/assets/img_trans.png'
Binary files app/assets/img_trans.png	1970-01-01 00:00:00 +0000 and app/assets/img_trans.png	2012-10-30 11:48:52 +0000 differ
=== modified file 'app/index.html'
--- app/index.html	2012-10-13 23:56:14 +0000
+++ app/index.html	2012-10-30 11:48:52 +0000
@@ -11,6 +11,7 @@
     <link rel="stylesheet"
           href="/juju-ui/assets/stylesheets/bootstrap-responsive-2.0.4.css">
     <link rel="stylesheet" href="/juju-ui/assets/stylesheets/juju-gui.css">
+    <link rel="stylesheet" href="/juju-ui/assets/sprite/sprite.css">
     <!--[if lt IE 9]>
     <script src="http://html5shim.googlecode.com/svn/trunk/html5.js";></script>
     <![endif]-->
@@ -26,12 +27,17 @@
               <div id="nav-brand-env">
                 <span>
                   <a class="brand" href="/">
-                    <img alt="Juju GUI" src="/juju-ui/assets/images/juju_logo.png" />
+                    <img alt="Juju GUI"
+                         class="sprite juju_logo"
+                         width="1" height="1"
+                         src="/juju-ui/assets/img_trans.png" />
                   </a>
                 </span>
                 <span class="nav-container">
                   <span class="nav-section">
-                    <img src="/juju-ui/assets/images/environment_icon.png" />
+                    <img class="sprite environment_icon"
+                         width="1" height="1"
+                         src="/juju-ui/assets/img_trans.png" />
                     <span id="environment-name"></span>
                     <span id="provider-type" class="provider-type"></span>
                   </span>
@@ -40,7 +46,9 @@
               <div id="nav-alerts-charms">
                 <span class="nav-container">
                   <span class="nav-section">
-                    <img src="/juju-ui/assets/images/alert_icon.png" />
+                    <img class="sprite alert_icon"
+                         width="1" height="1"
+                         src="/juju-ui/assets/img_trans.png" />
                     Alerts
                     <span id="notifications"></span>
                   </span>
@@ -48,8 +56,9 @@
                 <span class="nav-container" id="charm-search-trigger-container">
                   <span class="nav-section">
                     <span id="charm-search-trigger">
-                      <img id="charm-search-icon"
-                           src="/juju-ui/assets/images/charm_icon.png" />
+                      <img id="charm-search-icon" class="sprite charm_icon"
+                           width="1" height="1"
+                           src="/juju-ui/assets/img_trans.png" />
                       Charms
                       <i class="icon-chevron-down"></i>
                     </span>

=== added file 'grunt.js'
--- grunt.js	1970-01-01 00:00:00 +0000
+++ grunt.js	2012-10-30 11:48:52 +0000
@@ -0,0 +1,26 @@
+'use strict';
+
+module.exports = function(grunt) {
+  grunt.initConfig({
+    spritesheet: {
+      compile: {
+        options: {
+          outputImage: 'sprite/sprite.png',
+          outputCss: 'sprite/sprite.css',
+          selector: '.sprite'
+
+        },
+        files: {
+          'bin' : 'app/assets/images/*'
+        }
+      }
+    }
+  });
+
+  grunt.loadNpmTasks('node-spritesheet');
+  grunt.registerTask('spritegen', 'spritesheet');
+
+  grunt.registerTask('default', function() {
+    // noop
+  });
+};

=== modified file 'package.json'
--- package.json	2012-10-26 14:40:41 +0000
+++ package.json	2012-10-30 11:48:52 +0000
@@ -28,7 +28,9 @@
     "yuidocjs": "0.3.x",
     "minimatch": "0.2.x",
     "graceful-fs": "1.1.x",
-    "rimraf": "2.0.x"
+    "rimraf": "2.0.x",
+    "grunt": ">=0.2.0",
+    "node-spritesheet": ">=0.2.3"
   },
   "optionalDependencies": {}
 }