/*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 *  http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied.  See the License for the
 * specific language governing permissions and limitations
 * under the License.
*/
define([
    "underscore", "jquery", "backbone", "brooklyn",
    "view/location-wizard",
    "model/location", "model/entity",
    "text!tpl/catalog/page.html",
    "text!tpl/catalog/details-entity.html",
    "text!tpl/catalog/details-generic.html",
    "text!tpl/catalog/details-location.html",
    "text!tpl/catalog/add-catalog-entry.html",
    "text!tpl/catalog/add-yaml.html",
    "text!tpl/catalog/add-location.html",
    "text!tpl/catalog/nav-entry.html",

    "bootstrap", "jquery-form"
], function(_, $, Backbone, Brooklyn,
        LocationWizard,
        Location, Entity,
        CatalogPageHtml, DetailsEntityHtml, DetailsGenericHtml, LocationDetailsHtml,
        AddCatalogEntryHtml, AddYamlHtml, AddLocationHtml, EntryHtml) {

    // Holds the currently active details type, e.g. applications, policies. Bit of a workaround
    // to share the active view with all instances of AccordionItemView, so clicking the 'reload
    // catalog' button (handled by the parent of the AIVs) does not apply the 'active' class to
    // more than one element.
    var activeDetailsView;

    var CatalogItemDetailsView = Backbone.View.extend({

        events: {
            "click .composer": "composeItem",
            "click .delete": "deleteItem"
        },

        initialize: function() {
            _.bindAll(this);
            this.options.template = _.template(this.options.template || DetailsGenericHtml);
        },

        render: function() {
            if (!this.options.model) {
                return this.renderEmpty();
            } else {
                return this.renderDetails();
            }
        },

        renderEmpty: function(extraMessage) {
            this.$el.html("<div class='catalog-details'>" +
                "<h3>Select an entry on the left</h3>" +
                _.escape(extraMessage ? extraMessage : "") +
                "</div>");
            return this;
        },

        renderDetails: function() {
            var that = this,
                model = this.options.model,
                template = this.options.template;
            var show = function() {
                // Keep the previously open section open between items. Duplication between
                // here and setDetailsView, below. This case handles view refreshes from this
                // view directly (e.g. when indicating an error), below handles keeping the
                // right thing open when navigating from view to view.
                var open = this.$(".in").attr("id");
                var newHtml = $(template({model: model, viewName: that.options.name}));
                $(newHtml).find("#"+open).addClass("in");
                that.$el.html(newHtml);
                // rewire events. previous callbacks are removed automatically.
                that.delegateEvents()
            };

            this.activeModel = model;
            // Load the view with currently available data and refresh once the load is complete.
            // Only refreshes the view if the model changes and the user hasn't selected another
            // item while the load was executing.
            show();
            model.on("change", function() {
                if (that.activeModel.cid === model.cid) {
                    show();
                }
            });
            model.fetch()
                .fail(function(xhr, textStatus, errorThrown) {
                    console.log("error loading", model.id, ":", errorThrown);
                    if (that.activeModel.cid === model.cid) {
                        model.error = true;
                        show();
                    }
                })
                // Runs after the change event fires, or after the xhr completes
                .always(function () {
                    model.off("change");
                });
            return this;
        },

        composeItem: function(event) {
            // TODO we should store `catalogYaml` in the catalog so these can be edited
            // for now locations are edited, but other items are deployed (ugly and inconsistent)
            if (this.options.name == "locations") {
              // old ui has planYaml inside a catalog block
              this.composerEditItem(event, this.options.model.get("catalog"));
            } else {
              // deploy the item
              this.composerDeployItem(event);
            }
        },
        composerDeployItem: function(event) {
            console.log("composer deploy", event.currentTarget);
            Backbone.history.navigate("/v1/editor/app/"+ encodeURIComponent($(event.currentTarget).data("name")),
                {trigger: true});
        },        
        composerEditItem: function(event, catalog) {
            // TODO ideally we get a catalogYaml from the object instead of recreating
            var planYaml = catalog.planYaml;
            
            // remove a brooklyn.locations: - ... prefix which brooklyn may insert for legacy reasons,
            // replace with single blank line
            if (planYaml.trim().startsWith("brooklyn.locations:")) {
              planYaml = planYaml.replace(/^ *brooklyn.locations:( *\n)+/, "")
              planYaml = "\n"+planYaml.replace(/^( *)(-)( *)/, "$1 $3")
            }
            var yaml = "brooklyn.catalog:\n"+
              "  items:\n"+
              "  - id: " + catalog.symbolicName + "\n"+
              "    # NB: the version may need to be increased\n"+
              "    version: " + catalog.version + "\n"+
              (catalog.description ? "    description: " + catalog.description + "\n" : "") +
              (catalog.iconUrl ? "    iconUrl: " + catalog.iconUrl + "\n" : "") +
              // any other fields?  
              "    itemType: location\n"+
              "    item:\n"+
              this.prefixAllLines("      ", planYaml);
            Backbone.history.navigate("/v1/editor/catalog/_/"+ encodeURIComponent(yaml), 
                {trigger: true});
        },
        prefixAllLines: function(prefix, lines) {
            return prefix+lines.split("\n").join("\n"+prefix);
            Backbone.history.navigate("/v1/editor/app/"+ encodeURIComponent($(event.currentTarget).data("name")),
                {trigger: true});
        },
        
        deleteItem: function(event) {
            // Could use wait flag to block removal of model from collection
            // until server confirms deletion and success handler to perform
            // removal. Useful if delete fails for e.g. lack of entitlement.
            var that = this;
            var displayName = $(event.currentTarget).data("name") || "item";
            this.activeModel.destroy({
                success: function() {
                    that.renderEmpty("Deleted " + displayName);
                },
                error: function(info) {
                    that.renderEmpty("Unable to permanently delete " + displayName+". Deletion is temporary, client-side only.");
                }
            });
        }
    });

    var AddCatalogEntryView = Backbone.View.extend({
        template: _.template(AddCatalogEntryHtml),
        events: {
            "click .show-context": "showContext"
        },
        initialize: function() {
            _.bindAll(this);
        },
        render: function (initialView) {
            this.$el.html(this.template());
            if (initialView) {
                if (initialView == "entity") initialView = "yaml";
                
                this.$("[data-context='"+_.escape(initialView)+"']").addClass("active");
                this.showFormForType(initialView)
            }
            return this;
        },
        clearWithHtml: function(template) {
            if (this.contextView) this.contextView.close();
            this.context = undefined;
            this.$(".btn").removeClass("active");
            this.$("#catalog-add-form").html(template);
        },
        beforeClose: function () {
            if (this.contextView) this.contextView.close();
        },
        showContext: function(event) {
            var $event = $(event.currentTarget);
            var context = $event.data("context");
            if (this.context !== context) {
                if (this.contextView) {
                    this.contextView.close();
                }
                this.showFormForType(context)
            }
        },
        showFormForType: function (type) {
            this.context = type;
            if (type == "location") {
                this.contextView = newLocationForm(this, this.options.parent);
                Backbone.history.navigate("/v1/catalog/new/" + encodeURIComponent(type));
                this.$("#catalog-add-form").html(this.contextView.$el);
            }else{
                // go to composer
                Backbone.history.navigate('/v1/editor/catalog/', {trigger: true});
            }
        }
    });

    // Could adapt to edit existing locations too.
    function newLocationForm(addView, addViewParent) {
        return new LocationWizard({
            onLocationCreated: function(wizard, data) {
                addViewParent.loadAccordionItem("locations", data.id, true);
            },
            onFinish: function(wizard, data) {
                addViewParent.loadAccordionItem("locations", data.id);
                addView.clearWithHtml( "Added: "+_.escape(data.id)+". Loading..." );
            }
        }).render();
    }

    var Catalog = Backbone.Collection.extend({
        modelX: Backbone.Model.extend({
          url: function() {
            return "/v1/catalog/" + encodeURIComponent(this.name) + "/" + encodeURIComponent(this.id) + "?allVersions=true";
          }
        }),
        initialize: function(models, options) {
            this.name = options["name"];
            if (!this.name) {
                throw new Error("Catalog collection must know its name");
            }
            //this.model is a constructor so it shouldn't be _.bind'ed to this
            //It actually works when a browser provided .bind is used, but the
            //fallback implementation doesn't support it.
            var that = this; 
            var model = this.model.extend({
              url: function() {
                return "/v1/catalog/" + encodeURIComponent(that.name) + "/" + encodeURIComponent(this.id).split(encodeURIComponent(":")).join("/");
              }
            });
            _.bindAll(this);
            this.model = model;
        },
        url: function() {
            return "/v1/catalog/" + encodeURIComponent(this.name) + "?allVersions=true";
        }
    });

    /** Use to fill single accordion view list. */
    var AccordionItemView = Backbone.View.extend({
        tag: "div",
        className: "accordion-item",
        events: {
            'click .accordion-head': 'toggle',
            'click .accordion-nav-row': 'showDetails'
        },
        bodyTemplate: _.template(
            "<div class='accordion-head capitalized'><%- name %></div>" +
            "<div class='accordion-body' style='display: <%- display %>'></div>"),

        initialize: function() {
            _.bindAll(this);
            this.name = this.options.name;
            if (!this.name) {
                throw new Error("Name should have been given for accordion entry");
            } else if (!this.options.onItemSelected) {
                throw new Error("onItemSelected(model, element) callback should have been given for accordion entry");
            }

            // Generic templates
            this.template = _.template(this.options.template || EntryHtml);

            // Returns template applied to function arguments. Alter if collection altered.
            // Will be run in the context of the AccordionItemView.
            this.entryTemplateArgs = this.options.entryTemplateArgs || function(model, index) {
                return {type: model.getVersionedAttr("type"), id: model.get("id")};
            };

            // undefined argument is used for existing model items
            var collectionModel = this.options.model || Backbone.Model;
            this.collection = this.options.collection || new Catalog(undefined, {
                name: this.name,
                model: collectionModel
            });
            // Refreshes entries list when the collection is synced with the server or
            // any of its members are destroyed.
            this.collection
                .on("sync", this.renderEntries)
                .on("destroy", this.renderEntries);
            this.refresh();
        },

        beforeClose: function() {
            this.collection.off();
        },

        render: function() {
            this.$el.html(this.bodyTemplate({
                name: this.name,
                display: this.options.autoOpen ? "block" : "none"
            }));
            this.renderEntries();
            return this;
        },

        singleItemTemplater: function(isChild, model, index) {
            var args = _.extend({
                    cid: model.cid,
                    isChild: isChild,
                    extraClasses: (activeDetailsView == this.name && model.cid == this.activeCid) ? "active" : ""
                }, this.entryTemplateArgs(model));
            return this.template(args);
        },

        renderEntries: function() {
            var elements = this.collection.map(_.partial(this.singleItemTemplater, false), this);
            this.updateContent(elements.join(''));
        },

        updateContent: function(markup) {
            this.$(".accordion-body")
                .empty()
                .append(markup);
        },

        refresh: function() {
            this.collection.fetch();
        },

        showDetails: function(event) {
            var $event = $(event.currentTarget);
            var cid = $event.data("cid");
            if (activeDetailsView !== this.name || this.activeCid !== cid) {
                activeDetailsView = this.name;
                this.activeCid = cid;
                var model = this.collection.get(cid);
                Backbone.history.navigate("v1/catalog/" + encodeURIComponent(this.name) + "/" + encodeURIComponent(model.id));
                this.options.onItemSelected(activeDetailsView, model, $event);
            }
        },

        toggle: function() {
            var body = this.$(".accordion-body");
            var hidden = this.hidden = body.css("display") == "none";
            if (hidden) {
                body.removeClass("hide").slideDown('fast');
            } else {
                body.slideUp('fast')
            }
        },

        show: function() {
            var body = this.$(".accordion-body");
            var hidden = this.hidden = body.css("display") == "none";
            if (hidden) {
                body.removeClass("hide").slideDown('fast');
            }
        }
    });
    
    var AccordionEntityView = AccordionItemView.extend({
        renderEntries: function() {
            var symbolicNameFn = function(model) {return model.get("symbolicName")};
            var groups = this.collection.groupBy(symbolicNameFn);
            var orderedIds = _.uniq(this.collection.map(symbolicNameFn));

            function getLatestStableVersion(items) {
                //the server sorts items by descending version, snapshots at the back
                return items[0];
            }

            var catalogTree = _.map(orderedIds, function(symbolicName) {
                var group = groups[symbolicName];
                var root = getLatestStableVersion(group);
                var children = _.reject(group, function(model) {return root.id == model.id;});
                return {root: root, children: children};
            });

            var templater = function(memo, item, index) {
                memo.push(this.singleItemTemplater(false, item.root));
                return memo.concat(_.map(item.children, _.partial(this.singleItemTemplater, true), this));
            };

            var elements = _.reduce(catalogTree, templater, [], this);
            this.updateContent(elements.join(''));
        }
    });

    // Controls whole page. Parent of accordion items and details view.
    var CatalogResourceView = Backbone.View.extend({
        tagName:"div",
        className:"container container-fluid",
        entryTemplate:_.template(EntryHtml),

        events: {
            'click .refresh':'refresh',
            'click #add-new-thing': 'createNewThing'
        },

        initialize: function() {
            $(".nav1").removeClass("active");
            $(".nav1_catalog").addClass("active");
            // Important that bind happens before accordion object is created. If it happens after
            // `this' will not be set correctly for the onItemSelected callbacks.
            _.bindAll(this);
            this.accordion = this.options.accordion || {
                "applications": new AccordionEntityView({
                    name: "applications",
                    singular: "application",
                    onItemSelected: _.partial(this.showCatalogItem, DetailsEntityHtml),
                    model: Entity.Model,
                    autoOpen: !this.options.kind || this.options.kind == "applications"
                }),
                "entities": new AccordionEntityView({
                    name: "entities",
                    singular: "entity",
                    onItemSelected: _.partial(this.showCatalogItem, DetailsEntityHtml),
                    model: Entity.Model,
                    autoOpen: this.options.kind == "entities"
                }),
                "policies": new AccordionEntityView({
                    // TODO needs parsing, and probably its own model
                    // but cribbing "entity" works for now 
                    // (and not setting a model can cause errors intermittently)
                    onItemSelected: _.partial(this.showCatalogItem, DetailsEntityHtml),
                    name: "policies",
                    singular: "policy",
                    model: Entity.Model,
                    autoOpen: this.options.kind == "policies"
                }),
                "enrichers": new AccordionEntityView({
                    // TODO needs parsing, and probably its own model
                    // but cribbing "entity" works for now
                    // (and not setting a model can cause errors intermittently)
                    onItemSelected: _.partial(this.showCatalogItem, DetailsEntityHtml),
                    name: "enrichers",
                    singular: "enricher",
                    model: Entity.Model,
                    autoOpen: this.options.kind == "enrichers"
                }),
                "locations": new AccordionItemView({
                    name: "locations",
                    singular: "location",
                    onItemSelected: _.partial(this.showCatalogItem, LocationDetailsHtml),
                    collection: this.options.locations,
                    autoOpen: this.options.kind == "locations",
                    entryTemplateArgs: function (location, index) {
                        return {
                            type: location.getIdentifierName(),
                            id: location.getLinkByName("self")
                        };
                    }
                })
            };
        },

        beforeClose: function() {
            _.invoke(this.accordion, 'close');
        },

        render: function() {
            this.$el.html(_.template(CatalogPageHtml, {}));
            var parent = this.$(".catalog-accordion-parent");
            _.each(this.accordion, function(child) {
                parent.append(child.render().$el);
            });
            if (this.options.kind === "new") {
                this.createNewThing(this.options.id);
            } else if (this.options.kind && this.options.id) {
                this.loadAccordionItem(this.options.kind, this.options.id)
            } else {
                // Show empty details view to start
                this.setDetailsView(new CatalogItemDetailsView().render());
            }
            return this
        },

        /** Refreshes the contents of each accordion pane */
        refresh: function() {
            _.invoke(this.accordion, 'refresh');
        },

        createNewThing: function (type) {
            // Discard if it's the jquery event object.
            if (!_.isString(type)) {
                type = undefined;
            }
            var viewName = "createNewThing";
            if (!type) {
                Backbone.history.navigate("/v1/catalog/new");
            }
            activeDetailsView = viewName;
            this.$(".accordion-nav-row").removeClass("active");
            var newView = new AddCatalogEntryView({
                parent: this
            }).render(type);
            this.setDetailsView(newView);
        },

        loadAnyAccordionItem: function (id) {
            this.loadAccordionItem("entities", id);
            this.loadAccordionItem("applications", id);
            this.loadAccordionItem("policies", id);
            this.loadAccordionItem("enrichers", id);
            this.loadAccordionItem("locations", id);
        },

        loadAccordionItem: function (kind, id, noRedirect) {
            if (!this.accordion[kind]) {
                console.error("No accordion for: " + kind);
            } else {
                var accordion = this.accordion[kind];
                var self = this;
                // reset is needed because we rely on server's ordering;
                // without it, server additions are placed at end of list
                accordion.collection.fetch({reset: true})
                    .then(function() {
                        var model = accordion.collection.get(id);
                        if (!model) {
                            // if a version is supplied, try it without a version - needed for locations, navigating after deletion
                            if (id && id.split(":").length>1) {
                                model = accordion.collection.get( id.split(":")[0] );
                            }
                        }
                        if (!model) {
                            // if an ID is supplied without a version, look for first matching version (should be newest)
                            if (id && id.split(":").length==1 && accordion.collection.models) {
                                model = _.find(accordion.collection.models, function(m) { 
                                    return m && m.id && m.id.startsWith(id+":");
                                });
                            }
                        }
                        // TODO could look in collection for any starting with ID
                        if (model && !noRedirect) {
                            Backbone.history.navigate("/v1/catalog/" + encodeURIComponent(kind) + "/" + encodeURIComponent(id));
                            activeDetailsView = kind;
                            accordion.activeCid = model.cid;
                            accordion.options.onItemSelected(kind, model);
                            accordion.show();
                        } else {
                            // catalog item not found, or not found yet (it might be reloaded and another callback will try again)
                        }
                    });
            }
        },

        showCatalogItem: function(template, viewName, model, $target) {
            this.$(".accordion-nav-row").removeClass("active");
            if ($target) {
                $target.addClass("active");
            } else {
                this.$("[data-cid='" + _.escape(model.cid) + "']").addClass("active");
            }
            var newView = new CatalogItemDetailsView({
                model: model,
                template: template,
                name: viewName
            }).render();
            this.setDetailsView(newView)
        },

        setDetailsView: function(view) {
            this.$("#details").html(view.el);
            if (this.detailsView) {
                // Try to re-open sections that were previously visible.
                var openedItem = this.detailsView.$(".in").attr("id");
                if (openedItem) {
                    view.$("#" + openedItem).addClass("in");
                }
                this.detailsView.close();
            }
            this.detailsView = view;
        }
    });
    
    return CatalogResourceView
});