diff --git a/ui/keybindings.js b/ui/keybindings.js index ec9e3d59..b3902720 100755 --- a/ui/keybindings.js +++ b/ui/keybindings.js @@ -648,7 +648,7 @@ var KEYBOARD_CONFIG = { // XXX should this toggle or set mark to on? default: doc('Mark current image and advance', function(){ - toggleImageMark('on') + toggleMark('on') directionImage() // XXX do we need this??? //if(getImage().filter(':visible').length == 0){ @@ -659,7 +659,7 @@ var KEYBOARD_CONFIG = { // same as default but in reverse direction... shift: doc('Mark current image and return', function(){ - toggleImageMark('on') + toggleMark('on') directionImage(true) // XXX do we need this??? //if(getImage().filter(':visible').length == 0){ @@ -669,13 +669,13 @@ var KEYBOARD_CONFIG = { }), ctrl: doc('Show mark dialog', function(){ markImagesDialog() }), }, - Ins: doc('Toggle mark on current image', function(){ toggleImageMark() }), + Ins: doc('Toggle mark on current image', function(){ toggleMark() }), 'invert-marks': doc('Invert image marks', function(){ invertImageMarks() }), A: { // XXX does not yet work with DATA (???) //shift: doc('Toggle marks in current contagious block', - // function(){ toggleImageMarkBlock() }), + // function(){ toggleMarkBlock() }), ctrl: doc('Mark current ribbon', function(){ @@ -699,7 +699,7 @@ var KEYBOARD_CONFIG = { }, U: { default: doc('Unmark current image', - function(){ toggleImageMark('off') }), + function(){ toggleMark('off') }), ctrl: doc('Unmark current ribbon', function(){ removeImageMarks('ribbon') }), shift: doc('Unamrk all', diff --git a/ui/layout.css b/ui/layout.css index 8096cb53..1354b408 100755 --- a/ui/layout.css +++ b/ui/layout.css @@ -1039,13 +1039,18 @@ button:hover { .context-mode-indicators .current-image-marked { color: blue; } +.context-mode-indicators .current-image-bookmarked { + color: yellow; +} .global-mode-indicators .marked-only-visible .shown, .global-mode-indicators .marks-visible .shown, +.context-mode-indicators .current-image-bookmarked .shown, .context-mode-indicators .current-image-marked .shown { display: none; } .global-mode-indicators .marked-only-visible:after, .global-mode-indicators .marks-visible:after, +.context-mode-indicators .current-image-bookmarked:after, .context-mode-indicators .current-image-marked:after { display: inline-block; width: 6px; @@ -1063,6 +1068,11 @@ button:hover { .context-mode-indicators .current-image-marked:after { color: blue; } +.context-mode-indicators .current-image-bookmarked:after { + color: yellow; + background-color: yellow; + border: solid 2px yellow; +} .marks-visible.viewer .global-mode-indicators .marks-visible { display: inline-block; } @@ -1076,10 +1086,11 @@ button:hover { background-color: transparent; } /* image mark in single image mode... */ +.context-mode-indicators .current-image-bookmarked, .context-mode-indicators .current-image-marked { display: none; - color: blue; } +.single-image-mode.marks-visible.viewer .context-mode-indicators .current-image-bookmarked.shown, .single-image-mode.marks-visible.viewer .context-mode-indicators .current-image-marked.shown { display: inline-block; } diff --git a/ui/layout.less b/ui/layout.less index 1515d45b..62de5d47 100755 --- a/ui/layout.less +++ b/ui/layout.less @@ -1068,13 +1068,18 @@ button:hover { .context-mode-indicators .current-image-marked { color: blue; } +.context-mode-indicators .current-image-bookmarked { + color: yellow; +} .global-mode-indicators .marked-only-visible .shown, .global-mode-indicators .marks-visible .shown, +.context-mode-indicators .current-image-bookmarked .shown, .context-mode-indicators .current-image-marked .shown { display: none; } .global-mode-indicators .marked-only-visible:after, .global-mode-indicators .marks-visible:after, +.context-mode-indicators .current-image-bookmarked:after, .context-mode-indicators .current-image-marked:after { display: inline-block; width: 6px; @@ -1093,6 +1098,11 @@ button:hover { .context-mode-indicators .current-image-marked:after { color: blue; } +.context-mode-indicators .current-image-bookmarked:after { + color: yellow; + background-color: yellow; + border: solid 2px yellow; +} .marks-visible.viewer .global-mode-indicators .marks-visible { display: inline-block; } @@ -1106,10 +1116,11 @@ button:hover { background-color: transparent; } /* image mark in single image mode... */ +.context-mode-indicators .current-image-bookmarked, .context-mode-indicators .current-image-marked { display: none; - color: blue; } +.single-image-mode.marks-visible.viewer .context-mode-indicators .current-image-bookmarked.shown, .single-image-mode.marks-visible.viewer .context-mode-indicators .current-image-marked.shown { display: inline-block; } diff --git a/ui/marks.js b/ui/marks.js index 7f77ea36..3b18b6fe 100755 --- a/ui/marks.js +++ b/ui/marks.js @@ -204,7 +204,7 @@ var toggleMarkesView = createCSSClassToggler( */ -var toggleImageMark = makeMarkToggler('marked', 'selected', 'togglingMark') +var toggleMark = makeMarkToggler('marked', 'selected', 'togglingMark') // mode can be: @@ -217,7 +217,7 @@ function removeImageMarks(mode){ var res = ribbon .find('.marked') .each(function(){ - toggleImageMark(this, 'off') + toggleMark(this, 'off') }) $('.viewer').trigger('removeingRibbonMarks', [ribbon]) @@ -225,7 +225,7 @@ function removeImageMarks(mode){ } else if(mode == 'all'){ var res = $('.marked') .each(function(){ - toggleImageMark(this, 'off') + toggleMark(this, 'off') }) $('.viewer').trigger('removeingAllMarks') } @@ -240,7 +240,7 @@ function markAll(mode){ var res = ribbon .find('.image:not(.marked)') .each(function(){ - toggleImageMark(this, 'on') + toggleMark(this, 'on') }) $('.viewer').trigger('markingRibbon', [ribbon]) @@ -248,7 +248,7 @@ function markAll(mode){ } else if(mode == 'all'){ var res = $('.image:not(.marked)') .each(function(){ - toggleImageMark(this, 'on') + toggleMark(this, 'on') }) $('.viewer').trigger('markingAll') } @@ -262,7 +262,7 @@ function invertImageMarks(){ var res = ribbon .find('.image') .each(function(){ - toggleImageMark(this, 'next') + toggleMark(this, 'next') }) $('.viewer').trigger('invertingMarks', [ribbon]) return res @@ -273,16 +273,16 @@ function invertImageMarks(){ // images... // XXX need to make this dynamic data compatible... // XXX this will mark the block ONLY IF it is loaded!!! -function toggleImageMarkBlock(image){ +function toggleMarkBlock(image){ if(image == null){ image = getImage() } var found = [false, false] // we need to invert this... - var state = toggleImageMark() + var state = toggleMark() var _convert = function(i){ return function(){ - if(toggleImageMark(this, '?') == state){ + if(toggleMark(this, '?') == state){ // we found the end... // NOTE: this will not be set if we reached the end of // the ribbon or the end of the loaded images... @@ -290,7 +290,7 @@ function toggleImageMarkBlock(image){ // stop the iteration... return false } - toggleImageMark(this, state) + toggleMark(this, state) } } image.nextAll('.image').each(_convert(1)) @@ -387,7 +387,7 @@ function markImagesDialog(){ var alg = 'Mark images:' - var cur = toggleImageMark('?') == 'on' ? 'Unmark' : 'Mark' + var cur = toggleMark('?') == 'on' ? 'Unmark' : 'Mark' cfg = {} cfg[alg] = [ @@ -411,11 +411,11 @@ function markImagesDialog(){ // NOTE: these must be in order of least-specific last... if(/current image/.test(res)){ - toggleImageMark() + toggleMark() var msg = (cur + ' image').toLowerCase() } else if(/current block/.test(res)){ - toggleImageMarkBlock() + toggleMarkBlock() var msg = 'toggled block marks' } else if(/Invert/.test(res)){ diff --git a/ui/setup.js b/ui/setup.js index cc5be786..b567c9bb 100755 --- a/ui/setup.js +++ b/ui/setup.js @@ -32,11 +32,17 @@ function setupIndicators(){ .css('cursor', 'hand') .click(function(){ toggleMarkedOnlyView() }) + showContextIndicator( + 'current-image-bookmarked', + 'Image is bookmarked (ctrl-B)') + .css('cursor', 'hand') + .click(function(){ toggleBookmark() }) + showContextIndicator( 'current-image-marked', 'Image is marked (Ins)') .css('cursor', 'hand') - .click(function(){ toggleImageMark() }) + .click(function(){ toggleMark() }) } @@ -50,6 +56,13 @@ function updateContextIndicators(image){ } else { indicator.removeClass('shown') } + + indicator = $('.context-mode-indicators .current-image-bookmarked') + if(image.hasClass('bookmarked')){ + indicator.addClass('shown') + } else { + indicator.removeClass('shown') + } } @@ -360,6 +373,7 @@ function setupDataBindings(viewer){ .on([ 'focusingImage', 'togglingMark', + 'togglingBookmark', 'removeingAllMarks', 'removeingRibbonMarks', 'markingAll',