1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
|
// $Id$
(function ($) {
Drupal.color = {
callback: function(context, settings, form, farb, height, width) {
// Apply grid classes to the farbtastic container.
$('#placeholder').addClass('grid-4').addClass('push-6').addClass('alpha').addClass('omega');
var wrapper = $('#container');
$('#edit-scheme').change(function() {
var current = $(this).val();
var scheme = settings.color.schemes[current];
for (var i in scheme) {
$('#palette input[name="palette['+ i + ']"]', form).val(scheme[i]).css('background-color', scheme[i]);
};
Drupal.color.callback(context, settings, form, farb, height, width);
});
// Make variables for the selectors so the processing is more readable.
var page = 'html, body';
var tabs = '#skip-link a, .tabs a';
var tabs_active = '.tabs a.active';
var site_name = 'h1.site-name a';
var site_slogan = 'h2.site-slogan';
var navigation = '.region-navigation .content ul a, .region-navigation .content ul a:visited';
var title_page = 'h1.title';
var title_block = 'h2.block-title';
var title_linked = 'h2.title a';
var links = 'a, .a:visited';
var node_links = 'article .links a, article .links a:visited';
var header = '.region-header, .region-navigation, .region-header h2.block-title, .region-navigation h2.block-title';
var header_links = '.region-header a, .region-header a:visited';
var footer = '.breadcrumb, footer.section, footer.section .block-title';
var footer_links = '.breadcrumb a, footer.section a, footer.section a:visited';
// Page
$(page, context)
.css('background-color', $('#palette input[name="palette[page_background]"]', form).val())
.css('color', $('#palette input[name="palette[page_foreground]"]', form).val());
// Links
$(links, wrapper).css('color', $('#palette input[name="palette[links]"]', form).val());
$(links, wrapper).hover(function() {
$(this).css('color', $('#palette input[name="palette[links_hover]"]', form).val());
}, function() {
$(this).css('color', $('#palette input[name="palette[links]"]', form).val());
});
// Identity
$(site_name, context).css('color', $('#palette input[name="palette[site_name]"]', form).val());
$(site_slogan, context).css('color', $('#palette input[name="palette[site_slogan]"]', form).val());
// Navigation
$(navigation, context).css('background-color', $('#palette input[name="palette[navigation_background]"]', form).val())
.css('color', $('#palette input[name="palette[navigation_foreground]"]', form).val());
$(navigation, context).hover(function() {
$(this).css({
backgroundColor: '#fff',
color: $('#palette input[name="palette[page_foreground]"]', form).val(),
})
}, function() {
$(this).css('background-color', $('#palette input[name="palette[navigation_background]"]', form).val())
.css('color', $('#palette input[name="palette[navigation_foreground]"]', form).val());
});
// Tabs
$(tabs, context).css({
backgroundColor: $('#palette input[name="palette[tab_background]"]', form).val(),
color: $('#palette input[name="palette[tab_foreground]"]', form).val()
});
$(tabs, context).not(tabs_active).hover(function() {
$(this).css({
backgroundColor: $('#palette input[name="palette[tab_background_active]"]', form).val(),
color: $('#palette input[name="palette[tab_foreground_active]"]', form).val(),
})
}, function() {
$(this).css({
backgroundColor: $('#palette input[name="palette[tab_background]"]', form).val(),
color: $('#palette input[name="palette[tab_foreground]"]', form).val()
})
});
$(tabs_active, context).css({
backgroundColor: $('#palette input[name="palette[tab_background_active]"]', form).val(),
color: $('#palette input[name="palette[tab_foreground_active]"]', form).val(),
});
$(tabs_active, context).hover(function() {
$(this).css({
backgroundColor: $('#palette input[name="palette[tab_background_active]"]', form).val(),
color: $('#palette input[name="palette[tab_foreground_active]"]', form).val(),
})
}, function() {
$(this).css({
backgroundColor: $('#palette input[name="palette[tab_background_active]"]', form).val(),
color: $('#palette input[name="palette[tab_foreground_active]"]', form).val(),
})
});
// Titles
$(title_page, context).css('color', $('#palette input[name="palette[title_page]"]', form).val());
$(title_block, context).css('color', $('#palette input[name="palette[title_block]"]', form).val());
$(title_linked, context).css('color', $('#palette input[name="palette[title_linked]"]', form).val());
// Node links
$(node_links, context).css('background-color', $('#palette input[name="palette[node_links_background]"]', form).val())
.css('color', $('#palette input[name="palette[node_links_foreground]"]', form).val());
$(node_links, context).hover(function() {
$(this).css('background-color', $('#palette input[name="palette[node_links_background_hover]"]', form).val())
.css('color', $('#palette input[name="palette[node_links_foreground_hover]"]', form).val());
}, function() {
$(this).css('background-color', $('#palette input[name="palette[node_links_background]"]', form).val())
.css('color', $('#palette input[name="palette[node_links_foreground]"]', form).val());
});
// Header
$(header, context).css('color', $('#palette input[name="palette[header_foreground]"]', form).val())
$(header_links, context).css('color', $('#palette input[name="palette[header_links]"]', form).val());
$(header_links, context).hover(function() {
$(this).css('color', $('#palette input[name="palette[header_links_hover]"]', form).val());
}, function() {
$(this).css('color', $('#palette input[name="palette[header_links]"]', form).val());
});
// Footer
$(footer, context).css('background-color', $('#palette input[name="palette[footer_background]"]', form).val())
.css('color', $('#palette input[name="palette[footer_foreground]"]', form).val());
$(footer_links, context).css('color', $('#palette input[name="palette[footer_links]"]', form).val());
$(footer_links, context).hover(function() {
$(this).css('color', $('#palette input[name="palette[footer_links_hover]"]', form).val());
}, function() {
$(this).css('color', $('#palette input[name="palette[footer_links]"]', form).val());
});
}
};
})(jQuery);
|
