From 2bb87671b1c5b59d6c770627b99a17a784f81e1d Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Mon, 7 Sep 2015 01:08:00 -0400 Subject: stub in details page --- public/assets/js/lib/router.js | 7 ++- public/assets/js/lib/views/details/comments.js | 39 +++++++++++++++++ public/assets/js/lib/views/details/files.js | 59 ++++++++++++++++++++++++++ public/assets/js/lib/views/details/index.js | 28 ++++++++++++ public/assets/js/lib/views/index/threadbox.js | 6 ++- 5 files changed, 136 insertions(+), 3 deletions(-) create mode 100644 public/assets/js/lib/views/details/comments.js create mode 100644 public/assets/js/lib/views/details/files.js create mode 100644 public/assets/js/lib/views/details/index.js (limited to 'public/assets/js/lib') diff --git a/public/assets/js/lib/router.js b/public/assets/js/lib/router.js index 5bc05c3..d5b9652 100644 --- a/public/assets/js/lib/router.js +++ b/public/assets/js/lib/router.js @@ -8,7 +8,7 @@ var SiteRouter = Router.extend({ "/": 'login', "/index": 'index', "/login": 'login', - "/details/:id": 'room', + "/details/:id": 'details', }, initialize: function(){ @@ -22,5 +22,10 @@ var SiteRouter = Router.extend({ login: function(){ app.view = new LoginView () }, + + details: function(id){ + app.view = new DetailsView () + app.view.load(id) + } }) \ No newline at end of file diff --git a/public/assets/js/lib/views/details/comments.js b/public/assets/js/lib/views/details/comments.js new file mode 100644 index 0000000..164a3b1 --- /dev/null +++ b/public/assets/js/lib/views/details/comments.js @@ -0,0 +1,39 @@ +var CommentsView = FormView.extend({ + + el: "#comments", + + events: { + }, + + initialize: function(){ + this.__super__.initialize.call(this) + this.template = this.$(".template").html() + }, + + load: function(comments){ + comments.forEach(this.appendComment.bind(this)) + }, + + parse: function(comment){ + var datetime = verbose_date(comment.date) + var t = this.template.replace(/{{username}}/g, comment.username) + .replace(/{{comment}}/g, comment.comment) + .replace(/{{date}}/g, datetime[0]) + .replace(/{{time}}/g, datetime[1]) + return t + }, + + prependComment: function(comment){ + var $el = $( this.parse(comment) ) + this.$el.prepend($el) + }, + + appendComment: function(comment){ + var $el = $( this.parse(comment) ) + this.$el.append($el) + }, + + success: function(){ + this.prependComment(comment) + } +}) \ No newline at end of file diff --git a/public/assets/js/lib/views/details/files.js b/public/assets/js/lib/views/details/files.js new file mode 100644 index 0000000..5a19519 --- /dev/null +++ b/public/assets/js/lib/views/details/files.js @@ -0,0 +1,59 @@ +var FilesView = FormView.extend({ + + el: "#files", + + events: { + }, + + initialize: function(){ + this.__super__.initialize.call(this) + this.template = this.$(".template").html() + this.templateTotal = this.$(".templateTotal").html() + }, + + load: function(files){ + if (! files.length) { + this.$el.hide() + } + var total = 0 + files.forEach(function(file){ + this.appendFile(file) + total += file.size + }.bind(this)) + + var size = hush_size(total) + var t = this.templateTotal.replace(/{{size_class}}/g, size[0]) + .replace(/{{size}}/g, size[1]) + this.$el.append(t) + }, + + parse: function(file){ + var size = hush_size(file.size) + var datetime = verbose_date(file.date) + var date_class = carbon_date(file.date) + + var t = this.template.replace(/{{username}}/g, file.username) + .replace(/{{link}}/g, file.filename) + .replace(/{{filename}}/g, file.filename) + .replace(/{{date_class}}/g, date_class) + .replace(/{{date}}/g, datetime[0]) + .replace(/{{time}}/g, datetime[1]) + .replace(/{{size_class}}/g, size[0]) + .replace(/{{size}}/g, size[1]) + return t + }, + + prependFile: function(file){ + var $el = $( this.parse(file) ) + this.$el.prepend($el) + }, + + appendFile: function(file){ + var $el = $( this.parse(file) ) + this.$el.append($el) + }, + + success: function(){ + this.prependFile(file) + } +}) \ No newline at end of file diff --git a/public/assets/js/lib/views/details/index.js b/public/assets/js/lib/views/details/index.js new file mode 100644 index 0000000..e2adb55 --- /dev/null +++ b/public/assets/js/lib/views/details/index.js @@ -0,0 +1,28 @@ +var DetailsView = View.extend({ + + events: { + }, + + action: "/api/thread/", + + initialize: function(opt){ + this.comments = new CommentsView ({ parent: this }) + this.files = new FilesView ({ parent: this }) + }, + + load: function(id){ + id = id.replace(/\D/g, "") + $.get(this.action + id, this.populate.bind(this)) + }, + + populate: function(data){ + $("h1").html(data.thread.title) + this.comments.load(data.comments) + this.files.load(data.files) + }, + + success: function(){ + window.location.href = "/index" + }, + +}) diff --git a/public/assets/js/lib/views/index/threadbox.js b/public/assets/js/lib/views/index/threadbox.js index 2e7d211..9f12411 100644 --- a/public/assets/js/lib/views/index/threadbox.js +++ b/public/assets/js/lib/views/index/threadbox.js @@ -27,14 +27,16 @@ var ThreadBox = View.extend({ var comments = hush_null(thread.comment_count, "c") var files = hush_null(thread.file_count, "f") var dot = privacy_dot(thread.private) + var datetime = verbose_date(thread.lastmodified) var t = this.template .replace(/{{id}}/g, thread.id) .replace(/{{username}}/g, thread.username) .replace(/{{privacy_dot}}/g, dot) .replace(/{{title}}/g, thread.title) - .replace(/{{age}}/g, verbose_date(thread.lastmodified) ) - .replace(/{{age_class}}/g, carbon_date(thread.lastmodified) ) + .replace(/{{date}}/g, datetime[0]) + .replace(/{{time}}/g, datetime[1]) + .replace(/{{date_class}}/g, carbon_date(thread.lastmodified) ) .replace(/{{views}}/g, views[1]) .replace(/{{comments}}/g, comments[1]) .replace(/{{files}}/g, files[1]) -- cgit v1.2.3-70-g09d2