flynx/ImageGrid
1
1
Fork 0
mirror of https://github.com/flynx/ImageGrid.git synced 2025-11-03 21:00:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

added next/prev screen-width navigation...

Browse Source 
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2013-05-03 02:27:54 +04:00
parent 0605570b2d
commit 6ab3ce5505
3 changed files with 29 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
ui/ImageGrid.js
View File

@ -43,6 +43,16 @@ function getRelativeVisualPosition(outer, inner){
} }
function getVisibleImageSize(){
return $('.image').outerWidth() * getElementScale($('.ribbon-set'))
}
function getScreenWidthInImages(){
return $('.viewer').innerWidth() / getVisibleImageSize()
}
// NOTE: if this can't find an image if an order less, it will return // NOTE: if this can't find an image if an order less, it will return
// the first image in ribbon... // the first image in ribbon...
// NOTE: this might return an empty target if the ribbon is empty... // NOTE: this might return an empty target if the ribbon is empty...
@ -368,21 +378,29 @@ var NAV_DEFAULT = NAV_VISIBLE
// basic navigation actions... // basic navigation actions...
function nextImage(mode){ function nextImage(n, mode){
if(mode == null){ if(mode == null){
mode = NAV_DEFAULT mode = NAV_DEFAULT
} }
n = n == null ? 1 : n
return centerImage( return centerImage(
focusImage( focusImage(
$('.current.image').nextAll('.image' + mode).first())) $('.current.image').nextAll('.image' + mode).eq(n-1)))
} }
function prevImage(mode){ function prevImage(n, mode){
if(mode == null){ if(mode == null){
mode = NAV_DEFAULT mode = NAV_DEFAULT
} }
n = n == null ? 1 : n
return centerImage( return centerImage(
focusImage( focusImage(
$('.current.image').prevAll('.image' + mode).first())) $('.current.image').prevAll('.image' + mode).eq(n-1)))
}
function nextScreenImages(mode){
return nextImage(Math.round(getScreenWidthInImages()), mode)
}
function prevScreenImages(mode){
return prevImage(Math.round(getScreenWidthInImages()), mode)
} }
function firstImage(mode){ function firstImage(mode){
if(mode == null){ if(mode == null){

6
ui/index.html
View File

@ -5,6 +5,11 @@
<style> <style>
/*
* XXX move the CSS to a separate file...
* XXX split-off styling/coloring from layout...
*/
.viewer { .viewer {
position: relative; position: relative;
width: 800px; width: 800px;
@ -199,7 +204,6 @@
<script> <script>
/*********************************************************************/
// setup... // setup...
$(function(){ $(function(){

4
ui/keybindings3.js
View File

@ -35,7 +35,7 @@ var KEYBOARD_CONFIG = {
}, },
// XXX prevScreenImages... // XXX prevScreenImages...
ctrl: function(){ ctrl: function(){
console.log('NotImplemented: screen images back.') prevScreenImages()
}, },
// XXX need to keep shift explicitly clear for editor... // XXX need to keep shift explicitly clear for editor...
/* /*
@ -64,7 +64,7 @@ var KEYBOARD_CONFIG = {
}, },
// XXX nextScreenImages... // XXX nextScreenImages...
ctrl: function(){ ctrl: function(){
console.log('NotImplemented: screen images forward.') nextScreenImages()
}, },
// XXX need to keep shift explicitly clear for editor... // XXX need to keep shift explicitly clear for editor...
/* /*