Permalink
Browse files

wip rendering collection

  • Loading branch information...
1 parent 5329126 commit 3e5655584f401822bf5ae862cbc650abd412dd7c @ghendry committed Apr 19, 2012
View
2 app/client/coffeescripts/models.coffee
@@ -1,6 +1,4 @@
class Card extends Backbone.Model
- defaults:
- name: 'the default name'
initialize: ->
x: 1
View
32 app/client/coffeescripts/views.coffee
@@ -2,32 +2,34 @@ jQuery ->
class CardView extends Backbone.View
className: 'card'
template: _.template($('#new-card').html())
- el: '#container'
- initialize: (card) ->
- console.log 'card to init is ' + JSON.stringify(card)
- this.render(card)
- render: (card) ->
- console.log 'card to render is ' + JSON.stringify(card)
- $(@el).append @template({card_title: card.get('name'), card_text: 'the hard-coded text'})
+ el: 'li'
+ render: ->
+ $(@el).append @template(@model.toJSON())
$('.card').draggable({handle: 'p.handle'})
@
class CardsView extends Backbone.View
- #className: 'cards'
- el: '#container'
+ el: '#container ul'
initialize: ->
@collection = new app.Cards
- c = @addCard('the text')
- @showCard(c)
- c = @addCard('the second text')
- @showCard(c)
+ c = @addCard('the text', 'content')
+ c = @addCard('the second text', 'content2')
+ console.log 'collection is ' + JSON.stringify(@collection)
+ for c in @collection
+ #this is where it fails. c is undef
+ console.log 'card is ' + JSON.stringify(c)
@render()
render: ->
+ for card in @collection
+ console.log 'card is ' + JSON.stringify(card)
+ view = new CardView model: card
+ $(@el).append view.render().el
$(@el).append("<p>this is the end of cards view</p>")
@
- addCard: (text) ->
+ addCard: (title, content) ->
card = new app.Card
- card.set name: text
+ card.set card_name: title
+ card.set card_text: content
@collection.add(card)
console.log 'coll is now ' + JSON.stringify(@collection)
card
View
2 app/client/haml/index.haml
@@ -24,7 +24,7 @@
%script{:type=>"text/template", :id=>"new-card"}
%div.card.ui-widget-content
%p.handle.ui-widget-header Drag this!
- %p{:contenteditable=>"true"} {{ card_title }}
+ %p{:contenteditable=>"true"} {{ card_name }}
%p {{ card_text }}
%body
%h1 NXan App
View
4 public/assets/javascripts/models.js
@@ -13,10 +13,6 @@
return Card.__super__.constructor.apply(this, arguments);
}
- Card.prototype.defaults = {
- name: 'the default name'
- };
-
Card.prototype.initialize = function() {
return {
x: 1
View
48 public/assets/javascripts/views.js
@@ -18,19 +18,10 @@
CardView.prototype.template = _.template($('#new-card').html());
- CardView.prototype.el = '#container';
+ CardView.prototype.el = 'li';
- CardView.prototype.initialize = function(card) {
- console.log('card to init is ' + JSON.stringify(card));
- return this.render(card);
- };
-
- CardView.prototype.render = function(card) {
- console.log('card to render is ' + JSON.stringify(card));
- $(this.el).append(this.template({
- card_title: card.get('name'),
- card_text: 'the hard-coded text'
- }));
+ CardView.prototype.render = function() {
+ $(this.el).append(this.template(this.model.toJSON()));
$('.card').draggable({
handle: 'p.handle'
});
@@ -50,28 +41,45 @@
return CardsView.__super__.constructor.apply(this, arguments);
}
- CardsView.prototype.el = '#container';
+ CardsView.prototype.el = '#container ul';
CardsView.prototype.initialize = function() {
- var c;
+ var c, _i, _len, _ref;
this.collection = new app.Cards;
- c = this.addCard('the text');
- this.showCard(c);
- c = this.addCard('the second text');
- this.showCard(c);
+ c = this.addCard('the text', 'content');
+ c = this.addCard('the second text', 'content2');
+ console.log('collection is ' + JSON.stringify(this.collection));
+ _ref = this.collection;
+ for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+ c = _ref[_i];
+ console.log('card is ' + JSON.stringify(c));
+ }
return this.render();
};
CardsView.prototype.render = function() {
+ var card, view, _i, _len, _ref;
+ _ref = this.collection;
+ for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+ card = _ref[_i];
+ console.log('card is ' + JSON.stringify(card));
+ view = new CardView({
+ model: card
+ });
+ $(this.el).append(view.render().el);
+ }
$(this.el).append("<p>this is the end of cards view</p>");
return this;
};
- CardsView.prototype.addCard = function(text) {
+ CardsView.prototype.addCard = function(title, content) {
var card;
card = new app.Card;
card.set({
- name: text
+ card_name: title
+ });
+ card.set({
+ card_text: content
});
this.collection.add(card);
console.log('coll is now ' + JSON.stringify(this.collection));
View
2 public/index.html
@@ -21,7 +21,7 @@
<script id='new-card' type='text/template'>
<div class='card ui-widget-content'>
<p class='handle ui-widget-header'>Drag this!</p>
- <p contenteditable='true'>{{ card_title }}</p>
+ <p contenteditable='true'>{{ card_name }}</p>
<p>{{ card_text }}</p>
</div>
</script>

0 comments on commit 3e56555

Please sign in to comment.