Skip to content

Commit

Permalink
Merge pull request jdorn#91 from jdorn/gui/theme-switcher
Browse files Browse the repository at this point in the history
A theme switcher
  • Loading branch information
uded committed Oct 1, 2013
2 parents 79492f0 + 595c21c commit 66f8274
Show file tree
Hide file tree
Showing 5 changed files with 151 additions and 2 deletions.
11 changes: 11 additions & 0 deletions config/config.php.sample
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,17 @@ return array(
'debug'=>'Debug information',
'raw'=>'Raw report dump',
),

//this enebales one to change the default bootstrap theme
'bootstrap_theme' => 'default',

//this list all the available themes for a user to switch and use the one he or she likes
//once removed the theme will not appear in the dropdown
//if all to be removed - no dropdown will be visible for the user and the default (above) will be used
'bootstrap_themelist' => array(
'default',
'amelia', 'cerulean', 'cosmo', 'cyborg', 'flatly', 'journal', 'readable', 'simplex', 'slate', 'spacelab', 'united'
),

//email settings
'mail_settings' => array(
Expand Down
1 change: 1 addition & 0 deletions lib/PhpReports/PhpReports.php
Original file line number Diff line number Diff line change
Expand Up @@ -225,6 +225,7 @@ public static function listReports() {

$template_vars['reports'] = $reports;
$template_vars['report_errors'] = $errors;
$template_vars['theme'] = $_COOKIE['reports-theme'] != '' ? $_COOKIE['reports-theme'] : self::$config['bootstrap_theme'];

$start = microtime(true);
echo self::render('html/report_list',$template_vars);
Expand Down
File renamed without changes.
107 changes: 107 additions & 0 deletions public/js/jquery.cookie.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,107 @@
/*!
* jQuery Cookie Plugin v1.3.1
* https://github.com/carhartl/jquery-cookie
*
* Copyright 2013 Klaus Hartl
* Released under the MIT license
*/
(function (factory) {
if (typeof define === 'function' && define.amd) {
// AMD. Register as anonymous module.
define(['jquery'], factory);
} else {
// Browser globals.
factory(jQuery);
}
}(function ($) {

var pluses = /\+/g;

function decode(s) {
if (config.raw) {
return s;
}
try {
// If we can't decode the cookie, ignore it, it's unusable.
return decodeURIComponent(s.replace(pluses, ' '));
} catch(e) {}
}

function decodeAndParse(s) {
if (s.indexOf('"') === 0) {
// This is a quoted cookie as according to RFC2068, unescape...
s = s.slice(1, -1).replace(/\\"/g, '"').replace(/\\\\/g, '\\');
}

s = decode(s);

try {
// If we can't parse the cookie, ignore it, it's unusable.
return config.json ? JSON.parse(s) : s;
} catch(e) {}
}

var config = $.cookie = function (key, value, options) {

// Write
if (value !== undefined) {
options = $.extend({}, config.defaults, options);

if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate() + days);
}

value = config.json ? JSON.stringify(value) : String(value);

return (document.cookie = [
config.raw ? key : encodeURIComponent(key),
'=',
config.raw ? value : encodeURIComponent(value),
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}

// Read

var result = key ? undefined : {};

// To prevent the for loop in the first place assign an empty array
// in case there are no cookies at all. Also prevents odd result when
// calling $.cookie().
var cookies = document.cookie ? document.cookie.split('; ') : [];

for (var i = 0, l = cookies.length; i < l; i++) {
var parts = cookies[i].split('=');
var name = decode(parts.shift());
var cookie = parts.join('=');

if (key && key === name) {
result = decodeAndParse(cookie);
break;
}

// Prevent storing a cookie that we couldn't decode.
if (!key && (cookie = decodeAndParse(cookie)) !== undefined) {
result[name] = cookie;
}
}

return result;
};

config.defaults = {};

$.removeCookie = function (key, options) {
if ($.cookie(key) !== undefined) {
// Must not alter options, thus extending a fresh object...
$.cookie(key, '', $.extend({}, options, { expires: -1 }));
return true;
}
return false;
};

}));
34 changes: 32 additions & 2 deletions templates/default/html/page.twig
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@

<!-- Le styles -->
{% block stylesheets %}
<link href="{{base}}/public/css/bootstrap.defualt.min.css" rel="stylesheet">
<link id="bootstrap" href="{{base}}/public/css/bootstrap.{{theme}}.min.css" rel="stylesheet">
<link href="{{ base }}/public/css/typeahead.js-bootstrap.css" rel="stylesheet">
<style>
body {
Expand Down Expand Up @@ -90,7 +90,7 @@

{% block environment_chooser %}
{% if config.environments|length > 1 %}
<script>
<script type="text/javascript">
function change_environment(environment) {
$.getJSON('{{ base }}/set-environment', {
environment: environment
Expand Down Expand Up @@ -123,6 +123,35 @@
</ul>
{% endif %}
{% endblock %}
{% block theme_switcher %}
{% if config.bootstrap_themelist|length > 1 %}
<script type="text/javascript">
function changeTheme(theme) {
$('#bootstrap').attr('href', '{{ base }}/public/css/bootstrap.' + theme + '.min.css');
$.cookie('reports-theme', theme);
$('#theme-swtich > strong').text(theme);
$('ul#themes-list li').each(function(){
if ($(this).hasClass('active') && $(this).children().text() != theme) {
$(this).removeClass('active');
}
if ($(this).children().text() == theme) {
$(this).addClass('active');
}
});
}
</script>
<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" id="theme-swtich">Theme: <strong>{{ theme }}</strong> <b class="caret"></b></a>
<ul class="dropdown-menu" id="themes-list">
{% for option in config.bootstrap_themelist %}
<li{% if option == theme %} class="active"{% endif %}><a href="#" onclick="changeTheme('{{option}}')">{{option}}</a></li>
{% endfor %}
</ul>
</li>
</ul>
{% endif %}
{% endblock %}
</div>
</div>
</div>
Expand Down Expand Up @@ -166,6 +195,7 @@
{% block javascripts %}
<script src="{{base}}/public/js/jquery-2.0.3.min.js"></script>
<script src="{{base}}/public/js/bootstrap-3.0.min.js"></script>
<script src="{{base}}/public/js/jquery.cookie.js"></script>
<script src="{{base}}/public/js/typeahead.min.js"></script>
<script src="{{base}}/public/js/scripts.js"></script>
<script>
Expand Down

0 comments on commit 66f8274

Please sign in to comment.