diff --git a/ui/controls.otl b/ui/controls.otl index 7796fc97..a33da2b2 100755 --- a/ui/controls.otl +++ b/ui/controls.otl @@ -14,8 +14,7 @@ Control scheme: | action | keyboard gesture button (tablet) button (desktop) tablet / phone / desktop - single - ribbon + general focus image -- tap/click - - left image @@ -23,13 +22,13 @@ Control scheme: right image right swipe left + - up image - up -- (via focus image) - - + up -- (via focus image) ?? - down image - down -- (via focus image) - - + down -- (via focus image) ?? - first image - home -- - - + home -- ?? - last image - end -- - - + end -- ?? - shift up s-up swipe up + - @@ -41,7 +40,16 @@ Control scheme: c-s-down ?? ?? ?? drag view - ?? tap-drag - - + -- tap-drag - - + move view left + ?? ?? ?? ?? + move view right + ?? ?? ?? ?? + move view up + ?? ?? ?? ?? + move view down + ?? ?? ?? ?? + center current image ?? ?? ?? ?? @@ -51,15 +59,20 @@ Control scheme: - pinch closeup - - fit one 1 tap current image - - - fit three - 3 ?? - - - broad view - ?? ?? - - toggle single image mode ?? ?? - - toggle slideshow mode ?? ?? - - + + keyboard help + settings + ribbon-specific + fit three + 3 ?? - - + broad view + ?? ?? - - + single-specific . | vim:set spell : diff --git a/ui/gallery-prototype.js b/ui/gallery-prototype.js index bb7dd7ef..a84819b9 100755 --- a/ui/gallery-prototype.js +++ b/ui/gallery-prototype.js @@ -118,9 +118,10 @@ var keys = { zoomIn: [187], zoomOut: [189], // zoom presets... - zoomOriginal: [48], fitOne: [49], fitThree: [51], + // XXX is this relivant? + zoomOriginal: [48], first: [36], last: [35], @@ -133,6 +134,12 @@ var keys = { promote: [45], demote: [46], + moveViewUp: [75], // k + moveViewDown: [74], // j + moveViewLeft: [72], // h + moveViewRight: [76], // l + + // keys to be ignored... ignore: [16, 17, 18], helpShowOnUnknownKey: true @@ -186,6 +193,12 @@ function handleKeys(event){ : (fn(code, keys.fitOne) >= 0) ? fitImage() : (fn(code, keys.fitThree) >= 0) ? fitThreeImages() + // moving view... + : (fn(code, keys.moveViewUp) >= 0) ? moveViewUp() + : (fn(code, keys.moveViewDown) >= 0) ? moveViewDown() + : (fn(code, keys.moveViewLeft) >= 0) ? moveViewLeft() + : (fn(code, keys.moveViewRight) >= 0) ? moveViewRight() + : (fn(code, keys.toggleRibbonView) >= 0) ? toggleRibbonView() : (fn(code, keys.ignore) >= 0) ? false // XXX @@ -247,6 +260,30 @@ function toggleWideView(){ +/********************************************************* Movement **/ + +var MOVE_DELTA = 50 + +// XXX for some odd reason these are not liner... something to do with origin? +function moveViewUp(){ + var t = parseInt($('.field').css('top')) + $('.field').css({'top': t-(MOVE_DELTA)}) +} +function moveViewDown(){ + var t = parseInt($('.field').css('top')) + $('.field').css({'top': t+(MOVE_DELTA)}) +} +function moveViewLeft(){ + var l = parseInt($('.field').css('left')) + $('.field').css({'left': l-(MOVE_DELTA)}) +} +function moveViewRight(){ + var l = parseInt($('.field').css('left')) + $('.field').css({'left': l+(MOVE_DELTA)}) +} + + + /******************************************************* Navigation **/ // basic navigation... @@ -263,6 +300,7 @@ function lastImage(){ $('.current.ribbon').children('.image').last().click() } + // XXX for the above two functions to be stable we will need to jump up // to the next and down to the prev element... function focusRibbon(direction){ diff --git a/ui/gallery.html b/ui/gallery.html index ee4f600f..3e21f238 100755 --- a/ui/gallery.html +++ b/ui/gallery.html @@ -103,6 +103,13 @@ $(document).ready(setup); +

+ + + + + +