added browser fullscreen + some refactoring...

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

ui (gen4)/features/app.js

@@ -356,17 +356,6 @@ module.ElectronHost = core.ImageGridFeatures.Feature({
 // 		get loaded when in widget mode...
 
 var BrowserHostActions = actions.Actions({
-	config: {
-		// XXX for some reason this does not work...
-		// XXX integrate this into the right place...
-		'app-buttons': Object.assign({},
-			widgets.Buttons.actions.config['app-buttons'],
-			{
-				'↙': ['fullscreen always-shown', 
-					'toggleFullScreen -- Toggle fullscreen'],
-			}),
-	},
-
 	// window stuff...
 	get title(){
 		return $('title').text() },
@@ -395,7 +384,7 @@ var BrowserHostActions = actions.Actions({
 					state == 'on' ?
 						document.exitFullscreen()
 						// XXX id document.body the right scope here???
-						// 		...this.dom[0] seems to break things...
+						// 		...this.dom[0] seems to break alignment...
 						: document.body.requestFullscreen()
 
 					setTimeout(function(){ 
@@ -404,15 +393,9 @@ var BrowserHostActions = actions.Actions({
 							.focusImage()
 							.ribbons
 								.restoreTransitions()
-
+						// show viewer after we are done...
-						that.dom[0].style.visibility = ''
+						that.dom[0].style.visibility = '' }, 100)
-					}, 100)
 				}
-
-				// NOTE: we delay this to account for window animation...
-				//setTimeout(function(){ 
-				//	that.storeWindowGeometry() 
-				//}, 500)
 			})],
 })
 
@@ -686,70 +669,6 @@ module.AppControl = core.ImageGridFeatures.Feature('ui-app-control', [
 ])
 
 
-//---------------------------------------------------------------------
-// Fullscreen app control buttons...
-
-var AppButtonsActions = actions.Actions({
-	config: {
-		// append app-specific buttons...
-		'app-buttons': Object.assign({},
-			widgets.Buttons.actions.config['app-buttons'],
-			{
-				'_': ['minimize', 
-					'minimize -- Minimize'],
-				'↙': ['fullscreen always-shown', 
-					'toggleFullScreen -- Toggle fullscreen'],
-				'×': ['close', 
-					'close -- Quit'],
-			}),
-	},
-})
-
-var AppButtons = 
-module.AppButtons = core.ImageGridFeatures.Feature({
-	title: '',
-	doc: '',
-
-	tag: 'ui-app-buttons',
-	depends: [
-		'ui-windowed-app-control',
-		'ui-buttons',
-	],
-	suggested: [
-		// needed for reporting info in .makeButtonControls(..)
-		'ui-status-bar',
-	],
-
-	actions: AppButtonsActions,
-
-	handlers: [
-		['start.pre', 
-			function(){
-				this.toggleAppButtons('on')
-			}],
-		['start toggleFullScreen', 
-			function(){
-				var fullscreen = this.toggleFullScreen('?')
-				var buttons = this.dom.find('.app-buttons')
-				
-				// fullscreen button...
-				buttons.find('.fullscreen.button')
-					.html(fullscreen == 'on' ? '↙' : '↗')
-					.attr('info', fullscreen == 'on' ? 'Exit fullscreen' : 'Fullscreen')
-
-				// XXX should this be done by css???
-				if(fullscreen == 'on'){
-					buttons.find('.button:not(.always-shown)').show()
-
-				} else {
-					buttons.find('.button:not(.always-shown)').hide()
-				}
-
-				//this.toggleFullScreenControls(fullScreen)
-			}],
-	],
-})
-
 
 
 /**********************************************************************

ui (gen4)/features/core.js

@@ -536,6 +536,16 @@ var LifeCycleActions = actions.Actions({
 				'started'
 			: undefined },
 
+	// XXX not implemented...
+	// 		...this should be triggered on first run and after updates...
+	setup: ['- System/',
+		doc``,
+		Event(function(mode){
+			// System started event...
+			//
+			// Not intended for direct use.
+		})],
+
 	start: ['- System/', 
 		doc`Start core action/event
 
@@ -817,6 +827,15 @@ var LifeCycleActions = actions.Actions({
 			// Not intended for direct use.
 		})],
 
+	// XXX not implemented...
+	// 		...this should be triggered before uninstall...
+	cleanup: ['- System/',
+		doc``,
+		Event(function(){
+			// System started event...
+			//
+			// Not intended for direct use.
+		})],
 
 	// trigger core events...
 	//

ui (gen4)/features/meta.js

@@ -78,7 +78,6 @@ core.ImageGridFeatures.Feature('imagegrid-ui', [
 
 	'ui-progress',
 
-	'ui-app-buttons',
 	'ui-buttons',
 
 	'ui-status-bar',

ui (gen4)/features/ui-widgets.js

@@ -54,6 +54,7 @@ var makeButtonControls =
 module.makeButtonControls =
 function(context, cls, data){
 	cls = cls instanceof Array ? cls : cls.split(/\s+/g)
+	var unusable_draw = context.config['unusable-button-draw-mode'] || 'hidden'
 
 	// remove old versions...
 	context.dom.find('.'+ cls.join('.')).remove()
@@ -77,6 +78,8 @@ function(context, cls, data){
 
 	// make buttons...
 	Object.keys(data).forEach(function(k){
+		var usable = true
+
 		// spacer...
 		if(typeof(data[k]) == typeof('str') 
 				&& /--+/.test(data[k])){
@@ -87,6 +90,7 @@ function(context, cls, data){
 			var menu = function(){}
 
 		// normal element...
+		// XXX show button only if action available...
 		} else {
 			var e = data[k].slice()
 			var primary = e.pop()
@@ -101,6 +105,12 @@ function(context, cls, data){
 			primary = typeof(primary) == typeof('str') ?
 				keyboard.parseActionCall(primary, context) 
 				: primary
+			usable = primary instanceof Function
+				|| context[primary.action] instanceof Function
+
+			// do not draw if primary not usable...
+			if(!usable && unusable_draw == 'none'){
+				return }
 
 			var click = primary instanceof Function ? 
 				primary 
@@ -137,7 +147,12 @@ function(context, cls, data){
 						&& context.showStatusBarInfo()
 				})
 				.click(click)
-				.on('contextmenu', menu))
+				.on('contextmenu', menu)
+				.css(!usable ?
+						(unusable_draw == 'hidden' ? 
+							{display: 'none'}
+						: {})
+					: {}))
 	})
 
 	controls
@@ -3073,9 +3088,19 @@ var SETTINGS_ICON =
 	: navigator.platform == 'Win32' ?  '⛭'
 	: '<span class="material-icons">settings</span>'
 
+// XXX show button iff the action is present...
 // XXX add context menu action to buttons...
 var ButtonsActions = actions.Actions({
 	config: {
+		// can be:
+		// 	'hidden'	- draw hidden
+		// 	'disabled'	- draw disabled (not implemented)
+		// 	'none'		- do not draw
+		// 	'visible'	- force draw
+		//
+		// XXX should this be more granular???
+		'unusable-button-draw-mode': 'none',
+
 		'main-buttons-state': 'on',
 		// Format:
 		// 	{
@@ -3126,6 +3151,12 @@ var ButtonsActions = actions.Actions({
 				'browseActions: "Interface/" -- Interface settings...',
 				'toggleSideButtons -- Toggle touch controls',
 			]],
+			'_': ['minimize', 
+				'minimize -- Minimize'],
+			'&#8601;': ['fullscreen always-shown', 
+				'toggleFullScreen -- Toggle fullscreen'],
+			'&times;': ['close', 
+				'close -- Quit'],
 		},
 
 		'side-buttons-state': 'off',
@@ -3317,6 +3348,29 @@ module.Buttons = core.ImageGridFeatures.Feature({
 			function(){
 				$('.secondary-buttons.buttons .zoom.button sub')
 					.text(Math.round(this.screenwidth)) }],
+		// update fullscreen button...
+		['start toggleFullScreen', 
+			function(){
+				if(this.toggleFullScreen){
+					var fullscreen = this.toggleFullScreen('?')
+					var buttons = this.dom.find('.app-buttons')
+					
+					// fullscreen button...
+					buttons.find('.fullscreen.button')
+						.html(fullscreen == 'on' ? '&#8601;' : '&#8599;')
+						.attr('info', fullscreen == 'on' ? 'Exit fullscreen' : 'Fullscreen')
+
+					// XXX should this be done by css???
+					if(fullscreen == 'on'){
+						buttons.find('.button:not(.always-shown)').show()
+
+					} else {
+						buttons.find('.button:not(.always-shown)').hide()
+					}
+
+					//this.toggleFullScreenControls(fullScreen)
+				}
+			}],
 	],
 })