GNUsocial
/
gnu-social
4
0
Fork 1
Code Issues Releases Wiki Activity

Color picker reset: Resetting form values will also dynamically update 

the page colors back to their original.
This commit is contained in:
Sarven Capadisli 2009-05-20 23:11:35 +00:00
parent f90d0ac6c8
commit b561962b59
2 changed files with 61 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
actions/designsettings.php
View File

@ -141,7 +141,8 @@ class DesignsettingsAction extends AccountSettingsAction
$this->elementEnd('fieldset');
$this->submit('save', _('Save'));
$this->element('input', array('type' => 'reset',
$this->element('input', array('id' => 'settings_design_reset',
'type' => 'reset',
'value' => 'Reset',
'class' => 'form_action-secondary'));

108
js/farbtastic/farbtastic.go.js
View File

@ -1,29 +1,22 @@
$(document).ready(function() {
function UpdateColors(e) {
var S = f.linked;
var C = f.color;
if (S && S.value && S.value != C) {
UpdateSwatch(S);
switch (parseInt(f.linked.id.slice(-1))) {
case 0: default:
$('body').css({'background-color':C});
break;
case 1:
$('#content').css({'background-color':C});
break;
case 2:
$('#aside_primary').css({'background-color':C});
break;
case 3:
$('body').css({'color':C});
break;
case 4:
$('a').css({'color':C});
break;
}
S.value = C;
function UpdateColors(S) {
C = $(S).val();
switch (parseInt(S.id.slice(-1))) {
case 0: default:
$('body').css({'background-color':C});
break;
case 1:
$('#content').css({'background-color':C});
break;
case 2:
$('#aside_primary').css({'background-color':C});
break;
case 3:
$('body').css({'color':C});
break;
case 4:
$('a').css({'color':C});
break;
}
}
@ -33,35 +26,52 @@ $(document).ready(function() {
}
function UpdateSwatch(e) {
$(e).css({
"background-color": e.value,
"color": f.hsl[2] > 0.5 ? "#000": "#fff"
});
$(e).css({"background-color": e.value,
"color": f.hsl[2] > 0.5 ? "#000": "#fff"});
}
$('#settings_design_color').append('<div id="color-picker"></div>');
$('#color-picker').hide();
function SynchColors(e) {
var S = f.linked;
var C = f.color;
var f = $.farbtastic('#color-picker', UpdateColors);
var swatches = $('#settings_design_color .swatch');
if (S && S.value && S.value != C) {
S.value = C;
UpdateSwatch(S);
UpdateColors(S);
}
}
swatches
.each(UpdateColors)
function Init() {
$('#settings_design_color').append('<div id="color-picker"></div>');
$('#color-picker').hide();
.blur(function() {
$(this).val($(this).val().toUpperCase());
})
f = $.farbtastic('#color-picker', SynchColors);
swatches = $('#settings_design_color .swatch');
.focus(function() {
$('#color-picker').show();
UpdateFarbtastic(this);
})
.change(function() {
UpdateFarbtastic(this);
UpdateSwatch(this);
}).change()
;
swatches
.each(SynchColors)
.blur(function() {
$(this).val($(this).val().toUpperCase());
})
.focus(function() {
$('#color-picker').show();
UpdateFarbtastic(this);
})
.change(function() {
UpdateFarbtastic(this);
UpdateSwatch(this);
UpdateColors(this);
}).change();
}
var f, swatches;
Init();
$('#form_settings_design').bind('reset', function(){
setTimeout(function(){
swatches.each(function(){UpdateColors(this);});
$('#color-picker').remove();
swatches.unbind();
Init();
},10);
});
});