mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-10-29 18:30:09 +00:00
some refactoring...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
e60f0568d6
commit
9ce4e3c0c4
@ -57,7 +57,6 @@ var undoShift = function(undo){
|
||||
var BaseActions =
|
||||
module.BaseActions =
|
||||
actions.Actions({
|
||||
|
||||
config: {
|
||||
// XXX should this be here???
|
||||
version: 'gen4',
|
||||
@ -857,20 +856,20 @@ actions.Actions({
|
||||
|
||||
|
||||
var Base =
|
||||
module.Base = core.ImageGridFeatures.Feature({
|
||||
module.Base =
|
||||
core.ImageGridFeatures.Feature({
|
||||
title: 'ImageGrid base',
|
||||
|
||||
tag: 'base',
|
||||
depends: [
|
||||
'changes',
|
||||
],
|
||||
/*
|
||||
suggested: [
|
||||
'tags',
|
||||
'sort',
|
||||
'tasks',
|
||||
'base-edit',
|
||||
//'tags',
|
||||
//'sort',
|
||||
//'tasks',
|
||||
],
|
||||
//*/
|
||||
|
||||
actions: BaseActions,
|
||||
|
||||
@ -994,6 +993,32 @@ module.Base = core.ImageGridFeatures.Feature({
|
||||
})
|
||||
|
||||
|
||||
//---------------------------------------------------------------------
|
||||
// Edit...
|
||||
var BaseEditActions =
|
||||
module.BaseEditActions =
|
||||
actions.Actions({
|
||||
config: {
|
||||
},
|
||||
|
||||
// XXX
|
||||
})
|
||||
|
||||
var BaseEdit =
|
||||
module.BaseEdit =
|
||||
core.ImageGridFeatures.Feature({
|
||||
title: 'ImageGrid base editor',
|
||||
|
||||
tag: 'base-edit',
|
||||
depends: [
|
||||
'base',
|
||||
],
|
||||
|
||||
actions: BaseEditActions,
|
||||
})
|
||||
|
||||
|
||||
|
||||
//---------------------------------------------------------------------
|
||||
// Tags...
|
||||
|
||||
|
||||
@ -65,6 +65,11 @@ FORCE.prototype.hook = function(elem, prop){
|
||||
}
|
||||
|
||||
//---------------------------------------------------------------------
|
||||
//
|
||||
// - take care of DOM construction and update...
|
||||
// - alignment is done via .centerRibbon(..) / .centerImage(..)
|
||||
// - preview updates (XXX)
|
||||
// - update onload (a-la .ribbons._loadImagePreviewURL(..))
|
||||
|
||||
var VirtualDOMRibbonsClassPrototype = {
|
||||
// XXX ???
|
||||
@ -341,6 +346,17 @@ object.makeConstructor('VirtualDOMRibbons',
|
||||
|
||||
|
||||
/*********************************************************************/
|
||||
// XXX TODO:
|
||||
// - shifting images
|
||||
// - use .virtualdom.sync() + shadow animation instead of .ribbons.*
|
||||
// - would be nice to make this an alternative feature...
|
||||
// ...split out ribbon editing into a feature and do two
|
||||
// implementations, the original and virtualdom...
|
||||
// - current image indicator...
|
||||
// - custom align: .alignByOrder(..) / .alignByFirst(..) / ..
|
||||
// - ribbon rotation: .ribbonRotation(..) / .rotateRibbonCW(..) / ..
|
||||
// - cropping???
|
||||
//
|
||||
|
||||
var PartialRibbonsActions = actions.Actions({
|
||||
config: {
|
||||
@ -372,10 +388,9 @@ var PartialRibbonsActions = actions.Actions({
|
||||
|| this.config['ribbon-size-screens']
|
||||
|| 9) * w
|
||||
|
||||
// XXX DEBUG
|
||||
size = 5
|
||||
|
||||
// XXX add threshold test -- we do not need this on every action...
|
||||
|
||||
this.virtualdom.sync(target, size)
|
||||
this.centerViewer(target)
|
||||
}],
|
||||
|
||||
@ -710,12 +710,6 @@ module.ViewerActions = actions.Actions({
|
||||
this.focusImage(t, r)
|
||||
}
|
||||
}],
|
||||
setBaseRibbon: [
|
||||
function(target){
|
||||
var r = this.data.getRibbon(target)
|
||||
r = r == null ? this.ribbons.getRibbon(target) : r
|
||||
this.ribbons.setBaseRibbon(r)
|
||||
}],
|
||||
|
||||
// NOTE: these prioritize whole images, i.e. each image will at least
|
||||
// once be fully shown.
|
||||
@ -917,58 +911,6 @@ module.ViewerActions = actions.Actions({
|
||||
fitScreen: ['Zoom/Fit image to screen',
|
||||
function(){ this.screenfit = 1 }],
|
||||
|
||||
shiftImageLeft: [
|
||||
function(target){ this.ribbons.placeImage(target, -1) }],
|
||||
shiftImageRight: [
|
||||
function(target){ this.ribbons.placeImage(target, 1) }],
|
||||
|
||||
/*
|
||||
// XXX how should these animate???
|
||||
travelImageUp: [
|
||||
function(){
|
||||
}],
|
||||
travelImageDown: [
|
||||
function(){
|
||||
}],
|
||||
*/
|
||||
|
||||
shiftRibbonUp: [
|
||||
function(target){
|
||||
target = this.ribbons.getRibbon(target)
|
||||
var i = this.ribbons.getRibbonOrder(target)
|
||||
if(i > 0){
|
||||
this.ribbons.placeRibbon(target, i-1)
|
||||
}
|
||||
}],
|
||||
shiftRibbonDown: [
|
||||
function(target){
|
||||
target = this.ribbons.getRibbon(target)
|
||||
var i = this.ribbons.getRibbonOrder(target)
|
||||
if(i < this.data.ribbon_order.length-1){
|
||||
this.ribbons.placeRibbon(target, i+1)
|
||||
}
|
||||
}],
|
||||
|
||||
reverseImages: [ reloadAfter() ],
|
||||
reverseRibbons: [ reloadAfter() ],
|
||||
sortImages: [ reloadAfter(true) ],
|
||||
|
||||
// basic image editing...
|
||||
//
|
||||
// XXX should we have .rotate(..) and .flip(..) generic actions???
|
||||
rotateCW: [
|
||||
function(target){ this.ribbons.rotateCW(target) }],
|
||||
rotateCCW: [
|
||||
function(target){ this.ribbons.rotateCCW(target) }],
|
||||
flipVertical: [
|
||||
function(target){ this.ribbons.flipVertical(target, 'view') }],
|
||||
flipHorizontal: [
|
||||
function(target){ this.ribbons.flipHorizontal(target, 'view') }],
|
||||
|
||||
// XXX this needs an interactive mode -- mark A, mark B, align between
|
||||
alignToRibbon: [ reloadAfter(true) ],
|
||||
|
||||
|
||||
// ribbon rotation...
|
||||
//
|
||||
ribbonRotation: ['- Interface|Ribbon/',
|
||||
@ -1003,42 +945,6 @@ module.ViewerActions = actions.Actions({
|
||||
function(){ this.ribbonRotation(0) }],
|
||||
|
||||
|
||||
// tags...
|
||||
tag: [
|
||||
function(tags, gids){
|
||||
gids = gids != null && gids.constructor !== Array ? [gids] : gids
|
||||
return function(){
|
||||
//this.ribbons.updateImage(gids)
|
||||
this.refresh(gids)
|
||||
}
|
||||
}],
|
||||
untag: [
|
||||
function(tags, gids){
|
||||
gids = gids != null && gids.constructor !== Array ? [gids] : gids
|
||||
return function(){
|
||||
//this.ribbons.updateImage(gids)
|
||||
this.refresh(gids)
|
||||
}
|
||||
}],
|
||||
|
||||
|
||||
// group stuff...
|
||||
group: [ reloadAfter(true) ],
|
||||
ungroup: [ reloadAfter(true) ],
|
||||
groupTo: [ reloadAfter(true) ],
|
||||
groupMarked: [ reloadAfter(true) ],
|
||||
expandGroup: [ reloadAfter(true) ],
|
||||
collapseGroup: [ reloadAfter(true) ],
|
||||
|
||||
|
||||
// XXX BUG? reloadAfter() here does not remove some images...
|
||||
crop: [ reloadAfter(true) ],
|
||||
// XXX BUG? reloadAfter() produces an align error...
|
||||
uncrop: [ reloadAfter(true) ],
|
||||
// XXX might be a good idea to do this in a new viewer in an overlay...
|
||||
cropGroup: [ reloadAfter() ],
|
||||
|
||||
|
||||
// XXX experimental: not sure if this is the right way to go...
|
||||
// XXX make this play nice with crops...
|
||||
// ...should this be a crop???
|
||||
@ -1075,6 +981,10 @@ module.Viewer = core.ImageGridFeatures.Feature({
|
||||
'workspace',
|
||||
'introspection',
|
||||
],
|
||||
suggested: [
|
||||
// XXX is this the right way???
|
||||
'ui-edit',
|
||||
],
|
||||
|
||||
actions: ViewerActions,
|
||||
|
||||
@ -1152,6 +1062,127 @@ module.Viewer = core.ImageGridFeatures.Feature({
|
||||
})
|
||||
|
||||
|
||||
//---------------------------------------------------------------------
|
||||
|
||||
// XXX Q: should this be further split into groups and tags???
|
||||
var ViewerEditActions =
|
||||
module.ViewerEditActions =
|
||||
actions.Actions({
|
||||
config: {
|
||||
},
|
||||
|
||||
setBaseRibbon: [
|
||||
function(target){
|
||||
var r = this.data.getRibbon(target)
|
||||
r = r == null ? this.ribbons.getRibbon(target) : r
|
||||
this.ribbons.setBaseRibbon(r)
|
||||
}],
|
||||
|
||||
shiftImageLeft: [
|
||||
function(target){ this.ribbons.placeImage(target, -1) }],
|
||||
shiftImageRight: [
|
||||
function(target){ this.ribbons.placeImage(target, 1) }],
|
||||
|
||||
/*
|
||||
// XXX how should these animate???
|
||||
travelImageUp: [
|
||||
function(){
|
||||
}],
|
||||
travelImageDown: [
|
||||
function(){
|
||||
}],
|
||||
*/
|
||||
|
||||
shiftRibbonUp: [
|
||||
function(target){
|
||||
target = this.ribbons.getRibbon(target)
|
||||
var i = this.ribbons.getRibbonOrder(target)
|
||||
if(i > 0){
|
||||
this.ribbons.placeRibbon(target, i-1)
|
||||
}
|
||||
}],
|
||||
shiftRibbonDown: [
|
||||
function(target){
|
||||
target = this.ribbons.getRibbon(target)
|
||||
var i = this.ribbons.getRibbonOrder(target)
|
||||
if(i < this.data.ribbon_order.length-1){
|
||||
this.ribbons.placeRibbon(target, i+1)
|
||||
}
|
||||
}],
|
||||
|
||||
reverseImages: [ reloadAfter() ],
|
||||
reverseRibbons: [ reloadAfter() ],
|
||||
sortImages: [ reloadAfter(true) ],
|
||||
|
||||
// basic image editing...
|
||||
//
|
||||
// XXX should we have .rotate(..) and .flip(..) generic actions???
|
||||
rotateCW: [
|
||||
function(target){ this.ribbons.rotateCW(target) }],
|
||||
rotateCCW: [
|
||||
function(target){ this.ribbons.rotateCCW(target) }],
|
||||
flipVertical: [
|
||||
function(target){ this.ribbons.flipVertical(target, 'view') }],
|
||||
flipHorizontal: [
|
||||
function(target){ this.ribbons.flipHorizontal(target, 'view') }],
|
||||
|
||||
// XXX this needs an interactive mode -- mark A, mark B, align between
|
||||
alignToRibbon: [ reloadAfter(true) ],
|
||||
|
||||
|
||||
// tags...
|
||||
tag: [
|
||||
function(tags, gids){
|
||||
gids = gids != null && gids.constructor !== Array ? [gids] : gids
|
||||
return function(){
|
||||
//this.ribbons.updateImage(gids)
|
||||
this.refresh(gids)
|
||||
}
|
||||
}],
|
||||
untag: [
|
||||
function(tags, gids){
|
||||
gids = gids != null && gids.constructor !== Array ? [gids] : gids
|
||||
return function(){
|
||||
//this.ribbons.updateImage(gids)
|
||||
this.refresh(gids)
|
||||
}
|
||||
}],
|
||||
|
||||
|
||||
// group stuff...
|
||||
group: [ reloadAfter(true) ],
|
||||
ungroup: [ reloadAfter(true) ],
|
||||
groupTo: [ reloadAfter(true) ],
|
||||
groupMarked: [ reloadAfter(true) ],
|
||||
expandGroup: [ reloadAfter(true) ],
|
||||
collapseGroup: [ reloadAfter(true) ],
|
||||
|
||||
|
||||
// XXX BUG? reloadAfter() here does not remove some images...
|
||||
crop: [ reloadAfter(true) ],
|
||||
// XXX BUG? reloadAfter() produces an align error...
|
||||
uncrop: [ reloadAfter(true) ],
|
||||
// XXX might be a good idea to do this in a new viewer in an overlay...
|
||||
cropGroup: [ reloadAfter() ],
|
||||
})
|
||||
|
||||
var ViewerEdit =
|
||||
module.ViewerEdit =
|
||||
core.ImageGridFeatures.Feature({
|
||||
title: 'Graphical User Interface',
|
||||
|
||||
tag: 'ui-edit',
|
||||
|
||||
depends: [
|
||||
'base-edit',
|
||||
'ui',
|
||||
],
|
||||
|
||||
actions: ViewerEditActions,
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
/*********************************************************************/
|
||||
// User interfaces for different base features...
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user