mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-10-29 10:20:08 +00:00
made a better not-available url handling strategy + added html, br and hr elements to formDialog(..)...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
3c7e772203
commit
cbbce982ff
59
ui/TODO.otl
59
ui/TODO.otl
@ -108,33 +108,13 @@ Roadmap
|
||||
|
||||
|
||||
|
||||
[_] 30% Gen 3 current todo
|
||||
[_] 60% High priority
|
||||
[_] BUG: editor also affects the image background and border...
|
||||
| to view just set invert to 1
|
||||
| - background turns white...
|
||||
| - red border turns blue...
|
||||
|
|
||||
| need to either compensate or figure out a way to work around
|
||||
| this without adding ne tags...
|
||||
[_] 29% Gen 3 current todo
|
||||
[_] 59% High priority
|
||||
[_] BUG: basic editor causes images to blur up
|
||||
| ...if at least one filter is applied, appears to only affect
|
||||
| scaled images.
|
||||
[_] BUG: OSX: unable to load absolute paths...
|
||||
[_] OSX: add alternatives to function buttons...
|
||||
[_] Feature: basic editor...
|
||||
| use CSS3 filters to edit and save edit values for:
|
||||
| - brightness
|
||||
| - contrast
|
||||
| - saturation
|
||||
| - hue
|
||||
| - grayscale
|
||||
| - sepia
|
||||
| - invert
|
||||
| - blur
|
||||
|
|
||||
| save settings and load them on a per preview basis...
|
||||
|
|
||||
| see: http://html5-demos.appspot.com/static/css/filters/index.html
|
||||
|
|
||||
| For UI use a left/right pane to "hold" the sliders...
|
||||
[_] UI: Panes...
|
||||
|
|
||||
| +-----+---------------+-----+
|
||||
@ -450,6 +430,35 @@ Roadmap
|
||||
[_] side-by side view...
|
||||
[_] Simplify tool-tip structure in dialogs...
|
||||
| might also bee good to unify tool-tips across the app...
|
||||
[X] devise a better strategy to pruneBaseURLHistory(..)...
|
||||
| currently it will remove anything that does not exist.
|
||||
|
|
||||
| consider:
|
||||
| - push non-existing to back
|
||||
| - mark non-existing and show as disabled
|
||||
[X] Feature: basic editor...
|
||||
| use CSS3 filters to edit and save edit values for:
|
||||
| - brightness
|
||||
| - contrast
|
||||
| - saturation
|
||||
| - hue
|
||||
| - grayscale
|
||||
| - sepia
|
||||
| - invert
|
||||
| - blur
|
||||
|
|
||||
| save settings and load them on a per preview basis...
|
||||
|
|
||||
| see: http://html5-demos.appspot.com/static/css/filters/index.html
|
||||
|
|
||||
| For UI use a left/right pane to "hold" the sliders...
|
||||
[X] BUG: editor also affects the image background and border...
|
||||
| to view just set invert to 1
|
||||
| - background turns white...
|
||||
| - red border turns blue...
|
||||
|
|
||||
| need to either compensate or figure out a way to work around
|
||||
| this without adding ne tags...
|
||||
[X] URL history...
|
||||
[X] BUG: ribbons above and below are still sometimes loaded incorrectly
|
||||
| likely due to trying to align
|
||||
|
||||
@ -1214,16 +1214,11 @@ button:hover {
|
||||
}
|
||||
/* XXX this is experimental... */
|
||||
.viewer.overlay .ribbon-set {
|
||||
/* XXX blur makes things slow with transparency... */
|
||||
/* XXX blur makes things slow with transparency... */
|
||||
|
||||
/*
|
||||
-webkit-filter: blur(2px);
|
||||
filter: blur(2px);
|
||||
*/
|
||||
-webkit-filter: grayscale(0.5);
|
||||
filter: grayscale(0.5);
|
||||
|
||||
/*
|
||||
-webkit-filter: /*blur(2px)*/ grayscale(0.5);
|
||||
filter: /*blur(2px)*/ grayscale(0.5);
|
||||
/*
|
||||
-webkit-animation-name: testAnim;
|
||||
-webkit-animation-duration: .2s;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
@ -1330,6 +1325,9 @@ button:hover {
|
||||
color: white;
|
||||
background: silver;
|
||||
}
|
||||
.field .disabled-text {
|
||||
opacity: 0.5;
|
||||
}
|
||||
/************************************************************ Help ***/
|
||||
/* XXX make this more generic, and not just for the keyboard... */
|
||||
/* this is for sliding stuff */
|
||||
|
||||
@ -1386,6 +1386,11 @@ button:hover {
|
||||
}
|
||||
|
||||
|
||||
.field .disabled-text {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/************************************************************ Help ***/
|
||||
|
||||
94
ui/ui.js
94
ui/ui.js
@ -491,6 +491,55 @@ function isOverlayVisible(root){
|
||||
|
||||
|
||||
var FIELD_TYPES = {
|
||||
// a simple hr...
|
||||
//
|
||||
// format:
|
||||
// '---'
|
||||
// Three or more '-'s
|
||||
hr: {
|
||||
type: 'hr',
|
||||
text: null,
|
||||
default: false,
|
||||
html: '<hr>',
|
||||
test: function(val){
|
||||
return /\-\-\-+/.test(val)
|
||||
},
|
||||
},
|
||||
// a simple br...
|
||||
//
|
||||
// format:
|
||||
// ' '
|
||||
// Three or more spaces
|
||||
br: {
|
||||
type: 'br',
|
||||
text: null,
|
||||
default: false,
|
||||
html: '<br>',
|
||||
test: function(val){
|
||||
return /\s\s\s+/.test(val)
|
||||
},
|
||||
},
|
||||
// format:
|
||||
// {
|
||||
// html: <html-block>
|
||||
// }
|
||||
html: {
|
||||
type: 'html',
|
||||
text: null,
|
||||
default: false,
|
||||
html: '<div class="html-block"/>',
|
||||
test: function(val){
|
||||
return val.html != null
|
||||
},
|
||||
set: function(field, value){
|
||||
if(typeof(value.html) == typeof('str')){
|
||||
field.html(value.html)
|
||||
} else {
|
||||
field.append(value.html)
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
// format:
|
||||
// string
|
||||
// XXX add datalist option...
|
||||
@ -625,7 +674,7 @@ var FIELD_TYPES = {
|
||||
// ['a', 'b', 'c', ...]
|
||||
//
|
||||
// an item can be of the folowing format:
|
||||
// <text> ['|' 'default' ] [ '|' <tool-tip> ]
|
||||
// <text> ['|' 'default' | 'disabled' ] [ '|' <tool-tip> ]
|
||||
//
|
||||
// NOTE: only one 'default' item should be present.
|
||||
// NOTE: if no defaults are set, then the first item is checked.
|
||||
@ -664,6 +713,16 @@ var FIELD_TYPES = {
|
||||
val.prop('checked', false)
|
||||
}
|
||||
|
||||
// set disabled state...
|
||||
if(opts.slice(1).indexOf('disabled') >= 0){
|
||||
val.prop('disabled', true)
|
||||
opts.splice(opts.indexOf('disabled'), 1)
|
||||
item.addClass('disabled')
|
||||
} else {
|
||||
val.prop('disabled', false)
|
||||
item.removeClass('disabled')
|
||||
}
|
||||
|
||||
setTextWithTooltip(opts, item.find('.item-text'))
|
||||
|
||||
item.appendTo(field)
|
||||
@ -763,6 +822,7 @@ var FIELD_TYPES = {
|
||||
return $(field).attr('state')
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
|
||||
// Show a complex form dialog
|
||||
@ -821,15 +881,20 @@ function formDialog(root, message, config, btn, cls){
|
||||
|
||||
// setup text and data...
|
||||
setTextWithTooltip(t, html.find('.text'), html)
|
||||
field.set(html, config[t])
|
||||
|
||||
// NOTE: this is here to isolate t and field.get values...
|
||||
// ...is there a better way???
|
||||
var _ = (function(title, getter){
|
||||
html.on('resolve', function(evt, e){
|
||||
data[title] = getter(e)
|
||||
})
|
||||
})(t, field.get)
|
||||
if(field.set != null){
|
||||
field.set(html, config[t])
|
||||
}
|
||||
|
||||
if(field.get != null){
|
||||
// NOTE: this is here to isolate t and field.get values...
|
||||
// ...is there a better way???
|
||||
var _ = (function(title, getter){
|
||||
html.on('resolve', function(evt, e){
|
||||
data[title] = getter(e)
|
||||
})
|
||||
})(t, field.get)
|
||||
}
|
||||
|
||||
form.append(html)
|
||||
|
||||
@ -934,6 +999,17 @@ function confirm(){
|
||||
*/
|
||||
|
||||
|
||||
function detailedAlert(text, description, button){
|
||||
return formDialog(null, '', {'': {
|
||||
html: $('<details/>')
|
||||
.append($('<summary/>')
|
||||
.html(text))
|
||||
.append($('<span/>')
|
||||
.html(description))
|
||||
}}, button == null ? false : button, 'detailed-alert')
|
||||
}
|
||||
|
||||
|
||||
// NOTE: this will not work without node-webkit...
|
||||
function getDir(message, dfl, btn){
|
||||
btn = btn == null ? 'OK' : btn
|
||||
|
||||
@ -30,6 +30,16 @@ function pruneBaseURLHistory(){
|
||||
}
|
||||
|
||||
|
||||
function getNonExistingBaseURLs(){
|
||||
if(window.fs == null){
|
||||
return BASE_URL_HISTORY
|
||||
}
|
||||
return BASE_URL_HISTORY.filter(function(e){
|
||||
return !fs.existsSync(osPath(e))
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// Setup history event handlers...
|
||||
//
|
||||
// NOTE: this will save history state to localStorage...
|
||||
@ -38,7 +48,7 @@ function setupBaseURLHistory(){
|
||||
.on('baseURLChanged', function(evt, old_url, new_url){
|
||||
var updated = false
|
||||
|
||||
pruneBaseURLHistory()
|
||||
//pruneBaseURLHistory()
|
||||
|
||||
// store the old and new urls in history unless they already
|
||||
// exist...
|
||||
@ -97,11 +107,23 @@ function getURLHistoryPosition(){
|
||||
// Get next/prev relative position in history...
|
||||
//
|
||||
function getURLHistoryNext(){
|
||||
var res = BASE_URL_HISTORY[ getURLHistoryPosition() - 1]
|
||||
var non_existing = getNonExistingBaseURLs()
|
||||
var i = getURLHistoryPosition() + 1
|
||||
var res = BASE_URL_HISTORY[i]
|
||||
while(non_existing.indexOf(res) >= 0){
|
||||
i += 1
|
||||
var res = BASE_URL_HISTORY[i]
|
||||
}
|
||||
return res == null ? BASE_URL : res
|
||||
}
|
||||
function getURLHistoryPrev(){
|
||||
var res = BASE_URL_HISTORY[ getURLHistoryPosition() + 1 ]
|
||||
var non_existing = getNonExistingBaseURLs()
|
||||
var i = getURLHistoryPosition() - 1
|
||||
var res = BASE_URL_HISTORY[i]
|
||||
while(non_existing.indexOf(res) >= 0){
|
||||
i -= 1
|
||||
var res = BASE_URL_HISTORY[i]
|
||||
}
|
||||
return res == null ? BASE_URL : res
|
||||
}
|
||||
|
||||
@ -116,7 +138,6 @@ function getURLHistoryPrev(){
|
||||
// NOTE: this will not affect history url order...
|
||||
function makeURLHistoryLoader(get, end_msg){
|
||||
return function(){
|
||||
pruneBaseURLHistory()
|
||||
var url = get()
|
||||
if(url != BASE_URL){
|
||||
statusNotify(loadDir(url))
|
||||
@ -132,8 +153,9 @@ var loadURLHistoryPrev = makeURLHistoryLoader(getURLHistoryPrev, 'at first URL')
|
||||
|
||||
// NOTE: this can accept either path or history index...
|
||||
// NOTE: this will not reload an already loaded url...
|
||||
//
|
||||
// XXX need to somehow skip unavailable urls...
|
||||
function loadURLHistoryAt(a){
|
||||
pruneBaseURLHistory()
|
||||
a = a < 0 ? BASE_URL_HISTORY.length + a : a
|
||||
var url = typeof(a) == typeof(123) ? Math.min(a < 0 ? 0 : a, BASE_URL_HISTORY.length-1) : a
|
||||
if(url != BASE_URL){
|
||||
@ -157,22 +179,46 @@ function recentlyOpenedDialog(){
|
||||
'Shortcuts ctrl-shift-Left and ctrl-shift-Right can be used\n'+
|
||||
'to move through this list from ribbon view.'
|
||||
|
||||
var not_available = getNonExistingBaseURLs()
|
||||
|
||||
var cfg = {}
|
||||
cfg[title] = BASE_URL_HISTORY.map(function(e){
|
||||
// cleanup the urls...
|
||||
var ee = e.replace('file:///', '')
|
||||
|
||||
// mark disabled...
|
||||
if(not_available.indexOf(e) >= 0){
|
||||
ee = '<span class="disabled-text">'+ee+'</span>'
|
||||
dict[ee] = e
|
||||
return ee + ' | disabled | Not available.'
|
||||
}
|
||||
|
||||
// mark the current path...
|
||||
if(e == BASE_URL){
|
||||
ee = ee.italics()
|
||||
dict[ee] = e
|
||||
return ee + ' | default | Currently loaded data.'
|
||||
}
|
||||
|
||||
dict[ee] = e
|
||||
return ee
|
||||
})
|
||||
|
||||
formDialog(null, '',
|
||||
if(not_available.length > 0){
|
||||
cfg['spacer'] = '---'
|
||||
cfg[''] = {
|
||||
text: 'Clear unavailable paths',
|
||||
button: function(){
|
||||
pruneBaseURLHistory()
|
||||
saveLocalStorageBaseURLHistory()
|
||||
$('.recentlyOpenedDialog')
|
||||
.find('.item.disabled')
|
||||
.remove()
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
var dialog = formDialog(null, '',
|
||||
cfg,
|
||||
'OK',
|
||||
'recentlyOpenedDialog')
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user