SpontaneousCMS/spontaneous

View on GitHub
application/js/page_browser.js

Summary

Maintainability
C
1 day
Test Coverage
// console.log("Loading PageBrowser...");


Spontaneous.PageBrowser = (function($, S) {
    var dom = S.Dom
, flattenPageList = function(pageList) {
        var pages = []
        , comparator = function(a, b) {
            var at = a.title, bt = b.title;
            if (at > bt) { return 1; }
            if (at < bt) { return -1; }
            return 0;
        };
        $.each(pageList, function(key, list) { pages = pages.concat(list); });
        pages.sort(comparator);
        return pages;
    };
    var PageBrowser = new JS.Class(Spontaneous.PopoverView, {
        initialize: function(origin) {
            origin = String(origin || '');
            if (/^\//.test(origin)) {
                this.origin = origin || '/';
                this.selected = this.origin;
            } else {
                this.selected = false;
                this.origin = '/';
            }
            this.page_list = this.origin_list();
            this.ancestor_list = this.origin_ancestors();

        },
        origin_list: function() {
            return function(location) {
                return flattenPageList(location.generation);
            };
        },
        children_list: function() {
            return function(location) {
                return flattenPageList(location.children);
            };
        },
        origin_ancestors: function() {
            return function(location) {
                return location.ancestors;
            };
        },
        children_ancestors: function() {
            return function(location) {
                return location.ancestors.concat(location);
            };
        },
        get_page_list: function() {
            var path;
            if (typeof this.origin === 'string') {
                path = '/map/path' + this.origin;
            } else {
                path = '/map/' + this.origin.id;
            }
            S.Location.retrieve(path, this.page_list_loaded.bind(this));
        },
        view: function() {
            var wrapper = dom.div('.page-browser'), table = dom.div('.page-list');
            ancestors = dom.div('.page-ancestors');
            wrapper.append(ancestors).append(table);
            this.wrapper = wrapper;
            this.table = table;
            this.ancestors = ancestors;
            this.get_page_list();
            return wrapper;
        },
        page_list_loaded: function(page_list, xhr) {
            this.table.empty();
            this.location = page_list;
            this.manager.page_list_loaded(this);
            var g = this.page_list(this.location), table = this.table;
            for (var i = 0, ii = g.length; i < ii; i++) {
                var page = g[i];
                table.append(this.get_entry(page));
            }

            this.ancestors.empty();
            var _browser = this, list = dom.ul(), ancestors = this.ancestor_list(this.location);

            this.depth = ancestors.length;
            var click = function(p) {
                return function(event) {
                    _browser.ancestor_selected(p);
                    return false;
                };
            };

            for (i = 0, ii = ancestors.length; i < ii; i++) {
                var a = ancestors[i], li = dom.li().append(dom.a().text(a.title)).append(dom.span().text('/')).click(click(a));
                list.append(li);
            }
            if (ancestors.length === 0) {
                list.append(dom.li().append(dom.a().text('Choose a page...')));
            }
            this.ancestors.append(list);
        },
        get_entry: function(page) {
            var _browser = this, selected = function(p) {
                return function() {
                    _browser.page_selected(p);
                    $(this).addClass('active');
                };
            };
            var next_click = function() {
                _browser.next_level(page);
                return false;
            };

            var row = dom.div('.page').click(selected(page)), title = dom.a().text(page.title);
            if (page.children > 0) {
                var next = dom.span();
                next.click(next_click);
                row.append(next);
            }
            row.append(title);
            if (this.selected && (page.path === this.selected)) {
                row.addClass('active');
            }
            return row;
        },
        ancestor_selected: function(page) {
            this.page_list = this.origin_list();
            this.ancestor_list = this.origin_ancestors();
            this.origin = page;
            this.get_page_list();
        },
        next_level: function(page) {
            this.page_list = this.children_list();
            this.ancestor_list = this.children_ancestors();
            this.origin = page;
            this.get_page_list();
            // this.manager.next_level(page);
        },
        page_selected: function(page) {
            var table = this.table;
            $('.page', table).removeClass('active');
            this.selected = page.path;
            this.manager.page_selected(page);
        },
        title: function() {
            return 'Choose Page';
        },
        width: function() {
            return 400;
        }
        // position_from_event: function(event) {
        //     return {top: event.clientX, left: event.clientY};
        // },
    });
    return PageBrowser;
})(jQuery, Spontaneous);