mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-10-30 19:00:09 +00:00
refactored the panel API out from the editor...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
d4bae60f58
commit
64f13db83f
@ -20,6 +20,7 @@
|
|||||||
<script src="lib/jli.js"></script>
|
<script src="lib/jli.js"></script>
|
||||||
<script src="lib/keyboard.js"></script>
|
<script src="lib/keyboard.js"></script>
|
||||||
<script src="lib/scroller.js"></script>
|
<script src="lib/scroller.js"></script>
|
||||||
|
<script src="lib/panels.js"></script>
|
||||||
<script src="lib/editor.js"></script>
|
<script src="lib/editor.js"></script>
|
||||||
|
|
||||||
<script src="compatibility.js"></script>
|
<script src="compatibility.js"></script>
|
||||||
|
|||||||
@ -246,101 +246,6 @@ function makeLogRange(text, filter, target){
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
function makePanel(title, open, editable_title){
|
|
||||||
title = title == null ? ' ' : title
|
|
||||||
|
|
||||||
// tool panel...
|
|
||||||
var panel = $('<details/>')
|
|
||||||
.prop('open', open == null ? true : open)
|
|
||||||
.addClass('panel noScroll')
|
|
||||||
.css({
|
|
||||||
position: 'absolute',
|
|
||||||
top: '100px',
|
|
||||||
left: '100px',
|
|
||||||
})
|
|
||||||
.append($('<summary>'+title+'</summary>')
|
|
||||||
.attr({
|
|
||||||
contenteditable: editable_title == null ? 'false' : 'true',
|
|
||||||
})
|
|
||||||
// XXX add a '+' button to create a new panel...
|
|
||||||
.append($('<span/>')
|
|
||||||
.addClass('close-button')
|
|
||||||
.click(function(){
|
|
||||||
panel
|
|
||||||
.trigger('panelClosing')
|
|
||||||
.hide()
|
|
||||||
return false
|
|
||||||
})
|
|
||||||
.html('×')))
|
|
||||||
.draggable({
|
|
||||||
containment: 'parent',
|
|
||||||
scroll: false,
|
|
||||||
// XXX this makes things quite a bit slower...
|
|
||||||
stack: '.panel',
|
|
||||||
})
|
|
||||||
|
|
||||||
var _outside = false
|
|
||||||
|
|
||||||
// wrapper for sub-panels...
|
|
||||||
var content = $('<span class="panel-content">')
|
|
||||||
.sortable({
|
|
||||||
forcePlaceholderSize: true,
|
|
||||||
opacity: 0.7,
|
|
||||||
connectWith: '.panel-content',
|
|
||||||
zIndex: 9999,
|
|
||||||
|
|
||||||
start: function(e, ui){
|
|
||||||
_outside = false
|
|
||||||
ui.placeholder.height(ui.helper.outerHeight());
|
|
||||||
ui.placeholder.width(ui.helper.outerWidth());
|
|
||||||
},
|
|
||||||
// XXX this is not done...
|
|
||||||
// create a new panel when dropping outside of curent panel...
|
|
||||||
stop: function(e, ui){
|
|
||||||
// do this only when dropping putside the panel...
|
|
||||||
if(_outside){
|
|
||||||
makePanel()
|
|
||||||
// XXX adjust this to scale...
|
|
||||||
.css(ui.position)
|
|
||||||
.appendTo(panel.parent())
|
|
||||||
.find('.panel-content')
|
|
||||||
.append(ui.item)
|
|
||||||
}
|
|
||||||
},
|
|
||||||
// XXX are these the correct events???
|
|
||||||
over: function(e, ui){
|
|
||||||
_outside = false
|
|
||||||
},
|
|
||||||
out: function(e, ui){
|
|
||||||
_outside = true
|
|
||||||
},
|
|
||||||
})
|
|
||||||
.appendTo(panel)
|
|
||||||
return panel
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
function makeSubPanel(title, open, parent){
|
|
||||||
title = title == null ? ' ' : title
|
|
||||||
|
|
||||||
var sub_panel = $('<details/>')
|
|
||||||
.addClass('sub-panel noScroll')
|
|
||||||
.prop('open', open == null ? true : open)
|
|
||||||
.append($('<summary>'+title+'</summary>'))
|
|
||||||
.append($('<div class="sub-panel-content"/>'))
|
|
||||||
|
|
||||||
if(parent != null){
|
|
||||||
if(parent.hasClass('panel-content')){
|
|
||||||
sub_panel.appendTo(parent)
|
|
||||||
} else {
|
|
||||||
sub_panel.appendTo(parent.find('.panel-content'))
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return sub_panel
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
function makeFilterPanel(parent, target){
|
function makeFilterPanel(parent, target){
|
||||||
return makeSubPanel('Filters', true, parent)
|
return makeSubPanel('Filters', true, parent)
|
||||||
.find('.sub-panel-content')
|
.find('.sub-panel-content')
|
||||||
|
|||||||
111
ui/lib/panels.js
Executable file
111
ui/lib/panels.js
Executable file
@ -0,0 +1,111 @@
|
|||||||
|
/**********************************************************************
|
||||||
|
*
|
||||||
|
*
|
||||||
|
*
|
||||||
|
**********************************************************************/
|
||||||
|
|
||||||
|
//var DEBUG = DEBUG != null ? DEBUG : true
|
||||||
|
|
||||||
|
|
||||||
|
/*********************************************************************/
|
||||||
|
|
||||||
|
function makePanel(title, open, editable_title){
|
||||||
|
title = title == null ? ' ' : title
|
||||||
|
|
||||||
|
// tool panel...
|
||||||
|
var panel = $('<details/>')
|
||||||
|
.prop('open', open == null ? true : open)
|
||||||
|
.addClass('panel noScroll')
|
||||||
|
.css({
|
||||||
|
position: 'absolute',
|
||||||
|
top: '100px',
|
||||||
|
left: '100px',
|
||||||
|
})
|
||||||
|
.append($('<summary>'+title+'</summary>')
|
||||||
|
.attr({
|
||||||
|
contenteditable: editable_title == null ? 'false' : 'true',
|
||||||
|
})
|
||||||
|
// XXX add a '+' button to create a new panel...
|
||||||
|
.append($('<span/>')
|
||||||
|
.addClass('close-button')
|
||||||
|
.click(function(){
|
||||||
|
panel
|
||||||
|
.trigger('panelClosing')
|
||||||
|
.hide()
|
||||||
|
return false
|
||||||
|
})
|
||||||
|
.html('×')))
|
||||||
|
.draggable({
|
||||||
|
containment: 'parent',
|
||||||
|
scroll: false,
|
||||||
|
// XXX this makes things quite a bit slower...
|
||||||
|
stack: '.panel',
|
||||||
|
})
|
||||||
|
|
||||||
|
var _outside = false
|
||||||
|
|
||||||
|
// wrapper for sub-panels...
|
||||||
|
var content = $('<span class="panel-content">')
|
||||||
|
.sortable({
|
||||||
|
forcePlaceholderSize: true,
|
||||||
|
opacity: 0.7,
|
||||||
|
connectWith: '.panel-content',
|
||||||
|
zIndex: 9999,
|
||||||
|
|
||||||
|
start: function(e, ui){
|
||||||
|
_outside = false
|
||||||
|
ui.placeholder.height(ui.helper.outerHeight());
|
||||||
|
ui.placeholder.width(ui.helper.outerWidth());
|
||||||
|
},
|
||||||
|
// XXX this is not done...
|
||||||
|
// create a new panel when dropping outside of curent panel...
|
||||||
|
stop: function(e, ui){
|
||||||
|
// do this only when dropping putside the panel...
|
||||||
|
if(_outside){
|
||||||
|
makePanel()
|
||||||
|
// XXX adjust this to scale...
|
||||||
|
.css(ui.position)
|
||||||
|
.appendTo(panel.parent())
|
||||||
|
.find('.panel-content')
|
||||||
|
.append(ui.item)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// XXX are these the correct events???
|
||||||
|
over: function(e, ui){
|
||||||
|
_outside = false
|
||||||
|
},
|
||||||
|
out: function(e, ui){
|
||||||
|
_outside = true
|
||||||
|
},
|
||||||
|
})
|
||||||
|
.appendTo(panel)
|
||||||
|
return panel
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function makeSubPanel(title, open, parent){
|
||||||
|
title = title == null ? ' ' : title
|
||||||
|
|
||||||
|
var sub_panel = $('<details/>')
|
||||||
|
.addClass('sub-panel noScroll')
|
||||||
|
.prop('open', open == null ? true : open)
|
||||||
|
.append($('<summary>'+title+'</summary>'))
|
||||||
|
.append($('<div class="sub-panel-content"/>'))
|
||||||
|
|
||||||
|
if(parent != null){
|
||||||
|
if(parent.hasClass('panel-content')){
|
||||||
|
sub_panel.appendTo(parent)
|
||||||
|
} else {
|
||||||
|
sub_panel.appendTo(parent.find('.panel-content'))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return sub_panel
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**********************************************************************
|
||||||
|
* vim:set ts=4 sw=4 : */
|
||||||
29
ui/tags.js
29
ui/tags.js
@ -18,8 +18,24 @@ TAGS = {
|
|||||||
|
|
||||||
/*********************************************************************/
|
/*********************************************************************/
|
||||||
|
|
||||||
function buildTagsFromImages(images){
|
function buildTagsFromImages(images, tagset){
|
||||||
|
tagset = tagset == null ? TAGS : tagset
|
||||||
|
images = images == null ? IMAGES : images
|
||||||
|
|
||||||
|
for(gid in images){
|
||||||
|
var tags = images[gid].tags
|
||||||
|
if(tags == null){
|
||||||
|
continue
|
||||||
}
|
}
|
||||||
|
tags.map(function(tag){
|
||||||
|
if(tagset[tag] == null){
|
||||||
|
tagset[tag] = []
|
||||||
|
}
|
||||||
|
tagset[tag].push(gid)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
// XXX
|
// XXX
|
||||||
function normalizeTag(tag){
|
function normalizeTag(tag){
|
||||||
@ -27,6 +43,7 @@ function normalizeTag(tag){
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*********************************************************************/
|
/*********************************************************************/
|
||||||
|
|
||||||
function addTag(tags, gid, tagset, images){
|
function addTag(tags, gid, tagset, images){
|
||||||
@ -137,19 +154,25 @@ function updateTags(tags, gid, tagset, images){
|
|||||||
// this implements the AND selector...
|
// this implements the AND selector...
|
||||||
// NOTE: do not like this algorithm as it can get O(n^2)-ish
|
// NOTE: do not like this algorithm as it can get O(n^2)-ish
|
||||||
function selectByTags(tags, tagset){
|
function selectByTags(tags, tagset){
|
||||||
|
tags = typeof(tags) == typeof('str') ? [ tags ] : tags
|
||||||
|
tagset = tagset == null ? TAGS : tagset
|
||||||
|
|
||||||
var subtagset = []
|
var subtagset = []
|
||||||
var res = []
|
var res = []
|
||||||
|
|
||||||
// populate the subtagset...
|
// populate the subtagset...
|
||||||
tags.map(function(tag){
|
tags.map(function(tag){
|
||||||
|
if(tagset[tag] == null){
|
||||||
|
return
|
||||||
|
}
|
||||||
subtagset.push(tagset[tag])
|
subtagset.push(tagset[tag])
|
||||||
})
|
})
|
||||||
subtagset.sort(function(a, b){
|
subtagset.sort(function(a, b){
|
||||||
return a.length - b.length
|
return b.length - a.length
|
||||||
})
|
})
|
||||||
|
|
||||||
// set the res to the shortest subset...
|
// set the res to the shortest subset...
|
||||||
var cur = subtagset.pop().splice()
|
var cur = subtagset.pop().slice()
|
||||||
|
|
||||||
// filter out the result...
|
// filter out the result...
|
||||||
cur.map(function(gid){
|
cur.map(function(gid){
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user