mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-10-29 02:10:08 +00:00
added fullscreen app control buttons...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
dc93052a93
commit
5a58a780cf
@ -293,6 +293,44 @@ button:hover {
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
.fullscreen-controls {
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
right: 0px;
|
||||||
|
z-index: 9000;
|
||||||
|
|
||||||
|
opacity: 0.4;
|
||||||
|
|
||||||
|
size: 30px;
|
||||||
|
}
|
||||||
|
.fullscreen-controls:hover {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.fullscreen-controls .button {
|
||||||
|
display: inline-block;
|
||||||
|
color: silver;
|
||||||
|
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
|
||||||
|
text-align: center;
|
||||||
|
line-height: 40px;
|
||||||
|
}
|
||||||
|
.fullscreen-controls .button:hover {
|
||||||
|
color: white;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.fullscreen-controls .button.close:hover {
|
||||||
|
background: rgba(255, 0, 0, 0.8);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/********************************************************** Viewer ***/
|
/********************************************************** Viewer ***/
|
||||||
.viewer {
|
.viewer {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|||||||
@ -105,6 +105,10 @@ var AppControlActions = actions.Actions({
|
|||||||
}, this.config['window-delay-initial-display'] || 0)
|
}, this.config['window-delay-initial-display'] || 0)
|
||||||
}],
|
}],
|
||||||
|
|
||||||
|
minimize: ['Interface/Minimize',
|
||||||
|
function(){
|
||||||
|
nw.Window.get().minimize()
|
||||||
|
}],
|
||||||
toggleFullScreen: ['Interface/Toggle full screen mode',
|
toggleFullScreen: ['Interface/Toggle full screen mode',
|
||||||
toggler.CSSClassToggler(
|
toggler.CSSClassToggler(
|
||||||
function(){ return document.body },
|
function(){ return document.body },
|
||||||
@ -221,6 +225,65 @@ module.AppControl = core.ImageGridFeatures.Feature({
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
//---------------------------------------------------------------------
|
||||||
|
// Fullscreen app control buttons...
|
||||||
|
var FullScreenControllsActions = actions.Actions({
|
||||||
|
toggleFullScreenControls: ['Interface/',
|
||||||
|
toggler.Toggler(null,
|
||||||
|
function(){
|
||||||
|
return this.ribbons.viewer.find('.fullscreen-controls').length > 0 ? 'on' : 'off' },
|
||||||
|
['off', 'on'],
|
||||||
|
function(state){
|
||||||
|
// clear the controls....
|
||||||
|
this.ribbons.viewer.find('.fullscreen-controls').remove()
|
||||||
|
|
||||||
|
if(state == 'on'){
|
||||||
|
var that = this
|
||||||
|
|
||||||
|
$('<div>')
|
||||||
|
.addClass('fullscreen-controls')
|
||||||
|
// minimize....
|
||||||
|
.append($('<div>')
|
||||||
|
.addClass('button')
|
||||||
|
.html('_')
|
||||||
|
.click(function(){ that.minimize() }))
|
||||||
|
// fullscreen....
|
||||||
|
.append($('<div>')
|
||||||
|
.addClass('button')
|
||||||
|
.html('□')
|
||||||
|
.click(function(){ that.toggleFullScreen() }))
|
||||||
|
// close...
|
||||||
|
.append($('<div>')
|
||||||
|
.addClass('button close')
|
||||||
|
.html('×')
|
||||||
|
.click(function(){ that.close() }))
|
||||||
|
.appendTo(this.ribbons.viewer)
|
||||||
|
}
|
||||||
|
})],
|
||||||
|
})
|
||||||
|
|
||||||
|
var FullScreenControlls =
|
||||||
|
module.FullScreenControlls = core.ImageGridFeatures.Feature({
|
||||||
|
title: '',
|
||||||
|
doc: '',
|
||||||
|
|
||||||
|
tag: 'ui-fullscreen-controls',
|
||||||
|
depends: [
|
||||||
|
'ui-app-control',
|
||||||
|
],
|
||||||
|
|
||||||
|
actions: FullScreenControllsActions,
|
||||||
|
|
||||||
|
handlers: [
|
||||||
|
['toggleFullScreen',
|
||||||
|
function(){
|
||||||
|
this.toggleFullScreenControls(this.toggleFullScreen('?'))
|
||||||
|
}],
|
||||||
|
],
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/**********************************************************************
|
/**********************************************************************
|
||||||
* vim:set ts=4 sw=4 : */
|
* vim:set ts=4 sw=4 : */
|
||||||
return module })
|
return module })
|
||||||
|
|||||||
@ -132,6 +132,10 @@ var FileSystemLoaderActions = actions.Actions({
|
|||||||
// a-la glob)....
|
// a-la glob)....
|
||||||
//file.loadIndex(path, this.config['index-dir'], logger)
|
//file.loadIndex(path, this.config['index-dir'], logger)
|
||||||
return file.loadIndex(path, this.config['index-dir'], from_date, logger)
|
return file.loadIndex(path, this.config['index-dir'], from_date, logger)
|
||||||
|
.catch(function(err){
|
||||||
|
// XXX
|
||||||
|
console.error(err)
|
||||||
|
})
|
||||||
.then(function(res){
|
.then(function(res){
|
||||||
// XXX if res is empty load raw...
|
// XXX if res is empty load raw...
|
||||||
|
|
||||||
@ -543,9 +547,6 @@ var FileSystemLoaderUIActions = actions.Actions({
|
|||||||
// the given path (no UI) while .browsePath(..) will load the
|
// the given path (no UI) while .browsePath(..) will load the
|
||||||
// UI in all cases but will treat the given path as a base path
|
// UI in all cases but will treat the given path as a base path
|
||||||
// to start from.
|
// to start from.
|
||||||
// XXX should passing no path to this start browsing from the current
|
|
||||||
// path or from the root?
|
|
||||||
// XXX should these be dialog objects???
|
|
||||||
browseIndex: ['File/Load index...', makeBrowseProxy('loadIndex')],
|
browseIndex: ['File/Load index...', makeBrowseProxy('loadIndex')],
|
||||||
browseImages: ['File/Load images...', makeBrowseProxy('loadImages')],
|
browseImages: ['File/Load images...', makeBrowseProxy('loadImages')],
|
||||||
|
|
||||||
@ -570,6 +571,9 @@ var FileSystemLoaderUIActions = actions.Actions({
|
|||||||
//file.loadIndex(path, that.config['index-dir'], this.logger)
|
//file.loadIndex(path, that.config['index-dir'], this.logger)
|
||||||
// XXX we need to prune the indexes -- avoid loading nested indexes...
|
// XXX we need to prune the indexes -- avoid loading nested indexes...
|
||||||
file.listIndexes(path, index_dir)
|
file.listIndexes(path, index_dir)
|
||||||
|
.on('error', function(err){
|
||||||
|
console.error(err)
|
||||||
|
})
|
||||||
.on('end', function(res){
|
.on('end', function(res){
|
||||||
|
|
||||||
// we got the data, we can now remove the spinner...
|
// we got the data, we can now remove the spinner...
|
||||||
@ -599,8 +603,10 @@ var FileSystemLoaderUIActions = actions.Actions({
|
|||||||
// and selecting a postion will load all the participating
|
// and selecting a postion will load all the participating
|
||||||
// indexes to that date.
|
// indexes to that date.
|
||||||
// NOTE: this will show nothing if .location.method is not loadIndex..
|
// NOTE: this will show nothing if .location.method is not loadIndex..
|
||||||
|
// NOTE: this will drop all unsaved changes
|
||||||
|
// NOTE: this will set changes to all when loading a different state
|
||||||
|
// that the latest and to non otherwise....
|
||||||
//
|
//
|
||||||
// XXX should this affect .changes ???
|
|
||||||
// XXX handle named saves...
|
// XXX handle named saves...
|
||||||
// XXX add ability to name a save...
|
// XXX add ability to name a save...
|
||||||
// XXX need to handle saves (saveIndex(..) and friends) when loaded
|
// XXX need to handle saves (saveIndex(..) and friends) when loaded
|
||||||
@ -627,12 +633,11 @@ var FileSystemLoaderUIActions = actions.Actions({
|
|||||||
var from = that.location.from
|
var from = that.location.from
|
||||||
from = from && Date.fromTimeStamp(from).toShortDate()
|
from = from && Date.fromTimeStamp(from).toShortDate()
|
||||||
|
|
||||||
make('Latest')
|
if(that.changes !== false){
|
||||||
.on('open', function(){
|
make('Unsaved state')
|
||||||
that.reloadState()
|
|
||||||
})
|
|
||||||
|
|
||||||
make('---')
|
make('---')
|
||||||
|
}
|
||||||
|
|
||||||
// indicate that we are working...
|
// indicate that we are working...
|
||||||
var spinner = make($('<center><div class="loader"/></center>'))
|
var spinner = make($('<center><div class="loader"/></center>'))
|
||||||
@ -657,6 +662,16 @@ var FileSystemLoaderUIActions = actions.Actions({
|
|||||||
list
|
list
|
||||||
.sort()
|
.sort()
|
||||||
.reverse()
|
.reverse()
|
||||||
|
|
||||||
|
// Special case: top save state is the default,
|
||||||
|
// no need to mark anything for change...
|
||||||
|
var first = list.shift()
|
||||||
|
first && make(Date.fromTimeStamp(first).toShortDate())
|
||||||
|
.on('open', function(){
|
||||||
|
that.loadIndex(that.location.path, first)
|
||||||
|
})
|
||||||
|
|
||||||
|
list
|
||||||
.forEach(function(d){
|
.forEach(function(d){
|
||||||
var txt = Date.fromTimeStamp(d).toShortDate()
|
var txt = Date.fromTimeStamp(d).toShortDate()
|
||||||
|
|
||||||
@ -664,6 +679,9 @@ var FileSystemLoaderUIActions = actions.Actions({
|
|||||||
make(txt)
|
make(txt)
|
||||||
.on('open', function(){
|
.on('open', function(){
|
||||||
that.loadIndex(that.location.path, d)
|
that.loadIndex(that.location.path, d)
|
||||||
|
.then(function(){
|
||||||
|
that.markChanged('all')
|
||||||
|
})
|
||||||
})
|
})
|
||||||
// mark the current loaded position...
|
// mark the current loaded position...
|
||||||
.addClass(txt == from ? 'selected highlighted' : '')
|
.addClass(txt == from ? 'selected highlighted' : '')
|
||||||
|
|||||||
@ -54,6 +54,8 @@ core.ImageGridFeatures.Feature('viewer-testing', [
|
|||||||
|
|
||||||
'ui-ribbons-placement',
|
'ui-ribbons-placement',
|
||||||
|
|
||||||
|
'ui-fullscreen-controls',
|
||||||
|
|
||||||
// features...
|
// features...
|
||||||
'ui-ribbon-auto-align',
|
'ui-ribbon-auto-align',
|
||||||
//'ui-ribbon-align-to-order',
|
//'ui-ribbon-align-to-order',
|
||||||
|
|||||||
@ -921,6 +921,7 @@ module.Viewer = core.ImageGridFeatures.Feature({
|
|||||||
/*********************************************************************/
|
/*********************************************************************/
|
||||||
// User interfaces for different base features...
|
// User interfaces for different base features...
|
||||||
|
|
||||||
|
|
||||||
// XXX tag dialogs...
|
// XXX tag dialogs...
|
||||||
// XXX
|
// XXX
|
||||||
|
|
||||||
|
|||||||
@ -1816,8 +1816,9 @@ var BrowserPrototype = {
|
|||||||
var cur = this.select('!')
|
var cur = this.select('!')
|
||||||
var elem = this.select(!pattern ? '!'
|
var elem = this.select(!pattern ? '!'
|
||||||
: /-?[0-9]+/.test(pattern) ? pattern
|
: /-?[0-9]+/.test(pattern) ? pattern
|
||||||
// avoid keywords that .select(..) understands...
|
// XXX avoid keywords that .select(..) understands...
|
||||||
: '"'+pattern+'"' )
|
//: '"'+pattern+'"' )
|
||||||
|
: pattern)
|
||||||
|
|
||||||
// item not found...
|
// item not found...
|
||||||
if(elem.length == 0 && pattern != null){
|
if(elem.length == 0 && pattern != null){
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user