/plugins/jojo_core/external/jsTree/!DEV/jstree.themes.js
JavaScript | 186 lines | 127 code | 6 blank | 53 comment | 36 complexity | ee7bc795f770c65eacb5934eb68225e5 MD5 | raw file
Possible License(s): LGPL-2.1, BSD-3-Clause, LGPL-2.0, CC-BY-SA-3.0, MIT
- /* File: jstree.themes.js
- Controls the looks of jstree, without this plugin you will get a functional tree, but it will look just like an ordinary UL list
- */
- (function ($) {
- var themes_loaded = [];
- /*
- Group: $.jstree.
-
- Variable: $.jstree.THEMES_DIR
- The location of all themes, this is used when setting a theme without supplying an URL (only by name).
- Default is _false_. If left as _false_ the path will be autodetected when the DOM is ready.
- The location of _jquery.jstree.js_ is used for the autodetection.
- Normally you won't need to modify this (provided you leave the _themes_ folder in the same folder as _jquery.jstree.js_ and do not rename the file).
- If you decide to move the folder or rename the file, but still want to load themes by name, simply set this to the new location of the _themes_ folder.
- > <script type="text/javascript" src="jquery.jstree.js"></script>
- > <script type="text/javascript">$.jstree.THEMES_DIR = "some/path/with-a-trailing-slash/";</script>
- */
- $.jstree.THEMES_DIR = false;
-
- $.jstree.plugin("themes", {
- __construct : function () {
- this.get_container()
- .bind("__construct.jstree", $.proxy(function () {
- var s = this.get_settings(true).themes;
- this.data.themes.dots = s.dots;
- this.data.themes.icons = s.icons;
-
- if(s.url === false && s.theme === false) {
- s.theme = this.data.core.rtl ? 'default-rtl' : 'default';
- }
- this.set_theme(s.theme, s.url);
-
- this[ this.data.themes.dots ? "show_dots" : "hide_dots" ]();
- this[ this.data.themes.icons ? "show_icons" : "hide_icons" ]();
- }, this));
- },
- /* Class: jstree */
- /*
- Group: THEMES options
-
- Variable: config.themes.theme
- *string* the name of the theme you want to use. Default is _default_.
-
- Variable: config.themes.url
- *mixed* the URL of the stylesheet of the theme you want to use. Default is _false_. If left as _false_ the location will be autodetected using <$.jstree.THEMES_DIR>.
-
- Variable: config.themes.dots
- *boolean* whether to show dots or not. Default is _true_. The chosen theme should support this option.
-
- Variable: config.themes.icons
- *boolean* whether to show icons or not. Default is _true_.
- */
- defaults : {
- theme : false,
- url : false,
- dots : true,
- icons : true
- },
- _fn : {
- /*
- Group: THEMES functions
-
- Function: set_theme
- Sets the tree theme. This function is automatically called at construction with the settings specified in <config.themes.theme> and <config.themes.theme.url>.
-
- Parameters:
- theme_name - the name of the theme to apply
- theme_url - the URL of the stylesheet - leave this blank for autodetect
-
- Example:
- >// Set the theme and autodetect the location
- >$("#div1").jstree("set_theme","classic");
- >// A custom theme. Please note that if you place your own theme in the _themes_ folder ot will be autodetected too.
- >$("#div2").jstree("set_theme","custom-theme","/some/path/theme.css");
- */
- set_theme : function (theme_name, theme_url) {
- if(!theme_name) { return false; }
- if(!theme_url) { theme_url = $.jstree.THEMES_DIR + theme_name + '/style.css'; }
- if($.inArray(theme_url, themes_loaded) === -1) {
- $.vakata.css.add_sheet({ "url" : theme_url });
- themes_loaded.push(theme_url);
- }
- if(this.data.themes.theme != theme_name) {
- this.get_container().removeClass('jstree-' + this.data.themes.theme);
- this.data.themes.theme = theme_name;
- }
- this.get_container().addClass('jstree-' + theme_name);
- this.__callback(theme_name);
- },
- get_theme : function () { return this.data.themes.theme; },
- show_dots : function () { this.data.themes.dots = true; this.get_container().children("ul").removeClass("jstree-no-dots"); },
- hide_dots : function () { this.data.themes.dots = false; this.get_container().children("ul").addClass("jstree-no-dots"); },
- toggle_dots : function () { if(this.data.themes.dots) { this.hide_dots(); } else { this.show_dots(); } },
- show_icons : function () { this.data.themes.icons = true; this.get_container().children("ul").removeClass("jstree-no-icons"); },
- hide_icons : function () { this.data.themes.icons = false; this.get_container().children("ul").addClass("jstree-no-icons"); },
- toggle_icons : function () { if(this.data.themes.icons) { this.hide_icons(); } else { this.show_icons(); } },
-
- clean_node : function(obj) {
- obj = this.__call_old();
- return obj.each(function () {
- var t = $(this),
- d = t.data("jstree");
- if(!t.find("> a > ins.jstree-themeicon").length) {
- t.children("a").prepend("<ins class='jstree-icon jstree-themeicon'> </ins>");
- }
- if(d && d.icon) {
- if(d.icon.indexOf("/") === -1) { t.find("> a > .jstree-themeicon").addClass(d.icon); }
- else { t.find("> a > .jstree-themeicon").css("background", "url('" + d.icon + "') center center no-repeat"); }
- }
- else if(d && d.icon === false) {
- t.find("> a > .jstree-themeicon").hide();
- }
- else {
- t.children("a").each(function () {
- var t = $(this),
- d = t.data("jstree");
- if(d && d.icon) {
- if(d.icon.indexOf("/") === -1) { t.children(".jstree-themeicon").addClass(d.icon); }
- else { t.children(".jstree-themeicon").css("background", "url('" + d.icon + "') center center no-repeat"); }
- }
- else if(d && d.icon === false) {
- t.children(".jstree-themeicon").hide();
- }
- });
- }
- });
- },
-
- get_state : function () {
- var state = this.__call_old();
- state.themes = { 'theme' : this.get_theme(), 'icons' : this.data.themes.icons, 'dots' : this.data.themes.dots };
- return state;
- },
- set_state : function (state, callback) {
- if(this.__call_old()) {
- if(state.themes) {
- if(state.themes.theme) {
- this.set_theme(state.themes.theme);
- }
- if(typeof state.themes.dots !== 'undefined') {
- this[ state.themes.dots ? "show_dots" : "hide_dots" ]();
- }
- if(typeof state.themes.icons !== 'undefined') {
- this[ state.themes.icons ? "show_icons" : "hide_icons" ]();
- }
-
- delete state.themes;
- this.set_state(state, callback);
- return false;
- }
- return true;
- }
- return false;
- }
- }
- });
- $(function () {
- // autodetect themes path
- if($.jstree.THEMES_DIR === false) {
- $("script").each(function () {
- if(this.src.toString().match(/jquery\.jstree[^\/]*?\.js(\?.*)?$/)) {
- $.jstree.THEMES_DIR = this.src.toString().replace(/jquery\.jstree[^\/]*?\.js(\?.*)?$/, "") + 'themes/';
- return false;
- }
- });
- }
- if($.jstree.THEMES_DIR === false) { $.jstree.THEMES_DIR = "themes/"; }
- // add themes specific CSS
- var css_string = '' +
- '.jstree a { text-decoration:none; } ' +
- '.jstree a > .jstree-themeicon { height:16px; width:16px; margin-right:3px; } ' +
- '.jstree-rtl a > .jstree-themeicon { margin-left:3px; margin-right:0; } ' +
- '.jstree .jstree-no-icons .jstree-themeicon { display:none; } ';
- // Correct IE 6 (does not support the > CSS selector)
- if($.jstree.IS_IE6) {
- css_string += '' +
- '.jstree li a .jstree-themeicon { height:16px; width:16px; margin-right:3px; } ' +
- '.jstree-rtl li a .jstree-themeicon { margin-right:0px; margin-left:3px; } ';
- }
- // the default stylesheet
- $.vakata.css.add_sheet({ str : css_string, title : "jstree" });
- });
- // include the themes plugin by default
- $.jstree.defaults.plugins.push("themes");
- })(jQuery);
- //*/