jquery.fancytree
Version:
jQuery tree view / tree grid plugin with support for keyboard, inline editing, filtering, checkboxes, drag'n'drop, and lazy loading
467 lines (418 loc) • 11.4 kB
JavaScript
/**
* jQuery Theme Switcher plugin
*
* Copyright (c) 2011 Dave Hoff (davehoff.com)
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*
*/
(function( $ ){
$.fn.themeswitcher = function( options ) {
var switcherDiv = this, switcherOptions = {};
var settings = {
loadtheme : "",
height: 200,
width: 175,
rounded: true,
imgpath: "",
themepath: "https://ajax.googleapis.com/ajax/libs/jqueryui/",
jqueryuiversion: "1.8.10",
initialtext: "Switch Theme",
buttonpretext: "Theme:",
closeonselect: true,
buttonheight: 14,
cookiename: "jquery-ui-theme",
themes: [],
additionalthemes: [],
onopen: null,
onclose: null,
onselect: null,
cookieexpires: 365,
cookiepath: '/'
};
if(options) {
//lowercase all options passed in
$.each(options, function(k,v){
switcherOptions[k.toLowerCase()] = v;
});
$.extend( settings, switcherOptions );
}
if( ! settings.themes.length ){
var themes = [
{
title: "Black Tie",
name: "black-tie",
icon: "theme_90_black_tie.png"
},
{
title: "Blitzer",
name: "blitzer",
icon: "theme_90_blitzer.png"
},
{
title: "Cupertino",
name: "cupertino",
icon: "theme_90_cupertino.png"
},
{
title: "Dark Hive",
name: "dark-hive",
icon: "theme_90_dark_hive.png"
},
{
title: "Dot Luv",
name: "dot-luv",
icon: "theme_90_dot_luv.png"
},
{
title: "Eggplant",
name: "eggplant",
icon: "theme_90_eggplant.png"
},
{
title: "Excite Bike",
name: "excite-bike",
icon: "theme_90_excite_bike.png"
},
{
title: "Flick",
name: "flick",
icon: "theme_90_flick.png"
},
{
title: "Hot Sneaks",
name: "hot-sneaks",
icon: "theme_90_hot_sneaks.png"
},
{
title: "Humanity",
name: "humanity",
icon: "theme_90_humanity.png"
},
{
title: "Le Frog",
name: "le-frog",
icon: "theme_90_le_frog.png"
},
{
title: "Mint Choc",
name: "mint-choc",
icon: "theme_90_mint_choco.png"
},
{
title: "Overcast",
name: "overcast",
icon: "theme_90_overcast.png"
},
{
title: "Pepper Grinder",
name: "pepper-grinder",
icon: "theme_90_pepper_grinder.png"
},
{
title: "Redmond",
name: "redmond",
icon: "theme_90_windoze.png"
},
{
title: "Smoothness",
name: "smoothness",
icon: "theme_90_smoothness.png"
},
{
title: "South Street",
name: "south-street",
icon: "theme_90_south_street.png"
},
{
title: "Start",
name: "start",
icon: "theme_90_start_menu.png"
},
{
title: "Sunny",
name: "sunny",
icon: "theme_90_sunny.png"
},
{
title: "Swanky Purse",
name: "swanky-purse",
icon: "theme_90_swanky_purse.png"
},
{
title: "Trontastic",
name: "trontastic",
icon: "theme_90_trontastic.png"
},
{
title: "UI Darkness",
name: "ui-darkness",
icon: "theme_90_ui_dark.png"
},
{
title: "UI Lightness",
name: "ui-lightness",
icon: "theme_90_ui_light.png"
},
{
title: "Vader",
name: "vader",
icon: "theme_90_black_matte.png"
}
]
}else{
var themes = settings.themes;
}
if( settings.additionalthemes.length ){
$.extend( themes, settings.additionalthemes );
}
// Switcher link
var switcherLinkStyle = {
"cursor": "pointer",
"font-family": "'Trebuchet MS', Verdana, sans-serif",
"font-size": "11px",
"color": "#666",
"background": "#eee url("+settings.imgpath+"buttonbg.png) repeat-x 50% 50%",
"border": "1px solid #CCC",
"text-decoration": "none",
"padding": "3px 3px 3px 8px",
"width": settings.width+"px",
"display": "block",
"height": settings.buttonheight+"px",
"outline": "0px" ,
"line-height": settings.buttonheight+"px"
}
if( settings.rounded ){
switcherLinkStyle['border-radius'] = "6px";
switcherLinkStyle['-moz-border-radius'] = "6px";
switcherLinkStyle['-webkit-border-radius'] = "6px";
}
var switcherLink = $("<a/>")
.addClass("jquery-ui-switcher-link")
.css(switcherLinkStyle)
.bind({
mouseenter: function(){
$(this).css({
"background": "#eee"
})
},
mouseleave: function(){
if( ! switcherDiv.find(".jquery-ui-switcher-list-hldr").is(":visible") ){
$(this).css({
"background":"#eee url("+settings.imgpath+"buttonbg.png) repeat-x 50% 50%"
})
}
},
click: function(){
(!switcherDiv.find(".jquery-ui-switcher-list-hldr").is(":visible")) ? openSwitcher() : closeSwitcher();
}
});
// Title & Icon for switcher link
var switcherTitle = $("<span/>").addClass("jquery-ui-switcher-title").appendTo(switcherLink);
$("<span/>").addClass("jquery-ui-switcher-arrow")
.css({
"float": "right",
"width": "16px",
"height": "16px",
"background": "url("+settings.imgpath+"icon_color_arrow.gif) no-repeat 50% 50%"
})
.appendTo(switcherLink);
// load the default theme or the theme stored in the cookie
if( $.cookie(settings.cookiename) ){
updateTheme( findTheme($.cookie(settings.cookiename)) );
}else if( settings.loadtheme.length ){
updateTheme( findTheme(settings.loadtheme) );
}else{
switcherTitle.text(settings.initialtext);
}
var switcherListHldr = $("<div/>")
.addClass("jquery-ui-switcher-list-hldr")
.css({
"width": eval(settings.width+8)+"px",
"background": "#000",
"color": "#FFF",
"font-family": "'Trebuchet MS', Verdana, sans-serif",
"font-size": "12px",
"border": "1px solid #CCC",
"border-top": "none",
"z-index": "999999",
"position": "absolute",
"top": eval(settings.buttonheight+3)+"px",
"left": "0px",
"padding": "3px 3px 3px 0",
"display": "none"
})
.bind({
mouseleave: function(){
closeSwitcher();
}
});
if( settings.rounded ){
switcherListHldr.css("border-radius","0 0 6px 6px");
switcherListHldr.css("-moz-border-radius","0 0 6px 6px");
switcherListHldr.css("-webkit-border-radius","0 0 6px 6px");
}
var switcherList = $("<ul/>")
.css({
"list-style": "none",
"margin": "0",
"padding": "0",
"overflow-y": "auto",
"overflow-x": "hidden",
"height": settings.height+"px"
})
.appendTo(switcherListHldr);
// Iterate over themes and build links
$.each(themes, function(k,v){
var listItem = $("<li>")
.css("height","90px")
.appendTo(switcherList);
var listLink = $("<a>")
.css({
"display": "block",
"padding": "5px 3px 5px 5px",
"text-decoration": "none",
"float": "left",
"width": "100%",
"clear": "left"
})
.bind({
mouseenter: function(){
listLink.css("background","url("+settings.imgpath+"menuhoverbg.png) repeat-x 50% 50%");
},
mouseleave: function(){
listLink.css("background","none");
},
click: function(e){
updateTheme($(this).data());
e.preventDefault();
}
})
.attr("href","#")
.data(v)
.appendTo(listItem);
var linkImg = $("<img>")
.attr("src", settings.imgpath + v.icon)
.attr("title",v.title)
.css({
"float": "left",
"margin-right": "5px",
"border": "1px solid #333"
})
.appendTo(listLink);
var linkText = $("<span>")
.css({
"float": "left",
"padding-top": "5px",
"color": "#AAA"
})
.text(v.title)
.appendTo(listLink);
});
function updateTheme(data){
if( settings.onselect !== null )
settings.onselect();
switcherTitle.text(settings.buttonpretext +" "+ data.title);
var currentStyle = [];
var url = data.url;
if (!url) {
var urlPrefix = settings.themepath + settings.jqueryuiversion + "/themes/";
url = urlPrefix + data.name + "/jquery-ui.css";
currentStyle = $('link[href^="' + urlPrefix + '"]').first();
}
if (currentStyle.length) {
currentStyle[0].href = url;
} else {
var style = $("<link/>")
.attr("type","text/css")
.attr("rel","stylesheet")
.attr("href", url);
style.appendTo("head");
}
$.cookie(settings.cookiename, data.name,
{ expires: settings.cookieexpires, path: settings.cookiepath }
);
switcherDiv.find(".jquery-ui-switcher-title").text(settings.buttonpretext + " " + data.title);
if( settings.closeonselect )
closeSwitcher();
}
// Finds a theme[] based on a valid name or title
function findTheme(theme){
var result = null;
$.each(themes, function(k,v){
if( v.name.toLowerCase() === theme.toLowerCase() || v.title.toLowerCase() === theme.toLowerCase() ){
result = v;
return false;
}
});
if( !result ){
return themes[0];
}
return result;
}
function openSwitcher(){
if( settings.onopen !== null )
settings.onopen();
switcherDiv.find(".jquery-ui-switcher-link").css({
"color": "#AAA",
"background": "#000"
});
switcherDiv.find(".jquery-ui-switcher-list-hldr").slideDown("fast");
}
function closeSwitcher(){
if( settings.onclose !== null )
settings.onclose();
switcherDiv.find(".jquery-ui-switcher-list-hldr").slideUp("fast", function(){
switcherDiv.find(".jquery-ui-switcher-link").css({
"color":"#666",
"background": "#eee url("+settings.imgpath+"buttonbg.png) repeat-x 50% 50%"
});
});
}
this.css("position","relative");
this.append(switcherLink);
this.append(switcherListHldr);
return this;
}
})( jQuery );
/*!
* jQuery Cookie Plugin
* https://github.com/carhartl/jquery-cookie
*
* Copyright 2011, Klaus Hartl
* Dual licensed under the MIT or GPL Version 2 licenses.
* http://www.opensource.org/licenses/mit-license.php
* http://www.opensource.org/licenses/GPL-2.0
*/
(function($) {
$.cookie = function(key, value, options) {
// key and at least value given, set cookie...
if (arguments.length > 1 && (!/Object/.test(Object.prototype.toString.call(value)) || value === null || value === undefined)) {
options = $.extend({}, options);
if (value === null || value === undefined) {
options.expires = -1;
}
if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate() + days);
}
value = String(value);
return (document.cookie = [
encodeURIComponent(key), '=', options.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(''));
}
// key and possibly options given, get cookie...
options = value || {};
var decode = options.raw ? function(s) { return s; } : decodeURIComponent;
var pairs = document.cookie.split('; ');
for (var i = 0, pair; pair = pairs[i] && pairs[i].split('='); i++) {
if (decode(pair[0]) === key) return decode(pair[1] || ''); // IE saves cookies with empty string as "c; ", e.g. without "=" as opposed to EOMB, thus pair[1] may be undefined
}
return null;
};
})(jQuery);