cambio version desktop y movil

js/main-mvl.js

@@ -2,7 +2,16 @@ viewStatus= "story" /* data story */
 pagesLoaded= 0
 totalPages=7;
 currentPage=0;
+mode="desktop"
+sufix="desk"
+window.onresize = function(){ location.reload(); }
 window.onload = function() {
+    wwidth=$( window ).width();
+    if(wwidth<900) {
+        mode="mobile"
+        sufix="mob"
+    }
+
     loadData()
     /**** mobile ****/
 }
@@ -34,7 +43,7 @@ function reloadEvents(){
         $('.carousel-btn a.active').removeClass("active")
         $(this).addClass("active")
     });
-    
+
     Waypoint.destroyAll()
     var waypoints = $('#story, #mapa, #datos').waypoint({
       handler: function(direction) {
@@ -52,6 +61,20 @@ function reloadEvents(){
         },
         offset: '-11%'
     })
+
+    var modal2=
+    new jBox('Modal', {
+        width: '90%',
+        height: '90%',
+      attach: '#referencias-page-btn-'+currentPage,
+      //content: $('#referencias-page-'+j),
+      ajax: {
+        url: 'referencias/page'+currentPage+".html",
+        reload: 'strict'
+        },
+      closeButton: 'box'
+    });
+
 /*    var waypoints = $('#mapa').waypoint({
       handler: function(direction) {
         enableMenuElement(this.element.id)
@@ -87,21 +110,20 @@ function renderPage(pageNumber ){
     console.log(pageNumber)
     $("body").empty();
     if(pageNumber==0){
-        my.utils().renderExtTemplate({ name: 'portadamvl', selector: 'body', data: {}  })
+        my.utils().renderExtTemplate({ name: 'portada_'+sufix, selector: 'body', data: {}  })
     }
     else if(pageNumber==6){
         var mdata=paginasData[pageNumber-1]
         mdata.showPrev=mdata.showNext=true
-        my.utils().renderExtTemplate({ name: 'page6_mob', selector: 'body', data: mdata  })
+        my.utils().renderExtTemplate({ name: 'page6_'+sufix, selector: 'body', data: mdata  })
     }
     else{
         var mdata=paginasData[pageNumber-1]
         mdata.showPrev=mdata.showNext=true
         //if(pageNumber==1) mdata.showPrev=false;
         if(pageNumber==7) mdata.showNext=false;
-        my.utils().renderExtTemplate({ name: 'index_mob', selector: 'body', data: mdata })
+        my.utils().renderExtTemplate({ name: 'page_'+sufix, selector: 'body', data: mdata })
     }
-
 }
 
 var my = my || {};

js/main.js

@@ -1,11 +1,12 @@
 viewStatus= "story" /* data story */
 pagesLoaded= 0
-totalPages=7;
+totalPages=8;
+window.onresize = function(){ location.reload(); }
 window.onload = function() {
     width = 1000,
     height = 1000;
-    loadPageTemplates()
 
+    loadData();
     $('#pagepiling').pagepiling({
 	    menu: null,
         anchors: ["portada","page1","page2","page3","page4","page5","page6","page7"],
@@ -29,27 +30,55 @@ window.onload = function() {
             $('.btn-navigation.active').removeClass('active')
             $('#nav-btn-page'+index + " a").addClass('active')
         }
-    });
-    //turnEventsOn();
-
-
-
-    
+    });  //turnEventsOn();
 
 }
 
-function loadPageTemplates(){
-    $('#portada').load("templates/portada.html",function(){
-        loadModalEvent(0);
+function loadData(){
+    $.getJSON( "data/textos.json", function( data ) {
+      n_projects=Object.keys(data).length;
+      paginasData=data;
+      console.log("astas")
+      loadPageTemplates()
+    }).fail(function() {
+        console.log( "error" );
     })
+}
 
-    for (var i=1; i<= totalPages; i++){
-        (function (n) {
+sufix="desk"
+n_projects=7;
+function renderPage(pageNumber ){
+    //$("body").fadeOut();
+    console.log(pageNumber)
+    //$("body").empty();
+    if(pageNumber==0){
+        my.utils().renderExtTemplate({ name: 'portada_'+sufix, selector: 'body', data: {}  })
+    }
+    else if(pageNumber==6){
+        var mdata=paginasData[pageNumber-1]
+        my.utils().renderExtTemplate({ name: 'page6_'+sufix, selector: '#page-'+pageNumber, index : pageNumber, data: mdata  })
+    }
+    else{
+        var mdata=paginasData[pageNumber-1]
+        my.utils().renderExtTemplate({ name: 'page_'+sufix, selector: '#page-'+pageNumber, index : pageNumber, data: mdata })
+    }
+}
+
+
+function loadPageTemplates(){
+    my.utils().renderExtTemplate({ name: 'portada_'+sufix, selector: '#portada', data: {}, index : 0  })
+    /*$('#portada').load("templates/portada.html",function(){
+        loadModalEvent(0);
+    })*/
+
+    for (var i=1; i<= totalPages-1; i++){
+        /*(function (n) {
             $('#page-'+n).load("templates/page"+n+".html",function(){
                 counterLoading();
                 loadModalEvent(n);
             })
-        })(i)
+        })(i)*/
+        renderPage(i)
     }
     //turnEventsOn();
 }
@@ -61,13 +90,17 @@ function loadModalEvent(j){
       content: $('#map-page-'+j),
       closeButton: 'box'
     });
-
+    console.log(j)
     var modal2=
     new jBox('Modal', {
         width: '60%',
         height: '80%',
       attach: '#referencias-page-btn-'+j,
-      content: $('#referencias-page-'+j),
+      //content: $('#referencias-page-'+j),
+      ajax: {
+        url: 'referencias/page'+j+".html",
+        reload: 'strict'
+        },
       closeButton: 'box'
     });
 
@@ -75,13 +108,14 @@ function loadModalEvent(j){
 
 function counterLoading(){
     pagesLoaded++;
+    $('.verstory-btn').hide();
     if(pagesLoaded >= totalPages){
         var ssize=$( window ).height();
         var bottomSize=$( "#timeline" ).height();
         $('.story-content').css("height",ssize-bottomSize+'px')
         $('.data-content').css("height",ssize-bottomSize+'px')
         //Todas las plantillas cargadas
-        $('.menu-content').on("click",'.switchMode', function(e){
+        $('.extra-btn-container').on("click",'.switchMode', function(e){
             if(viewStatus=="story")
             {
                 viewStatus="data"
@@ -92,11 +126,15 @@ function counterLoading(){
             if(viewStatus=="story"){
                 $('.story-content, .menu-story-content').show();
                 $('.data-content, .menu-data-content').hide();
+                $('.verstory-btn').hide();
+                $('.vergrafico-btn').show();
                 //$('.menu-content .switchMode').empty().html("ver datos")
             }
             else{
                 $('.story-content, .menu-story-content').hide();
                 $('.data-content, .menu-data-content').show();
+                $('.vergrafico-btn').hide();
+                $('.verstory-btn').show();
                 //$('.menu-content .switchMode').empty().html("ver historia")
             }
         })
@@ -116,3 +154,33 @@ function turnEventsOn(){
             $(this).addClass('active')
         })*/
 }
+
+var my = my || {};
+my.utils = (function() {
+    var getPath = function(name) {
+        return 'templates/' + name + '.tmpl.html';
+    },
+    renderExtTemplate = function(item) {
+        var file = getPath( item.name );
+        $.when($.get(file))
+         .done(function(tmplData) {
+             n_projects--;
+             var tmpl= $.templates( tmplData );
+             var rendered=tmpl.render(item.data)
+             $(item.selector).append(rendered);
+              //setCardSizes();
+              afterLoading(item.index);
+         });
+    };
+
+    return {
+        getPath: getPath,
+        renderExtTemplate: renderExtTemplate
+    };
+});
+function afterLoading(i){
+    //$("body").fadeIn();
+    //reloadEvents();
+    if(i>0)loadModalEvent(i)
+    counterLoading();
+}