diff options
Diffstat (limited to 'js')
| -rw-r--r-- | js/colorpicker.js | 110 |
1 files changed, 103 insertions, 7 deletions
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();
},
}
|
