2009-04-13 14:39:23 +09:00
|
|
|
$(document).ready(function() {
|
2009-05-19 05:10:46 +09:00
|
|
|
function UpdateColors(e) {
|
|
|
|
var S = f.linked;
|
|
|
|
var C = f.color;
|
2009-04-13 14:39:23 +09:00
|
|
|
|
2009-05-19 05:10:46 +09:00
|
|
|
if (S && S.value && S.value != C) {
|
|
|
|
UpdateSwatch(S);
|
|
|
|
|
|
|
|
switch (parseInt(f.linked.id.slice(-1))) {
|
|
|
|
case 1: default:
|
|
|
|
$('body').css({'background-color':C});
|
|
|
|
break;
|
|
|
|
case 2:
|
|
|
|
$('#content').css({'background-color':C});
|
|
|
|
break;
|
|
|
|
case 3:
|
|
|
|
$('#aside_primary').css({'background-color':C});
|
|
|
|
break;
|
|
|
|
case 4:
|
|
|
|
$('body').css({'color':C});
|
|
|
|
break;
|
|
|
|
case 5:
|
|
|
|
$('a').css({'color':C});
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
S.value = C;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
function UpdateFarbtastic(e) {
|
|
|
|
f.linked = e;
|
|
|
|
f.setColor(e.value);
|
|
|
|
}
|
|
|
|
|
|
|
|
function UpdateSwatch(e) {
|
|
|
|
$(e).css({
|
|
|
|
"background-color": e.value,
|
|
|
|
"color": f.hsl[2] > 0.5 ? "#000": "#fff"
|
2009-04-13 14:39:23 +09:00
|
|
|
});
|
2009-05-19 05:10:46 +09:00
|
|
|
}
|
|
|
|
|
|
|
|
$('#settings_design_color').append('<div id="color-picker"></div>');
|
|
|
|
$('#color-picker').hide();
|
|
|
|
|
|
|
|
var f = $.farbtastic('#color-picker', UpdateColors);
|
2009-05-20 02:05:30 +09:00
|
|
|
var swatches = $('#settings_design_color .swatch');
|
2009-05-19 05:10:46 +09:00
|
|
|
|
|
|
|
swatches
|
|
|
|
.each(UpdateColors)
|
|
|
|
|
|
|
|
.blur(function() {
|
|
|
|
$(this).val($(this).val().toUpperCase());
|
|
|
|
})
|
|
|
|
|
|
|
|
.focus(function() {
|
|
|
|
$('#color-picker').show();
|
|
|
|
UpdateFarbtastic(this);
|
|
|
|
})
|
|
|
|
|
|
|
|
.change(function() {
|
|
|
|
UpdateFarbtastic(this);
|
|
|
|
UpdateSwatch(this);
|
|
|
|
}).change()
|
|
|
|
|
|
|
|
;
|
|
|
|
|
2009-04-13 14:39:23 +09:00
|
|
|
});
|