﻿(function ($) {

    $.fn.objectList = function (options) {

        if (this.length > 1) {
            this.each(function () {
                $(this).objectList(options)
            });
            return this;
        }

        // Fields
        var $this = $(this);
        var opts = $.extend({}, $.fn.objectList.defaults, options);
        var datasource = new bedrock.collections.list();
        var instance = new objectList($this);

        // Public methods   
        $this.intialize = function () {

            saltsjobaden.dataFactory.bind("datacreated", function (event, data, context) {

                if (context !== $this.dataContext && data.type == "objectList") {

                    if (data === null) {
                        bind();
                    }
                }
            });

            bind();
            return this;

        };


        $this.clear = function () {
            datasource.clear();
            bind();
        };


        $this.getDatasource = function () {
            return datasource;
        };

        $this.load = function () {
            bind();
        };


        // Private methods
        function bind() {

            saltsjobaden.dataFactory.objectsForSale.getAll(function (data, error) {
                if (!error) {

                    // skapa lista                    
                    CreateObjectList(data);

                }
            }, opts.dataContext);

        }


        function CreateObjectList(dataItem) {

            var container = $("#featured");
            var listContainer = $("#featured ul.ui-tabs-nav").html("");

            if (dataItem.length > 0) {

                for (var i = 0; i < dataItem.length; i++) {

                    createObjectItem(dataItem[i], i, container).appendTo(listContainer);

                }

            }
            else {
                alert("Något gick galet!!!");
            }

        }

        function AddInfoBox(dataItem, index, container) {

            var infoBox = $("<div></div>").addClass("ui-tabs-panel").attr("id", "fragment-" + index).appendTo(container);

            if (index != 0)
                infoBox.addClass("ui-tabs-hide");

            var img = $("<img />").attr("src", "/Handlers/DisplayImg.ashx?id=" + dataItem.ObjectPictureGuidId).attr("style", "width:400px;").appendTo(infoBox);
            var info = $("<div></div>").addClass("info").html("").appendTo(infoBox);

            var heading = $("<h2></h2>").html($("<a></a>").attr("href", "/Pages/ForSaleDetail.aspx?id=" + dataItem.ObjectId).html(dataItem.ObjectAddress)).appendTo(info);
            var content = $("<p></p>").html("infotext in här...").appendTo(info);

        }


        var createObjectItem = function (dataItem, index, container) {

            var item = $("<li></li>").addClass("ui-tabs-nav-item").attr("id", "nav-fragment-" + index).html("");

            if (index == 0)
                item.addClass("ui-tabs-selected");

            var link = $("<a></a>").attr("href", "#fragment-" + index).html("").bind('click', { id: index }, function (e) {

                $(".ui-tabs-nav-item").removeClass("ui-tabs-selected");
                $(".ui-tabs-panel").addClass("ui-tabs-hide");

                $("#nav-fragment-" + e.data.id).addClass("ui-tabs-selected");
                $("#fragment-" + e.data.id).removeClass("ui-tabs-hide");

            }).appendTo(item);
            var image = $("<img />").attr("src", "/Handlers/DisplayImg.ashx?id=" + dataItem.ObjectPictureGuidId).attr("style", "width:80px;max-height:50px;").appendTo(link);
            var info = $("<span></span>").html(dataItem.ObjectAddress).appendTo(link);

            //<a href="#fragment-1"><img src="/Functions/ObjectSlider/images/image1-small.jpg" alt="" /><span>15+ Excellent High Speed Photographs</span></a>


            AddInfoBox(dataItem, index, container);


            saltsjobaden.dataFactory.bind("updaterequested dataupdated updatecanceled fetchrequested", function (event, data, context) {

                if (context !== $this.dataContext && data.type == "objectList") {

                    if (event.type == "dataupdated" || event.type == "dataloaded") {

                        // Finally remove the loading class.
                        //progress.hide();
                        //$this.removeClass("loading");


                    }
                    else if (event.type == "fetchrequested") {

                        // Someone want to modify the node.                        
                        //container.html("");
                        //progress.show();                                             

                    }
                    else if (event.type == "updaterequested") {

                        // Someone want to modify the node.
                        //container.html("");
                        //progress.show();

                    }
                    else if (event.type == "updatecanceled") {

                        // The update resulted in error,
                        // remove the loading class and add an error class.                            
                        //progress.hide();
                        //container.html("");
                        $this.removeClass("loading").addClass("error");

                    }
                }
            });

            return item;

        };

        return $this.intialize();

    };

    $.fn.objectList.defaults = {

        selected: function (item) { },
        dataContext: null
    };

    objectList = function (control) {
        this.control = control;
        //this.init();
    };

    //  Events
    //  onofferlistloaded: function (offerlist) {
    //      this.control.trigger({
    //          type: "offerlistloaded",
    //          offerList: offerList
    //      });
    //  }

})(jQuery);
