Skip to content
This repository
Browse code

wip rendering collection

  • Loading branch information...
commit 3e5655584f401822bf5ae862cbc650abd412dd7c 1 parent 5329126
Ginny Hendry authored April 19, 2012
2  app/client/coffeescripts/models.coffee
... ...
@@ -1,6 +1,4 @@
1 1
 class Card extends Backbone.Model
2  
-  defaults:
3  
-    name: 'the default name'
4 2
   initialize: ->
5 3
     x: 1
6 4
   
32  app/client/coffeescripts/views.coffee
@@ -2,32 +2,34 @@ jQuery ->
2 2
   class CardView extends Backbone.View
3 3
     className: 'card'
4 4
     template: _.template($('#new-card').html())
5  
-    el: '#container'
6  
-    initialize: (card) ->
7  
-      console.log 'card to init is ' + JSON.stringify(card)
8  
-      this.render(card)
9  
-    render: (card) ->
10  
-      console.log 'card to render is ' + JSON.stringify(card)
11  
-      $(@el).append @template({card_title: card.get('name'), card_text: 'the hard-coded text'})
  5
+    el: 'li'
  6
+    render: ->
  7
+      $(@el).append @template(@model.toJSON())
12 8
       $('.card').draggable({handle: 'p.handle'})
13 9
       @
14 10
 
15 11
   class CardsView extends Backbone.View
16  
-    #className: 'cards'
17  
-    el: '#container'
  12
+    el: '#container ul'
18 13
     initialize: ->
19 14
       @collection = new app.Cards
20  
-      c = @addCard('the text')
21  
-      @showCard(c)
22  
-      c = @addCard('the second text')
23  
-      @showCard(c)
  15
+      c = @addCard('the text', 'content')
  16
+      c = @addCard('the second text', 'content2')
  17
+      console.log 'collection is ' + JSON.stringify(@collection)
  18
+      for c in @collection
  19
+        #this is where it fails.  c is undef
  20
+        console.log 'card is ' + JSON.stringify(c)
24 21
       @render()
25 22
     render: ->
  23
+      for card in @collection
  24
+        console.log 'card is ' + JSON.stringify(card)
  25
+        view = new CardView model: card
  26
+        $(@el).append view.render().el
26 27
       $(@el).append("<p>this is the end of cards view</p>")
27 28
       @
28  
-    addCard: (text) ->
  29
+    addCard: (title, content) ->
29 30
       card = new app.Card
30  
-      card.set name: text
  31
+      card.set card_name: title
  32
+      card.set card_text: content
31 33
       @collection.add(card)
32 34
       console.log 'coll is now ' + JSON.stringify(@collection)
33 35
       card
2  app/client/haml/index.haml
@@ -24,7 +24,7 @@
24 24
     %script{:type=>"text/template", :id=>"new-card"}
25 25
       %div.card.ui-widget-content
26 26
         %p.handle.ui-widget-header Drag this!
27  
-        %p{:contenteditable=>"true"} {{ card_title }}
  27
+        %p{:contenteditable=>"true"} {{ card_name }}
28 28
         %p {{ card_text }}
29 29
   %body
30 30
     %h1 NXan App
4  public/assets/javascripts/models.js
@@ -13,10 +13,6 @@
13 13
       return Card.__super__.constructor.apply(this, arguments);
14 14
     }
15 15
 
16  
-    Card.prototype.defaults = {
17  
-      name: 'the default name'
18  
-    };
19  
-
20 16
     Card.prototype.initialize = function() {
21 17
       return {
22 18
         x: 1
48  public/assets/javascripts/views.js
@@ -18,19 +18,10 @@
18 18
 
19 19
       CardView.prototype.template = _.template($('#new-card').html());
20 20
 
21  
-      CardView.prototype.el = '#container';
  21
+      CardView.prototype.el = 'li';
22 22
 
23  
-      CardView.prototype.initialize = function(card) {
24  
-        console.log('card to init is ' + JSON.stringify(card));
25  
-        return this.render(card);
26  
-      };
27  
-
28  
-      CardView.prototype.render = function(card) {
29  
-        console.log('card to render is ' + JSON.stringify(card));
30  
-        $(this.el).append(this.template({
31  
-          card_title: card.get('name'),
32  
-          card_text: 'the hard-coded text'
33  
-        }));
  23
+      CardView.prototype.render = function() {
  24
+        $(this.el).append(this.template(this.model.toJSON()));
34 25
         $('.card').draggable({
35 26
           handle: 'p.handle'
36 27
         });
@@ -50,28 +41,45 @@
50 41
         return CardsView.__super__.constructor.apply(this, arguments);
51 42
       }
52 43
 
53  
-      CardsView.prototype.el = '#container';
  44
+      CardsView.prototype.el = '#container ul';
54 45
 
55 46
       CardsView.prototype.initialize = function() {
56  
-        var c;
  47
+        var c, _i, _len, _ref;
57 48
         this.collection = new app.Cards;
58  
-        c = this.addCard('the text');
59  
-        this.showCard(c);
60  
-        c = this.addCard('the second text');
61  
-        this.showCard(c);
  49
+        c = this.addCard('the text', 'content');
  50
+        c = this.addCard('the second text', 'content2');
  51
+        console.log('collection is ' + JSON.stringify(this.collection));
  52
+        _ref = this.collection;
  53
+        for (_i = 0, _len = _ref.length; _i < _len; _i++) {
  54
+          c = _ref[_i];
  55
+          console.log('card is ' + JSON.stringify(c));
  56
+        }
62 57
         return this.render();
63 58
       };
64 59
 
65 60
       CardsView.prototype.render = function() {
  61
+        var card, view, _i, _len, _ref;
  62
+        _ref = this.collection;
  63
+        for (_i = 0, _len = _ref.length; _i < _len; _i++) {
  64
+          card = _ref[_i];
  65
+          console.log('card is ' + JSON.stringify(card));
  66
+          view = new CardView({
  67
+            model: card
  68
+          });
  69
+          $(this.el).append(view.render().el);
  70
+        }
66 71
         $(this.el).append("<p>this is the end of cards view</p>");
67 72
         return this;
68 73
       };
69 74
 
70  
-      CardsView.prototype.addCard = function(text) {
  75
+      CardsView.prototype.addCard = function(title, content) {
71 76
         var card;
72 77
         card = new app.Card;
73 78
         card.set({
74  
-          name: text
  79
+          card_name: title
  80
+        });
  81
+        card.set({
  82
+          card_text: content
75 83
         });
76 84
         this.collection.add(card);
77 85
         console.log('coll is now ' + JSON.stringify(this.collection));
2  public/index.html
@@ -21,7 +21,7 @@
21 21
     <script id='new-card' type='text/template'>
22 22
       <div class='card ui-widget-content'>
23 23
         <p class='handle ui-widget-header'>Drag this!</p>
24  
-        <p contenteditable='true'>{{ card_title }}</p>
  24
+        <p contenteditable='true'>{{ card_name }}</p>
25 25
         <p>{{ card_text }}</p>
26 26
       </div>
27 27
     </script>

0 notes on commit 3e56555

Please sign in to comment.
Something went wrong with that request. Please try again.