flynx/ImageGrid
1
1
Fork 0
mirror of https://github.com/flynx/ImageGrid.git synced 2025-10-30 02:40:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

more tweaks...

Browse Source 
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2016-03-25 00:49:14 +03:00
parent b0b0d92c0b
commit 64e62120c6
2 changed files with 74 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui (gen4)/css/layout.less
View File

@ -1153,7 +1153,7 @@ stretching in width... */
.overlay-info .index { .overlay-info .index {
cursor: pointer; cursor: pointer;
} }
.overlay-info .index .position { .overlay-info .index .position.editable {
cursor: text; cursor: text;
} }
.overlay-info .index.global:after { .overlay-info .index.global:after {

43
ui (gen4)/features/ui-status.js
View File

@ -70,7 +70,15 @@ var StatusBarActions = actions.Actions({
'path', 'path',
], ],
'status-bar-index-live-update-on-edit': false, 'status-bar-index': {
// NOTE: this would need to reconstruct the status bar for
// changes to take effect, i.e. call .resetStatusBar()
// XXX might be a good idea to run an editor on click on
// touch devices...
'editable': true,
'live-update-on-edit': false,
},
}, },
__statusbar_elements__: { __statusbar_elements__: {
@ -83,8 +91,20 @@ var StatusBarActions = actions.Actions({
var type = item var type = item
item = $('<span>') item = $('<span>')
.addClass(type) .addClass(type)
.append($('<span>') .append(!(this.config['status-bar-index'] || {})['editable'] ?
// not-editable...
$('<span>')
.addClass('position') .addClass('position')
.attr('info', 'Image position (click to toggle ribbon/global)')
// toggle index state...
.click(function(){
$(this).parent()
.toggleClass('global')
that.updateStatusBar()
})
// editable...
: $('<span>')
.addClass('position editable')
.attr('info', 'Image position (click to edit image position)') .attr('info', 'Image position (click to edit image position)')
.prop('contenteditable', true) .prop('contenteditable', true)
.keydown(function(){ .keydown(function(){
@ -92,7 +112,6 @@ var StatusBarActions = actions.Actions({
event.stopPropagation() event.stopPropagation()
var n = keyboard.toKeyName(event.keyCode) var n = keyboard.toKeyName(event.keyCode)
console.log('KEY:', n)
// lose focus and exit... // lose focus and exit...
if(n == 'Esc' || n == 'Enter'){ if(n == 'Esc' || n == 'Enter'){
@ -100,7 +119,7 @@ var StatusBarActions = actions.Actions({
// get image on enter... // get image on enter...
if(n == 'Enter'){ if(n == 'Enter'){
that.focusImage(parseInt($(this).text())-1, that.focusImage(parseInt($(this).text())-1 || 'current',
item.hasClass('global') ? 'global' : undefined) item.hasClass('global') ? 'global' : undefined)
} }
@ -108,6 +127,11 @@ var StatusBarActions = actions.Actions({
window.getSelection().removeAllRanges() window.getSelection().removeAllRanges()
$(this).blur() $(this).blur()
// reset on esc...
if(n == 'Esc'){
that.updateStatusBar()
}
return false return false
} }
}) })
@ -115,7 +139,7 @@ var StatusBarActions = actions.Actions({
.keyup(function(){ .keyup(function(){
event.stopPropagation() event.stopPropagation()
that.config['status-bar-index-live-update-on-edit'] that.config['status-bar-index']['live-update-on-edit']
&& that.focusImage(parseInt($(this).text())-1, && that.focusImage(parseInt($(this).text())-1,
item.hasClass('global') ? 'global' : undefined) item.hasClass('global') ? 'global' : undefined)
}) })
@ -376,7 +400,14 @@ var StatusBarActions = actions.Actions({
} }
})], })],
updateStatusBar: ['Interface/Update satus bar', updateStatusBar: ['Interface/Update satus bar',
function(){ this.toggleStatusBar('!') }] function(){ this.toggleStatusBar('!') }],
resetStatusBar: ['Interface/Reset status bar',
function(){
var mode = this.toggleStatusBar('?')
this.toggleStatusBar('none')
this.toggleStatusBar(mode)
}],
}) })
var StatusBar = var StatusBar =