yellow team mailing list archive

[Nicola Larosa <nicola.larosa@xxxxxxxxxxxxx>]

Nicola Larosa has proposed merging lp:~teknico/juju-gui/bug-1078910-serve-app-statically into lp:juju-gui.

Requested reviews:
  Juju GUI Hackers (juju-gui)
Related bugs:
  Bug #1078910 in juju-gui: "app directory should work with simply serving files"
  https://bugs.launchpad.net/juju-gui/+bug/1078910

For more details, see:
https://code.launchpad.net/~teknico/juju-gui/bug-1078910-serve-app-statically/+merge/138212

Serve runtime environment statically.

Create two new "prod" and "debug" environments, that are served
statically by a HTTP Python server. Keep serving the "devel"
environment dinamically by node.js, it will be made static
later. Make tests run in the "debug" environment. Refactor the
Makefile adding some docs and targets.

https://codereview.appspot.com/6878053/

-- 
https://code.launchpad.net/~teknico/juju-gui/bug-1078910-serve-app-statically/+merge/138212
Your team Juju GUI Hackers is requested to review the proposed merge of lp:~teknico/juju-gui/bug-1078910-serve-app-statically into lp:juju-gui.

=== modified file '.bzrignore'
--- .bzrignore	2012-11-15 21:53:49 +0000
+++ .bzrignore	2012-12-05 15:31:22 +0000
@@ -13,4 +13,4 @@
 Session.vim
 virtualenv
 yuidoc
-build
+build*

=== modified file 'Makefile'
--- Makefile	2012-12-05 12:58:02 +0000
+++ Makefile	2012-12-05 15:31:22 +0000
@@ -22,23 +22,38 @@
 	node_modules/rimraf node_modules/should node_modules/yui \
 	node_modules/yuidocjs
 EXPECTED_NODE_TARGETS=$(shell echo "$(NODE_TARGETS)" | tr ' ' '\n' | sort | tr '\n' ' ')
-
 TEMPLATE_TARGETS=$(shell bzr ls -k file app/templates)
+
+SRC=app
+ASSETS=$(SRC)/assets
+BUILD=build
+DEBUG=$(BUILD)-debug
+PROD=$(BUILD)-prod
+JUJU_UI=juju-ui
+BUILD_ASSETS=$(BUILD)/$(JUJU_UI)/assets
+DEBUG_ASSETS=$(DEBUG)/$(JUJU_UI)/assets
+PROD_ASSETS=$(PROD)/$(JUJU_UI)/assets
+
 SPRITE_SOURCE_FILES=$(shell bzr ls -R -k file app/assets/images)
-BUILD_ASSETS_DIR=build/juju-ui/assets
-SPRITE_GENERATED_FILES=$(BUILD_ASSETS_DIR)/stylesheets/sprite.css \
-	$(BUILD_ASSETS_DIR)/stylesheets/sprite.png
-PRODUCTION_FILES=$(BUILD_ASSETS_DIR)/modules.js \
-	$(BUILD_ASSETS_DIR)/config.js \
-	$(BUILD_ASSETS_DIR)/app.js \
-	$(BUILD_ASSETS_DIR)/stylesheets/all-static.css
+SPRITE_GENERATED_FILES=$(BUILD_ASSETS)/stylesheets/sprite.css \
+	$(BUILD_ASSETS)/stylesheets/sprite.png
+BUILD_FILES=$(BUILD_ASSETS)/app.js \
+	$(BUILD_ASSETS)/stylesheets/all-static.css
 DATE=$(shell date -u)
-APPCACHE=$(BUILD_ASSETS_DIR)/manifest.appcache
+APPCACHE=$(BUILD_ASSETS)/manifest.appcache
 
-all: build
+all:
+	@echo "Main targets:"
+	@echo "devel: run the development environment"
+	@echo "debug: run the debugging environment"
+	@echo "prod: run the production environment"
+	@echo "clean: remove all generated directories"
+	@echo "test: run tests in the browser"
+	@echo "prep: beautify and lint the source"
+	@echo "doc: generate Sphinx and YuiDoc documentation"
 
 build/juju-ui/templates.js: $(TEMPLATE_TARGETS) bin/generateTemplates
-	mkdir -p "$(BUILD_ASSETS_DIR)/stylesheets"
+	mkdir -p $(BUILD_ASSETS)/stylesheets
 	./bin/generateTemplates
 
 yuidoc/index.html: node_modules/yuidocjs $(JSFILES)
@@ -46,6 +61,9 @@
 
 yuidoc: yuidoc/index.html
 
+doc: yuidoc
+	make -C docs html
+
 $(SPRITE_GENERATED_FILES): node_modules/grunt node_modules/node-spritesheet $(SPRITE_SOURCE_FILES)
 	node_modules/grunt/bin/grunt spritegen
 
@@ -122,57 +140,90 @@
 
 spritegen: $(SPRITE_GENERATED_FILES)
 
-$(PRODUCTION_FILES): node_modules/yui node_modules/d3/d3.v2.min.js $(JSFILES) \
+$(BUILD_FILES): node_modules/yui node_modules/d3/d3.v2.min.js $(JSFILES) \
 		bin/merge-files lib/merge-files.js \
 		$(THIRD_PARTY_JS)
-	rm -f $(PRODUCTION_FILES)
-	mkdir -p "$(BUILD_ASSETS_DIR)/stylesheets"
+	rm -f $(BUILD_FILES)
+	mkdir -p $(BUILD_ASSETS)/stylesheets
 	./bin/merge-files
-	cp app/modules.js $(BUILD_ASSETS_DIR)/modules.js
-	cp app/config.js $(BUILD_ASSETS_DIR)/config.js
-
-combinejs: $(PRODUCTION_FILES)
+
+combine_js_css: $(BUILD_FILES)
+
+link_debug_files:
+	mkdir -p $(DEBUG_ASSETS)/stylesheets
+	ln -sf `pwd`/$(SRC)/favicon.ico `pwd`/$(DEBUG)/
+	ln -sf `pwd`/$(SRC)/index.html `pwd`/$(DEBUG)/
+	ln -sf `pwd`/$(SRC)/config-debug.js $(DEBUG_ASSETS)/config.js
+	ln -sf `pwd`/$(SRC)/modules-debug.js $(DEBUG_ASSETS)/modules.js
+	ln -sf `pwd`/$(SRC)/app.js `pwd`/$(DEBUG)/$(JUJU_UI)/
+	ln -sf `pwd`/$(SRC)/models `pwd`/$(DEBUG)/$(JUJU_UI)/
+	ln -sf `pwd`/$(SRC)/store `pwd`/$(DEBUG)/$(JUJU_UI)/
+	ln -sf `pwd`/$(SRC)/views `pwd`/$(DEBUG)/$(JUJU_UI)/
+	ln -sf `pwd`/$(SRC)/widgets `pwd`/$(DEBUG)/$(JUJU_UI)/
+	ln -sf `pwd`/$(ASSETS)/javascripts/yui/yui/yui-debug.js $(DEBUG_ASSETS)/app.js
+	ln -sf `pwd`/$(ASSETS)/images `pwd`/$(DEBUG_ASSETS)/
+	ln -sf `pwd`/$(ASSETS)/javascripts `pwd`/$(DEBUG_ASSETS)/
+	ln -sf `pwd`/$(ASSETS)/svgs `pwd`/$(DEBUG_ASSETS)/
+	ln -sf `pwd`/$(BUILD)/$(JUJU_UI)/templates.js `pwd`/$(DEBUG)/$(JUJU_UI)/
+	ln -sf `pwd`/$(BUILD_ASSETS)/manifest.appcache `pwd`/$(DEBUG_ASSETS)/
+	ln -sf `pwd`/$(BUILD_ASSETS)/stylesheets/all-static.css `pwd`/$(DEBUG_ASSETS)/stylesheets/
+	ln -sf `pwd`/$(BUILD_ASSETS)/stylesheets/juju-gui.css `pwd`/$(DEBUG_ASSETS)/stylesheets/
+	ln -sf `pwd`/$(BUILD_ASSETS)/stylesheets/sprite.css `pwd`/$(DEBUG_ASSETS)/stylesheets/
+	ln -sf `pwd`/$(BUILD_ASSETS)/stylesheets/sprite.png `pwd`/$(DEBUG_ASSETS)/stylesheets/
+
+link_prod_files:
+	mkdir -p $(PROD_ASSETS)/stylesheets
+	ln -sf `pwd`/$(SRC)/favicon.ico `pwd`/$(PROD)/
+	ln -sf `pwd`/$(SRC)/index.html `pwd`/$(PROD)/
+	ln -sf `pwd`/$(SRC)/config.js $(PROD_ASSETS)/config.js
+	ln -sf `pwd`/$(SRC)/modules.js $(PROD_ASSETS)/modules.js
+	ln -sf `pwd`/$(ASSETS)/images `pwd`/$(PROD_ASSETS)/
+	ln -sf `pwd`/$(ASSETS)/svgs `pwd`/$(PROD_ASSETS)/
+	ln -sf `pwd`/$(BUILD_ASSETS)/app.js `pwd`/$(PROD_ASSETS)/
+	ln -sf `pwd`/$(BUILD_ASSETS)/manifest.appcache `pwd`/$(PROD_ASSETS)/
+	ln -sf `pwd`/$(BUILD_ASSETS)/stylesheets/all-static.css `pwd`/$(PROD_ASSETS)/stylesheets/
+	ln -sf `pwd`/$(BUILD_ASSETS)/stylesheets/juju-gui.css `pwd`/$(PROD_ASSETS)/stylesheets/
+	ln -sf `pwd`/$(BUILD_ASSETS)/stylesheets/sprite.css `pwd`/$(PROD_ASSETS)/stylesheets/
+	ln -sf `pwd`/$(BUILD_ASSETS)/stylesheets/sprite.png `pwd`/$(PROD_ASSETS)/stylesheets/
 
 prep: beautify lint
 
-test: build
+test: build-debug
 	./test-server.sh
 
-debug: build
+devel: build
 	@echo "Customize config.js to modify server settings"
 	node server.js
 
-server: build
-	@echo "Running the application from a SimpleHTTPServer"
-	cd build && python -m SimpleHTTPServer 8888
-
-clean:
+debug: build-debug
+	@echo "Running the debug environment from a SimpleHTTPServer"
+	cd $(DEBUG) && python -m SimpleHTTPServer 8888
+
+prod: build-prod
+	@echo "Running the production environment from a SimpleHTTPServer"
+	cd $(PROD) && python -m SimpleHTTPServer 8888
+
+clean-builds:
+	rm -rf $(BUILD) $(DEBUG) $(PROD)
+
+clean-deps:
 	rm -rf node_modules virtualenv
+
+clean-docs:
 	make -C docs clean
-	rm -Rf build/
-
-build/index.html: app/index.html
-	cp -f app/index.html build/
-
-build/favicon.ico: app/favicon.ico
-	cp -f app/favicon.ico build/
-
-$(BUILD_ASSETS_DIR)/images: $(SPRITE_SOURCE_FILES)
-	cp -rf app/assets/images $(BUILD_ASSETS_DIR)/images
-	touch $@
-
-$(BUILD_ASSETS_DIR)/svgs: $(shell bzr ls -R -k file app/assets/svgs)
-	cp -rf app/assets/svgs $(BUILD_ASSETS_DIR)/svgs
-
-build_images: build/favicon.ico $(BUILD_ASSETS_DIR)/images \
-	$(BUILD_ASSETS_DIR)/svgs
+	rm -rf yuidoc
+
+clean: clean-builds clean-deps clean-docs
 
 build: appcache $(NODE_TARGETS) javascript_libraries \
-	build/juju-ui/templates.js yuidoc spritegen \
-	combinejs build/index.html build_images
+	build/juju-ui/templates.js spritegen
+
+build-debug: build combine_js_css link_debug_files
+
+build-prod: build combine_js_css link_prod_files
 
 $(APPCACHE): manifest.appcache.in
-	mkdir -p "build/juju-ui/assets"
+	mkdir -p $(BUILD_ASSETS)
 	cp manifest.appcache.in $(APPCACHE)
 	sed -re 's/^\# TIMESTAMP .+$$/\# TIMESTAMP $(DATE)/' -i $(APPCACHE)
 
@@ -186,6 +237,8 @@
 # appcache, and this provides the correct order.
 appcache-force: appcache-touch appcache
 
-.PHONY: test lint beautify server clean build_images prep jshint gjslint \
-	appcache appcache-touch appcache-force yuidoc spritegen yuidoc-lint \
-	combinejs javascript_libraries
+.PHONY: test lint beautify clean prep jshint gjslint appcache \
+	appcache-touch appcache-force yuidoc spritegen yuidoc-lint \
+	combine_js_css javascript_libraries build build-debug \
+	build-prod clean-builds clean-deps clean-docs devel debug \
+	prod link_debug_files link_prod_files doc all

=== added file 'app/config-debug.js'
--- app/config-debug.js	1970-01-01 00:00:00 +0000
+++ app/config-debug.js	2012-12-05 15:31:22 +0000
@@ -0,0 +1,11 @@
+var juju_config = {
+  consoleEnabled: true,
+  serverRouting: false,
+  html5: true,
+  container: '#main',
+  viewContainer: '#main',
+  // FIXME: turn off transitions until they are fixed.
+  transitions: false,
+  charm_store_url: 'http://jujucharms.com/',
+  socket_url: 'ws://localhost:8081/ws'
+};

=== modified file 'app/config.js'
--- app/config.js	2012-10-26 15:50:40 +0000
+++ app/config.js	2012-12-05 15:31:22 +0000
@@ -1,5 +1,5 @@
 var juju_config = {
-  consoleEnabled: true,
+  consoleEnabled: false,
   serverRouting: false,
   html5: true,
   container: '#main',

=== modified file 'test-server.js'
--- test-server.js	2012-11-19 20:07:19 +0000
+++ test-server.js	2012-12-05 15:31:22 +0000
@@ -12,14 +12,14 @@
   // avoid annoying the linter.
   server.use(express['static'](__dirname));
   // fallback to looking in assets
-  server.use('/juju-ui', express['static'](__dirname + '/app/'));
+  server.use('/juju-ui', express['static'](__dirname + '/build-debug/juju-ui'));
   server.use(express.bodyParser());
   server.use(express.methodOverride());
 });
 
 server.get('/juju-ui/:file', function(req, res) {
   var fileName = req.params.file;
-  res.sendfile('build/juju-ui/' + fileName);
+  res.sendfile('build-debug/juju-ui/' + fileName);
 });
 
 var port = 8084;
@@ -27,4 +27,3 @@
 server.listen(port, function() {
   console.log('Server listening on ' + port);
 });
-

=== modified file 'test/index.html'
--- test/index.html	2012-11-20 22:51:41 +0000
+++ test/index.html	2012-12-05 15:31:22 +0000
@@ -3,8 +3,8 @@
 <head>
   <meta charset="utf-8">
   <link rel="stylesheet" href="assets/mocha.css">
-  <script src="../app/assets/javascripts/yui/yui/yui-debug.js"></script>
-  <script src="../app/modules-debug.js"></script>
+  <script src="/juju-ui/assets/app.js"></script>
+  <script src="/juju-ui/assets/modules.js"></script>
   <script src="assets/chai.js"></script>
   <script src="assets/mocha.js"></script>
   <script src="utils.js"></script>