mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-10-29 10:20:08 +00:00
finished the basic bookmarks functionality (not tested, needs CSS)...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
062a5ba275
commit
a455e55b4d
28
ui/data.js
28
ui/data.js
@ -163,6 +163,14 @@ var UPDATE_SYNC = false
|
||||
var SYNC_IMG_LOADER = false
|
||||
|
||||
|
||||
// list of functions to setup different bindings
|
||||
//
|
||||
// each function must be of the form:
|
||||
// setupBinding(viewer) -> viewer
|
||||
//
|
||||
var SETUP_BINDINGS = []
|
||||
|
||||
|
||||
|
||||
/**********************************************************************
|
||||
* Helpers
|
||||
@ -502,7 +510,7 @@ function getGIDBefore(gid, ribbon, search, data){
|
||||
ribbon = ribbon == null ? getGIDRibbonIndex(gid, data) : ribbon
|
||||
search = search == null ? binSearch : search
|
||||
//search = search == null ? match2(linSearch, binSearch) : search
|
||||
ribbon = data.ribbons[ribbon]
|
||||
ribbon = typeof(ribbon) == typeof(123) ? data.ribbons[ribbon] : ribbon
|
||||
var order = data.order
|
||||
|
||||
var target = order.indexOf(gid)
|
||||
@ -1713,6 +1721,24 @@ function preCacheAllRibbons(){
|
||||
* Actions...
|
||||
*/
|
||||
|
||||
function showImage(gid){
|
||||
var img = getImage(gid)
|
||||
|
||||
// target image not loaded...
|
||||
if(img.length == 0){
|
||||
DATA.current = gid
|
||||
reloadViewer()
|
||||
img = getImage(gid)
|
||||
|
||||
// target is already loaded...
|
||||
} else {
|
||||
centerView(focusImage(img))
|
||||
centerRibbons()
|
||||
}
|
||||
return img
|
||||
}
|
||||
|
||||
|
||||
// Sort the ribbons by DATA.order and re-render...
|
||||
//
|
||||
// This is the main way to sort images:
|
||||
|
||||
@ -33,6 +33,7 @@
|
||||
<script src="workers.js"></script>
|
||||
<script src="modes.js"></script>
|
||||
<script src="marks.js"></script>
|
||||
<script src="bookmarks.js"></script>
|
||||
<script src="files.js"></script>
|
||||
<script src="localstorage.js"></script>
|
||||
<script src="info.js"></script>
|
||||
|
||||
79
ui/marks.js
79
ui/marks.js
@ -38,6 +38,28 @@ function _removeMark(cls, gid, image){
|
||||
}
|
||||
|
||||
|
||||
// Make a mark toggler
|
||||
//
|
||||
// The toggler will:
|
||||
// - toggle img_class on the target image
|
||||
// - add/remove a mark element after the image
|
||||
// - toggle mark_class on the mark element
|
||||
// - trigger the evt_name on the viewer passing it:
|
||||
// - target image
|
||||
// - action ('on' on 'off')
|
||||
//
|
||||
// The actual toggler is built with createCSSClassToggler(..), see its
|
||||
// docs for protocol descrittion.
|
||||
//
|
||||
// The resulting toggled, by default, marks the current image
|
||||
// (.current.image), but can be passed a different image as first
|
||||
// argument.
|
||||
//
|
||||
// NOTE: when passing an alternative image as an argument, the second
|
||||
// argument MUST also be passed. it can be one of:
|
||||
// - 'on' : force create mark
|
||||
// - 'off' : force remove mark
|
||||
// - 'next' : toggle next state (default)
|
||||
function makeMarkToggler(img_class, mark_class, evt_name){
|
||||
return createCSSClassToggler(
|
||||
'.current.image',
|
||||
@ -348,5 +370,62 @@ function markImagesDialog(){
|
||||
}
|
||||
|
||||
|
||||
/*********************************************************************/
|
||||
|
||||
function setupMarks(viewer){
|
||||
console.log('Marks: setup...')
|
||||
return viewer
|
||||
// marks...
|
||||
// XXX toggle marking a block is not yet supported...
|
||||
.on('togglingMark', function(evt, img, action){
|
||||
var gid = getImageGID(img)
|
||||
|
||||
// add marked image to list...
|
||||
if(action == 'on'){
|
||||
MARKED.indexOf(gid) == -1 && MARKED.push(gid)
|
||||
|
||||
// remove marked image from list...
|
||||
} else {
|
||||
MARKED.splice(MARKED.indexOf(gid), 1)
|
||||
}
|
||||
})
|
||||
.on('removeingRibbonMarks', function(evt, ribbon){
|
||||
$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){
|
||||
var i = MARKED.indexOf(e)
|
||||
if(i != -1){
|
||||
MARKED.splice(i, 1)
|
||||
}
|
||||
})
|
||||
})
|
||||
.on('removeingAllMarks', function(evt){
|
||||
MARKED.splice(0, MARKED.length)
|
||||
})
|
||||
.on('markingRibbon', function(evt, ribbon){
|
||||
$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){
|
||||
var i = MARKED.indexOf(e)
|
||||
if(i == -1){
|
||||
MARKED.push(e)
|
||||
}
|
||||
})
|
||||
})
|
||||
.on('markingAll', function(evt){
|
||||
MARKED.splice(0, MARKED.length)
|
||||
MARKED.concat(DATA.order)
|
||||
})
|
||||
.on('invertingMarks', function(evt, ribbon){
|
||||
$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){
|
||||
var i = MARKED.indexOf(e)
|
||||
if(i == -1){
|
||||
MARKED.push(e)
|
||||
} else {
|
||||
MARKED.splice(i, 1)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
SETUP_BINDINGS.push(setupMarks)
|
||||
|
||||
|
||||
|
||||
/**********************************************************************
|
||||
* vim:set ts=4 sw=4 : */
|
||||
|
||||
54
ui/setup.js
54
ui/setup.js
@ -68,6 +68,11 @@ function updateContextIndicators(image){
|
||||
//
|
||||
function setupDataBindings(viewer){
|
||||
viewer = viewer == null ? $('.viewer') : viewer
|
||||
|
||||
SETUP_BINDINGS.forEach(function(setup){
|
||||
setup(viewer)
|
||||
})
|
||||
|
||||
viewer
|
||||
.click(function(){
|
||||
if($('.ribbon').length == 0){
|
||||
@ -321,55 +326,6 @@ function setupDataBindings(viewer){
|
||||
})
|
||||
|
||||
|
||||
// marks...
|
||||
// XXX toggle marking a block is not yet supported...
|
||||
.on('togglingMark', function(evt, img, action){
|
||||
var gid = getImageGID(img)
|
||||
|
||||
// add marked image to list...
|
||||
if(action == 'on'){
|
||||
MARKED.indexOf(gid) == -1 && MARKED.push(gid)
|
||||
|
||||
// remove marked image from list...
|
||||
} else {
|
||||
MARKED.splice(MARKED.indexOf(gid), 1)
|
||||
}
|
||||
})
|
||||
.on('removeingRibbonMarks', function(evt, ribbon){
|
||||
$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){
|
||||
var i = MARKED.indexOf(e)
|
||||
if(i != -1){
|
||||
MARKED.splice(i, 1)
|
||||
}
|
||||
})
|
||||
})
|
||||
.on('removeingAllMarks', function(evt){
|
||||
MARKED.splice(0, MARKED.length)
|
||||
})
|
||||
.on('markingRibbon', function(evt, ribbon){
|
||||
$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){
|
||||
var i = MARKED.indexOf(e)
|
||||
if(i == -1){
|
||||
MARKED.push(e)
|
||||
}
|
||||
})
|
||||
})
|
||||
.on('markingAll', function(evt){
|
||||
MARKED.splice(0, MARKED.length)
|
||||
MARKED.concat(DATA.order)
|
||||
})
|
||||
.on('invertingMarks', function(evt, ribbon){
|
||||
$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){
|
||||
var i = MARKED.indexOf(e)
|
||||
if(i == -1){
|
||||
MARKED.push(e)
|
||||
} else {
|
||||
MARKED.splice(i, 1)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
// caching...
|
||||
.on('reloadedRibbon updatedRibbon', function(evt, ribbon){
|
||||
|
||||
|
||||
@ -191,6 +191,7 @@ function sortImages(cmp, reverse){
|
||||
DATA.order.reverse()
|
||||
}
|
||||
updateRibbonOrder()
|
||||
$('.viewer').trigger('sortedImages', [cmp])
|
||||
}
|
||||
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user