From 2e5b7c6bc855e2ff198b2f5b269c4f3dfebf39e2 Mon Sep 17 00:00:00 2001
From: "Alex A. Naanou" <alex.nanou@gmail.com>
Date: Fri, 3 May 2013 19:24:06 +0400
Subject: [PATCH] added start/end indicators...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
---
 ui/ImageGrid.js | 30 +++++++++++++++++++++++++++---
 ui/index.html   | 25 ++++++++++++++++++++++---
 2 files changed, 49 insertions(+), 6 deletions(-)

diff --git a/ui/ImageGrid.js b/ui/ImageGrid.js
index b232d7ad..d4795e3a 100755
--- a/ui/ImageGrid.js
+++ b/ui/ImageGrid.js
@@ -28,7 +28,13 @@
 
 
 function flashIndicator(direction){
-	$(direction == 'prev' ? '.up-indicator' : '.down-indicator')
+	$({
+		prev: '.up-indicator',
+		next: '.down-indicator',
+		// XXX not implemented yet...
+		start: '.start-indicator',
+		end: '.end-indicator',
+	}[direction])
 		// NOTE: this needs to be visible in all cases and key press 
 		// 		rhythms... 
 		.show()
@@ -532,14 +538,24 @@ function nextImage(n, mode){
 	mode = mode == null ? NAV_DEFAULT : mode
 	n = n == null ? 1 : n
 	var target = $('.current.image').nextAll('.image' + mode)
-	target = target.length < n ?  target.last() : target.eq(n-1)
+	if(target.length < n){
+		target = target.last()
+		flashIndicator('end')
+	} else {
+		target = target.eq(n-1)
+	}
 	return centerImage(focusImage(target))
 }
 function prevImage(n, mode){
 	mode = mode == null ? NAV_DEFAULT : mode
 	n = n == null ? 1 : n
 	var target = $('.current.image').prevAll('.image' + mode)
-	target = target.length < n ? target.last() : target.eq(n-1)
+	if(target.length < n){
+		target = target.last()
+		flashIndicator('start')
+	} else {
+		target = target.eq(n-1)
+	}
 	return centerImage(focusImage(target))
 }
 function nextScreenImages(mode){
@@ -548,14 +564,22 @@ function nextScreenImages(mode){
 function prevScreenImages(mode){
 	return prevImage(Math.round(getScreenWidthInImages()), mode)
 }
+// XXX revise...
 function firstImage(mode){
 	mode = mode == null ? NAV_DEFAULT : mode
+	if($('.current.image').prevAll('.image' + mode).length == 0){
+		flashIndicator('start')
+	}
 	return centerImage(
 		focusImage(
 			$('.current.image').closest('.ribbon').find('.image').filter(mode).first()))
 }
+// XXX revise...
 function lastImage(mode){
 	mode = mode == null ? NAV_DEFAULT : mode
+	if($('.current.image').nextAll('.image' + mode).length == 0){
+		flashIndicator('end')
+	}
 	return centerImage(
 		focusImage(
 			$('.current.image').closest('.ribbon').find('.image').filter(mode).last()))
diff --git a/ui/index.html b/ui/index.html
index 385a1ef1..8acf41d9 100755
--- a/ui/index.html
+++ b/ui/index.html
@@ -142,7 +142,9 @@
 
 
 .up-indicator,
-.down-indicator {
+.down-indicator,
+.start-indicator,
+.end-indicator {
 	display: block;
 	position: absolute;
 	content: "";
@@ -183,10 +185,25 @@
 	top: -25px;
 	bottom: auto;
 }
+.start-indicator,
+.end-indicator {
+	left: 0px;
+	width: 10px;
+	height: 100%;
+	margin: 0px;
+
+	background: yellow;
+}
+.end-indicator {
+	left: auto;
+	right: 0px;
+}
 /* default state */
 .up-indicator,
-.down-indicator {
-	display: none
+.down-indicator,
+.start-indicator,
+.end-indicator {
+	display: none;
 }
 
 
@@ -312,6 +329,8 @@ Populated
 	<!-- XXX should these be here??? -->
 	<div class="up-indicator"></div>
 	<div class="down-indicator"></div>
+	<div class="start-indicator"></div>
+	<div class="end-indicator"></div>
 </div>