From f637859b0ecffef206d9af3ea052d542ce05bd85 Mon Sep 17 00:00:00 2001
From: laurence <laurenceseo99@gmail.com>
Date: Tue, 17 Sep 2013 03:36:57 +0800
Subject: favorite panel

---
 js/colorpicker.js | 110 ++++++++++++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 103 insertions(+), 7 deletions(-)

(limited to 'js/colorpicker.js')

diff --git a/js/colorpicker.js b/js/colorpicker.js
index 574349f..bce6593 100644
--- a/js/colorpicker.js
+++ b/js/colorpicker.js
@@ -8,11 +8,16 @@ var infostate = 0;
 var names = true;
 var hexes = false;
 var rgbs = false;
+var favshow = false;
 var selectedname = "";
 var selectedrgb;
+var curfavcolor = "";
+var curfavcolorId = "";
 //---------element objects----------
 var transbutton = $('#transbutton');
 var submitvalue = $('#submitvalue');
+var addfav = $('#addfavlist');
+var openfav = $('#openfavlist');
 var preview = $('#preview');
 var colornames = $('#colornames');
 var namespace = $('#namespace');
@@ -26,10 +31,17 @@ var backgroundswitch = $('#backgroundswitch');
 var bg_menu = $('#bg_menu');
 var vasebackground = $('#vasebackground');
 var hexswitch = $('#hexswitch');
+var favpanel = $('#favpanel');
 //----------------------------------
 $(function(){
 	ColorPicker.show();
 });
+function selectfavColor(selcolor, id)
+{	
+	addfav.html('Remove from Favorites');
+	curfavcolor = selcolor;
+	curfavcolorId = id;
+}
 var ColorPicker = {	
 	GoldenFuncs: {
 		regolden: function(num) {
@@ -51,7 +63,7 @@ var ColorPicker = {
 		},
 		makegolden: function(idandselectr, propertystr) {
 		  result = ColorPicker.GoldenFuncs.getproperty(idandselectr, propertystr);
-		  newval = ColorPicker.GoldenFuncs.goldenize(result);
+		  newval = ColorPicker.GoldenFuncs.goldenize(result) + 60;
 		  propval = newval.toString()+'px';
 		  if(propertystr == 'height') {
 			  $(idandselectr).css('width', propval);
@@ -59,7 +71,7 @@ var ColorPicker = {
 			  $(idandselectr).css('height', propval);
 		  }
 		}
-	},	
+	},
 	Events: {		
 		addEventListener: function(){
 			//--------event handler of transparent button-------
@@ -75,9 +87,8 @@ var ColorPicker = {
 							  function(){ transbutton.attr('class','defaulttrans')});
 			submitvalue.hover(function(){ submitvalue.addClass('hovertrans')},
 							  function(){ submitvalue.attr('class','defaulttrans')});
-			submitvalue.click(function() {			
-				
-			});
+			addfav.hover(function(){ addfav.addClass('hovertrans')},
+							  function(){ addfav.attr('class','defaulttrans')});					
 			$('.bgOptions').click(function(){
 				if (this.id == "bg1")
 				{
@@ -143,7 +154,8 @@ var ColorPicker = {
 				  })
 				}
 			});
-
+			addfav.click(function(){ColorPicker.addfavourites()});
+			openfav.click(function(){ColorPicker.openfavourites()});
 			hexswitch.click(function(){ColorPicker.hexcolorswitch()});
 			$('.theswitches').hover(function(){ ColorPicker.switchhovercss(this.id, 'over') }, 
 									function(){ ColorPicker.switchhovercss(this.id, 'out') });
@@ -154,6 +166,90 @@ var ColorPicker = {
 			});
 		}
 	},
+	initfavpanel: function(){
+		var fcolors = $('#favcolors').val();
+		var clist=fcolors.split(',');
+		for(var i=0; i < clist.length; i++) {
+			if (clist[i] != '')
+			{
+				var colname = rgbtoname[hextorgb[clist[i]]];				
+				favpanel.append('<span class="favcolor" id="favcol' + i + '" ><input name="favcolor" type="radio"  onclick="selectfavColor(\'' + clist[i] + '\',\'favcol' + i +'\');"><label>' + colname +  '</label></span>');				
+			}			
+		}
+	},
+	existsfavcolor: function(fcolor) {
+		var fcolors = $('#favcolors').val();
+		var clist=fcolors.split(',');
+		for(var i=0; i < clist.length; i++) {
+			if (clist[i] == fcolor)
+			{
+				return i;
+			}
+		}
+		return -1;
+	},
+	addfavourites: function() {
+		var fcolors = $('#favcolors').val();
+		
+		if (curfavcolor != '') {
+			var clist=fcolors.split(',');
+			var index = ColorPicker.existsfavcolor(curfavcolor);
+			if(index != 0 && index == clist.length - 1)
+			{
+				fcolors = fcolors.replace(',' + curfavcolor, '');
+			}else if(clist.length == 1) {
+				fcolors = fcolors.replace(curfavcolor, '');
+			}else{
+				fcolors = fcolors.replace(curfavcolor+ ',', '');
+			}
+			$('#' + curfavcolorId).remove();
+			addfav.html('Add to Favorites');
+			curfavcolor = "";
+			curfavcolorId = "";
+			$('#favnone').attr('checked','checked');
+			if (fcolors == '')
+			{
+				favpanel.hide();
+				favshow = false;
+				openfav.attr('class','defaulttrans');
+			}
+		}else {
+			if (ColorPicker.existsfavcolor(rgbtohex[selectedrgb]) == -1)
+			{				
+				if (fcolors.length > 0) {
+					fcolors = fcolors + ',' + rgbtohex[selectedrgb];
+				}else {
+					fcolors = rgbtohex[selectedrgb];
+				}				
+				var colname = rgbtoname[selectedrgb];
+				var clist=fcolors.split(',');
+				var id = clist.length - 1;
+				$('#favmsg').remove();
+				favpanel.append('<span class="favcolor" id="favcol' + id + '" ><input name="favcolor" type="radio" onclick="selectfavColor(\'' + rgbtohex[selectedrgb] + '\',\'favcol' + id +'\');"><label>' + colname +  '</label></span>');
+			}	
+		}
+		$('#favcolors').val(fcolors);		
+	},
+	openfavourites: function() {
+		if (favshow) {
+			favpanel.hide();
+			openfav.attr('class','defaulttrans');
+			favshow = false;
+			$('#favmsg').remove();
+		}else {
+			favpanel.show();
+			openfav.addClass('hovertrans');
+			favshow = true;
+			var fcolors = $('#favcolors').val();
+			if(fcolors == '') {
+				favpanel.append('<span class="favmsg" id="favmsg">No favourite colors.</span>');
+			}
+		}
+		addfav.html('Add to Favorites');
+		curfavcolor = "";
+		curfavcolorId = "";
+		$('#favnone').attr('checked','checked');
+	},
 	loadColorStorage: function() {
 		var opts = $('#opt_hexswitch').val();
 		names = false;
@@ -190,6 +286,7 @@ var ColorPicker = {
 			$('#colorpicker').css({'background-image':'none','background-color':$('#' + bgOpt).html()});
 		}
 		$('#bgURI').val($('#opt_bgURI').val());
+		ColorPicker.initfavpanel();
 	},
 	switchhovercss: function(sel, uno) {
 		var chng = {};
@@ -370,7 +467,6 @@ var ColorPicker = {
 		ColorPicker.setupdimensions();
 		ColorPicker.switchcolorinfo();
 		ColorPicker.hexcolorswitch();
-		
 		ColorPicker.Events.addEventListener();
 	},
 }
-- 
cgit v1.2.3-70-g09d2