Commit 402fdbb0

mo khan <mo@mokhan.ca>
2014-07-05 14:48:23
display disqus backbone view on cakes#show page.
1 parent ab64290
Changed files (8)
app/assets/javascripts/backbone/models/cake.js.coffee
@@ -18,6 +18,9 @@ class CakeSide.Models.Cake extends Backbone.Model
   photos: ->
     CakeSide.Application.request('PhotosRepository', @id)
 
+  public_url: ->
+    "#{window.location.origin}/creations/#{@get('slug')}"
+
 class CakeSide.Collections.CakesCollection extends Backbone.Collection
   model: CakeSide.Models.Cake
   url: '/api/v1/cakes'
app/assets/javascripts/backbone/routers/cakes_router.js.coffee
@@ -9,6 +9,7 @@ class CakeSide.Routers.CakesRouter extends Backbone.Router
     ".*": "index"
 
   index: ->
+    CakeSide.Application.request('CommentView').hide()
     @view = new CakeSide.Views.Cakes.IndexView(collection: CakeSide.Application.request('CakesRepository'))
     $("#backbone-content").html(@view.render().el)
 
@@ -18,10 +19,12 @@ class CakeSide.Routers.CakesRouter extends Backbone.Router
     $("#backbone-content").html(@view.render().el)
 
   newCake: ->
+    CakeSide.Application.request('CommentView').hide()
     @view = new CakeSide.Views.Cakes.NewView(collection: CakeSide.Application.request('CakesRepository'))
     $("#backbone-content").html(@view.render().el)
 
   edit: (id) ->
+    CakeSide.Application.request('CommentView').hide()
     cake = CakeSide.Application.request('CakesRepository').get(id)
     @view = new CakeSide.Views.Cakes.EditView(model: cake)
     $("#backbone-content").html(@view.render().el)
app/assets/javascripts/backbone/templates/cakes/delete_modal.jst.ejs
@@ -14,7 +14,7 @@
     This will permanently delete <b><%= name %></b> photos, and comments.
   </p>
   <p>
-    Please type in the name of the repository to confirm.
+    Please type in the name of the cake to confirm.
     <input id="confirmation-textbox" type="text" class="input-xxlarge" autofocus="" required="" aria-label="Type in the name of the cake to confirm that you want to delete this repository.">
   </p>
 </div>
app/assets/javascripts/backbone/views/cakes/show_view.js.coffee
@@ -20,6 +20,7 @@ class CakeSide.Views.Cakes.ShowView extends Marionette.CompositeView
   constructor: (options) ->
     super(options)
     @collection = @model.photos()
+    @displayComments()
 
   launchAddPhoto: ->
     @displayModal(new CakeSide.Views.Photos.NewModalView(cake: @model))
@@ -31,3 +32,8 @@ class CakeSide.Views.Cakes.ShowView extends Marionette.CompositeView
     $("#modal").html(view.render().el)
     $("#modal").modal()
 
+  displayComments: ->
+    CakeSide.Application.request('CommentView').render
+      identifier: "c-#{@model.id}"
+      title: @model.get('name')
+      url: @model.public_url()
app/assets/javascripts/backbone/views/disqus_view.js.coffee
@@ -0,0 +1,26 @@
+class CakeSide.Views.DisqusView extends Backbone.View
+  el: "#disqus_thread"
+  initialize: (options) ->
+    disqus = document.createElement('script')
+    disqus.type = 'text/javascript'
+    disqus.async = true
+    disqus.src = "//#{options.disqus_shortname}.disqus.com/embed.js"
+    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(disqus)
+
+  render: (options) ->
+    try
+      @$el.removeClass('hidden')
+      DISQUS.reset
+        reload: true,
+        config: ->
+          @page.identifier = options.identifier
+          @page.title = "CakeSide - #{options.title}"
+          @page.url = options.url
+      @
+    catch error
+      console.log(error)
+    finally
+      @
+
+  hide: ->
+    @$el.addClass('hidden')
app/assets/javascripts/backbone/cakeside.js.coffee
@@ -27,6 +27,10 @@ window.CakeSide =
     @categories = new CakeSide.Collections.CategoriesCollection()
     @categories.fetch(reset: true)
 
+    @disqus_view = new CakeSide.Views.DisqusView
+      disqus_shortname: data.disqus_shortname
+    CakeSide.Application.reqres.setHandler 'CommentView', =>
+      @disqus_view
     CakeSide.Application.reqres.setHandler 'CakesRepository', =>
       @cakes
     CakeSide.Application.reqres.setHandler 'CategoriesRepository', =>
app/views/api/v1/cakes/_cake.json.jbuilder
@@ -1,5 +1,6 @@
 json.id cake.id
 json.name cake.name
+json.slug cake.to_param
 json.story cake.story
 json.watermark cake.watermark
 json.is_restricted cake.is_restricted
app/views/my/cakes/index.html.erb
@@ -1,10 +1,23 @@
 <%= content_for :javascript do -%>
   <%= javascript_tag do %>
     var ALL_TAGS = [ <% ActsAsTaggableOn::Tag.pluck(:name).sort!.each { |item| %> '<%= item %>', <% } %> ];
-    CakeSide.initialize({ access_token: '<%= current_user.authentication_token %>' });
+    var disqus_shortname = '<%= ENV['DISQUS_SHORTNAME'] %>';
+    var disqus_identifier = 'u-<%= current_user.id %>';
+    var disqus_config = function(){
+      this.page.remote_auth_s3 = '<%= disqus_auth %>';
+      this.page.api_key = '<%= ENV['DISQUS_API_KEY'] %>';
+      this.callbacks.onNewComment = [function(comment) {
+        $.post('<%= comments_path %>', { id: comment.id, url: document.URL, comment: comment }, function(result){ console.log(result); });
+      }];
+    };
+    CakeSide.initialize({
+      access_token: '<%= current_user.authentication_token %>',
+      disqus_shortname: disqus_shortname,
+    });
   <% end %>
 <% end -%>
 
 <%= render partial: "shared/account_nav", locals: { selected: :creations } %>
 <div id="backbone-content"></div>
 <div id="modal" class="modal hide fade"></div>
+<div id="disqus_thread"></div>