Commit 92740647 authored by Rene Saarsoo's avatar Rene Saarsoo
Browse files

Refactor accessors hiding. 

Instead of two boolean settings, now saving one Object setting containing
two keys.

Hiding of accessors now also works in dropdown menus.

And the code is shorter & cleaner.
parent 6a9562c2

template/app/Settings.js

+6 −1
Original line number Diff line number Diff line
@@ -6,6 +6,11 @@ Ext.define("Docs.Settings", { 
    storeName: 'Settings',

    singleton: true,



    // Default values for settings for which undefined doesn't suite.

    defaults: {

        hide: {}

    },



    /**

     * Saves a setting

     *
@@ -34,6 +39,6 @@ Ext.define("Docs.Settings", { 
     */

    get: function(key) {

        var index = this.store.findExact("key", key);

        return index > -1 ? this.store.getAt(index).get("value") : undefined;

        return index > -1 ? this.store.getAt(index).get("value") : this.defaults[key];

    }

});

template/app/view/cls/Overview.js

+25 −28
Original line number Diff line number Diff line
@@ -57,6 +57,7 @@ Ext.define('Docs.view.cls.Overview', { 
     */

    load: function(docClass) {

        this.docClass = docClass;

        this.accessors = this.buildAccessorsMap();



        if (this.toolbar) {

            // Workaround for bug in ExtJS.
@@ -68,15 +69,10 @@ Ext.define('Docs.view.cls.Overview', { 
        }

        this.toolbar = Ext.create('Docs.view.cls.Toolbar', {

            docClass: this.docClass,

            accessors: this.accessors,

            listeners: {

                hideInherited: function(hideInherited) {

                    this.filterMembers(this.toolbar.getFilterValue(), hideInherited, Docs.Settings.get("hideAccessors"));

                },

                hideAccessors: function(hideAccessors) {

                    this.filterMembers(this.toolbar.getFilterValue(), Docs.Settings.get("hideInherited"), hideAccessors);

                },

                filter: function(search) {

                    this.filterMembers(search, Docs.Settings.get("hideInherited"), Docs.Settings.get("hideAccessors"));

                filter: function(search, hide) {

                    this.filterMembers(search, hide);

                },

                scope: this

            }
@@ -87,8 +83,9 @@ Ext.define('Docs.view.cls.Overview', { 


        Docs.Syntax.highlight(this.getEl());



        if (Docs.Settings.get("hideInherited") || Docs.Settings.get("hideAccessors")) {

            this.filterMembers("", Docs.Settings.get("hideInherited"), Docs.Settings.get("hideAccessors"));

        var hide = Docs.Settings.get("hide");

        if (hide.inherited || hide.accessors) {

            this.filterMembers("", hide);

        }



        this.fireEvent('afterload');
@@ -97,13 +94,13 @@ Ext.define('Docs.view.cls.Overview', { 
    /**

     * Filters members by search string and inheritance.

     * @param {String} search

     * @param {Boolean} hideInherited

     * @param {Boolean} hideAccessors

     * @param {Object} hide

     * @param {Boolean} hide.inherited

     * @param {Boolean} hide.accessors

     * @private

     */

    filterMembers: function(search, hideInherited, hideAccessors) {

        Docs.Settings.set("hideInherited", hideInherited);

        Docs.Settings.set("hideAccessors", hideAccessors);

    filterMembers: function(search, hide) {

        Docs.Settings.set("hide", hide);

        var isSearch = search.length > 0;



        // Hide the class documentation when filtering
@@ -115,25 +112,15 @@ Ext.define('Docs.view.cls.Overview', { 
        // and hide inherited members if hideInherited=true

        // and hide accessor methods when hideAccessors=true

        var re = new RegExp(Ext.String.escapeRegex(search), "i");

        if (hideAccessors) {

            // build map of all possible accessor method names

            var accessors = {};

            Ext.Array.forEach(this.docClass.members.cfg, function(m) {

                var capName = Ext.String.capitalize(m.name);

                accessors["get"+capName] = true;

                accessors["set"+capName] = true;

            });

        }

        this.eachMember(function(m) {

            var el = Ext.get(m.id);

            var byInheritance = !hideInherited || (m.owner === this.docClass.name);

            var byAccessor = !hideAccessors || m.tagname !== 'method' || !accessors.hasOwnProperty(m.name);

            var byInheritance = !hide.inherited || (m.owner === this.docClass.name);

            var byAccessor = !hide.accessors || m.tagname !== 'method' || !this.accessors.hasOwnProperty(m.name);

            var byFilter = !isSearch || re.test(m.name);

            if (byInheritance && byFilter && byAccessor) {

                el.setStyle({display: 'block'});

            }

            else {

                console.log(m.name);

                el.setStyle({display: 'none'});

            }

        }, this);
@@ -164,7 +151,17 @@ Ext.define('Docs.view.cls.Overview', { 
            }, this);

        }, this);



        this.toolbar.hideInherited(hideInherited);

        this.toolbar.hideMenuItems(hide);

    },



    buildAccessorsMap: function(name) {

        var accessors = {};

        Ext.Array.forEach(this.docClass.members.cfg, function(m) {

            var capName = Ext.String.capitalize(m.name);

            accessors["get"+capName] = true;

            accessors["set"+capName] = true;

        });

        return accessors;

    },



    getVisibleElements: function(selector, root) {

template/app/view/cls/Toolbar.js

+44 −45
Original line number Diff line number Diff line
@@ -20,24 +20,21 @@ Ext.define('Docs.view.cls.Toolbar', { 
     */

    docClass: {},



    initComponent: function() {

        this.addEvents(

    /**

             * @event hideInherited

             * Fires when hideInherited checkbox toggled.

             * @param {Boolean} hide  True when inherited items should get hidden.

     * @cfg {Object} accessors

     * Accessors map from Overview component.

     */

            "hideInherited",

            /**

             * @event hideAccessors

             * Fires when hideAccessors checkbox toggled.

             * @param {Boolean} hide  True when accessor methods should get hidden.

             */

            "hideAccessors",

    accessors: {},



    initComponent: function() {

        this.addEvents(

            /**

             * @event filter

             * Fires when text typed to filter.

             * Fires when text typed to filter, or one of the hide-checkboxes clicked.

             * @param {String} search  The search text.

             * @param {Object} hide  Flags which members to hide:

             * @param {Boolean} hide.inherited  True when inherited items should get hidden.

             * @param {Boolean} hide.accessors  True when accessor methods should get hidden.

             */

            "filter",

            /**
@@ -90,13 +87,13 @@ Ext.define('Docs.view.cls.Toolbar', { 
                enableKeyEvents: true,

                listeners: {

                    keyup: function(cmp) {

                        this.fireEvent("filter", cmp.getValue());

                        this.fireEvent("filter", cmp.getValue(), this.getHideFlags());

                        cmp.setHideTrigger(cmp.getValue().length === 0);

                    },

                    specialkey: function(cmp, event) {

                        if (event.keyCode === Ext.EventObject.ESC) {

                            cmp.reset();

                            this.fireEvent("filter", "");

                            this.fireEvent("filter", "", this.getHideFlags());

                        }

                    },

                    scope: this
@@ -104,35 +101,13 @@ Ext.define('Docs.view.cls.Toolbar', { 
                onTriggerClick: function() {

                    this.reset();

                    this.focus();

                    self.fireEvent('filter', '');

                    self.fireEvent('filter', '', this.getHideFlags());

                    this.setHideTrigger(true);

                }

            }),

            { xtype: 'tbfill' },

            {

                boxLabel: 'Hide inherited',

                boxLabelAlign: 'before',

                xtype: 'checkbox',

                margin: '0 5 0 0',

                padding: '0 0 5 0',

                checked: Docs.Settings.get("hideInherited"),

                handler: function(el) {

                    this.fireEvent("hideInherited", el.checked);

                },

                scope: this

            },

            {

                boxLabel: 'Hide accessors',

                boxLabelAlign: 'before',

                xtype: 'checkbox',

                margin: '0 5 0 0',

                padding: '0 0 5 0',

                checked: Docs.Settings.get("hideAccessors"),

                handler: function(el) {

                    this.fireEvent("hideAccessors", el.checked);

                },

                scope: this

            },

            this.hideInherited = this.createCheckbox("Hide inherited", "inherited"),

            this.hideAccessors = this.createCheckbox("Hide accessors", "accessors"),

            {

                xtype: 'button',

                iconCls: 'expand-all-members',
@@ -150,6 +125,27 @@ Ext.define('Docs.view.cls.Toolbar', { 
        this.callParent(arguments);

    },



    getHideFlags: function() {

        return {

            inherited: this.hideInherited.getValue(),

            accessors: this.hideAccessors.getValue()

        };

    },



    createCheckbox: function(title, type) {

        return Ext.widget('checkbox', {

            boxLabel: title,

            boxLabelAlign: 'before',

            margin: '0 5 0 0',

            padding: '0 0 5 0',

            checked: Docs.Settings.get("hide")[type],

            handler: function(el) {

                this.fireEvent("filter", this.filterField.getValue(), this.getHideFlags());

            },

            scope: this

        });

    },



    createMemberButton: function(cfg) {

        var data = Ext.Array.map(cfg.members, function(m) {

            return this.createLinkRecord(this.docClass.name, m);
@@ -185,7 +181,7 @@ Ext.define('Docs.view.cls.Toolbar', { 
    // creates store tha holds link records

    createStore: function(records) {

        var store = Ext.create('Ext.data.Store', {

            fields: ['id', 'cls', 'url', 'label', 'inherited', 'meta']

            fields: ['id', 'cls', 'url', 'label', 'inherited', 'accessor', 'meta']

        });

        store.add(records);

        return store;
@@ -198,20 +194,23 @@ Ext.define('Docs.view.cls.Toolbar', { 
            url: member ? (cls + "-" + member.id) : cls,

            label: member ? ((member.tagname === "method" && member.name === "constructor") ? "new "+cls : member.name) : cls,

            inherited: member ? member.owner !== cls : false,

            accessor: member ? member.tagname === "method" && this.accessors.hasOwnProperty(member.name) : false,

            meta: member ? member.meta : {}

        };

    },



    /**

     * Hides or unhides inherited members in dropdown menus.

     * @param {Boolean} hide

     * @param {Object} hide

     */

    hideInherited: function(hide) {

    hideMenuItems: function(hide) {

        Ext.Array.forEach(['cfg', 'property', 'method', 'event'], function(type) {

            if (this.memberButtons[type]) {

                var store = this.memberButtons[type].getStore();

                if (hide) {

                    store.filterBy(function(m) { return !m.get("inherited"); });

                if (hide.inherited || hide.accessors) {

                    store.filterBy(function(m) {

                        return !(hide.inherited && m.get("inherited") || hide.accessors && m.get("accessor"));

                    });

                }

                else {

                    store.clearFilter();