From afa14dabfaecacd1a965fd3ae67963bd7644c144 Mon Sep 17 00:00:00 2001
From: "Alex A. Naanou" <alex.nanou@gmail.com>
Date: Tue, 14 May 2013 18:35:09 +0400
Subject: [PATCH] more marking support, toggleImageMarkBlock(...) not yet
 supported...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
---
 ui/base.js    | 17 +++++++++++++----
 ui/data.js    | 35 +++++++++++++++++++++++++++++++++++
 ui/index.html |  6 ++++--
 3 files changed, 52 insertions(+), 6 deletions(-)

diff --git a/ui/base.js b/ui/base.js
index 20aa0371..eabec693 100755
--- a/ui/base.js
+++ b/ui/base.js
@@ -870,12 +870,15 @@ var toggleImageMark = createCSSClassToggler('.current.image', 'marked',
 function removeImageMarks(mode){
 	// remove marks from current ribbon (default)...
 	if(mode == 'ribbon' || mode == null){
-		return getRibbon()
+		var ribbon = getRibbon()
+		$('.viewer').trigger('removeingRibbonMarks', [ribbon])
+		return ribbon
 			.find('.marked')
 				.removeClass('marked')
 
 	// remove all marks...
 	} else if(mode == 'all'){
+		$('.viewer').trigger('removeingAllMarks')
 		return $('.marked')
 			.removeClass('marked')
 	} 
@@ -885,12 +888,14 @@ function removeImageMarks(mode){
 function markAll(mode){
 	// remove marks from current ribbon (default)...
 	if(mode == 'ribbon' || mode == null){
-		return getRibbon()
+		var ribbon = getRibbon()
+		$('.viewer').trigger('markingRibbon', [ribbon])
+		return ribbon
 			.find('.image:not(.marked)')
 				.addClass('marked')
 
-	// remove all marks...
 	} else if(mode == 'all'){
+		$('.viewer').trigger('markingAll')
 		return $('.image:not(.marked)').addClass('marked')
 	}
 }
@@ -898,7 +903,9 @@ function markAll(mode){
 
 // NOTE: this only does it's work in the current ribbon...
 function invertImageMarks(){
-	return getRibbon()
+	var ribbon = getRibbon()
+	$('.viewer').trigger('invertingMarks', [ribbon])
+	return ribbon
 		.find('.image')
 			.toggleClass('marked')
 }
@@ -906,10 +913,12 @@ function invertImageMarks(){
 
 // Toggle marks in the current continuous section of marked or unmarked
 // images...
+// XXX need to make this dynamic data compatible...
 function toggleImageMarkBlock(image){
 	if(image == null){
 		image = $('.current.image')
 	}
+	//$('.viewer').trigger('togglingImageBlockMarks', [image])
 	// we need to invert this...
 	var state = toggleImageMark()
 	var _convert = function(){
diff --git a/ui/data.js b/ui/data.js
index 203fde4c..a8f2e908 100755
--- a/ui/data.js
+++ b/ui/data.js
@@ -541,6 +541,8 @@ function setupDataBindings(viewer){
 		})
 
 
+		// marks...
+		// XXX toggle marking a block is not yet supported...
 		.on('togglingMark', function(evt, img, action){
 			var gid = getImageGID(img) 
 
@@ -553,6 +555,39 @@ function setupDataBindings(viewer){
 				MARKS.splice(MARKS.indexOf(gid), 1)
 			}
 		})
+		.on('removeingRibbonMarks', function(evt, ribbon){
+			$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){
+				var i = MARKS.indexOf(e)
+				if(i != -1){
+					MARKS.splice(i, 1)
+				}
+			})
+		})
+		.on('removeingAllMarks', function(evt){
+			MARKS.splice(0, MARKS.length)
+		})
+		.on('markingRibbon', function(evt, ribbon){
+			$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){
+				var i = MARKS.indexOf(e)
+				if(i == -1){
+					MARKS.push(e)
+				}
+			})
+		})
+		.on('markingAll', function(evt){
+			MARKS.splice(0, MARKS.length)
+			MARKS.concat(DATA.order)
+		})
+		.on('invertingMarks', function(evt, ribbon){
+			$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){
+				var i = MARKS.indexOf(e)
+				if(i == -1){
+					MARKS.push(e)
+				} else {
+					MARKS.splice(i, 1)
+				}
+			})
+		})
 }
 
 
diff --git a/ui/index.html b/ui/index.html
index 6e022934..6ec17518 100755
--- a/ui/index.html
+++ b/ui/index.html
@@ -24,8 +24,10 @@
 	position: absolute;
 	display: block;
 
-	/* neede for scaling/zooming to behave correctly and not shift the 
-	element, when its dimensions change... */
+	/* NOTE: this needs for scaling/zooming to behave correctly and not 
+			shift the element, when its dimensions change... 
+			...this is because .ribbon-set will both be used for scaling 
+			and aligning... */
 	transform-origin: top left;
 	-ms-transform-origin: top left;
 	-webkit-transform-origin: top left; /* Safari and Chrome */