added build notes...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>

ui (gen4)/doc/BUILD-NOTES

@@ -0,0 +1,54 @@
+
+Chromium flicker issue
+----------------------
+
+This appears to be GPU related.
+
+package.json:
+	"chromium-args": "--disable-gpu-compositing",
+
+This will fix the issue temporarily, but still need a better solution.
+
+
+
+Remote debugging via DevTools
+-----------------------------
+
+Set this in package.json:
+  "chromium-args": "--remote-debugging-port=9222",
+
+Then open http://localhost:9222 in chrome.
+	
+
+
+Sharp
+-----
+
+To build sharp for a specific version of node:
+	cd ./node_modules/sharp/
+	node-gyp --target=v5.7.0 rebuild	# v5.7.0 is the version 
+						# of node used in nw.js
+
+
+Speedup loading of app
+----------------------
+
+One of the ways to speed up the load times when packed is to store Node's
+modules ./node_modules in a speporate loaction, outside of the the app.zip
+or package.nw
+To enable require(..) to find them:
+	- > npm install --save app-module-path
+	- when building the zip move all the modules out to a new location
+	  *except* app-module-path
+	- add this line to all root js modules *before* any other 
+	  require(..) is called:
+	  	if(process.__nwjs){
+			var path = require('path')
+			require('app-module-path')
+				.addPath(path.dirname(process.execPath) 
+					+ '/node_modules/')
+		}
+
+
+
+

ui (gen4)/features/app.js

@@ -147,6 +147,8 @@ var AppControlActions = actions.Actions({
 					that.storeWindowGeometry() 
 				}, 500)
 			})],
+
+	// XXX add ability to use devtools on background page (node context)...
 	showDevTools: ['Interface|Development/Show Dev Tools',
 		function(){
 			nw.Window.get().showDevTools &&

ui (gen4)/lib/widget/browse.js

@@ -171,11 +171,6 @@ var BrowserClassPrototype = {
 			.append($('<div>')
 				   .addClass('v-block list'))
 
-		// XXX make this part of the framework...
-		if(obj){
-			browser.data('widget-controller', obj)
-		}
-
 		return browser
 	},
 }

ui (gen4)/lib/widget/drawer.js

@@ -19,7 +19,7 @@ var DrawerClassPrototype = {
 	make: function(obj, client, options){
 		var that = this
 		var overlay = $('<div>')
-			.addClass('drawer-widget modal-widget' + (options.direction || 'bottom'))
+			.addClass('drawer-widget modal-widget ' + (options.direction || 'bottom'))
 			.append($('<div>')
 				.addClass('content')
 				.click(function(){
@@ -31,11 +31,6 @@ var DrawerClassPrototype = {
 			overlay.attr('tabindex', 0)
 		}
 
-		// XXX make this part of the framework...
-		if(obj){
-			overlay.data('widget-controller', obj)
-		}
-
 		return overlay
 	},
 }
@@ -80,8 +75,9 @@ var DrawerPrototype = {
 		if(handler == null){
 			var that = this
 			this.dom.animate({
-					scrollTop: this.options.direction == 'bottom'? 0 
-						: this.dom.find('.content')[0].scrollHeight,
+					scrollTop: this.options.direction == 'top'? 
+							this.dom.find('.content')[0].scrollHeight
+						: 0, 
 					opacity: 0,
 					filter: 'none',
 				}, 
@@ -120,24 +116,21 @@ var DrawerPrototype = {
 				that.close()
 			})
 			.css({ opacity: 0 })
-			.scrollTop(options.direction == 'bottom' ?  0
-				: options.direction == 'top' ?
+			.scrollTop(options.direction == 'top' ?
 					dom.find('.content')[0].scrollHeight
 				: 0)
 			.animate({
 					scrollTop: 
-						(options.direction == 'bottom' ?
-							Math.min(
+						(options.direction == 'top' ?
+							(dom.find('.content')[0].scrollHeight
+							 	- dom.outerHeight()
+								+ options['fade-at']) + 'px'
+						: Math.min(
 								client_dom.outerHeight(), 
 								// do not scroll more than the container height and
 								// keep a bit on top...
 								(parent.is('body') ? $(document) : parent)
-									.outerHeight()-options['fade-at']) + 'px'
-						: options.direction == 'top' ?
-							(dom.find('.content')[0].scrollHeight
-							 	- dom.outerHeight()
-								+ options['fade-at']) + 'px'
-						: 0),
+									.outerHeight()-options['fade-at']) + 'px'),
 					opacity: 1,
 				}, 
 				options['animate'],
@@ -145,25 +138,8 @@ var DrawerPrototype = {
 					dom.scroll(function(){
 						var st = $(this).scrollTop()
 
-						// bottom drawer...
-						if(options.direction == 'bottom'){
-							var h = Math.min(options['fade-at'], client_dom.outerHeight())
-
-							// start fading...
-							if(st < h){
-								dom.css({ opacity: Math.min(1, st/h) })
-
-							} else if(dom.css('opacity') < 1){
-								dom.css('opacity', 1)
-							}
-
-							// close drawer when scrolling to the top...
-							if(st < options['close-at']){
-								that.close()
-							}
-
 						// top drawer...
-						} else if(options.direction == 'top'){
+						if(options.direction == 'top'){
 							var h = dom.find('.content')[0].scrollHeight
 
 							// start fading...
@@ -178,6 +154,23 @@ var DrawerPrototype = {
 							if(st > h - options['close-at']){
 								that.close()
 							}
+
+						// bottom drawer...
+						} else if(options.direction == 'bottom'){
+							var h = Math.min(options['fade-at'], client_dom.outerHeight())
+
+							// start fading...
+							if(st < h){
+								dom.css({ opacity: Math.min(1, st/h) })
+
+							} else if(dom.css('opacity') < 1){
+								dom.css('opacity', 1)
+							}
+
+							// close drawer when scrolling to the top...
+							if(st < options['close-at']){
+								that.close()
+							}
 						}
 					})
 				})

ui (gen4)/lib/widget/overlay.js

@@ -42,11 +42,6 @@ var OverlayClassPrototype = {
 			overlay.attr('tabindex', 0)
 		}
 
-		// XXX make this part of the framework...
-		if(obj){
-			overlay.data('widget-controller', obj)
-		}
-
 		return overlay
 	},
 }

ui (gen4)/lib/widget/widget.js

@@ -59,6 +59,7 @@ var WidgetClassPrototype = {
 
 
 var WidgetPrototype = {
+	// NOTE: this must have .data('widget-controller', this) set...
 	dom: null,
 	client: null,
 
@@ -105,6 +106,8 @@ var WidgetPrototype = {
 		// build the dom...
 		if(this.constructor.make){
 			this.dom = this.constructor.make(this, options)
+
+			this.dom.data('widget-controller', this)
 		}
 
 		// XXX do we do this here???
@@ -148,6 +151,8 @@ var ContainerClassPrototype = {
 
 
 var ContainerPrototype = {
+	// NOTE: this must have .data('widget-controller', this) set...
+	dom: null,
 
 	focus: function(handler){
 		if(handler != null){
@@ -181,6 +186,8 @@ var ContainerPrototype = {
 		if(this.constructor.make){
 			this.dom = this.constructor
 				.make(this, client.dom || client, options)
+
+			this.dom.data('widget-controller', this)
 		}
 
 		// add keyboard handler...