/**
 * Created by Bill on 2016/10/7.
 */
define(["jQuery", "underscore", "Backbone", "handlebars", "util"
        ,"/Bill.io/js/collections/HomePageCollection.js"
        ,"text!/Bill.io/templates/HomePage.tpl"
        ,"text!/Bill.io/templates/ShowCaseContent.tpl"
        ,"text!/Bill.io/templates/CanvasContent.tpl"
        ,"text!/Bill.io/templates/HomePageError.tpl"],
        function($, _, Backbone, Handlebars, util, HomePageCollection, HomePageTpl, ShowCaseContentTpl, CanvasContentTpl, HomePageErrorTpl){

            var objShowCaseCollection = new HomePageCollection();
            var objCanvasCollection = new HomePageCollection();

            objShowCaseCollection.parseIndicator = "showCase";
            objCanvasCollection.parseIndicator = "canvasPractise";

            var HomePageView = Backbone.View.extend({
                el: ".page",
                initialize: function(attrs){
                    this.options = attrs;
                },
                render: function(){
                    util.switchBackgroundColor(true);
                    util.closeOverLayer();
                    util.loadHandlebarTemplate(HomePageTpl, {}, ".page");
                    objShowCaseCollection.fetch({
                        success: function(collection, resp){
                            console.dir(collection.models);
                            console.dir(resp);
                            if(collection.models){
                                util.loadHandlebarTemplate2(ShowCaseContentTpl, resp, ".showCase");
                                util.switchSpin(".showCase .spin");
                            }
                        },
                        error: function(collection, resp){
                            console.dir(collection);
                            console.dir(resp);
                            util.loadHandlebarTemplate2(HomePageErrorTpl, resp, ".showCase");
                            util.switchSpin(".showCase .spin");
                        }
                    });

                    objCanvasCollection.fetch({
                        success: function(collection, resp){
                            console.dir(collection.models);
                            console.dir(resp);
                            if(collection.models){
                                util.loadHandlebarTemplate2(CanvasContentTpl, resp, ".canvasPractise");
                                util.switchSpin(".canvasPractise .spin");
                            }
                        },
                        error: function(collection, resp){
                            console.dir(collection);
                            console.dir(resp);
                            util.loadHandlebarTemplate2(HomePageErrorTpl, resp, ".canvasPractise");
                            util.switchSpin(".canvasPractise .spin");
                        }
                    });
                },
                events: {
                    "click .showcases>a": "overLayerHandler",
                    "touchstart .showcases>a": "addMaskHandler",
                    "touchend .showcases>a": "removeMaskHandler"
                },
                overLayerHandler: function(){
                    util.openOverLayer();
                    this.undelegateEvents(); //temp
                },
                addMaskHandler: function(){
                    var event = arguments[0];
                    console.log(event.target.parentNode);
                    if(event.target.parentNode.nodeName === "A"){
                        event.target.parentNode.setAttribute("class", event.target.parentNode.getAttribute("class") + " active");
                    }
                },
                removeMaskHandler: function(){
                    var event = arguments[0];
                    console.log(event.target.parentNode);
                    if(event.target.parentNode.nodeName === "A"){
                        event.target.parentNode.setAttribute("class", event.target.parentNode.getAttribute("class").replace(/active/g, "").replace(/(^\s+)|(\s+$)/g, ""));
                    }
                }
            });

            return HomePageView;
});

@@ -3007,33 +3007,32 @@
 verLayerHandler%22
-,
 %0A               
@@ -3032,24 +3032,26 @@
             
+//
 %22touchstart 
@@ -3103,16 +3103,18 @@
         
+//
 %22touchen
@@ -3239,247 +3239,32 @@
     
-util.openOverLayer();%0A                    this.undelegateEvents(); //temp%0A                %7D,%0A                addMaskHandler: function()%7B%0A                    var event = arguments%5B0%5D;%0A                    console.log(event.target.parentNode)
+var event = arguments%5B0%5D
 ;%0A  
@@ -3499,420 +3499,85 @@
     
-%7D,%0A
     
-            removeMaskHandler: function()%7B%0A                    var event = arguments%5B0%5D;%0A                    console.log(event.target.parentNode);%0A                    if(event.target.parentNode.nodeName === %22A%22)%7B%0A                        event.target.parentNode.setAttribute(%22class%22, event.target.parentNode.getAttribute(%22class%22).replace(/active/g, %22%22).replace(/(%5E%5Cs+)%7C(%5Cs+$)/g, %22%22));%0A                    %7D
+util.openOverLayer();%0A                    this.undelegateEvents(); //temp
 %0A   

test end