1 %# BEGIN BPS TAGGED BLOCK {{{
5 %# This software is Copyright (c) 1996-2015 Best Practical Solutions, LLC
6 %# <sales@bestpractical.com>
8 %# (Except where explicitly superseded by other copyright notices)
13 %# This work is made available to you under the terms of Version 2 of
14 %# the GNU General Public License. A copy of that license should have
15 %# been provided with this software, but in any event can be snarfed
18 %# This work is distributed in the hope that it will be useful, but
19 %# WITHOUT ANY WARRANTY; without even the implied warranty of
20 %# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
21 %# General Public License for more details.
23 %# You should have received a copy of the GNU General Public License
24 %# along with this program; if not, write to the Free Software
25 %# Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA
26 %# 02110-1301 or visit their web page on the internet at
27 %# http://www.gnu.org/licenses/old-licenses/gpl-2.0.html.
30 %# CONTRIBUTION SUBMISSION POLICY:
32 %# (The following paragraph is not intended to limit the rights granted
33 %# to you to modify and distribute this software under the terms of
34 %# the GNU General Public License and is only of importance to you if
35 %# you choose to contribute your changes and enhancements to the
36 %# community by submitting them to Best Practical Solutions, LLC.)
38 %# By intentionally submitting any modifications, corrections or
39 %# derivatives to this work, or any other work intended for use with
40 %# Request Tracker, to Best Practical Solutions, LLC, you confirm that
41 %# you are the copyright holder for those contributions and you grant
42 %# Best Practical Solutions, LLC a nonexclusive, worldwide, irrevocable,
43 %# royalty-free, perpetual, license to use, copy, create derivative
44 %# works based on those contributions, and sublicense and distribute
45 %# those contributions and any derivatives thereof.
47 %# END BPS TAGGED BLOCK }}}
48 <& /Admin/Elements/Header,
49 Title => loc("Theme"),
52 <& /Elements/ListActions, actions => \@results &>
54 <script type="text/javascript" src="<%RT->Config->Get('WebPath')%>/NoAuth/js/farbtastic.js"></script>
56 <div id="simple-customize">
57 <div id="upload-logo">
59 <& /Elements/Logo, id => 'logo-theme-editor', ShowName => 0 &>
60 <form method="POST" enctype="multipart/form-data">
61 <label for="logo-upload"><&|/l&>Upload a new logo</&>:</label>
62 <input type="file" name="logo-upload" id="logo-upload" /><br />
63 <div class="gd-support">
65 <&|/l, $valid_image_types &>Your system supports automatic color suggestions for: [_1]</&>
67 <&|/l&>GD is disabled or not installed. You can upload an image, but you won't get automatic color suggestions.</&>
70 <input name="reset_logo" value="Reset to default RT Logo" type="submit" />
71 <input type="submit" value="Upload" />
75 <div id="customize-theme">
76 <h2>Customize the RT theme</h2>
79 <label for="section"><&|/l&>Select a section</&>:</label>
80 <select id="section"></select>
83 <div class="description"><&|/l&>Select a color for the section</&>:</div>
85 <div class="primary-colors">
87 % my $fg = $_->{l} >= $text_threshold ? 'black' : 'white';
88 <button type="button" class="color-template"
89 style="background-color: rgb(<% $_->{c} %>); color: <% $fg %>;">
95 <div id="color-picker"></div>
101 <div id="custom-css">
102 <h2>Custom CSS (Advanced)</h2>
105 <textarea rows=20 id="user_css" name="user_css" wrap="off"><% $user_css %></textarea><br />
106 <input id="try" type="button" class="button" value="Try" />
107 <input id="reset" type="reset" value="Reset" type="submit" />
108 <input name="reset_css" value="Reset to default RT Theme" type="submit" />
109 <input value="Save" type="submit" />
115 ['Page' => ['body']],
116 ['Header' => ['div#quickbar', 'body.aileron #main-navigation #app-nav > li, body.aileron #main-navigation #app-nav > li > a, #prefs-menu > li, #prefs-menu > li > a, #logo .rtname']],
117 ['Page title' => ['div#header h1']],
118 ['Page content' => ['div#body']],
119 ['Buttons' => ['input[type="reset"], input[type="submit"], input[class="button"]']],
120 ['Button hover' => ['input[type="reset"]:hover, input[type="submit"]:hover, input[class="button"]:hover']],
123 <script type="text/javascript">
124 var section_css_mapping = <% JSON(\@sections) |n%>;
128 jQuery.each(section_css_mapping, function(i,v){
129 $('select#section').append($("<option/>")
134 function update_sitecss(text) {
136 text = $('#user_css').val();
138 // IE 8 doesn't let us update the innerHTML of <style> tags (with jQuery.text())
139 // see: http://stackoverflow.com/questions/2692770/style-style-textcss-appendtohead-does-not-work-in-ie/2692861#2692861
140 $("style#sitecss").remove();
141 $("<style id='sitecss' type='text/css' media='all'>" + text + "</style>").appendTo('head');
145 $('#try').click(function() {
149 $('#reset').click(function() {
150 setTimeout(function() {
155 function change_color(bg, fg) {
156 var section = $('select#section').val();
158 var applying = jQuery.grep(section_css_mapping, function(a){ return a[0] == section })[0][1];
159 var css = $('#user_css').val();
161 var specials = new RegExp("([.*+?|()\\[\\]{}\\\\])", "g");
162 for (var name in applying) {
163 var selector = (applying[name]).replace(specials, "\\$1");
164 var rule = new RegExp('^'+selector+'\\s*\{.*?\}', "m");
165 var newcss = "background: " + bg;
167 /* Don't set the text color on <body> as it affects too much */
168 if (applying[name] != "body")
169 newcss += "; color: " + fg;
171 /* Kill the border on the quickbar if we're styling it */
172 if (applying[name].match(/quickbar/))
173 newcss += "; border: none;"
175 /* Page title's text color is the selected color */
176 if (applying[name].match(/#header/))
177 newcss = "color: " + bg;
179 /* Nav doesn't need a background, but it wants text color */
180 if (applying[name].match(/#main-navigation/))
181 newcss = "color: " + fg;
183 css = css.replace(rule, applying[name]+" { "+newcss+" }");
186 $('#user_css').val(css);
190 $('#color-picker').farbtastic(function(color){ change_color(color, this.hsl[2] > <% $text_threshold %> ? '#000' : '#fff') });
192 $('button.color-template').click(function() {
193 change_color($(this).css('background-color'), $(this).css('color'));
200 unless ($session{'CurrentUser'}->HasRight( Object=> RT->System, Right => 'SuperUser')) {
201 Abort(loc('This feature is only available to system administrators.'));
204 use Digest::MD5 'md5_hex';
206 my $text_threshold = 0.6;
210 if (my $file_hash = _UploadedFile( 'logo-upload' )) {
211 my ($id, $msg) = RT->System->SetAttribute( Name => "UserLogo",
212 Description => "User-provided logo",
214 type => $file_hash->{ContentType},
215 data => $file_hash->{LargeContent},
216 hash => md5_hex($file_hash->{LargeContent}),
218 push @results, loc("Unable to set UserLogo: [_1]", $msg) unless $id;
220 $imgdata = $file_hash->{LargeContent};
222 elsif ($ARGS{'reset_logo'}) {
223 RT->System->DeleteAttribute('UserLogo');
226 if (my $attr = RT->System->FirstAttribute('UserLogo')) {
227 my $content = $attr->Content;
228 if (ref($content) eq 'HASH') {
229 $imgdata = $content->{data};
232 RT->System->DeleteAttribute('UserLogo');
238 if ($ARGS{'reset_css'}) {
239 RT->System->DeleteAttribute('UserCSS');
243 my ($id, $msg) = RT->System->SetAttribute( Name => "UserCSS",
244 Description => "User-provided css",
245 Content => $user_css );
246 push @results, loc("Unable to set UserCSS: [_1]", $msg) unless $id;
251 my $attr = RT->System->FirstAttribute('UserCSS');
252 $user_css = $attr ? $attr->Content : join(
254 join "\n" => "/* ". $_->[0] ." */",
255 map { "$_ {}" } @{$_->[1]}
260 # XXX: move this to some other modules
262 use List::MoreUtils qw(uniq);
264 my $has_color_analyzer = eval { require Convert::Color; 1 };
267 my $valid_image_types;
269 if (not RT->Config->Get('DisableGD') and $has_color_analyzer) {
272 # Always find out what GD can read...
273 for my $type (qw(Png Jpeg Gif)) {
274 $gd_can{$type}++ if GD::Image->can("newFrom${type}Data");
276 $valid_image_types = join(", ", map { uc } sort { lc $a cmp lc $b } keys %gd_can);
278 # ...but only analyze the image if we have data
280 if ( my $img = GD::Image->new($imgdata) ) {
281 $colors = analyze_img($img);
284 # This has to be one damn long line because the loc() needs to be
285 # source parsed correctly.
286 push @results, loc("Automatically suggested theme colors aren't available for your image. This might be because you uploaded an image type that your installed version of GD doesn't support. Supported types are: [_1]. You can recompile libgd and GD.pm to include support for other image types.", $valid_image_types);
295 for my $i (0..$img->width-1) {
296 for my $j (0..$img->height-1) {
297 my @color = $img->rgb( $img->getPixel($i,$j) );
298 my $hsl = Convert::Color->new('rgb:'.join(',',map { $_ / 255 } @color))->convert_to('hsl');
299 my $c = join(',',@color);
300 next if $hsl->lightness < 0.1;
301 $color->{$c} ||= { h => $hsl->hue, s => $hsl->saturation, l => $hsl->lightness, cnt => 0, c => $c};
302 $color->{$c}->{cnt}++;
306 for (values %$color) {
307 $_->{rank} = $_->{s} * $_->{cnt};
309 my @top5 = grep { defined and $_->{'l'} and $_->{'c'} }
310 (sort { $b->{rank} <=> $a->{rank} } values %$color)[0..5];
311 if ((scalar uniq map {$_->{rank}} @top5) == 1) {
312 $RT::Logger->info("Only one color found in logo image");