change trs to xts

.gitignore

@@ -32,7 +32,7 @@ coverage
 bower_components
 
 # node-waf configuration
-.lock-trslript
+.lock-xtslript
 
 # Compiled binary addons (https://nodejs.org/api/addons.html)
 build/Release

dist/x-tree-select.css

@@ -1,4 +1,4 @@
-.trsel{
+.xtsel{
     border: 1px solid silver;
     padding: 5px;
     text-align: center;
@@ -7,7 +7,7 @@
     position: relative;
 }
 
-#trsel-list{
+#xtsel-list{
     border: gray 1px solid;
     width: 100%;
     padding: 0;
@@ -22,7 +22,7 @@
     z-index: 99;
 }
 
-#trsel-list li{
+#xtsel-list li{
     padding: 4px;
     border-bottom: 1px solid rgba(33,33,33,0.2);
     display: block;
@@ -31,15 +31,15 @@
     overflow: hidden;
 }
 
-#trsel-list li:nth-child(even){
+#xtsel-list li:nth-child(even){
     background: #efefef;
 }
 
-#trsel-list li:last-child{
+#xtsel-list li:last-child{
     border: none;
 }
 
-#trsel-list li.trsel-childer{
+#xtsel-list li.xtsel-childer{
     background: transparent url("right.png") no-repeat;
     background-position-x: calc(100% - 10px) ;
     -ms-background-position-y: center;
@@ -47,27 +47,27 @@
     background-size: auto 50% ;
 }
 
-#trsel-list li:hover{
+#xtsel-list li:hover{
     background-color: #dbedff ;
 }
-#trsel-list li.trsel-back{
+#xtsel-list li.xtsel-back{
     background: white url("left.png") 5px no-repeat;
     padding-left: 30px;
     background-size: auto 50% ;
 }
 
 
-#trsel-list.xout{
+#xtsel-list.xout{
     transform-origin: center right;
     transform-style: preserve-3d;
     transform: translateX(-100%) rotateY(-180deg) skew(0deg) ;
 }
 
-#trsel-list.xfade li{
+#xtsel-list.xfade li{
     opacity: 0;
 }
 
-#trsel-list li{
+#xtsel-list li{
     -webkit-transition: all .55s linear;
     -moz-transition: all .55s linear;
     -o-transition: all .55s linear;
@@ -75,7 +75,7 @@
     max-height: 30px;
 }
 
-#trsel-list.xslide li{
+#xtsel-list.xslide li{
     max-height: 0;
     overflow: hidden;
     box-sizing: border-box;
@@ -88,7 +88,7 @@
     transition: all .6s linear;
 }
 
-.trsel-selectable{
+.xtsel-selectable{
     float: left;
     width: 1.5em;
     position: relative;
@@ -101,25 +101,25 @@
 
 
 /** rtl support css */
-.trs-rtl{
+.xts-rtl{
 }
 
-.trs-rtl li {
+.xts-rtl li {
     direction: rtl !important;
     text-align: right !important;
 }
-.trs-rtl li.trsel-childer {
+.xts-rtl li.xtsel-childer {
     background-image: url("left.png") !important;
     background-position-x: 10px !important;
 }
-.trs-rtl li.trsel-back {
+.xts-rtl li.xtsel-back {
     background-image:  url("right.png") !important ;
     background-position-x: calc(100% - 10px) !important;
     padding-right: 30px !important;
 }
 
 
-.trs-rtl .trsel-selectable{
+.xts-rtl .xtsel-selectable{
     float: right;
     margin-left: .7em;
     margin-right: 0;

dist/x-tree-select.js

@@ -17,14 +17,14 @@
         };
 
         // set default store for setting
-        if ($.trsStore === undefined) {
+        if ($.xtsStore === undefined) {
             $.scbCounter = -1;
-            $.trsStore = [];
+            $.xtsStore = [];
             $.currentCounter = 0;
         }
 
         // make app var for use in plugin
-        $.trs = this;
+        $.xts = this;
 
         // change plugin info
         var settings = $.extend({
@@ -63,9 +63,9 @@
 
         // store setting for use
         $.scbCounter++;
-        $.trsStore[$.scbCounter] = settings;
+        $.xtsStore[$.scbCounter] = settings;
 
-        // console.log($.trsStore);
+        // console.log($.xtsStore);
 
         /**
          * initial element
@@ -85,63 +85,63 @@
 
             // set rtl class if is rtl
             var rtlClass = '';
-            if ($.trsStore[$.scbCounter].direction === 'rtl') {
-                rtlClass = 'trs-rtl';
+            if ($.xtsStore[$.scbCounter].direction === 'rtl') {
+                rtlClass = 'xts-rtl';
             }
 
             // init element for click for choose
-            $(self).parent().append('<div class="trsel ' + rtlClass + '" data-trcounter="' +
+            $(self).parent().append('<div class="xtsel ' + rtlClass + '" data-trcounter="' +
                 $.scbCounter + '" >' + placeholder + '</div>');
 
 
             // initial idx for use in naviagion
-            settings.datatree = $.trs.makeId('1', settings.datatree);
+            settings.datatree = $.xts.makeId('1', settings.datatree);
             // on click combowizard
-            $(self).parent().find('.trsel').bind('click.open', function (e) {
+            $(self).parent().find('.xtsel').bind('click.open', function (e) {
                 if (e.target !== this) {
                     return;
                 }
 
-                var trsel = $(this);
+                var xtsel = $(this);
 
-                if (trsel.hasClass("loading")) {
+                if (xtsel.hasClass("loading")) {
                     return;
                 }
 
-                trsel.addClass("loading");
+                xtsel.addClass("loading");
                 setTimeout(function () {
-                    trsel.removeClass("loading");
+                    xtsel.removeClass("loading");
                 }, 600);
 
                 $.currentCounter = $(this).data('trcounter');
-                $.lastx.title = $.trsStore[$.currentCounter].mainTitle;
+                $.lastx.title = $.xtsStore[$.currentCounter].mainTitle;
                 // check is open list
                 if (!$(this).hasClass('active')) {
 
-                    $.trsStore[$.currentCounter].onOpen();
+                    $.xtsStore[$.currentCounter].onOpen();
                     // find target for last value
-                    $.trs.target = $(this).parent().find('input');
+                    $.xts.target = $(this).parent().find('input');
                     // find select text position
-                    $.trs.text = $(self).parent().find('.trsel');
+                    $.xts.text = $(self).parent().find('.xtsel');
                     //if now list show list and countiniu
-                    $(this).append('<ul id="trsel-list"></ul>');
-                    if ($.trsStore[$.currentCounter].navx === undefined) {
+                    $(this).append('<ul id="xtsel-list"></ul>');
+                    if ($.xtsStore[$.currentCounter].navx === undefined) {
                         // show first list main cat in list
-                        $.trs.showTree($.trsStore[$.currentCounter].datatree);
+                        $.xts.showTree($.xtsStore[$.currentCounter].datatree);
                     } else {
-                        $.lastx = $.trsStore[$.currentCounter].lastx;
-                        $.navigatex = $.trsStore[$.currentCounter].navx;
-                        $.trs.showTree($.trs.findTree($.trsStore[$.currentCounter].datatree, $.trsStore[$.currentCounter].lastx.id));
+                        $.lastx = $.xtsStore[$.currentCounter].lastx;
+                        $.navigatex = $.xtsStore[$.currentCounter].navx;
+                        $.xts.showTree($.xts.findTree($.xtsStore[$.currentCounter].datatree, $.xtsStore[$.currentCounter].lastx.id));
                     }
                     // slide down list
-                    $("#trsel-list").slideDown(function () {
+                    $("#xtsel-list").slideDown(function () {
                         $(document).bind('click.handvarrsl', function (e) {
-                            if (!$(e.target).is(".trsel-childer, .trsel-back")) {
-                                $.trs.resetClose();
-                                $("#trsel-list").slideUp(200, function () {
+                            if (!$(e.target).is(".xtsel-childer, .xtsel-back")) {
+                                $.xts.resetClose();
+                                $("#xtsel-list").slideUp(200, function () {
                                     $(this).remove();
                                 });
-                                $($.trs.text).removeClass('active');
+                                $($.xts.text).removeClass('active');
                             }
                             e.preventDefault();
                             return false;
@@ -157,19 +157,19 @@
 
                     // hide and remove list
                     $(this).removeClass('active');
-                    $("#trsel-list").slideUp(100, function () {
-                        // $.trs.resetClose();
+                    $("#xtsel-list").slideUp(100, function () {
+                        // $.xts.resetClose();
                         $(this).remove();
                     });
                 }
             });
 
             //reset
-            $(document).off('click', '#trsel-list li');
+            $(document).off('click', '#xtsel-list li');
             // on click items
-            $(document).on('click', '#trsel-list li', function (e) {
+            $(document).on('click', '#xtsel-list li', function (e) {
                 // has child & no parent selecatble
-                if ($(this).hasClass('trsel-childer') && !$(e.target).hasClass('trsel-selectable')) {
+                if ($(this).hasClass('xtsel-childer') && !$(e.target).hasClass('xtsel-selectable')) {
                     // make navigation
                     var tmp = {
                         title: $.lastx.title,
@@ -181,49 +181,49 @@
 
 
                     // transtion ;
-                    $("#trsel-list").addClass($.treeselect_animation[$.trsStore[$.currentCounter].transition]);
+                    $("#xtsel-list").addClass($.treeselect_animation[$.xtsStore[$.currentCounter].transition]);
 
 
                     var xself = this;
                     var ax = setTimeout(function () {
                         // show child items
-                        $.trs.showTree($.trs.findTree($.trsStore[$.currentCounter].datatree, $(xself).data('id')));
+                        $.xts.showTree($.xts.findTree($.xtsStore[$.currentCounter].datatree, $(xself).data('id')));
                         // remove effect
-                        $("#trsel-list").removeClass($.treeselect_animation[$.trsStore[$.currentCounter].transition]);
+                        $("#xtsel-list").removeClass($.treeselect_animation[$.xtsStore[$.currentCounter].transition]);
                     }, 600);
 
-                } else if ($(this).hasClass('trsel-back')) { // if click on back
+                } else if ($(this).hasClass('xtsel-back')) { // if click on back
                     if ($.navigatex[$.navigatex.length - 1] !== undefined) {
                         // roll back navigtaion to last
                         $.lastx.title = $.navigatex[$.navigatex.length - 1].title;
                         $.lastx.id = $.navigatex[$.navigatex.length - 1].id;
                     } else {
                         // check is navigation emoppty set def
-                        $.lastx.title = $.trsStore[$.currentCounter].mainTitle;
+                        $.lastx.title = $.xtsStore[$.currentCounter].mainTitle;
                         $.lastx.id = '';
                     }
                     // pop last navigation item
                     $.navigatex.pop();
                     // get parent list
-                    var lst = $.trs.findTree($.trsStore[$.currentCounter].datatree, $(this).data('id'));
+                    var lst = $.xts.findTree($.xtsStore[$.currentCounter].datatree, $(this).data('id'));
                     // if has not parent show main cat
-                    $("#trsel-list").addClass($.treeselect_animation[$.trsStore[$.currentCounter].transition]);
+                    $("#xtsel-list").addClass($.treeselect_animation[$.xtsStore[$.currentCounter].transition]);
 
                     var ax = setTimeout(function () {
                         if (lst.length === 0) {
-                            $.trs.showTree($.trsStore[$.currentCounter].datatree);
+                            $.xts.showTree($.xtsStore[$.currentCounter].datatree);
                         } else {
                             // then show parent list
-                            $.trs.showTree(lst);
+                            $.xts.showTree(lst);
                         }
-                        $("#trsel-list").removeClass($.treeselect_animation[$.trsStore[$.currentCounter].transition]);
+                        $("#xtsel-list").removeClass($.treeselect_animation[$.xtsStore[$.currentCounter].transition]);
                     }, 600);
 
                 } else { // choose|select value
                     // onChange event
-                    $.trsStore[$.currentCounter].onChange({
-                        value: $($.trs.target).val(),
-                        text: $($.trs.text).clone()    //clone the element
+                    $.xtsStore[$.currentCounter].onChange({
+                        value: $($.xts.target).val(),
+                        text: $($.xts.text).clone()    //clone the element
                             .children() //select all the children
                             .remove()   //remove all the children
                             .end()  //again go back to selected element
@@ -233,28 +233,28 @@
                         text: $(this).text()
                     });
                     // set main input value
-                    $($.trs.target).val($(this).data('value'));
+                    $($.xts.target).val($(this).data('value'));
                     // set choosed test
-                    $($.trs.text).text($(this).text());
+                    $($.xts.text).text($(this).text());
                     // if selected is not first level store level & last titles
                     if ($.navigatex.length > 0) {
-                        $.trsStore[$.currentCounter].navx = $.navigatex;
-                        $.trsStore[$.currentCounter].lastx = $.lastx;
+                        $.xtsStore[$.currentCounter].navx = $.navigatex;
+                        $.xtsStore[$.currentCounter].lastx = $.lastx;
                     } else {
-                        delete $.trsStore[$.currentCounter].navx;
-                        delete $.trsStore[$.currentCounter].lastx;
+                        delete $.xtsStore[$.currentCounter].navx;
+                        delete $.xtsStore[$.currentCounter].lastx;
                     }
                     // remove active class and hide list
-                    $($.trs.text).removeClass('active');
+                    $($.xts.text).removeClass('active');
                     // onChange
-                    $.trsStore[$.currentCounter].onSelect({
+                    $.xtsStore[$.currentCounter].onSelect({
                         value: $(this).data('value'),
                         text: $(this).text(),
                         id: $(this).data('id'),
                         parent: $.lastx,
                         ancestors: $.navigatex
                     });
-                    $("#trsel-list").slideUp(100, function () {
+                    $("#xtsel-list").slideUp(100, function () {
                         $(this).remove();
                     });
                 }
@@ -280,13 +280,13 @@
                 var prefix = base + '-' + (parseInt(ix) + 1);
                 itm.idx = prefix;
                 //if there is no child object, just create it
-                if (itm[$.trsStore[$.scbCounter].json.child] === undefined) {
-                    itm[$.trsStore[$.scbCounter].json.child] = [];
+                if (itm[$.xtsStore[$.scbCounter].json.child] === undefined) {
+                    itm[$.xtsStore[$.scbCounter].json.child] = [];
                 }
                 // if has child
-                if (itm[$.trsStore[$.scbCounter].json.child].length !== 0) {
+                if (itm[$.xtsStore[$.scbCounter].json.child].length !== 0) {
                     // recall this function for children
-                    itm[$.trsStore[$.scbCounter].json.child] = $.trs.makeId(prefix, itm[$.trsStore[$.scbCounter].json.child]);
+                    itm[$.xtsStore[$.scbCounter].json.child] = $.xts.makeId(prefix, itm[$.xtsStore[$.scbCounter].json.child]);
                 }
                 all.push(itm);
             }
@@ -301,34 +301,34 @@
         this.showTree = function (list, cb) {
             var content = '';
             // clear li list
-            $("#trsel-list li").remove();
+            $("#xtsel-list li").remove();
             // back button handle
             // has parent need back button
             if ($.navigatex.length !== 0) {
                 // if navigation is empity not need back button
                 var back = $.navigatex[$.navigatex.length - 1];
 
-                content += '<li class="trsel-back" data-id="' + back.id + '"> &nbsp;' + back.title + '</li>';
+                content += '<li class="xtsel-back" data-id="' + back.id + '"> &nbsp;' + back.title + '</li>';
             }
             // show list passed to function
             for (var ix in list) {
                 var item = list[ix];
                 // ad childs
                 // check has child
-                var clsx = ' class="trsel-childer"';
+                var clsx = ' class="xtsel-childer"';
                 var select = '';
-                if (item[$.trsStore[$.currentCounter].json.child].length === 0) {
+                if (item[$.xtsStore[$.currentCounter].json.child].length === 0) {
                     clsx = ' class=""';
                 } else {
-                    if ($.trsStore[$.currentCounter].selectablePrernt) {
-                        var select = '<span class="trsel-selectable"></span>';
+                    if ($.xtsStore[$.currentCounter].selectablePrernt) {
+                        var select = '<span class="xtsel-selectable"></span>';
                     }
                 }
 
                 // li to list
-                content += '<li' + clsx + ' data-id="' + item.idx + '"  data-value="' + item[$.trsStore[$.currentCounter].json.value] + '">' + select + item[$.trsStore[$.currentCounter].json.title] + '</li>';
+                content += '<li' + clsx + ' data-id="' + item.idx + '"  data-value="' + item[$.xtsStore[$.currentCounter].json.value] + '">' + select + item[$.xtsStore[$.currentCounter].json.title] + '</li>';
             }
-            $("#trsel-list").html(content);
+            $("#xtsel-list").html(content);
             if (cb !== undefined) {
                 cb();
             }
@@ -347,14 +347,14 @@
             for (var ix in list) {
                 var item = list[ix];
                 if (item.idx === idx) {
-                    return item[$.trsStore[$.currentCounter].json.child];
+                    return item[$.xtsStore[$.currentCounter].json.child];
                 }
             }
             // if not fond in first level each the childs
             for (var ix in list) {
                 var item = list[ix];
-                if (item[$.trsStore[$.currentCounter].json.child].length !== 0) {
-                    var tmp = $.trs.findTree(item[$.trsStore[$.currentCounter].json.child], idx);
+                if (item[$.xtsStore[$.currentCounter].json.child].length !== 0) {
+                    var tmp = $.xts.findTree(item[$.xtsStore[$.currentCounter].json.child], idx);
                     // if found idx retrur
                     if (tmp.length !== 0) {
                         return tmp;
@@ -380,35 +380,35 @@
             if (parent != null) {
                 $.navigatex.push({
                     id: parent.idx,
-                    title: parent[$.trsStore[c].json.title]
+                    title: parent[$.xtsStore[c].json.title]
                 });
             } else {
                 $.navigatex.push({
                     id: "",
-                    title:  $.trsStore[c].mainTitle
+                    title:  $.xtsStore[c].mainTitle
                 });
-                $.lastx.title = $.trsStore[c].mainTitle;
+                $.lastx.title = $.xtsStore[c].mainTitle;
                 $.lastx.id = '';
             }
             // each all
             for (var ix in list) {
                 var item = list[ix];
-                if (item[$.trsStore[c].json.value] == val) {
+                if (item[$.xtsStore[c].json.value] == val) {
                     return item;
                 }
                 // if has child
-                if (item[$.trsStore[c].json.child] != undefined && item[$.trsStore[c].json.child].length > 0) {
+                if (item[$.xtsStore[c].json.child] != undefined && item[$.xtsStore[c].json.child].length > 0) {
                     // add last
                     $.lastx = {
                         id: item.idx,
-                        title: item[$.trsStore[c].json.title]
+                        title: item[$.xtsStore[c].json.title]
                     };
-                    var back = this.findItem(item[$.trsStore[c].json.child], val, c, item);
+                    var back = this.findItem(item[$.xtsStore[c].json.child], val, c, item);
                     if (back != false) {
                         return back;
                     }
                 }
-                // console.log($.trsStore[c].json.child);
+                // console.log($.xtsStore[c].json.child);
             }
 
             $.navigatex.pop();
@@ -423,13 +423,13 @@
          */
         this.setDefault = function (c, val) {
             // find value
-            var back = $.trs.findItem($.trsStore[c].datatree, val, c);
+            var back = $.xts.findItem($.xtsStore[c].datatree, val, c);
             // if is exits val
             if (back != false) {
-                $.trsStore[c].lastx = $.lastx;
+                $.xtsStore[c].lastx = $.lastx;
                 $.navigatex.pop();
-                $.trsStore[c].navx = $.navigatex;
-                $("[data-trcounter='" + c + "']").text(back[$.trsStore[c].json.title]);
+                $.xtsStore[c].navx = $.navigatex;
+                $("[data-trcounter='" + c + "']").text(back[$.xtsStore[c].json.title]);
             }
         };
 
@@ -437,11 +437,11 @@
          * reset values on close
          */
         this.resetClose = function () {
-            $.trsStore[$.currentCounter].onClose();
+            $.xtsStore[$.currentCounter].onClose();
             // reset navagtion value
             $.navigatex = [];
             $.lastx = {
-                title: $.trsStore[$.currentCounter].mainTitle,
+                title: $.xtsStore[$.currentCounter].mainTitle,
                 id: ''
             };
             // reset docuemnt bind
@@ -452,7 +452,7 @@
             this.html(currentInnerText + " " + newValue)
         };
         this.each(function () {
-            $.trs.init(this);
+            $.xts.init(this);
         });
         return this;
 

dist/x-tree-select.min.css

@@ -1 +1 @@
-.trsel{border:1px solid silver;padding:5px;text-align:center;border-radius:4px;cursor:pointer;position:relative}#trsel-list{border:gray 1px solid;width:100%;padding:0;position:absolute;display:none;list-style:none;top:45%;left:-1px;background:#fff;border-radius:0 0 6px 6px;overflow:hidden;z-index:99}#trsel-list li{padding:4px;border-bottom:1px solid rgba(33,33,33,.2);display:block;text-align:left;background:#fff;overflow:hidden}#trsel-list li:nth-child(even){background:#efefef}#trsel-list li:last-child{border:none}#trsel-list li.trsel-childer{background:transparent url(right.png) no-repeat;background-position-x:calc(100% - 10px);-ms-background-position-y:center;background-position-y:center;background-size:auto 50%}#trsel-list li:hover{background-color:#dbedff}#trsel-list li.trsel-back{background:#fff url(left.png) 5px no-repeat;padding-left:30px;background-size:auto 50%}#trsel-list.xout{transform-origin:center right;transform-style:preserve-3d;transform:translateX(-100%) rotateY(-180deg) skew(0)}#trsel-list.xfade li{opacity:0}#trsel-list li{-webkit-transition:all .55s linear;-moz-transition:all .55s linear;-o-transition:all .55s linear;transition:all .55s linear;max-height:30px}#trsel-list.xslide li{max-height:0;overflow:hidden;box-sizing:border-box;padding:0}.anim{-webkit-transition:all .6s linear;-moz-transition:all .6s linear;-o-transition:all .6s linear;transition:all .6s linear}.trsel-selectable{float:left;width:1.5em;position:relative;height:1em;background:transparent url(check-box.png) 5px no-repeat;background-size:auto 95%;background-position:center;margin-right:.7em}.trs-rtl li{direction:rtl!important;text-align:right!important}.trs-rtl li.trsel-childer{background-image:url(left.png)!important;background-position-x:10px!important}.trs-rtl li.trsel-back{background-image:url(right.png)!important;background-position-x:calc(100% - 10px)!important;padding-right:30px!important}.trs-rtl .trsel-selectable{float:right;margin-left:.7em;margin-right:0}
+.xtsel{border:1px solid silver;padding:5px;text-align:center;border-radius:4px;cursor:pointer;position:relative}#xtsel-list{border:gray 1px solid;width:100%;padding:0;position:absolute;display:none;list-style:none;top:45%;left:-1px;background:#fff;border-radius:0 0 6px 6px;overflow:hidden;z-index:99}#xtsel-list li{padding:4px;border-bottom:1px solid rgba(33,33,33,.2);display:block;text-align:left;background:#fff;overflow:hidden}#xtsel-list li:nth-child(even){background:#efefef}#xtsel-list li:last-child{border:none}#xtsel-list li.xtsel-childer{background:transparent url(right.png) no-repeat;background-position-x:calc(100% - 10px);-ms-background-position-y:center;background-position-y:center;background-size:auto 50%}#xtsel-list li:hover{background-color:#dbedff}#xtsel-list li.xtsel-back{background:#fff url(left.png) 5px no-repeat;padding-left:30px;background-size:auto 50%}#xtsel-list.xout{transform-origin:center right;transform-style:preserve-3d;transform:translateX(-100%) rotateY(-180deg) skew(0)}#xtsel-list.xfade li{opacity:0}#xtsel-list li{-webkit-transition:all .55s linear;-moz-transition:all .55s linear;-o-transition:all .55s linear;transition:all .55s linear;max-height:30px}#xtsel-list.xslide li{max-height:0;overflow:hidden;box-sizing:border-box;padding:0}.anim{-webkit-transition:all .6s linear;-moz-transition:all .6s linear;-o-transition:all .6s linear;transition:all .6s linear}.xtsel-selectable{float:left;width:1.5em;position:relative;height:1em;background:transparent url(check-box.png) 5px no-repeat;background-size:auto 95%;background-position:center;margin-right:.7em}.xts-rtl li{direction:rtl!important;text-align:right!important}.xts-rtl li.xtsel-childer{background-image:url(left.png)!important;background-position-x:10px!important}.xts-rtl li.xtsel-back{background-image:url(right.png)!important;background-position-x:calc(100% - 10px)!important;padding-right:30px!important}.xts-rtl .xtsel-selectable{float:right;margin-left:.7em;margin-right:0}

src/themes/xts-bootstrap-theme.css

@@ -20,7 +20,7 @@
  * @link       https://github.com/4xmen/x-tree-select
  * @link       https://www.npmjs.com/package/x-tree-select
  */
-.trsel{
+.xtsel{
     background: white;
     background-repeat: no-repeat;
     background-image: url("data:image/svg+xml;charset=utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'><path fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/></svg>");
@@ -41,11 +41,11 @@
     text-align: left;
 }
 
-.trs-rtl{
+.xts-rtl{
     text-align: right;
     background-position-x:12px;
 }
 
-#trsel-list{
+#xtsel-list{
     top: 1.25rem;
 }

src/themes/xts-materialize-theme.css

@@ -20,7 +20,7 @@
  * @link       https://github.com/4xmen/x-tree-select
  * @link       https://www.npmjs.com/package/x-tree-select
  */
-.trsel{
+.xtsel{
     border-radius: 0;
     background: white;
     border: 0;
@@ -38,15 +38,15 @@
     background-size: 20px 20px;
     background-image: url('data:image/svg+xml;charset=utf8,<svg class="caret" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg>');
 }
-.trsel:hover{
+.xtsel:hover{
     border-bottom: 1px solid #26a69a ;
 }
-.trs-rtl{
+.xts-rtl{
     background-position-x: 12px;
     text-align: right;
 }
 
-#trsel-list {
+#xtsel-list {
     background: white;
     border: 0;
     border-radius: 0;
@@ -55,13 +55,13 @@
     top: 25px;
 }
 
-#trsel-list li{
+#xtsel-list li{
     background: white;
     padding: 0 10px;
     line-height: 40px !important;
     max-height: none;
 }
 
-#trsel-list li:hover{
+#xtsel-list li:hover{
     background-color:  rgba(38, 166, 154, 0.4);
 }

src/themes/xts-semantic-ui-theme.css

@@ -20,7 +20,7 @@
  * @link       https://github.com/4xmen/x-tree-select
  * @link       https://www.npmjs.com/package/x-tree-select
  */
-.trsel{
+.xtsel{
     background-color: #ffffff;
     text-align: left;
     background-repeat: no-repeat;
@@ -37,27 +37,27 @@
     padding-bottom: 8px;
 }
 
-.trsel:hover{
+.xtsel:hover{
     border-color: rgb(150, 200, 218);
 }
-.trs-rtl{
+.xts-rtl{
     text-align: right;
     background-position-x:12px;
     padding-left: 29px;
     padding-right: 14px;
 }
 
-#trsel-list {
+#xtsel-list {
     top:20px;
     border-color: rgb(150, 200, 218);
 }
 
-#trsel-list li{
+#xtsel-list li{
     background-color: #fff!important;
     border-bottom-color: #fafafa;
     padding: .48571429rem 1.14285714rem!important;
 }
 
-#trsel-list li:hover{
+#xtsel-list li:hover{
     background-color: rgba(0,0,0,.05) !important;
 }

src/x-tree-select.css

@@ -1,4 +1,4 @@
-.trsel{
+.xtsel{
     border: 1px solid silver;
     padding: 5px;
     text-align: center;
@@ -7,7 +7,7 @@
     position: relative;
 }
 
-#trsel-list{
+#xtsel-list{
     border: gray 1px solid;
     width: 100%;
     padding: 0;
@@ -22,7 +22,7 @@
     z-index: 99;
 }
 
-#trsel-list li{
+#xtsel-list li{
     padding: 4px;
     border-bottom: 1px solid rgba(33,33,33,0.2);
     display: block;
@@ -31,15 +31,15 @@
     overflow: hidden;
 }
 
-#trsel-list li:nth-child(even){
+#xtsel-list li:nth-child(even){
     background: #efefef;
 }
 
-#trsel-list li:last-child{
+#xtsel-list li:last-child{
     border: none;
 }
 
-#trsel-list li.trsel-childer{
+#xtsel-list li.xtsel-childer{
     background: transparent url("right.png") no-repeat;
     background-position-x: calc(100% - 10px) ;
     -ms-background-position-y: center;
@@ -47,27 +47,27 @@
     background-size: auto 50% ;
 }
 
-#trsel-list li:hover{
+#xtsel-list li:hover{
     background-color: #dbedff ;
 }
-#trsel-list li.trsel-back{
+#xtsel-list li.xtsel-back{
     background: white url("left.png") 5px no-repeat;
     padding-left: 30px;
     background-size: auto 50% ;
 }
 
 
-#trsel-list.xout{
+#xtsel-list.xout{
     transform-origin: center right;
     transform-style: preserve-3d;
     transform: translateX(-100%) rotateY(-180deg) skew(0deg) ;
 }
 
-#trsel-list.xfade li{
+#xtsel-list.xfade li{
     opacity: 0;
 }
 
-#trsel-list li{
+#xtsel-list li{
     -webkit-transition: all .55s linear;
     -moz-transition: all .55s linear;
     -o-transition: all .55s linear;
@@ -75,7 +75,7 @@
     max-height: 30px;
 }
 
-#trsel-list.xslide li{
+#xtsel-list.xslide li{
     max-height: 0;
     overflow: hidden;
     box-sizing: border-box;
@@ -88,7 +88,7 @@
     transition: all .6s linear;
 }
 
-.trsel-selectable{
+.xtsel-selectable{
     float: left;
     width: 1.5em;
     position: relative;
@@ -101,38 +101,38 @@
 
 
 /** rtl support css */
-.trs-rtl{
+.xts-rtl{
 }
 
-.trs-rtl li {
+.xts-rtl li {
     direction: rtl !important;
     text-align: right !important;
 }
-.trs-rtl li.trsel-childer {
+.xts-rtl li.xtsel-childer {
     background-image: url("left.png") !important;
     background-position-x: 10px !important;
 }
-.trs-rtl li.trsel-back {
+.xts-rtl li.xtsel-back {
     background-image:  url("right.png") !important ;
     background-position-x: calc(100% - 10px) !important;
     padding-right: 30px !important;
 }
 
 
-.trs-rtl .trsel-selectable{
+.xts-rtl .xtsel-selectable{
     float: right;
     margin-left: .7em;
     margin-right: 0;
 }
 
-.trsel .search{
+.xtsel .search{
     display: none;
     padding: 0 !important;
 }
-.trsel.trs-searcable .search{
+.xtsel.xts-searcable .search{
     display: block;
 }
-.trsel .search input{
+.xtsel .search input{
     background: white;
     padding: 8px;
     border: 0;

src/x-tree-select.js

@@ -9,14 +9,14 @@
         };
 
         // set default store for setting
-        if ($.trsStore === undefined) {
+        if ($.xtsStore === undefined) {
             $.scbCounter = -1;
-            $.trsStore = [];
+            $.xtsStore = [];
             $.currentCounter = 0;
         }
 
         // make app var for use in plugin
-        $.trs = this;
+        $.xts = this;
 
         // change plugin info
         var settings = $.extend({
@@ -56,9 +56,9 @@
 
         // store setting for use
         $.scbCounter++;
-        $.trsStore[$.scbCounter] = settings;
+        $.xtsStore[$.scbCounter] = settings;
 
-        // console.log($.trsStore);
+        // console.log($.xtsStore);
 
         /**
          * initial element
@@ -78,68 +78,70 @@
 
             var elCls = '';
             // set rtl class if is rtl
-            if ($.trsStore[$.scbCounter].direction === 'rtl') {
-                elCls = 'trs-rtl';
+            if ($.xtsStore[$.scbCounter].direction === 'rtl') {
+                elCls = 'xts-rtl';
             }
 
             // check is searchable
-            if ($.trsStore[$.scbCounter].searchable === true) {
-                elCls += ' trs-searcable';
+            if ($.xtsStore[$.scbCounter].searchable === true) {
+                elCls += ' xts-searcable';
             }
 
             // init element for click for choose
-            $(self).parent().append('<div class="trsel ' + elCls + '" data-trcounter="' +
+            $(self).parent().append('<div class="xtsel ' + elCls + '" data-trcounter="' +
                 $.scbCounter + '" >' + placeholder + '</div>');
 
 
             // initial idx for use in naviagion
-            settings.datatree = $.trs.makeId('1', settings.datatree);
+            settings.datatree = $.xts.makeId('1', settings.datatree);
             // on click combowizard
-            $(self).parent().find('.trsel').bind('click.open', function (e) {
+            $(self).parent().find('.xtsel').bind('click.open', function (e) {
                 if (e.target !== this) {
                     return;
                 }
 
-                var trsel = $(this);
+                var xtsel = $(this);
 
-                if (trsel.hasClass("loading")) {
+                if (xtsel.hasClass("loading")) {
                     return;
                 }
 
-                trsel.addClass("loading");
+                xtsel.addClass("loading");
                 setTimeout(function () {
-                    trsel.removeClass("loading");
+                    xtsel.removeClass("loading");
                 }, 600);
 
                 $.currentCounter = $(this).data('trcounter');
-                $.lastx.title = $.trsStore[$.currentCounter].mainTitle;
+                $.lastx.title = $.xtsStore[$.currentCounter].mainTitle;
                 // check is open list
                 if (!$(this).hasClass('active')) {
 
-                    $.trsStore[$.currentCounter].onOpen();
+                    $.xtsStore[$.currentCounter].onOpen();
+
+
                     // find target for last value
-                    $.trs.target = $(this).parent().find('input');
+                    $.xts.target = $(this).parent().find('input');
                     // find select text position
-                    $.trs.text = $(self).parent().find('.trsel');
+                    $.xts.text = $(self).parent().find('.xtsel');
                     //if now list show list and countiniu
-                    $(this).append('<ul id="trsel-list"></ul>');
-                    if ($.trsStore[$.currentCounter].navx === undefined) {
+                    $(this).append('<ul id="xtsel-list"></ul>');
+                    if ($.xtsStore[$.currentCounter].navx === undefined) {
                         // show first list main cat in list
-                        $.trs.showTree($.trsStore[$.currentCounter].datatree);
+                        $.xts.showTree($.xtsStore[$.currentCounter].datatree);
                     } else {
-                        $.lastx = $.trsStore[$.currentCounter].lastx;
-                        $.navigatex = $.trsStore[$.currentCounter].navx;
-                        $.trs.showTree($.trs.findTree($.trsStore[$.currentCounter].datatree, $.trsStore[$.currentCounter].lastx.id));
+                        $.lastx = $.xtsStore[$.currentCounter].lastx;
+                        $.navigatex = $.xtsStore[$.currentCounter].navx;
+                        $.xts.showTree($.xts.findTree($.xtsStore[$.currentCounter].datatree, $.xtsStore[$.currentCounter].lastx.id));
                     }
                     // slide down list
-                    $("#trsel-list").slideDown(function () {
+                    $("#xtsel-list").slideDown(function () {
                         $(document).bind('click.handvarrsl', function (e) {
-                            if (!$(e.target).is(".trsel-childer, .trsel-back, .search, .srch")) {
-                                $.trs.resetClose();
-                                $("#trsel-list").slideUp(200, function () {
+                            if (!$(e.target).is(".xtsel-childer, .xtsel-back, .search, .srch")) {
+                                $.xts.resetClose();
+                                $("#xtsel-list").slideUp(200, function () {
                                     $(this).remove();
                                 });
-                                $($.trs.text).removeClass('active');
+                                $($.xts.text).removeClass('active');
                             }
                             e.preventDefault();
                             return false;
@@ -155,19 +157,19 @@
 
                     // hide and remove list
                     $(this).removeClass('active');
-                    $("#trsel-list").slideUp(100, function () {
-                        // $.trs.resetClose();
+                    $("#xtsel-list").slideUp(100, function () {
+                        // $.xts.resetClose();
                         $(this).remove();
                     });
                 }
             });
 
             //reset
-            $(document).off('click', '#trsel-list li');
+            $(document).off('click', '#xtsel-list li');
             // on click items
-            $(document).on('click', '#trsel-list li', function (e) {
+            $(document).on('click', '#xtsel-list li', function (e) {
                 // has child & no parent selecatble
-                if ($(this).hasClass('trsel-childer') && !$(e.target).hasClass('trsel-selectable')) {
+                if ($(this).hasClass('xtsel-childer') && !$(e.target).hasClass('xtsel-selectable')) {
                     // make navigation
                     var tmp = {
                         title: $.lastx.title,
@@ -179,50 +181,50 @@
 
 
                     // transtion ;
-                    $("#trsel-list").addClass($.treeselect_animation[$.trsStore[$.currentCounter].transition]);
+                    $("#xtsel-list").addClass($.treeselect_animation[$.xtsStore[$.currentCounter].transition]);
 
 
                     var xself = this;
                     var ax = setTimeout(function () {
                         // show child items
-                        $.trs.showTree($.trs.findTree($.trsStore[$.currentCounter].datatree, $(xself).data('id')));
+                        $.xts.showTree($.xts.findTree($.xtsStore[$.currentCounter].datatree, $(xself).data('id')));
                         // remove effect
-                        $("#trsel-list").removeClass($.treeselect_animation[$.trsStore[$.currentCounter].transition]);
+                        $("#xtsel-list").removeClass($.treeselect_animation[$.xtsStore[$.currentCounter].transition]);
                     }, 600);
 
-                } else if ($(this).hasClass('trsel-back')) { // if click on back
+                } else if ($(this).hasClass('xtsel-back')) { // if click on back
                     if ($.navigatex[$.navigatex.length - 1] !== undefined) {
                         // roll back navigtaion to last
                         $.lastx.title = $.navigatex[$.navigatex.length - 1].title;
                         $.lastx.id = $.navigatex[$.navigatex.length - 1].id;
                     } else {
                         // check is navigation emoppty set def
-                        $.lastx.title = $.trsStore[$.currentCounter].mainTitle;
+                        $.lastx.title = $.xtsStore[$.currentCounter].mainTitle;
                         $.lastx.id = '';
                     }
                     // pop last navigation item
                     $.navigatex.pop();
                     // get parent list
-                    var lst = $.trs.findTree($.trsStore[$.currentCounter].datatree, $(this).data('id'));
+                    var lst = $.xts.findTree($.xtsStore[$.currentCounter].datatree, $(this).data('id'));
                     // if has not parent show main cat
-                    $("#trsel-list").addClass($.treeselect_animation[$.trsStore[$.currentCounter].transition]);
+                    $("#xtsel-list").addClass($.treeselect_animation[$.xtsStore[$.currentCounter].transition]);
 
                     var ax = setTimeout(function () {
                         if (lst.length === 0) {
-                            $.trs.showTree($.trsStore[$.currentCounter].datatree);
+                            $.xts.showTree($.xtsStore[$.currentCounter].datatree);
                         } else {
                             // then show parent list
-                            $.trs.showTree(lst);
+                            $.xts.showTree(lst);
                         }
-                        $("#trsel-list").removeClass($.treeselect_animation[$.trsStore[$.currentCounter].transition]);
+                        $("#xtsel-list").removeClass($.treeselect_animation[$.xtsStore[$.currentCounter].transition]);
                     }, 600);
                 }else if( $(e.target).hasClass('search') || $(e.target).hasClass('srch') ){
                     // console.log('x');
                 } else { // choose|select value
                     // onChange event
-                    $.trsStore[$.currentCounter].onChange({
-                        value: $($.trs.target).val(),
-                        text: $($.trs.text).clone()    //clone the element
+                    $.xtsStore[$.currentCounter].onChange({
+                        value: $($.xts.target).val(),
+                        text: $($.xts.text).clone()    //clone the element
                             .children() //select all the children
                             .remove()   //remove all the children
                             .end()  //again go back to selected element
@@ -232,28 +234,28 @@
                         text: $(this).text()
                     });
                     // set main input value
-                    $($.trs.target).val($(this).data('value'));
+                    $($.xts.target).val($(this).data('value'));
                     // set choosed test
-                    $($.trs.text).text($(this).text());
+                    $($.xts.text).text($(this).text());
                     // if selected is not first level store level & last titles
                     if ($.navigatex.length > 0) {
-                        $.trsStore[$.currentCounter].navx = $.navigatex;
-                        $.trsStore[$.currentCounter].lastx = $.lastx;
+                        $.xtsStore[$.currentCounter].navx = $.navigatex;
+                        $.xtsStore[$.currentCounter].lastx = $.lastx;
                     } else {
-                        delete $.trsStore[$.currentCounter].navx;
-                        delete $.trsStore[$.currentCounter].lastx;
+                        delete $.xtsStore[$.currentCounter].navx;
+                        delete $.xtsStore[$.currentCounter].lastx;
                     }
                     // remove active class and hide list
-                    $($.trs.text).removeClass('active');
+                    $($.xts.text).removeClass('active');
                     // onChange
-                    $.trsStore[$.currentCounter].onSelect({
+                    $.xtsStore[$.currentCounter].onSelect({
                         value: $(this).data('value'),
                         text: $(this).text(),
                         id: $(this).data('id'),
                         parent: $.lastx,
                         ancestors: $.navigatex
                     });
-                    $("#trsel-list").slideUp(100, function () {
+                    $("#xtsel-list").slideUp(100, function () {
                         $(this).remove();
                     });
                 }
@@ -279,13 +281,13 @@
                 var prefix = base + '-' + (parseInt(ix) + 1);
                 itm.idx = prefix;
                 //if there is no child object, just create it
-                if (itm[$.trsStore[$.scbCounter].json.child] === undefined) {
-                    itm[$.trsStore[$.scbCounter].json.child] = [];
+                if (itm[$.xtsStore[$.scbCounter].json.child] === undefined) {
+                    itm[$.xtsStore[$.scbCounter].json.child] = [];
                 }
                 // if has child
-                if (itm[$.trsStore[$.scbCounter].json.child].length !== 0) {
+                if (itm[$.xtsStore[$.scbCounter].json.child].length !== 0) {
                     // recall this function for children
-                    itm[$.trsStore[$.scbCounter].json.child] = $.trs.makeId(prefix, itm[$.trsStore[$.scbCounter].json.child]);
+                    itm[$.xtsStore[$.scbCounter].json.child] = $.xts.makeId(prefix, itm[$.xtsStore[$.scbCounter].json.child]);
                 }
                 all.push(itm);
             }
@@ -300,14 +302,14 @@
         this.showTree = function (list, cb) {
             var content = '';
             // clear li list
-            $("#trsel-list li").remove();
+            $("#xtsel-list li").remove();
 
             // back button handle
             // has parent need back button
             if ($.navigatex.length !== 0) {
                 // if navigation is empity not need back button
                 var back = $.navigatex[$.navigatex.length - 1];
-                content += '<li class="trsel-back" data-id="' + back.id + '"> &nbsp;' + back.title + '</li>';
+                content += '<li class="xtsel-back" data-id="' + back.id + '"> &nbsp;' + back.title + '</li>';
             } else {
                  // if has no parent
                 // search element
@@ -319,20 +321,20 @@
                 var item = list[ix];
                 // ad childs
                 // check has child
-                var clsx = ' class="trsel-childer"';
+                var clsx = ' class="xtsel-childer"';
                 var select = '';
-                if (item[$.trsStore[$.currentCounter].json.child].length === 0) {
+                if (item[$.xtsStore[$.currentCounter].json.child].length === 0) {
                     clsx = ' class=""';
                 } else {
-                    if ($.trsStore[$.currentCounter].selectablePrernt) {
-                        var select = '<span class="trsel-selectable"></span>';
+                    if ($.xtsStore[$.currentCounter].selectablePrernt) {
+                        var select = '<span class="xtsel-selectable"></span>';
                     }
                 }
 
                 // li to list
-                content += '<li' + clsx + ' data-id="' + item.idx + '"  data-value="' + item[$.trsStore[$.currentCounter].json.value] + '">' + select + item[$.trsStore[$.currentCounter].json.title] + '</li>';
+                content += '<li' + clsx + ' data-id="' + item.idx + '"  data-value="' + item[$.xtsStore[$.currentCounter].json.value] + '">' + select + item[$.xtsStore[$.currentCounter].json.title] + '</li>';
             }
-            $("#trsel-list").html(content);
+            $("#xtsel-list").html(content);
             if (cb !== undefined) {
                 cb();
             }
@@ -351,14 +353,14 @@
             for (var ix in list) {
                 var item = list[ix];
                 if (item.idx === idx) {
-                    return item[$.trsStore[$.currentCounter].json.child];
+                    return item[$.xtsStore[$.currentCounter].json.child];
                 }
             }
             // if not fond in first level each the childs
             for (var ix in list) {
                 var item = list[ix];
-                if (item[$.trsStore[$.currentCounter].json.child].length !== 0) {
-                    var tmp = $.trs.findTree(item[$.trsStore[$.currentCounter].json.child], idx);
+                if (item[$.xtsStore[$.currentCounter].json.child].length !== 0) {
+                    var tmp = $.xts.findTree(item[$.xtsStore[$.currentCounter].json.child], idx);
                     // if found idx retrur
                     if (tmp.length !== 0) {
                         return tmp;
@@ -384,30 +386,30 @@
             if (parent != null) {
                 $.navigatex.push({
                     id: parent.idx,
-                    title: parent[$.trsStore[c].json.title]
+                    title: parent[$.xtsStore[c].json.title]
                 });
             } else {
                 $.navigatex.push({
                     id: "",
-                    title:  $.trsStore[c].mainTitle
+                    title:  $.xtsStore[c].mainTitle
                 });
-                $.lastx.title = $.trsStore[c].mainTitle;
+                $.lastx.title = $.xtsStore[c].mainTitle;
                 $.lastx.id = '';
             }
             // each all
             for (var ix in list) {
                 var item = list[ix];
-                if (item[$.trsStore[c].json.value] == val) {
+                if (item[$.xtsStore[c].json.value] == val) {
                     return item;
                 }
                 // if has child
-                if (item[$.trsStore[c].json.child] != undefined && item[$.trsStore[c].json.child].length > 0) {
+                if (item[$.xtsStore[c].json.child] != undefined && item[$.xtsStore[c].json.child].length > 0) {
                     // add last
                     $.lastx = {
                         id: item.idx,
-                        title: item[$.trsStore[c].json.title]
+                        title: item[$.xtsStore[c].json.title]
                     };
-                    var back = this.findItem(item[$.trsStore[c].json.child], val, c, item);
+                    var back = this.findItem(item[$.xtsStore[c].json.child], val, c, item);
                     if (back != false) {
                         return back;
                     }
@@ -426,13 +428,13 @@
          */
         this.setDefault = function (c, val) {
             // find value
-            var back = $.trs.findItem($.trsStore[c].datatree, val, c);
+            var back = $.xts.findItem($.xtsStore[c].datatree, val, c);
             // if is exits val
             if (back != false) {
-                $.trsStore[c].lastx = $.lastx;
+                $.xtsStore[c].lastx = $.lastx;
                 $.navigatex.pop();
-                $.trsStore[c].navx = $.navigatex;
-                $("[data-trcounter='" + c + "']").text(back[$.trsStore[c].json.title]);
+                $.xtsStore[c].navx = $.navigatex;
+                $("[data-trcounter='" + c + "']").text(back[$.xtsStore[c].json.title]);
             }
         };
 
@@ -440,11 +442,11 @@
          * reset values on close
          */
         this.resetClose = function () {
-            $.trsStore[$.currentCounter].onClose();
+            $.xtsStore[$.currentCounter].onClose();
             // reset navagtion value
             $.navigatex = [];
             $.lastx = {
-                title: $.trsStore[$.currentCounter].mainTitle,
+                title: $.xtsStore[$.currentCounter].mainTitle,
                 id: ''
             };
             // reset docuemnt bind
@@ -455,7 +457,7 @@
             this.html(currentInnerText + " " + newValue)
         };
         this.each(function () {
-            $.trs.init(this);
+            $.xts.init(this);
         });
         return this;