refactored the panel API out from the editor...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2013-12-09 21:10:12 +04:00
parent d4bae60f58
commit 64f13db83f
4 changed files with 138 additions and 98 deletions

View File

@ -20,6 +20,7 @@
<script src="lib/jli.js"></script>
<script src="lib/keyboard.js"></script>
<script src="lib/scroller.js"></script>
<script src="lib/panels.js"></script>
<script src="lib/editor.js"></script>
<script src="compatibility.js"></script>

View File

@ -246,101 +246,6 @@ function makeLogRange(text, filter, target){
}
function makePanel(title, open, editable_title){
title = title == null ? '&nbsp;' : 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('&times;')))
.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 ? '&nbsp;' : 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){
return makeSubPanel('Filters', true, parent)
.find('.sub-panel-content')

111
ui/lib/panels.js Executable file
View File

@ -0,0 +1,111 @@
/**********************************************************************
*
*
*
**********************************************************************/
//var DEBUG = DEBUG != null ? DEBUG : true
/*********************************************************************/
function makePanel(title, open, editable_title){
title = title == null ? '&nbsp;' : 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('&times;')))
.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 ? '&nbsp;' : 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 : */

View File

@ -18,15 +18,32 @@ 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
function normalizeTag(tag){
return tag.trim()
}
/*********************************************************************/
function addTag(tags, gid, tagset, images){
@ -137,19 +154,25 @@ function updateTags(tags, gid, tagset, images){
// this implements the AND selector...
// NOTE: do not like this algorithm as it can get O(n^2)-ish
function selectByTags(tags, tagset){
tags = typeof(tags) == typeof('str') ? [ tags ] : tags
tagset = tagset == null ? TAGS : tagset
var subtagset = []
var res = []
// populate the subtagset...
tags.map(function(tag){
if(tagset[tag] == null){
return
}
subtagset.push(tagset[tag])
})
subtagset.sort(function(a, b){
return a.length - b.length
return b.length - a.length
})
// set the res to the shortest subset...
var cur = subtagset.pop().splice()
var cur = subtagset.pop().slice()
// filter out the result...
cur.map(function(gid){