mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-11-01 11:50:07 +00:00
reworked the crop modes, now can be nested (still need some work) + some minor tweaks...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
3f8f7eb45f
commit
d30849f387
@ -1613,6 +1613,7 @@ function showAllData(){
|
|||||||
var prev_state = DATA
|
var prev_state = DATA
|
||||||
var cur = DATA.current
|
var cur = DATA.current
|
||||||
|
|
||||||
|
if(CROP_STACK.length != 0){
|
||||||
DATA = getAllData()
|
DATA = getAllData()
|
||||||
CROP_STACK = []
|
CROP_STACK = []
|
||||||
|
|
||||||
@ -1624,6 +1625,7 @@ function showAllData(){
|
|||||||
|
|
||||||
reloadViewer()
|
reloadViewer()
|
||||||
updateImages()
|
updateImages()
|
||||||
|
}
|
||||||
|
|
||||||
return prev_state
|
return prev_state
|
||||||
}
|
}
|
||||||
|
|||||||
@ -184,13 +184,19 @@ var KEYBOARD_CONFIG = {
|
|||||||
title: 'Marked only and single ribbon views',
|
title: 'Marked only and single ribbon views',
|
||||||
doc: 'To show marked-only images press <b>shift-F2</b> and for single ribbon mode press <b>F3</b>.',
|
doc: 'To show marked-only images press <b>shift-F2</b> and for single ribbon mode press <b>F3</b>.',
|
||||||
|
|
||||||
Esc: doc('Exit mode',
|
Esc: {
|
||||||
|
default: doc('Uncrop to last state',
|
||||||
|
function(){
|
||||||
|
uncropLastState()
|
||||||
|
return false
|
||||||
|
}),
|
||||||
|
shift: doc('Exit crop mode',
|
||||||
function(){
|
function(){
|
||||||
// add something like uncrop here...
|
|
||||||
toggleMarkedOnlyView('off')
|
toggleMarkedOnlyView('off')
|
||||||
toggleSingleRibbonMode('off')
|
toggleSingleRibbonMode('off')
|
||||||
return false
|
return false
|
||||||
}),
|
}),
|
||||||
|
},
|
||||||
Q: 'Esc',
|
Q: 'Esc',
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -588,16 +594,16 @@ var KEYBOARD_CONFIG = {
|
|||||||
F2: {
|
F2: {
|
||||||
default: doc('Toggle mark visibility',
|
default: doc('Toggle mark visibility',
|
||||||
function(){ toggleMarkesView() }),
|
function(){ toggleMarkesView() }),
|
||||||
shift: doc('Toggle marked only images view',
|
shift: doc('Crop marked only images',
|
||||||
function(){
|
function(){
|
||||||
toggleMarkedOnlyView()
|
toggleMarkedOnlyView('on')
|
||||||
}),
|
}),
|
||||||
},
|
},
|
||||||
|
|
||||||
F3: doc('Toggle single ribbon view (EXPERIMENTAL)',
|
F3: doc('Crop single ribbon',
|
||||||
function(){
|
function(){
|
||||||
event.preventDefault()
|
event.preventDefault()
|
||||||
toggleSingleRibbonMode()
|
toggleSingleRibbonMode('on')
|
||||||
}),
|
}),
|
||||||
|
|
||||||
E: doc('Open image in external software', openImage),
|
E: doc('Open image in external software', openImage),
|
||||||
|
|||||||
@ -1140,6 +1140,14 @@ button:hover {
|
|||||||
display: inline-block;
|
display: inline-block;
|
||||||
min-height: 50px;
|
min-height: 50px;
|
||||||
min-width: 300px;
|
min-width: 300px;
|
||||||
|
/* XXX for some reason this is not sized correctly... */
|
||||||
|
|
||||||
|
max-height: 90%;
|
||||||
|
max-width: 90%;
|
||||||
|
/* XXX this needs to be lower priority than max-height... */
|
||||||
|
|
||||||
|
/*overflow-y: auto;*/
|
||||||
|
|
||||||
color: white;
|
color: white;
|
||||||
border: solid silver 1px;
|
border: solid silver 1px;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
|
|||||||
@ -1182,6 +1182,12 @@ button:hover {
|
|||||||
|
|
||||||
min-height: 50px;
|
min-height: 50px;
|
||||||
min-width: 300px;
|
min-width: 300px;
|
||||||
|
/* XXX for some reason this is not sized correctly... */
|
||||||
|
max-height: 90%;
|
||||||
|
max-width: 90%;
|
||||||
|
|
||||||
|
/* XXX this needs to be lower priority than max-height... */
|
||||||
|
/*overflow-y: auto;*/
|
||||||
|
|
||||||
color: white;
|
color: white;
|
||||||
border: solid silver 1px;
|
border: solid silver 1px;
|
||||||
|
|||||||
12
ui/marks.js
12
ui/marks.js
@ -50,17 +50,21 @@ var toggleMarkedOnlyView = createCSSClassToggler(
|
|||||||
'.viewer',
|
'.viewer',
|
||||||
'marked-only-view cropped-mode',
|
'marked-only-view cropped-mode',
|
||||||
function(action){
|
function(action){
|
||||||
// prevent reentering...
|
//// prevent reentering...
|
||||||
if(action == 'on' && $('.viewer').hasClass('cropped-mode')
|
//if(action == 'on' && $('.viewer').hasClass('cropped-mode')
|
||||||
|| action == toggleMarkedOnlyView('?')){
|
// || action == toggleMarkedOnlyView('?')){
|
||||||
|
if(action == 'on' && toggleSingleImageMode('?') == 'on'){
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
function(action){
|
function(action){
|
||||||
if(action == 'on'){
|
if(action == 'on'){
|
||||||
|
// XXX do nothing if there is no change...
|
||||||
|
// XXX
|
||||||
cropMarkedImages()
|
cropMarkedImages()
|
||||||
} else {
|
} else {
|
||||||
uncropData()
|
//uncropData()
|
||||||
|
showAllData()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
31
ui/modes.js
31
ui/modes.js
@ -177,19 +177,42 @@ var toggleSingleRibbonMode = createCSSClassToggler(
|
|||||||
'.viewer',
|
'.viewer',
|
||||||
'single-ribbon-mode cropped-mode',
|
'single-ribbon-mode cropped-mode',
|
||||||
function(action){
|
function(action){
|
||||||
// prevent reentering...
|
//// prevent reentering...
|
||||||
if(action == 'on' && $('.viewer').hasClass('cropped-mode')
|
//if(action == 'on' && $('.viewer').hasClass('cropped-mode')
|
||||||
|| action == toggleSingleRibbonMode('?')){
|
// || action == toggleSingleRibbonMode('?')){
|
||||||
|
// prevent mixing marked-only and single-ribbon modes...
|
||||||
|
if(action == 'on' && toggleMarkedOnlyView('?') == 'on'){
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
function(action){
|
function(action){
|
||||||
if(action == 'on'){
|
if(action == 'on'){
|
||||||
|
// XXX do nothing if there is no change...
|
||||||
|
// XXX
|
||||||
cropDataTo(DATA.ribbons[getRibbonIndex()].slice())
|
cropDataTo(DATA.ribbons[getRibbonIndex()].slice())
|
||||||
|
} else {
|
||||||
|
//uncropData()
|
||||||
|
showAllData()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
function uncropLastState(){
|
||||||
|
if(toggleSingleRibbonMode('?') == 'off'
|
||||||
|
&& toggleMarkedOnlyView('?') == 'off'){
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
// exit cropped mode...
|
||||||
|
if(CROP_STACK.length == 1){
|
||||||
|
toggleSingleRibbonMode('off')
|
||||||
|
toggleMarkedOnlyView('off')
|
||||||
|
|
||||||
|
// ucrop one state...
|
||||||
} else {
|
} else {
|
||||||
uncropData()
|
uncropData()
|
||||||
}
|
}
|
||||||
})
|
}
|
||||||
|
|
||||||
|
|
||||||
// TODO transitions...
|
// TODO transitions...
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user