mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-10-29 02:10:08 +00:00
added browser fullscreen + some refactoring...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
594f0cbd8e
commit
a283958a49
@ -356,17 +356,6 @@ module.ElectronHost = core.ImageGridFeatures.Feature({
|
|||||||
// get loaded when in widget mode...
|
// get loaded when in widget mode...
|
||||||
|
|
||||||
var BrowserHostActions = actions.Actions({
|
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...
|
// window stuff...
|
||||||
get title(){
|
get title(){
|
||||||
return $('title').text() },
|
return $('title').text() },
|
||||||
@ -395,7 +384,7 @@ var BrowserHostActions = actions.Actions({
|
|||||||
state == 'on' ?
|
state == 'on' ?
|
||||||
document.exitFullscreen()
|
document.exitFullscreen()
|
||||||
// XXX id document.body the right scope here???
|
// 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()
|
: document.body.requestFullscreen()
|
||||||
|
|
||||||
setTimeout(function(){
|
setTimeout(function(){
|
||||||
@ -404,15 +393,9 @@ var BrowserHostActions = actions.Actions({
|
|||||||
.focusImage()
|
.focusImage()
|
||||||
.ribbons
|
.ribbons
|
||||||
.restoreTransitions()
|
.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)
|
|
||||||
}],
|
|
||||||
],
|
|
||||||
})
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/**********************************************************************
|
/**********************************************************************
|
||||||
|
|||||||
@ -536,6 +536,16 @@ var LifeCycleActions = actions.Actions({
|
|||||||
'started'
|
'started'
|
||||||
: undefined },
|
: 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/',
|
start: ['- System/',
|
||||||
doc`Start core action/event
|
doc`Start core action/event
|
||||||
|
|
||||||
@ -817,6 +827,15 @@ var LifeCycleActions = actions.Actions({
|
|||||||
// Not intended for direct use.
|
// 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...
|
// trigger core events...
|
||||||
//
|
//
|
||||||
|
|||||||
@ -78,7 +78,6 @@ core.ImageGridFeatures.Feature('imagegrid-ui', [
|
|||||||
|
|
||||||
'ui-progress',
|
'ui-progress',
|
||||||
|
|
||||||
'ui-app-buttons',
|
|
||||||
'ui-buttons',
|
'ui-buttons',
|
||||||
|
|
||||||
'ui-status-bar',
|
'ui-status-bar',
|
||||||
|
|||||||
@ -54,6 +54,7 @@ var makeButtonControls =
|
|||||||
module.makeButtonControls =
|
module.makeButtonControls =
|
||||||
function(context, cls, data){
|
function(context, cls, data){
|
||||||
cls = cls instanceof Array ? cls : cls.split(/\s+/g)
|
cls = cls instanceof Array ? cls : cls.split(/\s+/g)
|
||||||
|
var unusable_draw = context.config['unusable-button-draw-mode'] || 'hidden'
|
||||||
|
|
||||||
// remove old versions...
|
// remove old versions...
|
||||||
context.dom.find('.'+ cls.join('.')).remove()
|
context.dom.find('.'+ cls.join('.')).remove()
|
||||||
@ -77,6 +78,8 @@ function(context, cls, data){
|
|||||||
|
|
||||||
// make buttons...
|
// make buttons...
|
||||||
Object.keys(data).forEach(function(k){
|
Object.keys(data).forEach(function(k){
|
||||||
|
var usable = true
|
||||||
|
|
||||||
// spacer...
|
// spacer...
|
||||||
if(typeof(data[k]) == typeof('str')
|
if(typeof(data[k]) == typeof('str')
|
||||||
&& /--+/.test(data[k])){
|
&& /--+/.test(data[k])){
|
||||||
@ -87,6 +90,7 @@ function(context, cls, data){
|
|||||||
var menu = function(){}
|
var menu = function(){}
|
||||||
|
|
||||||
// normal element...
|
// normal element...
|
||||||
|
// XXX show button only if action available...
|
||||||
} else {
|
} else {
|
||||||
var e = data[k].slice()
|
var e = data[k].slice()
|
||||||
var primary = e.pop()
|
var primary = e.pop()
|
||||||
@ -101,6 +105,12 @@ function(context, cls, data){
|
|||||||
primary = typeof(primary) == typeof('str') ?
|
primary = typeof(primary) == typeof('str') ?
|
||||||
keyboard.parseActionCall(primary, context)
|
keyboard.parseActionCall(primary, context)
|
||||||
: primary
|
: 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 ?
|
var click = primary instanceof Function ?
|
||||||
primary
|
primary
|
||||||
@ -126,7 +136,7 @@ function(context, cls, data){
|
|||||||
|| e[0]
|
|| e[0]
|
||||||
|| ''
|
|| ''
|
||||||
}
|
}
|
||||||
|
|
||||||
controls
|
controls
|
||||||
.append($('<div>')
|
.append($('<div>')
|
||||||
.addClass('button ' + cls)
|
.addClass('button ' + cls)
|
||||||
@ -137,7 +147,12 @@ function(context, cls, data){
|
|||||||
&& context.showStatusBarInfo()
|
&& context.showStatusBarInfo()
|
||||||
})
|
})
|
||||||
.click(click)
|
.click(click)
|
||||||
.on('contextmenu', menu))
|
.on('contextmenu', menu)
|
||||||
|
.css(!usable ?
|
||||||
|
(unusable_draw == 'hidden' ?
|
||||||
|
{display: 'none'}
|
||||||
|
: {})
|
||||||
|
: {}))
|
||||||
})
|
})
|
||||||
|
|
||||||
controls
|
controls
|
||||||
@ -3073,9 +3088,19 @@ var SETTINGS_ICON =
|
|||||||
: navigator.platform == 'Win32' ? '⛭'
|
: navigator.platform == 'Win32' ? '⛭'
|
||||||
: '<span class="material-icons">settings</span>'
|
: '<span class="material-icons">settings</span>'
|
||||||
|
|
||||||
|
// XXX show button iff the action is present...
|
||||||
// XXX add context menu action to buttons...
|
// XXX add context menu action to buttons...
|
||||||
var ButtonsActions = actions.Actions({
|
var ButtonsActions = actions.Actions({
|
||||||
config: {
|
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',
|
'main-buttons-state': 'on',
|
||||||
// Format:
|
// Format:
|
||||||
// {
|
// {
|
||||||
@ -3126,6 +3151,12 @@ var ButtonsActions = actions.Actions({
|
|||||||
'browseActions: "Interface/" -- Interface settings...',
|
'browseActions: "Interface/" -- Interface settings...',
|
||||||
'toggleSideButtons -- Toggle touch controls',
|
'toggleSideButtons -- Toggle touch controls',
|
||||||
]],
|
]],
|
||||||
|
'_': ['minimize',
|
||||||
|
'minimize -- Minimize'],
|
||||||
|
'↙': ['fullscreen always-shown',
|
||||||
|
'toggleFullScreen -- Toggle fullscreen'],
|
||||||
|
'×': ['close',
|
||||||
|
'close -- Quit'],
|
||||||
},
|
},
|
||||||
|
|
||||||
'side-buttons-state': 'off',
|
'side-buttons-state': 'off',
|
||||||
@ -3317,6 +3348,29 @@ module.Buttons = core.ImageGridFeatures.Feature({
|
|||||||
function(){
|
function(){
|
||||||
$('.secondary-buttons.buttons .zoom.button sub')
|
$('.secondary-buttons.buttons .zoom.button sub')
|
||||||
.text(Math.round(this.screenwidth)) }],
|
.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' ? '↙' : '↗')
|
||||||
|
.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)
|
||||||
|
}
|
||||||
|
}],
|
||||||
],
|
],
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user