first commit

web/stCategoryTreePlugin/js/jquery-no-conflict.js

@@ -0,0 +1 @@
+jQuery.noConflict();

web/stCategoryTreePlugin/js/jquery.treeview.js

@@ -0,0 +1,292 @@
+/*
+ * Treeview 1.4 - jQuery plugin to hide and show branches of a tree
+ * 
+ * http://bassistance.de/jquery-plugins/jquery-plugin-treeview/
+ * http://docs.jquery.com/Plugins/Treeview
+ *
+ * Copyright (c) 2007 Jörn Zaefferer
+ *
+ * Dual licensed under the MIT and GPL licenses:
+ *   http://www.opensource.org/licenses/mit-license.php
+ *   http://www.gnu.org/licenses/gpl.html
+ *
+ * Revision: $Id: jquery.treeview.js 4684 2008-02-07 19:08:06Z joern.zaefferer $
+ *
+ */
+
+;(function($) {
+
+   $.extend($.fn, {
+      swapClass: function(c1, c2) {
+         var c1Elements = this.filter('.' + c1);
+         this.filter('.' + c2).removeClass(c2).addClass(c1);
+         c1Elements.removeClass(c1).addClass(c2);
+         return this;
+      },
+      replaceClass: function(c1, c2) {
+         return this.filter('.' + c1).removeClass(c1).addClass(c2).end();
+      },
+      hoverClass: function(className) {
+         className = className || "hover";
+         return this.hover(function() {
+            $(this).addClass(className);
+         }, function() {
+            $(this).removeClass(className);
+         });
+      },
+      heightToggle: function(animated, callback) {
+         animated ?
+            this.animate({ height: "toggle" }, animated, callback) :
+            this.each(function(){
+               jQuery(this)[ jQuery(this).is(":hidden") ? "show" : "hide" ]();
+               if(callback)
+                  callback.apply(this, arguments);
+            });
+      },
+      heightHide: function(animated, callback) {
+         if (animated) {
+            this.animate({ height: "hide" }, animated, callback);
+         } else {
+            this.hide();
+            if (callback)
+               this.each(callback);          
+         }
+      },
+      prepareBranches: function(settings) {
+         if (!settings.prerendered) {
+            // mark last tree items
+            this.filter(":last-child:not(ul)").addClass(CLASSES.last);
+            // collapse whole tree, or only those marked as closed, anyway except those marked as open
+            this.filter((settings.collapsed ? "" : "." + CLASSES.closed) + ":not(." + CLASSES.open + ")").find(">ul").hide();
+         }
+         // return all items with sublists
+         return this.filter(":has(> div img."+CLASSES.hitarea+")");
+      },
+      applyClasses: function(settings, toggler, loader) {
+//       this.filter(":has(>ul):not(:has(>a))").find(">span").click(function(event) {
+//          toggler.apply($(this).next());
+//       }).add( $("a", this) ).hoverClass();
+         
+         if (!settings.prerendered) {
+            // handle closed ones first
+            this.filter(":has(>ul:hidden)")
+                  .addClass(CLASSES.expandable)
+                  .replaceClass(CLASSES.last, CLASSES.lastExpandable);
+                  
+            // handle open ones
+            this.not(":has(>ul:hidden)")
+                  .addClass(CLASSES.collapsable)
+                  .replaceClass(CLASSES.last, CLASSES.lastCollapsable);
+                  
+               // create hitarea
+            this.prepend("<div class=\"" + CLASSES.hitarea + "\"/>").find("div." + CLASSES.hitarea).each(function() {
+               var classes = "";
+               $.each($(this).parent().attr("class").split(" "), function() {
+                  classes += this + "-hitarea ";
+               });
+               $(this).addClass( classes );
+            });
+         }
+         
+         // apply event to hitarea
+                        if (settings.url)
+                        {
+                           $(this).not(':has(>ul)').find("." + CLASSES.hitarea).click(loader);
+                           $(this).filter(':has(>ul)').find("." + CLASSES.hitarea).click(toggler);
+                        }
+                        else
+                        {
+                           $(this).find("." + CLASSES.hitarea).click(toggler);
+                        }
+      },
+      treeview: function(settings) {
+         
+         settings = $.extend({
+            cookieId: "treeview"
+         }, settings);
+         
+         if (settings.add) {
+            return this.trigger("add", [settings.add]);
+         }
+         
+         if ( settings.toggle ) {
+            var callback = settings.toggle;
+            settings.toggle = function() {
+               return callback.apply($(this).parent()[0], arguments);
+            };
+         }
+      
+         // factory for treecontroller
+         function treeController(tree, control) {
+            // factory for click handlers
+            function handler(filter) {
+               return function() {
+                  // reuse toggle event handler, applying the elements to toggle
+                  // start searching for all hitareas
+                  toggler.apply( $("." + CLASSES.hitarea, tree).filter(function() {
+                     // for plain toggle, no filter is provided, otherwise we need to check the parent element
+                     return filter ? $(this).parent("." + filter).length : true;
+                  }) );
+                  return false;
+               };
+            }
+            // click on first element to collapse tree
+            $("a:eq(0)", control).click( handler(CLASSES.collapsable) );
+            // click on second to expand tree
+            $("a:eq(1)", control).click( handler(CLASSES.expandable) );
+            // click on third to toggle tree
+            $("a:eq(2)", control).click( handler() ); 
+         }
+
+                        function loader(event)
+                        {
+
+                           if (settings.url)
+                           {
+                              var hitarea = $(this);
+                              hitarea.unbind(event);
+                              hitarea.click(toggler);
+                              hitarea.trigger('click');
+                              hitarea.addClass('preload');
+                  
+                              $.get(settings.url, {id: Number(hitarea.attr('id').match(/[0-9]+$/))}, function(data) {
+                                 var parent = hitarea.parent().parent();
+                                 parent.append(data);
+
+                                 hitarea.removeClass('preload');
+                              });
+                           }
+
+                           event.stopPropagation();
+                           event.stopImmediatePropagation();
+                        }
+      
+         // handle toggle event
+         function toggler(event) {
+                          if (!event.isImmediatePropagationStopped())
+                          {
+                                 target = $(this);
+                            
+
+            target
+               .parent()
+               // swap classes for hitarea
+               .find(">." + CLASSES.hitarea)
+                  .swapClass( CLASSES.collapsableHitarea, CLASSES.expandableHitarea )
+                  .swapClass( CLASSES.lastCollapsableHitarea, CLASSES.lastExpandableHitarea )
+               .end()
+               // swap classes for parent li
+               .swapClass( CLASSES.collapsable, CLASSES.expandable )
+               .swapClass( CLASSES.lastCollapsable, CLASSES.lastExpandable )
+               // find child lists
+                    .parent()
+               .find( ">ul" )
+               // toggle them
+               .heightToggle( settings.animated, settings.toggle );
+            if ( settings.unique ) {
+               target.parent()
+                  .siblings()
+                  // swap classes for hitarea
+                  .find(">." + CLASSES.hitarea)
+                     .replaceClass( CLASSES.collapsableHitarea, CLASSES.expandableHitarea )
+                     .replaceClass( CLASSES.lastCollapsableHitarea, CLASSES.lastExpandableHitarea )
+                  .end()
+                  .replaceClass( CLASSES.collapsable, CLASSES.expandable )
+                  .replaceClass( CLASSES.lastCollapsable, CLASSES.lastExpandable )
+                  .find( ">ul" )
+                  .heightHide( settings.animated, settings.toggle );
+            }
+                                event.stopImmediatePropagation();
+                          }
+
+         }
+         
+         function serialize() {
+            function binary(arg) {
+               return arg ? 1 : 0;
+            }
+            var data = [];
+            branches.each(function(i, e) {
+               data[i] = $(e).is(":has(>ul:visible)") ? 1 : 0;
+            });
+            $.cookie(settings.cookieId, data.join("") );
+         }
+         
+         function deserialize() {
+            var stored = $.cookie(settings.cookieId);
+            if ( stored ) {
+               var data = stored.split("");
+               branches.each(function(i, e) {
+                  $(e).find(">ul")[ parseInt(data[i]) ? "show" : "hide" ]();
+               });
+            }
+         }
+         
+         // add treeview class to activate styles
+         this.addClass("treeview");
+         
+         // prepare branches and find all tree items with child lists
+         var branches = this.find("li").prepareBranches(settings);
+         
+         switch(settings.persist) {
+         case "cookie":
+            var toggleCallback = settings.toggle;
+            settings.toggle = function() {
+               serialize();
+               if (toggleCallback) {
+                  toggleCallback.apply(this, arguments);
+               }
+            };
+            deserialize();
+            break;
+         case "location":
+            var current = this.find("a").filter(function() { return this.href.toLowerCase() == location.href.toLowerCase(); });
+            if ( current.length ) {
+               current.addClass(CLASSES.selected).parents("ul, li").add( current.next() ).show();
+            }
+            break;
+         }
+         
+         branches.applyClasses(settings, toggler, loader);
+            
+         // if control option is set, create the treecontroller and show it
+         if ( settings.control ) {
+            treeController(this, settings.control);
+            $(settings.control).show();
+         }
+         
+         return this.bind("add", function(event, branches) {
+            $(branches).prev()
+               .removeClass(CLASSES.last)
+               .removeClass(CLASSES.lastCollapsable)
+               .removeClass(CLASSES.lastExpandable)
+            .find(">." + CLASSES.hitarea)
+               .removeClass(CLASSES.lastCollapsableHitarea)
+               .removeClass(CLASSES.lastExpandableHitarea);
+            $(branches).find("li").andSelf().prepareBranches(settings).applyClasses(settings, toggler, loader);
+         });
+      }
+   });
+   
+   // classes used by the plugin
+   // need to be styled via external stylesheet, see first example
+   var CLASSES = $.fn.treeview.classes = {
+      open: "open",
+      closed: "closed",
+      expandable: "x-tree-node-expanded",
+      expandableHitarea: "x-tree-elbow-plus",
+      lastExpandableHitarea: "x-tree-elbow-end-plus",
+      collapsable: "x-tree-node-collapsed",
+      collapsableHitarea: "x-tree-elbow-minus",
+      lastCollapsableHitarea: "x-tree-elbow-end-minus",
+      lastCollapsable: "lastCollapsable",
+      lastExpandable: "lastExpandable",
+      last: "last",
+      hitarea: "x-tree-hitarea",
+        selected: 'x-tree-node-anchor-selected'
+   };
+   
+   // provide backwards compability
+   $.fn.Treeview = $.fn.treeview;
+   
+})(jQuery);

web/stCategoryTreePlugin/js/stCategoryTree.js

@@ -0,0 +1,608 @@
+/**
+* Drzewo kategorii integrujące Ext.tree.TreePanel z modułem stCategoryTree
+*
+* @package stCategoryTreePlugin
+* @author Marcin Butlak <marcin.butlak@sote.pl>
+* @copyright SOTE
+* @license SOTE
+* @version $Id$
+*/
+
+stCategoryTree = function() {
+    return {
+        showCategoryCreateWindow: function(tree, module_name, ui_provider)
+        {
+            var sn = tree.getSelectionModel().getSelectedNode();
+
+            if (!sn)
+            {
+                sn = tree.getRootNode();
+            }
+
+            Ext.MessageBox.show({
+                title: 'Dodaj kategorię',
+                msg: 'Nazwa kategorii:',
+                width:300,
+                buttons: {
+                    ok:'Dodaj',
+                    cancel:'Anuluj'
+                },
+                prompt: true,
+                fn: function (btn, text)
+                {
+                    text = Ext.util.Format.stripTags(text);
+
+                    text = text.trim();
+
+                    if (btn == 'ok' && text != '')
+                    {
+                        Ext.MessageBox.show({
+                            msg: 'Dodawanie kategorii, prosze czekać...',
+                            progressText: 'Operacja w toku...',
+                            width:325,
+                            wait:true,
+                            waitConfig: {
+                                interval:200
+                            },
+                            icon:'ext-mb-download'
+                        });
+
+                        Ext.Ajax.request({
+                            url: Ext.SF_SCRIPT_NAME + '/' + module_name + '/appendCategory',
+                            params: {
+                                parent_id: sn.id,
+                                name: text
+                            },
+                            success: function(response)
+                            {
+                                var json_data = Ext.util.JSON.decode(response.responseText);
+                                if (json_data)
+                                {
+                                    var parent = tree.getNodeById(json_data.parent_id);
+
+                                    parent.appendChild(new Ext.tree.AsyncTreeNode({
+                                        text: json_data.name,
+                                        id: json_data.id,
+                                        allowDrag: true,
+                                        uiProvider: ui_provider,
+                                        qtip: 'Kliknij dwukrotnie aby zmienić nazwę kategorii. Kliknij, przytrzymaj i przeciągnij aby zmienić jej położenie'
+                                    }));
+
+                                    Ext.MessageBox.hide();
+
+                                    parent.expand(false, true);
+
+
+                                }
+                            }
+                        });
+                    }
+                    else if (btn != 'cancel')
+                    {
+                        stCategoryTree.showCategoryCreateWindow(tree, module_name, ui_provider);
+                    }
+                },
+                animEl: sn.id
+            });
+        },
+        create : function(root_name, root_id, module_name, editable, ui_provider, params, container_scroll, animated, show_hints, root_href)
+        {
+
+            if (typeof ui_provider == 'undefined')
+            {
+                ui_provider = Ext.tree.stTreeNodeUI;
+            }
+            
+            if (typeof animated == 'undefined')
+            {
+                animated = true;
+            }    
+                    
+            if (typeof show_hints == 'undefined')
+            {
+                show_hints = true;
+            } 
+                        
+            if (typeof ui_provider == 'undefined')
+            {
+                container_scroll = true;
+            }            
+            
+            if (typeof params == 'undefined')
+            {
+                params = {};
+            }            
+
+            if (show_hints)
+            {
+                Ext.QuickTips.init();
+                Ext.apply(Ext.QuickTips.getQuickTip(), {
+                    maxWidth: 200,
+                    minWidth: 100,
+                    showDelay: 50,
+                    dismissDelay: 10000,
+                    trackMouse: true
+                });
+            }
+
+            var tb = new Ext.Toolbar(
+            {
+                items:
+                [
+
+                {
+                    text: 'Dodaj',
+                    cls: 'st_ext_button-icon',
+                    icon: '/images/backend/icons/add.png',
+                    disabled: true,
+                    tooltip: 'Wybierz kategorię z drzewa do której chcesz dodać nową podkategorię i ponownie wciśnij ten przycisk',
+                    handler: function () { stCategoryTree.showCategoryCreateWindow(tree, module_name, ui_provider) }
+                },
+                {
+                    text: 'Edytuj',
+                    cls: 'st_ext_button-icon',
+                    icon: '/images/backend/icons/edit.png',
+                    disabled: true,
+                    tooltip: 'Wybierz kategorię z drzewa, którą chcesz edytować a następnie wciśnij ten przycisk.',
+                    handler: function()
+                    {
+                        var sn = tree.getSelectionModel().getSelectedNode();
+
+                        if (sn)
+                        {
+                            window.location = Ext.SF_SCRIPT_NAME  + '/category/edit/id/' + sn.id;
+                        }
+
+
+                    }
+                },                   
+                {
+                    text: 'Usuń',
+                    cls: 'st_ext_button-icon',
+                    icon: '/images/backend/icons/delete.png',
+                    disabled: true,
+                    tooltip: 'Wybierz kategorię z drzewa którą chcesz usunać a następnie wciśnij ten przycisk.',
+                    handler: function()
+                    {
+                        Ext.MessageBox.buttonText.yes = "Tak";
+                        Ext.MessageBox.buttonText.no = "Nie";
+                        Ext.Msg.confirm('Usunąć kategorię?', 'Zamierzasz usunąć kategorię z drzewa. Jesteś pewien że chcesz kontynuować?',
+                            function (btn)
+                            {
+                                if (btn == "yes")
+                                {
+                                    Ext.MessageBox.show({
+                                        msg: 'Usuwanie kategorii, prosze czekać...',
+                                        progressText: 'Operacja w toku...',
+                                        width:325,
+                                        wait:true,
+                                        waitConfig: {
+                                            interval:200
+                                        },
+                                        icon:'ext-mb-download', //custom class in msg-box.html
+                                        animEl: 'mb7'
+                                    });
+
+                                    var sn = tree.getSelectionModel().getSelectedNode();
+		
+                                    if (sn)
+                                    {
+
+                                        Ext.Ajax.request({
+                                            url: Ext.SF_SCRIPT_NAME + '/' + module_name + '/removeCategory',
+                                            params: {
+                                                id: sn.id
+                                            },
+                                            success: function(response)
+                                            {
+                                                var json_data = Ext.util.JSON.decode(response.responseText);
+                                                var node = tree.getNodeById(json_data.id);
+		
+                                                if (node)
+                                                {
+                                                    if (node.isRoot)
+                                                    {
+                                                        tree.destroy()
+                                                    }
+                                                    else
+                                                    {
+                                                        node.remove();
+                                                    }
+                                                }
+
+                                                Ext.MessageBox.hide();
+		
+                                            }
+                                        });
+                                    }
+                                }
+                            });
+
+                    }
+                },             
+                {
+                    text: 'Usuń drzewo',
+                    cls: 'st_ext_button-icon',
+                    icon: '/images/backend/icons/delete.png',
+                    tooltip: 'Usuwa całe drzewo kategorii',
+                    handler: function()
+                    {
+                        Ext.MessageBox.buttonText.yes = "Tak";
+                        Ext.MessageBox.buttonText.no = "Nie";
+                        Ext.Msg.confirm('Usunąć drzewo?', 'Zamierzasz usunąć całe drzewo kategorii. Jesteś pewien że chcesz kontynuować?',
+                            function (btn)
+                            {
+                                if (btn == "yes")
+                                {
+                                    Ext.MessageBox.show({
+                                        msg: 'Usuwanie drzewa kategorii, prosze czekać...',
+                                        progressText: 'Operacja w toku...',
+                                        width:325,
+                                        wait:true,
+                                        waitConfig: {
+                                            interval:200
+                                        },
+                                        icon:'ext-mb-download', //custom class in msg-box.html
+                                        animEl: 'mb7'
+                                    });
+
+                                    var root = tree.getRootNode();
+		
+                                    Ext.Ajax.request({
+                                        url: Ext.SF_SCRIPT_NAME + '/' + module_name + '/removeCategory',
+                                        params: {
+                                            id: root.id
+                                        },
+                                        success: function(response)
+                                        {
+                                            var json_data = Ext.util.JSON.decode(response.responseText);
+                                            var node = tree.getNodeById(json_data.id);
+		
+                                            if (node)
+                                            {
+                                                tree.destroy();
+                                            }
+                                            Ext.MessageBox.hide();
+                                        }
+                                    });
+                                }
+                            });
+
+
+                    }
+                }
+                
+                ]
+            });
+
+            var Tree = Ext.tree;
+
+            var tree = new Tree.TreePanel(
+            {
+                el: 'st_category-tree-' + root_id,
+                autoScroll: true,
+                animate: animated,
+                enableDD: editable,
+                containerScroll: container_scroll,
+                autoScroll: container_scroll,
+                autoHeight: !container_scroll,
+                border: false,
+                shadow: false,
+                bodyBorder: false,
+                useArrows: true,
+                tbar: editable ? tb : null,
+                nodeUiProvider: Ext.tree.stTreeNodeUI,
+                loader: new Tree.TreeLoader(
+                {
+                    dataUrl: Ext.SF_SCRIPT_NAME + '/' + module_name + '/fetchCategories?root_id=' + root_id,
+                    baseParams: params,
+                    baseAttrs: {
+                        uiProvider: ui_provider
+                    }
+                })
+
+            });
+
+            // set the root node
+            if (editable)
+            {
+                var root = new Tree.AsyncTreeNode(
+                {
+                    text: root_name,
+                    cls: 'st_category-tree-root',
+                    draggable: false,
+                    qtip: 'Kliknij dwukrotnie aby zmienić nazwę drzewa kategorii',
+                    id: root_id,
+                    href: root_href ? root_href : null,
+                    uiProvider: ui_provider
+                });
+            } else
+            {
+                var root = new Tree.AsyncTreeNode(
+                {
+                    text: root_name,
+                    cls: 'st_category-tree-root',
+                    draggable: false,
+                    id: root_id,
+                    href: root_href ? root_href : null,
+                    uiProvider: ui_provider
+                });
+            }
+
+            tree.setRootNode(root);
+
+            tree.on('textchange', function (node, value, old_value)
+            {
+
+                value = Ext.util.Format.stripTags(value);
+
+                value = value.trim();
+
+                tree.suspendEvents();
+                node.setText(value);
+                tree.resumeEvents();
+
+                if (value != '' && value != old_value)
+                {
+                    Ext.Ajax.request({
+                        url: Ext.SF_SCRIPT_NAME + '/' + module_name + '/changeCategoryName',
+                        params: {
+                            'value': value,
+                            'id': node.id
+                        }
+                    });
+
+
+
+                }
+                else if (value == '')
+                {
+                    tree.suspendEvents();
+                    node.setText(old_value);
+                    tree.resumeEvents();
+                }
+                
+            });
+
+            if (editable)
+            {
+                tree.on('click', function (node, e)
+                {
+                    tb.items.item(0).setDisabled(false);
+
+                    if (node.isRoot)
+                    {
+                        tb.items.item(1).setDisabled(false);
+                        tb.items.item(2).setDisabled(true);
+                    }
+                    else
+                    {
+                        tb.items.item(1).setDisabled(false);
+                        tb.items.item(2).setDisabled(false);
+                    }
+                });
+            }
+            
+            tree.on('movenode', function (tree, node, old_parent, new_parent, index)
+            {
+
+                Ext.MessageBox.show({
+                    msg: 'Przenoszenie kategorii, prosze czekać...',
+                    progressText: 'Operacja w toku...',
+                    width:325,
+                    wait:true,
+                    waitConfig: {
+                        interval:200
+                    },
+                    icon:'ext-mb-download'
+                });
+                
+
+                if (node.previousSibling)
+                {
+                    prev_sibling_id = node.previousSibling.id;
+                }
+                else
+                {
+                    prev_sibling_id = 0;
+                }
+
+                if (node.nextSibling)
+                {
+                    next_sibling_id = node.nextSibling.id;
+                }
+                else
+                {
+                    next_sibling_id = 0;
+                }
+ 
+                Ext.Ajax.request(
+                {
+                    url: Ext.SF_SCRIPT_NAME + '/' + module_name + '/moveCategory',
+                    success: function()
+                    {
+                        Ext.MessageBox.hide();
+                    },
+                    params: {
+                        'prev_sibling_id': prev_sibling_id,
+                        'next_sibling_id': next_sibling_id,
+                        'parent_id': new_parent.id,
+                        'id': node.id
+                    }
+                });
+            });
+
+
+            // render the tree
+            tree.render();
+
+            root.expand();
+            
+            if (typeof Ext.categoryTree == 'undefined')
+            {
+                Ext.categoryTree = [];
+            }
+            
+            Ext.categoryTree[root.id] = tree;
+          
+            if (editable)
+            {
+                var ge = new Ext.tree.TreeEditor(tree,
+                {
+                    allowBlank: false,
+                    blankText: 'Musisz podać nazwę kategorii',
+                    selectOnFocus:true,
+                    cancelOnEsc: true
+                });
+            }
+        }
+
+    };
+}();
+
+
+Ext.tree.stTreeNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
+
+    updateExpandIcon : function(){
+        if(this.rendered){
+
+            var n = this.node, c1, c2;
+            var cls = n.isLast() ? "x-tree-elbow-end" : "x-tree-elbow";
+            var hasChild = n.hasChildNodes();
+            if(hasChild || n.attributes.expandable){
+                if(n.expanded){
+                    cls += "-minus";
+                    c1 = "x-tree-node-collapsed";
+                    c2 = "x-tree-node-expanded";
+                }else{
+                    cls += "-plus";
+                    c1 = "x-tree-node-expanded";
+                    c2 = "x-tree-node-collapsed";
+                }
+                if(this.wasLeaf){
+                    this.removeClass("x-tree-node-leaf");
+                    this.wasLeaf = false;
+                }
+                if(this.c1 != c1 || this.c2 != c2){
+                    Ext.fly(this.elNode).replaceClass(c1, c2);
+                    this.c1 = c1; this.c2 = c2;
+                }
+            }else{
+                if(!this.wasLeaf){
+                    Ext.fly(this.elNode).replaceClass("x-tree-node-expanded", "x-tree-node-collapsed");
+                    //                    delete this.c1;
+                    //                    delete this.c2;
+                    this.wasLeaf = false;
+                }
+            }
+            var ecc = "x-tree-ec-icon "+cls;
+            if(this.ecc != ecc){
+                this.ecNode.className = ecc;
+                this.ecc = ecc;
+            }
+        }
+    }
+});
+
+Ext.tree.stTreeNodeProductUI = Ext.extend(Ext.tree.stTreeNodeUI,{
+    renderElements : function(n, a, targetNode, bulkRender){
+        // add some indent caching, this helps performance when rendering a large tree
+        this.indentMarkup = n.parentNode ? n.parentNode.ui.getChildIndent() : '';
+        
+        var root = n.ownerTree.getRootNode();
+        if (!n.isRoot)
+        {
+            var cb = ['<input onchange="var sel=document.getElementById(\'categories_assigned_'+n.id+'\'); var cel =  document.getElementById(\'product_default_category_' + n.id + '\'); cel.disabled = !this.checked; if (!this.checked) {if (sel) sel.value = 0;} else {if (sel) sel.value='+n.id+';}" qtip="Zaznacz aby dodać produkt do kategorii" name="product_in_category[' + n.id + ']" value="' + n.id + '" class="x-tree-node-cb" type="checkbox" ' + (a.in_category ? 'checked="checked" />' : '/>') ,
+            '<input qtip="Zaznacz aby ustawić główną kategorię dla produktu" id="product_default_category_' + n.id + '" name="product_default_category" value="' + n.id + '" type="radio" onmouseup="this.checked = true" ' + (!a.in_category ? 'disabled="disabled"' : '') + (a.default_category ? ' checked="checked" />' : '/>')].join('');
+        }
+        else
+        {
+            var cb = [];
+        }
+        
+        var href = a.href ? a.href : Ext.isGecko ? "" : "#";
+        var buf = ['<li class="x-tree-node"><div ext:tree-node-id="',n.id,'" class="x-tree-node-el x-tree-node-leaf ', a.cls,'">',
+
+        '<span class="x-tree-node-indent">',this.indentMarkup,"</span>",
+        '<img src="', this.emptyIcon, '" class="x-tree-ec-icon x-tree-elbow" />',
+        '<img src="', a.icon || this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on" />',
+        cb,
+        '<a hidefocus="on" class="x-tree-node-anchor" href="',href,'" tabIndex="1" ',
+        a.hrefTarget ? ' target="'+a.hrefTarget+'"' : "", '><span unselectable="on">',n.text,"</span></a>",
+
+        "</div>",
+
+        '<ul class="x-tree-node-ct" style="clear: both;display:none;"></ul>',
+
+        "</li>"].join('');
+
+        var nel;
+        if(bulkRender !== true && n.nextSibling && (nel = n.nextSibling.ui.getEl())){
+            this.wrap = Ext.DomHelper.insertHtml("beforeBegin", nel, buf);
+        }else{
+            this.wrap = Ext.DomHelper.insertHtml("beforeEnd", targetNode, buf);
+        }
+
+        this.elNode = this.wrap.childNodes[0];
+        this.ctNode = this.wrap.childNodes[1];
+        var cs = this.elNode.childNodes;
+        this.indentNode = cs[0];
+        this.ecNode = cs[1];
+        this.iconNode = cs[2];
+       
+        
+        var index = n.isRoot ? 3 : 5;
+
+        this.anchor = cs[index];
+        this.textNode = cs[index].firstChild;
+    },
+
+    onCheckChange : function(){
+
+    }
+
+});
+
+Ext.tree.stTreeNodeFrontendUI = Ext.extend(Ext.tree.stTreeNodeUI,{
+    renderElements : function(n, a, targetNode, bulkRender){
+        // add some indent caching, this helps performance when rendering a large tree
+        this.indentMarkup = n.parentNode ? n.parentNode.ui.getChildIndent() : '';
+
+        var href = a.href ? a.href : Ext.isGecko ? "" : "#";
+        var buf = ['<li class="st_category-tree-element ',n.isLast ? 'st_category-tree-element-last' : '','"><div ext:tree-node-id="',n.id,'" class="x-tree-node-el ',a.cls,'">',
+
+        //'<span class="x-tree-node-indent">',this.indentMarkup,"</span>",
+        '<img src="', this.emptyIcon, '" class="x-tree-ec-icon x-tree-elbow" />',
+        '<a class="x-tree-node-anchor" href="',href,'" tabIndex="1" ',
+        a.hrefTarget ? ' target="'+a.hrefTarget+'"' : "", '><span unselectable="on">',n.text,"</span></a>",
+        '<img src="', this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on" />',
+        "</div>",
+        '<ul class="x-tree-node-ct" style="display:none;"></ul>',
+        "</li>"].join('');
+
+        var nel;
+        if(bulkRender !== true && n.nextSibling && (nel = n.nextSibling.ui.getEl())){
+            this.wrap = Ext.DomHelper.insertHtml("beforeBegin", nel, buf);
+        }else{
+            this.wrap = Ext.DomHelper.insertHtml("beforeEnd", targetNode, buf);
+        }
+
+        this.elNode = this.wrap.childNodes[0];
+        this.ctNode = this.wrap.childNodes[1];
+        var cs = this.elNode.childNodes;
+        // this.indentNode = cs[0];
+        this.ecNode = cs[0];
+        this.iconNode = cs[2];
+       
+        
+        var index = 1;
+
+        this.anchor = cs[index];
+        this.textNode = cs[index].firstChild;
+    },
+
+    onCheckChange : function(){
+
+    }
+
+});