mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-10-29 10:20:08 +00:00
added separator support in Browse/List/... widgets and now displaying separators in metadata...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
7641f793d2
commit
29f178d115
@ -289,6 +289,10 @@
|
||||
content: "9";
|
||||
}
|
||||
|
||||
.browse-widget .list>hr.separator {
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/******************************************************** Theaming ***/
|
||||
|
||||
@ -244,10 +244,6 @@ module.MetadataReader = core.ImageGridFeatures.Feature({
|
||||
var MetadataUIActions = actions.Actions({
|
||||
config: {
|
||||
'metadata-field-order': [
|
||||
// image attrs...
|
||||
'GID', 'Index (ribbon)', 'Index (crop)', 'Index (global)',
|
||||
'File Name', 'Full Path',
|
||||
|
||||
// metadata...
|
||||
'Make', 'Camera Model Name', 'Lens ID', 'Lens', 'Lens Profile Name', 'Focal Length',
|
||||
|
||||
@ -259,11 +255,6 @@ var MetadataUIActions = actions.Actions({
|
||||
'Date/time Original', 'Create Date', 'Modify Date',
|
||||
|
||||
'Mime Type',
|
||||
|
||||
// NOTE: this is here so as not to hide the 'metadata: unavailable'
|
||||
// message when not metadata is present and .showMetadata(..)
|
||||
// is called in 'short' mode...
|
||||
'Metadata',
|
||||
],
|
||||
},
|
||||
|
||||
@ -277,16 +268,13 @@ var MetadataUIActions = actions.Actions({
|
||||
var field_order = this.config['metadata-field-order'] || []
|
||||
var x = field_order.length + 1
|
||||
|
||||
// get image metadata...
|
||||
var metadata = (this.images
|
||||
&& this.images[image]
|
||||
&& this.images[image].metadata)
|
||||
|| { metadata: 'unavailable.' }
|
||||
var img = this.images && this.images[image] || null
|
||||
// get image metadata...
|
||||
var metadata = img && img.metadata || {}
|
||||
|
||||
// XXX move these to an info feature...
|
||||
// base fields...
|
||||
var fields = [
|
||||
var base = [
|
||||
['GID: ', image],
|
||||
// NOTE: these are 1-based and not 0-based...
|
||||
['Index (ribbon): ',
|
||||
@ -301,7 +289,7 @@ var MetadataUIActions = actions.Actions({
|
||||
]
|
||||
// crop-specific stuff...
|
||||
if(this.crop_stack && this.crop_stack.len > 0){
|
||||
fields = fields.concat([
|
||||
base = base.concat([
|
||||
['Index (crop): ',
|
||||
this.data.getImageOrder('loaded', image) + 1
|
||||
+'/'+
|
||||
@ -310,7 +298,7 @@ var MetadataUIActions = actions.Actions({
|
||||
}
|
||||
// fields that expect that image data is available...
|
||||
if(img){
|
||||
fields = fields.concat([
|
||||
base = base.concat([
|
||||
['File Name: ', img.path],
|
||||
// XXX normalize this...
|
||||
['Full Path: ', (img.base_path || '.') +'/'+ img.path],
|
||||
@ -318,6 +306,7 @@ var MetadataUIActions = actions.Actions({
|
||||
}
|
||||
|
||||
// build fields...
|
||||
var fields = []
|
||||
Object.keys(metadata).forEach(function(k){
|
||||
var n = k
|
||||
// convert camel-case to human-case ;)
|
||||
@ -347,10 +336,13 @@ var MetadataUIActions = actions.Actions({
|
||||
return a - b
|
||||
})
|
||||
|
||||
// add separator to base...
|
||||
fields.length > 0 && base.push('---')
|
||||
|
||||
var o = overlay.Overlay(this.ribbons.viewer,
|
||||
browse.makeList(
|
||||
null,
|
||||
fields,
|
||||
base.concat(fields),
|
||||
{
|
||||
showDisabled: false,
|
||||
})
|
||||
|
||||
@ -288,6 +288,7 @@ requirejs([
|
||||
'option 1': function(_, p){ console.log('option:', p) },
|
||||
'option 2': function(_, p){ console.log('option:', p) },
|
||||
'- option 3': function(_, p){ console.log('option:', p) },
|
||||
'---': null,
|
||||
'option 4': function(_, p){ console.log('option:', p) },
|
||||
})
|
||||
// another way to handle the opening of items...
|
||||
|
||||
@ -297,6 +297,27 @@ var BrowserPrototype = {
|
||||
|
||||
//'keydown',
|
||||
],
|
||||
|
||||
|
||||
// Separator element...
|
||||
|
||||
// Element text as passed to make(..) to generate a separator
|
||||
// element rather than a list element...
|
||||
//
|
||||
// NOTE: if null text checking is disabled...
|
||||
elementSeparatorText: null,
|
||||
|
||||
// Separator class...
|
||||
//
|
||||
// NOTE: if make(..) is passed an element with this class it will
|
||||
// be treated as a separator and not as a list element.
|
||||
// NOTE: to disable class checking set this to null
|
||||
elementSeparatorClass: 'separator',
|
||||
|
||||
// Separator HTML code...
|
||||
//
|
||||
// NOTE: if this is null, then '<hr>' is used.
|
||||
elementSeparatorHTML: '<hr>',
|
||||
},
|
||||
|
||||
// XXX TEST: this should prevent event propagation...
|
||||
@ -755,6 +776,20 @@ var BrowserPrototype = {
|
||||
// - [str, ...]
|
||||
// - DOM/jQuery
|
||||
var make = function(p, traversable, disabled){
|
||||
// special case separator...
|
||||
if(p && (p == that.options.elementSeparatorText
|
||||
|| (p.hasClass
|
||||
&& that.options.elementSeparatorClass
|
||||
&& p.hasClass(that.options.elementSeparatorClass)))){
|
||||
var res = p
|
||||
if(typeof(res) == typeof('str')){
|
||||
res = $(that.options.elementSeparatorHTML || '<hr>')
|
||||
.addClass(that.options.elementSeparatorClass || '')
|
||||
}
|
||||
res.appendTo(l)
|
||||
return res
|
||||
}
|
||||
|
||||
// array of str...
|
||||
if(p.constructor === Array){
|
||||
var txt = p.join('')
|
||||
@ -1026,6 +1061,9 @@ var BrowserPrototype = {
|
||||
var browser = this.dom
|
||||
|
||||
var elems = browser.find('.list>div'
|
||||
+ (this.options.elementSeparatorClass ?
|
||||
':not('+ this.options.elementSeparatorClass +')'
|
||||
: '')
|
||||
+ (ignore_disabled ?
|
||||
':not(.disabled):not(.filtered-out)'
|
||||
: ''))
|
||||
@ -1372,7 +1410,11 @@ var BrowserPrototype = {
|
||||
// NOTE: this uses .filter(..) for string and regexp matching...
|
||||
select: function(elem, filtering){
|
||||
var browser = this.dom
|
||||
var pattern = '.list>div:not(.disabled):not(.filtered-out):visible'
|
||||
var pattern = '.list>div'
|
||||
+ (this.options.elementSeparatorClass ?
|
||||
':not('+ this.options.elementSeparatorClass +')'
|
||||
: '')
|
||||
+':not(.disabled):not(.filtered-out):visible'
|
||||
var elems = browser.find(pattern)
|
||||
|
||||
if(elems.length == 0){
|
||||
@ -1477,7 +1519,11 @@ var BrowserPrototype = {
|
||||
// .navigate('next') will simply navigate to the next element while
|
||||
// .select('next') / .filter('next') will yield that element by name.
|
||||
navigate: function(action, filtering){
|
||||
var pattern = '.list>div:not(.disabled):not(.filtered-out):visible'
|
||||
var pattern = '.list>div'
|
||||
+ (this.options.elementSeparatorClass ?
|
||||
':not('+ this.options.elementSeparatorClass +')'
|
||||
: '')
|
||||
+':not(.disabled):not(.filtered-out):visible'
|
||||
action = action || 'first'
|
||||
|
||||
if(action == 'none'){
|
||||
@ -2085,6 +2131,8 @@ ListPrototype.options = {
|
||||
// NOTE: to disable this set it to false or null
|
||||
disableItemPattern: '^- ',
|
||||
|
||||
elementSeparatorText: '---',
|
||||
|
||||
list: function(path, make){
|
||||
var that = this
|
||||
var data = this.options.data
|
||||
@ -2123,7 +2171,7 @@ ListPrototype.options = {
|
||||
|
||||
var e = make(n, null, disable)
|
||||
|
||||
if(data !== keys){
|
||||
if(data !== keys && that.options.data[k] != null){
|
||||
e.on('open', function(){
|
||||
return that.options.data[k].apply(this, arguments)
|
||||
})
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user