git-svn-id: https://msi/svn/firstRepo/WebClient/branches/Manut_2.2.3@29 0f545695-f87b-41b6-9a03-7f16563b5454

js/modules/category/category.js

@@ -6,7 +6,7 @@ define(['jquery', 'underscore', 'backbone', 'text!modules/category/categoryViewT
                 categoryName: null,
                 //initialize template
                 template: _.template(categoryViewTemplate),
-                itemtemplate: _.template(categoryItemTemplate),
+                itemtemplate: _.template(categoryItemTemplate, {variable: 'item'}),
                 initialize: function (options) {
                     var self = this;
                     CategoryView.__super__.initialize.call(this);
@@ -16,15 +16,18 @@ define(['jquery', 'underscore', 'backbone', 'text!modules/category/categoryViewT
                         success: function (data, textStatus, jqXHR) {
                             self.renderItem();
                         }
-                        //success: function(){ self.renderItem(); } 
                     });
                 },
                 renderItem: function () {
                     var $ul = $('#allRicette');
+                    var self = this;
+                    var html = "";
+                    _.each(this.collection.toJSON(), function(d) {
+                      html += self.itemtemplate(d);
+                    });
+                    //var items = this.itemtemplate({data: this.collection.toJSON()});
 
-                    var items = this.itemtemplate({data: this.collection.toJSON()});
-
-                    $ul.html(items);
+                    $ul.html(html);
                     $ul.listview("refresh");
                     $ul.trigger("updatelayout");
 

js/modules/category/categoryItemTemplate.html

@@ -1,19 +1,14 @@
-<% if(data.length == 0){ %>
-    <h1>Nessuna ricetta trovata</h1>
-<%} else { for (var i = 0; i < data.length; i++) { %>
-  <% var item = data[i]; %>
-	<li><a href="#ricetta/<%= item.ricetta_id%>" class="ui-btn ui-btn-icon-right ui-icon-carat-r">
-            <div class='ricettaTitolo'><%= unescape(item.titolo) %></div>
-            <div class='ricettaAutore'><%= unescape(item.autore) %></div>
-            <br><div class='ricettaAutore'>Diff.:&nbsp;&nbsp;</div>
-			<div id="valutazione" style="">
-                <form id="difficoltaFrm" data-role="none">
-                    <input name="difficolta" <% if(item.difficolta==="1"){%>checked="checked"<%}%> type="radio" data-role="none" value="1" disabled="disabled" title="Molto Semplice" class="star"/>
-                    <input name="difficolta" <% if(item.difficolta==="2"){%>checked="checked"<%}%> type="radio" data-role="none" value="2" disabled="disabled" title="Semplice" class="star"/>
-                    <input name="difficolta" <% if(item.difficolta==="3"){%>checked="checked"<%}%> type="radio" data-role="none" value="3" disabled="disabled" title="Normale" class="star"/>
-                    <input name="difficolta" <% if(item.difficolta==="4"){%>checked="checked"<%}%> type="radio" data-role="none" value="4" disabled="disabled" title="Difficile" class="star"/>
-                    <input name="difficolta" <% if(item.difficolta==="5"){%>checked="checked"<%}%> type="radio" data-role="none" value="5" disabled="disabled" title="Molto Difficile" class="star"/>
-                    </form>
-            </div>            
-        </a></li>
-<% }} %>
+<li><a href="#ricetta/<%= item.ricetta_id%>" class="ui-btn ui-btn-icon-right ui-icon-carat-r">
+    <div class='ricettaTitolo'><%= unescape(item.titolo) %></div>
+    <div class='ricettaAutore'><%= unescape(item.autore) %></div>
+    <br><div class='ricettaAutore'>Diff.:&nbsp;&nbsp;</div>
+                <div id="valutazione" style="">
+        <form id="difficoltaFrm" data-role="none">
+            <input name="difficolta" <% if(item.difficolta==="1"){%>checked="checked"<%}%> type="radio" data-role="none" value="1" disabled="disabled" title="Molto Semplice" class="star"/>
+            <input name="difficolta" <% if(item.difficolta==="2"){%>checked="checked"<%}%> type="radio" data-role="none" value="2" disabled="disabled" title="Semplice" class="star"/>
+            <input name="difficolta" <% if(item.difficolta==="3"){%>checked="checked"<%}%> type="radio" data-role="none" value="3" disabled="disabled" title="Normale" class="star"/>
+            <input name="difficolta" <% if(item.difficolta==="4"){%>checked="checked"<%}%> type="radio" data-role="none" value="4" disabled="disabled" title="Difficile" class="star"/>
+            <input name="difficolta" <% if(item.difficolta==="5"){%>checked="checked"<%}%> type="radio" data-role="none" value="5" disabled="disabled" title="Molto Difficile" class="star"/>
+            </form>
+    </div>            
+</a></li>

js/modules/index/index.js

@@ -1,21 +1,30 @@
-define(['jquery', 'underscore', 'backbone','text!modules/index/indexViewTemplate.html', 'modules/base/baseView'],
-    function($, _, Backbone, indexViewTemplate, BaseView){
+define(['jquery', 'underscore', 'backbone','text!modules/index/indexViewTemplate.html','text!modules/index/indexItemViewTemplate.html', 'modules/base/baseView'],
+    function($, _, Backbone, indexViewTemplate, indexItemViewTemplate, BaseView){
 
         var IndexView = BaseView.extend({
 
             collection: null,
             //initialize template
             template:_.template(indexViewTemplate),
+            templateItem:_.template(indexItemViewTemplate, {variable: 'item'}),
 
             initialize: function (options) {
                 var self = this;
                 IndexView.__super__.initialize.call(this);
                 this.collection = options.collection;
                 this.collection.fetch({ 
-					success: function(data, textStatus, jqXHR){
-					    self.render();
-					}
-				});
+                    success: function(){
+                        var $ul = $('#categoryList');
+                        var html = "";
+                        _.each(self.collection.toJSON(), function(d) {
+                          html += self.templateItem(d);
+                        });
+                        $ul.html(html);
+                        //$ul.listview("refresh");
+                        //$ul.trigger("updatelayout");
+                        //self.trigger("renderCompleted:Categories",self);
+                    }
+                });
             },
 
             //render the content into div of view
@@ -26,9 +35,9 @@ define(['jquery', 'underscore', 'backbone','text!modules/index/indexViewTemplate
                 //$el is cached jQuery object for the view's element.
                 //append the compiled template into view div container
                 this.$el.append(this.header.$el);
-                this.$el.append(this.template({data:this.collection.toJSON()}));
-                this.$el.append(this.footer.$el);
-                this.trigger("renderCompleted:Categories",this);
+                this.$el.append(this.template());
+                this.$el.append(this.footer.$el);                
+                
                 //return to enable chained calls
                 this.$el.find("#indexBtn").addClass("ui-btn-active");
                 return this;

js/modules/index/indexItemViewTemplate.html

@@ -0,0 +1 @@
+<li><a href="#category/<%=item.name%>/<%= item.category_id%>" class="ui-btn ui-btn-icon-right ui-icon-carat-r"><%= item.name %></a></li>

js/modules/index/indexViewTemplate.html

@@ -1,9 +1,5 @@
 <div id="categoryListContent" data-role="content">	
-	<h1>Indice</h1>		        
+    <h1>Indice</h1>		        
     <ul id="categoryList" data-role="listview" data-inset="true">
-	<% for (var i = 0; i < data.length; i++) { %>
-	  <% var item = data[i]; %>
-	<li><a href="#category/<%=item.name%>/<%= item.category_id%>" class="ui-btn ui-btn-icon-right ui-icon-carat-r"><%= item.name %></a></li>
-	<% } %>    	
-	</ul>
+    </ul>
 </div>

js/modules/item/itemViewTemplate.html

@@ -1,7 +1,7 @@
 <div data-role="header" data-position="fixed" data-tap-toggle="false">
-    <a id="favoriteBtn" href="" data-role="button" class="ui-btn-left" data-icon="custom" style="font-size: x-small;">Agg. al Blocco</a>
+    <a id="favoriteBtn" href="#" class="nav-glyphish-example ui-btn ui-icon-myHome ui-btn-icon-notext ui-btn-left" data-icon="custom"></a>
     <h3 id='titoloRicetta'><%= unescape(ricetta.titolo)%></h3>
-    <a id="backBtn" href="" data-role="button" class="ui-btn-right" data-icon="custom">Indietro</a>
+    <a id="backBtn" href="#" class="nav-glyphish-example ui-btn ui-icon-myHome ui-btn-icon-notext ui-btn-right" data-icon="custom"></a>
 </div>		 
 <div id="contentIngredienti" data-role="content">
 	<h1>Ingredienti</h1>

js/modules/search/found.js

@@ -12,22 +12,62 @@ define(['jquery', 'underscore', 'backbone','text!modules/search/foundViewTemplat
                 var self = this;
                 FoundView.__super__.initialize.call(this);
                 this.collection = options.collection;
+                
                 this.collection.fetch({
                     success: function(){ self.renderItem(); } });
             },
+            
+            events: {
+                "click #pagSucc": "nextPageSearch",
+                "click #pagPrec": "prevPageSearch"
+            },
+            
+            goTop: function(element) {
+                $('html, body').animate({
+                    scrollTop: '0px'
+                }, 'fast');
+                return element; // for chaining...
+            },
 
             renderItem: function(){
                 var $ul = $('#foundRicette');
-
+                $ul.html('');
                 var items = this.itemTemplate({data:this.collection.toJSON()});
 
                 $ul.html( items );
                 $ul.listview( "refresh" );
                 $ul.trigger( "updatelayout");
+                
+                if(this.collection.indexItems === 0)
+                    $('#pagPrec').hide();
+                else
+                    $('#pagPrec').show();
+                
+                if(this.collection.getTotalRecords() <  (this.collection.indexItems + 1) * this.collection.numItems)
+                    $('#pagSucc').hide();
+                else
+                    $('#pagSucc').show();
 
                 $.mobile.loading( 'hide' );
                 //$( '[data-alpha="true"]' ).alphascroll();
             },
+            
+            nextPageSearch: function(e){
+                e.preventDefault();
+                var self=this;
+                this.collection.indexItems++;
+                this.collection.fetch({reset: true,
+                    success: function(){ self.renderItem(); } });
+                this.goTop();
+            },
+            
+            prevPageSearch: function(e){
+                e.preventDefault();
+                var self=this;
+                this.collection.indexItems--;
+                this.collection.fetch({reset: true,
+                    success: function(){ self.renderItem(); } });
+            },
 
             //render the content into div of view
             render: function(){

js/modules/search/foundViewTemplate.html

@@ -1,5 +1,6 @@
 <div id="categoryListContent" data-role="content">	
-	<h1>Ricerca Ricette...</h1>
-    <ul id="foundRicette" data-role="listview" data-autodividers="true" data-inset="true">
-	</ul>
+    <h1>Ricerca Ricette...</h1>
+    <center><a href="" id="pagPrec" button="true" class="ui-btn ui-corner-all">Pagina precedente</a></center>
+    <ul id="foundRicette" data-role="listview" data-autodividers="true" data-inset="true"></ul>
+    <center><a href="" id="pagSucc" button="true" class="ui-btn ui-corner-all">Pagina successiva</a></center>
 </div>