Browse files

Add editVerse view

  • Loading branch information...
1 parent 12958a4 commit dcfeca0f4ba4fad09cce82b43246792c338c8d24 @ismyrnow committed Feb 7, 2014
View
3 public/css/style.css
@@ -121,7 +121,8 @@ select {
font-weight: 300;
}
-.new-verse {
+.new-verse,
+.edit-verse {
padding: 1em;
}
View
15 public/js/router.js
@@ -1,6 +1,6 @@
define(['backbone', 'views/verselistview', 'models/verselistmodel', 'collections/versescollection', 'views/verseview',
- 'views/newverseview'],
-function (Backbone, VerseListView, VerseListModel, VersesCollection, VerseView, NewVerseView) {
+ 'views/newverseview', 'views/editverseview'],
+function (Backbone, VerseListView, VerseListModel, VersesCollection, VerseView, NewVerseView, EditVerseView) {
'use strict';
return Backbone.Router.extend({
@@ -12,6 +12,7 @@ function (Backbone, VerseListView, VerseListModel, VersesCollection, VerseView,
'verses/memorized': 'memorizedVerses',
'verse/new': 'newVerse',
'verse/:id': 'verse',
+ 'verse/edit/:id': 'editVerse',
'.*': 'index'
},
@@ -57,6 +58,16 @@ function (Backbone, VerseListView, VerseListModel, VersesCollection, VerseView,
view.render();
},
+ editVerse: function(id) {
+ var model = App.Verses.get(id);
+ var view = new EditVerseView({
+ el: $('body'),
+ model: model
+ });
+
+ view.render();
+ },
+
reset: function() {
require(['fixtures'], function() {
window.location.href = '/';
View
23 public/js/templates/editVerse.hbs
@@ -0,0 +1,23 @@
+<header>
+ <a class="left" href="#verse/{{id}}">
+ Cancel
+ </a>
+ <h1>New Verse</h1>
+ <a class="right" id="save-verse" href="javascript:void(0)">
+ Save
+ </a>
+</header>
+
+<div class="body edit-verse">
+ <input type="text" name="reference" placeholder="Reference" value="{{reference}}" />
+ <select name="version">
+ <option value="esv">ESV</option>
+ </select>
+ <select name="list">
+ {{#select list}}
+ <option value="learning">Learning</option>
+ <option value="memorized">Memorized</option>
+ {{/select}}
+ </select>
+ <textarea name="text" rows="7">{{text}}</textarea>
+</div>
View
4 public/js/templates/verse.hbs
@@ -3,9 +3,9 @@
Back
</a>
<h1>{{reference}}</h1>
- <!--<a class="right" href="#">
+ <a class="right" id="edit-verse" href="#verse/edit/{{id}}">
Edit
- </a>-->
+ </a>
</header>
<div class="body verse">
View
68 public/js/views/editVerseView.js
@@ -0,0 +1,68 @@
+define(['handlebars', 'marionette', 'hbs!templates/editVerse', 'debounce'],
+function (Handlebars, Marionette, template, debounce) {
+ 'use strict';
+
+ return Marionette.ItemView.extend({
+
+ initialize: function() {
+ this.referenceChangedDebounced = debounce(this.referenceChanged, 1000);
+ window.Handlebars.registerHelper('select', this.selectHelper);
+ },
+
+ el: $('body'),
+
+ template: template,
+
+ events: {
+ 'click #save-verse': 'saveVerse',
+ 'keyup [name=reference]': 'referenceChangedDebounced'
+ },
+
+ saveVerse: function() {
+ var reference = $('input[name=reference]').val();
+ var version = $('select[name=version]').val();
+ var list = $('select[name=list]').val();
+ var text = $('textarea[name=text').val();
+
+ var verseModel = App.Verses.get(this.model.id);
+
+ verseModel.save({
+ reference: reference,
+ text: text,
+ version: version,
+ list: list
+ });
+
+ window.location.hash = "#";
+ },
+
+ referenceChanged: function() {
+ // TODO: check to see if reference looks legit
+ var reference = $('input[name=reference]').val();
+ var version = $('select[name=version]').val();
+
+ this.ajaxGetPassage(reference, version).then(function(result) {
+ $('textarea[name=text]').val(result.text);
+ });
+ },
+
+ ajaxGetPassage: function(reference, version) {
+ return $.ajax({
+ url: 'api/passage',
+ data: {
+ 'reference': reference,
+ 'version': version
+ },
+ dataType: 'json'
+ }).promise();
+ },
+
+ selectHelper: function(value, options) {
+ var $el = $('<select />').html(options.fn(this));
+ $el.find('[value=' + value + ']').attr({'selected':'selected'});
+ return $el.html();
+ }
+
+ });
+
+});

0 comments on commit dcfeca0

Please sign in to comment.