/*global jQuery */
(function($) {
    
    function editTitle(model) {
        model.getContent().find("span.view-title").hide();
        var editor = model.getContent().find(".view-title-editor");
        editor.find("select.title-property").val(model.config.title || "");
        var link = editor.find("select.title-property-link");
        link.val(model.config.titleLink || "");
        editor.show();
        if (link.find("option").size() > 1 && model.config.title) {
            link.parent("span").show();
        } else {
            link.parent("span").hide();
        }
    }

    function viewTitle(model, record) {
        if (!record) {
            var record_num = model.getContent().data("record_num");
            if (!record_num) {
                record_num = 0;
            }            
            record = getDatabaseRecord(record_num);
        }
        var title = '';
        var titleLink = '';
        if (model.config.title) {
            title = record[model.config.title];
            if (model.config.titleLink) {
                titleLink = record[model.config.titleLink];
            }
        }
        model.getContent().find(".view-title-editor").hide().end()
            .find("span.view-title .title-value").empty().append(titleHTML(title, titleLink)).end()
            .find("span.view-title").show();

    }

    function titleHTML(title, titleLink) {
        var html = "<span>" + title + "</span>";
        if (titleLink) {
            html += "&nbsp;<a href='" + titleLink + "' target='_blank'>(link)</a>";
        }
        return html;
    }


    function getDatabaseRecord(record_num) {
        var database = $.exhibit.database;
        var recordIds = database.getAllItems();
        var id = recordIds.toArray()[record_num];
        return database.getItem(id);
    }

    $.fn.recordTitle =  function(method) {        
        if (!method || method === "create") {
            return this.each(function() {
                model= $(this).data("model");
                if (model) {
                    root = model.getContent();
                    var title = root.find(".view-title-editor .title-property");
                    var titleLink = root.find(".view-title-editor  .title-property-link");                
                    // Set up the editable drop down data
                    var showLink = false;                

                    $.each($.freemix.property.getPropertiesWithType("text"),function() {
                         title.append("<option value='" + this.name() + "'>" + this.label() + "</option>");
                    });
                    $.each($.freemix.property.getPropertiesWithType("url"),function() {
                        titleLink.append("<option value='" + this.name() + "'>" + this.label() + "</option>");
                        showLink = true;
                    });
                
                    $("select.title-property", root).change(function() {
                        if ($(this).val() !== '' && showLink) {
                            titleLink.parent("span").show();
                        } else {
                            titleLink.parent("span").hide();
                        }
                    });
                
                    root.find(".view-title-editor .ok-button").freemixButton(function() {
                        model.config.title = root.find("select.title-property").val();
                        model.config.titleLink = root.find("select.title-property-link").val();
                        viewTitle(model);
                    });

                    root.find(".view-title-editor .cancel-button").freemixButton(function() {
                        viewTitle(model);
                    });
                
                    if (title.val() && title.val() !== '' && showLink) {
                        titleLink.parent("span").show();
                    }

                    root.find(".view-title a.title-edit-link").click(function() {
                        editTitle(model);
                        return false;
                    });
                    
                    root.bind("display-record", function(e, record, value) {
                        viewTitle(model, record);
                    });
                                 
                    viewTitle(model);
                }
                
            });
            

            
        } 
    };
    
    $.freemix.prototypes.generateTitleExhibitHtml = function() {
        var title = $("<div class='exhibit-title ui-widget-header'></div>");
        var props = $.freemix.property.enabledProperties();
        if (this.config.title) {
            var html = "<span ex:content='" + props[this.config.title].expression() + "' ></span>";
            if (this.config.titleLink) {
                html += "&nbsp;<a ex:href-content='" + props[this.config.titleLink].expression() + "' target='_blank'>(link)</a>";
            }
            title.append(html);
        }
        return title;
    };
    
})(jQuery);