From c486c293ef8ac00e945fd7b2c930ac4e247eb531 Mon Sep 17 00:00:00 2001 From: nilsding Date: Mon, 8 Dec 2014 15:42:34 +0100 Subject: [PATCH] restructured javascript files --- app/assets/javascripts/answer.coffee | 3 - .../javascripts/answerbox/comment.coffee | 65 +++++ .../javascripts/answerbox/destroy.coffee | 18 ++ app/assets/javascripts/answerbox/smile.coffee | 41 +++ .../javascripts/application.js.erb.coffee | 275 +----------------- app/assets/javascripts/inbox.coffee | 51 +++- app/assets/javascripts/questionbox/all.coffee | 28 ++ .../javascripts/questionbox/user.coffee | 29 ++ app/assets/javascripts/user.coffee | 45 ++- 9 files changed, 272 insertions(+), 283 deletions(-) delete mode 100644 app/assets/javascripts/answer.coffee create mode 100644 app/assets/javascripts/answerbox/comment.coffee create mode 100644 app/assets/javascripts/answerbox/destroy.coffee create mode 100644 app/assets/javascripts/answerbox/smile.coffee create mode 100644 app/assets/javascripts/questionbox/all.coffee create mode 100644 app/assets/javascripts/questionbox/user.coffee diff --git a/app/assets/javascripts/answer.coffee b/app/assets/javascripts/answer.coffee deleted file mode 100644 index 24f83d18..00000000 --- a/app/assets/javascripts/answer.coffee +++ /dev/null @@ -1,3 +0,0 @@ -# Place all the behaviors and hooks related to the matching controller here. -# All this logic will automatically be available in application.js. -# You can use CoffeeScript in this file: http://coffeescript.org/ diff --git a/app/assets/javascripts/answerbox/comment.coffee b/app/assets/javascripts/answerbox/comment.coffee new file mode 100644 index 00000000..3181a368 --- /dev/null +++ b/app/assets/javascripts/answerbox/comment.coffee @@ -0,0 +1,65 @@ +# Toggle button +$(document).on "click", "button[name=ab-comments]", -> + btn = $(this) + aid = btn[0].dataset.aId + state = btn[0].dataset.state + commentBox = $("#ab-comments-#{aid}") + + switch state + when 'hidden' + commentBox.slideDown() + btn[0].dataset.state = 'shown' + when 'shown' + commentBox.slideUp() + btn[0].dataset.state = 'hidden' + + +$(document).on "keyup", "input[name=ab-comment-new]", (evt) -> + input = $(this) + aid = input[0].dataset.aId + ctr = $("span#ab-comment-charcount-#{aid}") + cbox = $("div[name=ab-comment-new-group][data-a-id=#{aid}]") + + if evt.which == 13 # return key + evt.preventDefault() + return cbox.addClass "has-error" if input.val().length > 160 || input.val().trim().length == 0 + input.attr 'disabled', 'disabled' + + $.ajax + url: '/ajax/create_comment' + type: 'POST' + data: + answer: aid + comment: input.val() + dataType: 'json' # jQuery can't guess the datatype correctly here... + success: (data, status, jqxhr) -> + console.log data + if data.success + $(".panel-footer#ab-comments-#{aid}").html data.render + input.val '' + ctr.html 160 + $("span#ab-comment-count-#{aid}").html data.count + showNotification data.message, data.success + error: (jqxhr, status, error) -> + console.log jqxhr, status, error + showNotification "An error occurred, a developer should check the console for details", false + complete: (jqxhr, status) -> + input.removeAttr 'disabled' + + +# character count +$(document).on "input", "input[name=ab-comment-new]", (evt) -> + input = $(this) + aid = input[0].dataset.aId + ctr = $("span#ab-comment-charcount-#{aid}") + + cbox = $("div[name=ab-comment-new-group][data-a-id=#{aid}]") + cbox.removeClass "has-error" if cbox.hasClass "has-error" + + ctr.html 160 - input.val().length + if Number(ctr.html()) < 0 + ctr.removeClass 'text-muted' + ctr.addClass 'text-danger' + else + ctr.removeClass 'text-danger' + ctr.addClass 'text-muted' \ No newline at end of file diff --git a/app/assets/javascripts/answerbox/destroy.coffee b/app/assets/javascripts/answerbox/destroy.coffee new file mode 100644 index 00000000..5631a861 --- /dev/null +++ b/app/assets/javascripts/answerbox/destroy.coffee @@ -0,0 +1,18 @@ +$(document).on "click", "button[name=ab-destroy]", -> + btn = $(this) + btn.button "loading" + aid = btn[0].dataset.aId + $.ajax + url: '/ajax/destroy_answer' # TODO: find a way to use rake routes instead of hardcoding them here + type: 'POST' + data: + answer: aid + success: (data, status, jqxhr) -> + if data.success + $("div.answer-box[data-id=#{aid}]").slideUp() + showNotification data.message, data.success + error: (jqxhr, status, error) -> + console.log jqxhr, status, error + showNotification "An error occurred, a developer should check the console for details", false + complete: (jqxhr, status) -> + btn.button "reset" \ No newline at end of file diff --git a/app/assets/javascripts/answerbox/smile.coffee b/app/assets/javascripts/answerbox/smile.coffee new file mode 100644 index 00000000..0595cdc1 --- /dev/null +++ b/app/assets/javascripts/answerbox/smile.coffee @@ -0,0 +1,41 @@ +$(document).on "click", "button[name=ab-smile]", -> + btn = $(this) + aid = btn[0].dataset.aId + action = btn[0].dataset.action + count = Number $("span#ab-smile-count-#{aid}").html() + btn[0].dataset.loadingText = " #{count}" + btn.button "loading" + + target_url = switch action + when 'smile' + count++ + '/ajax/create_smile' + when 'unsmile' + count-- + '/ajax/destroy_smile' + + success = false + + $.ajax + url: target_url + type: 'POST' + data: + id: aid + success: (data, status, jqxhr) -> + success = data.success + if success + $("span#ab-smile-count-#{aid}").html(count) + showNotification data.message, data.success + error: (jqxhr, status, error) -> + console.log jqxhr, status, error + showNotification "An error occurred, a developer should check the console for details", false + complete: (jqxhr, status) -> + btn.button "reset" + if success + switch action + when 'smile' + btn[0].dataset.action = 'unsmile' + btn.html " #{count}" + when 'unsmile' + btn[0].dataset.action = 'smile' + btn.html " #{count}" \ No newline at end of file diff --git a/app/assets/javascripts/application.js.erb.coffee b/app/assets/javascripts/application.js.erb.coffee index bf45abe7..3693840e 100644 --- a/app/assets/javascripts/application.js.erb.coffee +++ b/app/assets/javascripts/application.js.erb.coffee @@ -11,7 +11,7 @@ NProgress.configure showSpinner: false -showNotification = (text, success=true) -> +window.showNotification = (text, success=true) -> args = title: if success then "Success!" else "Uh-oh..." message: text @@ -20,278 +20,5 @@ showNotification = (text, success=true) -> else $.growl.error args -$(document).on "click", "button[name=qb-ask]", -> - btn = $(this) - btn.button "loading" - promote = btn[0].dataset.promote == "true" - $("textarea[name=qb-question]").attr "readonly", "readonly" - anonymousQuestion = if $("input[name=qb-anonymous]")[0] != undefined - $("input[name=qb-anonymous]")[0].checked - else - true - $.ajax - url: '/ajax/ask' # TODO: find a way to use rake routes instead of hardcoding them here - type: 'POST' - data: - rcpt: $("input[name=qb-to]").val() - question: $("textarea[name=qb-question]").val() - anonymousQuestion: anonymousQuestion - success: (data, status, jqxhr) -> - if data.success - $("textarea[name=qb-question]").val '' - if promote - $("div#question-box").hide() - $("div#question-box-promote").show() - showNotification data.message, data.success - error: (jqxhr, status, error) -> - console.log jqxhr, status, error - showNotification "An error occurred, a developer should check the console for details", false - complete: (jqxhr, status) -> - btn.button "reset" - $("textarea[name=qb-question]").removeAttr "readonly" - -$(document).on "click", "button[name=qb-all-ask]", -> - btn = $(this) - btn.button "loading" - $("textarea[name=qb-all-question]").attr "readonly", "readonly" - - $.ajax - url: '/ajax/ask' - type: 'POST' - data: - rcpt: "followers" - question: $("textarea[name=qb-all-question]").val() - anonymousQuestion: false - success: (data, status, jqxhr) -> - if data.success - $("textarea[name=qb-all-question]").val '' - $('#modal-ask-followers').modal('hide') - showNotification data.message, data.success - error: (jqxhr, status, error) -> - console.log jqxhr, status, error - showNotification "An error occurred, a developer should check the console for details", false - complete: (jqxhr, status) -> - btn.button "reset" - $("textarea[name=qb-all-question]").removeAttr "readonly" - -$(document).on "keydown", "textarea[name=ib-answer]", (evt) -> - iid = $(this)[0].dataset.id - if evt.keyCode == 13 and evt.ctrlKey - # trigger warning: - $("button[name=ib-answer][data-ib-id=#{iid}]").trigger 'click' - -$(document).on "click", "button[name=ib-answer]", -> - btn = $(this) - btn.button "loading" - iid = btn[0].dataset.ibId - $("textarea[name=ib-answer][data-id=#{iid}]").attr "readonly", "readonly" - $.ajax - url: '/ajax/answer' # TODO: find a way to use rake routes instead of hardcoding them here - type: 'POST' - data: - id: iid - answer: $("textarea[name=ib-answer][data-id=#{iid}]").val() - success: (data, status, jqxhr) -> - if data.success - $("div.inbox-box[data-id=#{iid}]").slideUp() - showNotification data.message, data.success - error: (jqxhr, status, error) -> - console.log jqxhr, status, error - showNotification "An error occurred, a developer should check the console for details", false - complete: (jqxhr, status) -> - btn.button "reset" - $("textarea[name=ib-answer][data-id=#{iid}]").removeAttr "readonly" - -$(document).on "click", "button[name=ib-destroy]", -> - btn = $(this) - btn.button "loading" - iid = btn[0].dataset.ibId - $("textarea[name=ib-answer][data-id=#{iid}]").attr "readonly", "readonly" - $.ajax - url: '/ajax/delete_inbox' - type: 'POST' - data: - id: iid - success: (data, status, jqxhr) -> - if data.success - $("div.inbox-box[data-id=#{iid}]").slideUp() - showNotification data.message, data.success - error: (jqxhr, status, error) -> - console.log jqxhr, status, error - showNotification "An error occurred, a developer should check the console for details", false - complete: (jqxhr, status) -> - btn.button "reset" - $("textarea[name=ib-answer][data-id=#{iid}]").removeAttr "readonly" - -$(document).on "click", "button[name=ab-destroy]", -> - btn = $(this) - btn.button "loading" - aid = btn[0].dataset.aId - $.ajax - url: '/ajax/destroy_answer' # TODO: find a way to use rake routes instead of hardcoding them here - type: 'POST' - data: - answer: aid - success: (data, status, jqxhr) -> - if data.success - $("div.answer-box[data-id=#{aid}]").slideUp() - showNotification data.message, data.success - error: (jqxhr, status, error) -> - console.log jqxhr, status, error - showNotification "An error occurred, a developer should check the console for details", false - complete: (jqxhr, status) -> - btn.button "reset" - -$(document).on "click", "button[name=ab-smile]", -> - btn = $(this) - aid = btn[0].dataset.aId - action = btn[0].dataset.action - count = Number $("span#ab-smile-count-#{aid}").html() - btn[0].dataset.loadingText = " #{count}" - btn.button "loading" - - target_url = switch action - when 'smile' - count++ - '/ajax/create_smile' - when 'unsmile' - count-- - '/ajax/destroy_smile' - - success = false - - $.ajax - url: target_url - type: 'POST' - data: - id: aid - success: (data, status, jqxhr) -> - success = data.success - if success - $("span#ab-smile-count-#{aid}").html(count) - showNotification data.message, data.success - error: (jqxhr, status, error) -> - console.log jqxhr, status, error - showNotification "An error occurred, a developer should check the console for details", false - complete: (jqxhr, status) -> - btn.button "reset" - if success - switch action - when 'smile' - btn[0].dataset.action = 'unsmile' - btn.html " #{count}" - when 'unsmile' - btn[0].dataset.action = 'smile' - btn.html " #{count}" - -$(document).on "click", "button[name=ab-comments]", -> - btn = $(this) - aid = btn[0].dataset.aId - state = btn[0].dataset.state - commentBox = $("#ab-comments-#{aid}") - - switch state - when 'hidden' - commentBox.slideDown() - btn[0].dataset.state = 'shown' - when 'shown' - commentBox.slideUp() - btn[0].dataset.state = 'hidden' - -$(document).on "keyup", "input[name=ab-comment-new]", (evt) -> - input = $(this) - aid = input[0].dataset.aId - ctr = $("span#ab-comment-charcount-#{aid}") - cbox = $("div[name=ab-comment-new-group][data-a-id=#{aid}]") - - if evt.which == 13 # return key - evt.preventDefault() - return cbox.addClass "has-error" if input.val().length > 160 || input.val().trim().length == 0 - input.attr 'disabled', 'disabled' - - $.ajax - url: '/ajax/create_comment' - type: 'POST' - data: - answer: aid - comment: input.val() - dataType: 'json' # jQuery can't guess the datatype correctly here... - success: (data, status, jqxhr) -> - console.log data - if data.success - $(".panel-footer#ab-comments-#{aid}").html data.render - input.val '' - ctr.html 160 - $("span#ab-comment-count-#{aid}").html data.count - showNotification data.message, data.success - error: (jqxhr, status, error) -> - console.log jqxhr, status, error - showNotification "An error occurred, a developer should check the console for details", false - complete: (jqxhr, status) -> - input.removeAttr 'disabled' - -$(document).on "input", "input[name=ab-comment-new]", (evt) -> - input = $(this) - aid = input[0].dataset.aId - ctr = $("span#ab-comment-charcount-#{aid}") - - cbox = $("div[name=ab-comment-new-group][data-a-id=#{aid}]") - cbox.removeClass "has-error" if cbox.hasClass "has-error" - - ctr.html 160 - input.val().length - if Number(ctr.html()) < 0 - ctr.removeClass 'text-muted' - ctr.addClass 'text-danger' - else - ctr.removeClass 'text-danger' - ctr.addClass 'text-muted' - -$(document).on "click", "button[name=user-action]", -> - btn = $(this) - btn.button "loading" - target = btn[0].dataset.target - action = btn[0].dataset.action - count = Number $("h4.entry-text#follower-count").html() - - target_url = switch action - when 'follow' - count++ - '/ajax/create_friend' - when 'unfollow' - count-- - '/ajax/destroy_friend' - - success = false - - $.ajax - url: target_url - type: 'POST' - data: - screen_name: target - success: (data, status, jqxhr) -> - success = data.success - if data.success - $("h4.entry-text#follower-count").html(count) - showNotification data.message, data.success - error: (jqxhr, status, error) -> - console.log jqxhr, status, error - showNotification "An error occurred, a developer should check the console for details", false - complete: (jqxhr, status) -> - btn.button "reset" - if success - switch action - when 'follow' - btn[0].dataset.action = 'unfollow' - btn.attr 'class', 'btn btn-default btn-block' - btn.html 'Unfollow' - when 'unfollow' - btn[0].dataset.action = 'follow' - btn.attr 'class', 'btn btn-primary btn-block' - btn.html 'Follow' - $(document).on "click", "button#create-account", -> Turbolinks.visit "/sign_up" - -$(document).on "click", "button#new-question", -> - $("div#question-box").show() - $("div#question-box-promote").hide() diff --git a/app/assets/javascripts/inbox.coffee b/app/assets/javascripts/inbox.coffee index 24f83d18..b3116636 100644 --- a/app/assets/javascripts/inbox.coffee +++ b/app/assets/javascripts/inbox.coffee @@ -1,3 +1,48 @@ -# Place all the behaviors and hooks related to the matching controller here. -# All this logic will automatically be available in application.js. -# You can use CoffeeScript in this file: http://coffeescript.org/ +$(document).on "keydown", "textarea[name=ib-answer]", (evt) -> + iid = $(this)[0].dataset.id + if evt.keyCode == 13 and evt.ctrlKey + # trigger warning: + $("button[name=ib-answer][data-ib-id=#{iid}]").trigger 'click' + +$(document).on "click", "button[name=ib-answer]", -> + btn = $(this) + btn.button "loading" + iid = btn[0].dataset.ibId + $("textarea[name=ib-answer][data-id=#{iid}]").attr "readonly", "readonly" + $.ajax + url: '/ajax/answer' # TODO: find a way to use rake routes instead of hardcoding them here + type: 'POST' + data: + id: iid + answer: $("textarea[name=ib-answer][data-id=#{iid}]").val() + success: (data, status, jqxhr) -> + if data.success + $("div.inbox-box[data-id=#{iid}]").slideUp() + showNotification data.message, data.success + error: (jqxhr, status, error) -> + console.log jqxhr, status, error + showNotification "An error occurred, a developer should check the console for details", false + complete: (jqxhr, status) -> + btn.button "reset" + $("textarea[name=ib-answer][data-id=#{iid}]").removeAttr "readonly" + +$(document).on "click", "button[name=ib-destroy]", -> + btn = $(this) + btn.button "loading" + iid = btn[0].dataset.ibId + $("textarea[name=ib-answer][data-id=#{iid}]").attr "readonly", "readonly" + $.ajax + url: '/ajax/delete_inbox' + type: 'POST' + data: + id: iid + success: (data, status, jqxhr) -> + if data.success + $("div.inbox-box[data-id=#{iid}]").slideUp() + showNotification data.message, data.success + error: (jqxhr, status, error) -> + console.log jqxhr, status, error + showNotification "An error occurred, a developer should check the console for details", false + complete: (jqxhr, status) -> + btn.button "reset" + $("textarea[name=ib-answer][data-id=#{iid}]").removeAttr "readonly" \ No newline at end of file diff --git a/app/assets/javascripts/questionbox/all.coffee b/app/assets/javascripts/questionbox/all.coffee new file mode 100644 index 00000000..31d51ee0 --- /dev/null +++ b/app/assets/javascripts/questionbox/all.coffee @@ -0,0 +1,28 @@ +$(document).on "click", "button[name=qb-all-ask]", -> + btn = $(this) + btn.button "loading" + $("textarea[name=qb-all-question]").attr "readonly", "readonly" + + $.ajax + url: '/ajax/ask' + type: 'POST' + data: + rcpt: "followers" + question: $("textarea[name=qb-all-question]").val() + anonymousQuestion: false + success: (data, status, jqxhr) -> + if data.success + $("textarea[name=qb-all-question]").val '' + $('#modal-ask-followers').modal('hide') + showNotification data.message, data.success + error: (jqxhr, status, error) -> + console.log jqxhr, status, error + showNotification "An error occurred, a developer should check the console for details", false + complete: (jqxhr, status) -> + btn.button "reset" + $("textarea[name=qb-all-question]").removeAttr "readonly" + +# for that promotional thing +$(document).on "click", "button#new-question", -> + $("div#question-box").show() + $("div#question-box-promote").hide() diff --git a/app/assets/javascripts/questionbox/user.coffee b/app/assets/javascripts/questionbox/user.coffee new file mode 100644 index 00000000..77c8b113 --- /dev/null +++ b/app/assets/javascripts/questionbox/user.coffee @@ -0,0 +1,29 @@ +$(document).on "click", "button[name=qb-ask]", -> + btn = $(this) + btn.button "loading" + promote = btn[0].dataset.promote == "true" + $("textarea[name=qb-question]").attr "readonly", "readonly" + anonymousQuestion = if $("input[name=qb-anonymous]")[0] != undefined + $("input[name=qb-anonymous]")[0].checked + else + true + $.ajax + url: '/ajax/ask' # TODO: find a way to use rake routes instead of hardcoding them here + type: 'POST' + data: + rcpt: $("input[name=qb-to]").val() + question: $("textarea[name=qb-question]").val() + anonymousQuestion: anonymousQuestion + success: (data, status, jqxhr) -> + if data.success + $("textarea[name=qb-question]").val '' + if promote + $("div#question-box").hide() + $("div#question-box-promote").show() + showNotification data.message, data.success + error: (jqxhr, status, error) -> + console.log jqxhr, status, error + showNotification "An error occurred, a developer should check the console for details", false + complete: (jqxhr, status) -> + btn.button "reset" + $("textarea[name=qb-question]").removeAttr "readonly" diff --git a/app/assets/javascripts/user.coffee b/app/assets/javascripts/user.coffee index 24f83d18..0752092c 100644 --- a/app/assets/javascripts/user.coffee +++ b/app/assets/javascripts/user.coffee @@ -1,3 +1,42 @@ -# Place all the behaviors and hooks related to the matching controller here. -# All this logic will automatically be available in application.js. -# You can use CoffeeScript in this file: http://coffeescript.org/ +$(document).on "click", "button[name=user-action]", -> + btn = $(this) + btn.button "loading" + target = btn[0].dataset.target + action = btn[0].dataset.action + count = Number $("h4.entry-text#follower-count").html() + + target_url = switch action + when 'follow' + count++ + '/ajax/create_friend' + when 'unfollow' + count-- + '/ajax/destroy_friend' + + success = false + + $.ajax + url: target_url + type: 'POST' + data: + screen_name: target + success: (data, status, jqxhr) -> + success = data.success + if data.success + $("h4.entry-text#follower-count").html(count) + showNotification data.message, data.success + error: (jqxhr, status, error) -> + console.log jqxhr, status, error + showNotification "An error occurred, a developer should check the console for details", false + complete: (jqxhr, status) -> + btn.button "reset" + if success + switch action + when 'follow' + btn[0].dataset.action = 'unfollow' + btn.attr 'class', 'btn btn-default btn-block' + btn.html 'Unfollow' + when 'unfollow' + btn[0].dataset.action = 'follow' + btn.attr 'class', 'btn btn-primary btn-block' + btn.html 'Follow'