diff options
| -rw-r--r-- | app/assets/javascripts/awards_handler.coffee | 151 | ||||
| -rw-r--r-- | app/views/award_emoji/_awards_block.html.haml | 2 | ||||
| -rw-r--r-- | app/views/projects/notes/_note.html.haml | 4 |
3 files changed, 92 insertions, 65 deletions
diff --git a/app/assets/javascripts/awards_handler.coffee b/app/assets/javascripts/awards_handler.coffee index e211c86f425..071dbd36641 100644 --- a/app/assets/javascripts/awards_handler.coffee +++ b/app/assets/javascripts/awards_handler.coffee @@ -6,35 +6,43 @@ class @AwardsHandler $(document) .off 'click', '.js-add-award' - .on 'click', '.js-add-award', (event) => - event.stopPropagation() - event.preventDefault() + .on 'click', '.js-add-award', (e) => + e.stopPropagation() + e.preventDefault() - @showEmojiMenu $(event.currentTarget) + @showEmojiMenu $(e.currentTarget) - $('html').on 'click', (event) -> - unless $(event.target).closest('.emoji-menu').length + $('html').on 'click', (e) -> + $target = $ e.target + + unless $target.closest('.emoji-menu-content').length + $('.js-awards-block.current').removeClass 'current' + + unless $target.closest('.emoji-menu').length if $('.emoji-menu').is(':visible') $('.js-add-award.is-active').removeClass 'is-active' $('.emoji-menu').removeClass 'is-visible' $(document) .off 'click', '.js-emoji-btn' - .on 'click', '.js-emoji-btn', @handleClick - + .on 'click', '.js-emoji-btn', (e) => + e.preventDefault() - handleClick: (e) => + $target = $ e.currentTarget + emoji = $target.find('.icon').data 'emoji' - e.preventDefault() - - emoji = $(e.currentTarget).find('.icon').data 'emoji' - @getVotesBlock().addClass 'js-awards-block' - @addAward @getAwardUrl(), emoji + $target.closest('.js-awards-block').addClass 'current' + @addAward @getAwardUrl(), emoji showEmojiMenu: ($addBtn) -> - $menu = $('.emoji-menu') + $menu = $ '.emoji-menu' + + if $addBtn.hasClass 'note-emoji-button' + $addBtn.parents('.note').find('.js-awards-block').addClass 'current' + else + $addBtn.closest('.js-awards-block').addClass 'current' if $menu.length $holder = $addBtn.closest('.js-award-holder') @@ -68,7 +76,7 @@ class @AwardsHandler createEmojiMenu: (awardMenuUrl, callback) -> - $.get awardMenuUrl, (response) => + $.get awardMenuUrl, (response) -> $('body').append response callback() @@ -94,11 +102,10 @@ class @AwardsHandler addAward: (awardUrl, emoji, checkMutuality = yes) -> - emoji = @normilizeEmojiName(emoji) - @postEmoji awardUrl, emoji, => - @addAwardToEmojiBar(emoji, checkMutuality) + emoji = @normilizeEmojiName emoji - $('.js-awards-block-current').removeClass 'js-awards-block-current' + @postEmoji awardUrl, emoji, => + @addAwardToEmojiBar emoji, checkMutuality $('.emoji-menu').removeClass 'is-visible' @@ -108,25 +115,26 @@ class @AwardsHandler @checkMutuality emoji if checkForMutuality @addEmojiToFrequentlyUsedList(emoji) - emoji = @normilizeEmojiName(emoji) + emoji = @normilizeEmojiName(emoji) $emojiBtn = @findEmojiIcon(emoji).parent() if $emojiBtn.length > 0 - if @isActive($emojiBtn) - @decrementCounter($emojiBtn, emoji) + if @isActive $emojiBtn + @decrementCounter $emojiBtn, emoji else - counter = $emojiBtn.find('.js-counter') - counter.text(parseInt(counter.text()) + 1) - $emojiBtn.addClass('active') - @addMeToUserList(emoji) + counter = $emojiBtn.find '.js-counter' + counter.text parseInt(counter.text()) + 1 + $emojiBtn.addClass 'active' + @addMeToUserList emoji else - @createEmoji(emoji) + @getVotesBlock().removeClass 'hidden' + @createEmoji emoji - getVotesBlock: -> return $ '.awards.js-awards-block' + getVotesBlock: -> return $ '.js-awards-block.current' - getAwardUrl: -> @getVotesBlock().data 'award-url' + getAwardUrl: -> return @getVotesBlock().data 'award-url' checkMutuality: (emoji) -> @@ -135,8 +143,9 @@ class @AwardsHandler if emoji in [ 'thumbsup', 'thumbsdown' ] mutualVote = if emoji is 'thumbsup' then 'thumbsdown' else 'thumbsup' + selector = "[data-emoji=#{mutualVote}]" - isAlreadyVoted = $("[data-emoji=#{mutualVote}]").parent().hasClass 'active' + isAlreadyVoted = @getVotesBlock().find(selector).parent().hasClass 'active' @addAward awardUrl, mutualVote, no if isAlreadyVoted @@ -144,28 +153,35 @@ class @AwardsHandler decrementCounter: ($emojiBtn, emoji) -> - isntNoteBody = $emojiBtn.closest('.note-body').length is 0 - counter = $('.js-counter', $emojiBtn) - counterNumber = parseInt(counter.text()) - if !isntNoteBody - # If this is a note body, we just hide the award emoji row like the initial state - $emojiBtn.closest('.js-awards-block').addClass 'hidden' + counter = $('.js-counter', $emojiBtn) + counterNumber = parseInt(counter.text()) if counterNumber > 1 counter.text(counterNumber - 1) @removeMeFromUserList($emojiBtn, emoji) - else if (emoji == 'thumbsup' || emoji == 'thumbsdown') && isntNoteBody + else if emoji is 'thumbsup' or emoji is 'thumbsdown' $emojiBtn.tooltip('destroy') counter.text('0') @removeMeFromUserList($emojiBtn, emoji) + @removeEmoji $emojiBtn if $emojiBtn.parents('.note').length else - $emojiBtn.tooltip('destroy') - $emojiBtn.remove() + @removeEmoji $emojiBtn $emojiBtn.removeClass('active') + removeEmoji: ($emojiBtn) -> + + $emojiBtn.tooltip('destroy') + $emojiBtn.remove() + + $votesBlock = @getVotesBlock() + + if $votesBlock.find('.js-emoji-btn').length is 0 + $votesBlock.addClass 'hidden' + + getAwardTooltip: ($awardBlock) -> return $awardBlock.attr('data-original-title') or $awardBlock.attr('data-title') @@ -225,16 +241,12 @@ class @AwardsHandler </button>" emoji_node = $(buttonHtml) - .insertBefore '.js-awards-block .js-award-holder:not(.js-award-action-btn)' + .insertBefore '.js-awards-block.current .js-award-holder:not(.js-award-action-btn)' .find '.emoji-icon' .data 'emoji', emoji $('.award-control').tooltip() - - $currentBlock = $ '.js-awards-block' - - if $currentBlock.is '.hidden' - $currentBlock.removeClass 'hidden' + $('.js-awards-block.current').removeClass 'current' createEmoji: (emoji) -> @@ -261,42 +273,53 @@ class @AwardsHandler postEmoji: (awardUrl, emoji, callback) -> + $.post awardUrl, { name: emoji }, (data) -> - if data.ok - callback.call() + callback.call() if data.ok + findEmojiIcon: (emoji) -> - $(".js-awards-block.awards > .js-emoji-btn [data-emoji='#{emoji}']") + + return $(".js-awards-block.current > .js-emoji-btn [data-emoji='#{emoji}']") + scrollToAwards: -> - $('body, html').animate({ - scrollTop: $('.awards').offset().top - 80 - }, 200) - normilizeEmojiName: (emoji) -> - @aliases[emoji] || emoji + options = scrollTop: $('.awards').offset().top - 80 + $('body, html').animate options, 200 + + + normilizeEmojiName: (emoji) -> return @aliases[emoji] or emoji + addEmojiToFrequentlyUsedList: (emoji) -> - frequently_used_emojis = @getFrequentlyUsedEmojis() - frequently_used_emojis.push(emoji) - $.cookie('frequently_used_emojis', frequently_used_emojis.join(','), { expires: 365 }) + + frequentlyUsedEmojis = @getFrequentlyUsedEmojis() + frequentlyUsedEmojis.push emoji + $.cookie 'frequently_used_emojis', frequentlyUsedEmojis.join(','), { expires: 365 } + getFrequentlyUsedEmojis: -> - frequently_used_emojis = ($.cookie('frequently_used_emojis') || '').split(',') - _.compact(_.uniq(frequently_used_emojis)) + + frequentlyUsedEmojis = ($.cookie('frequently_used_emojis') or '').split(',') + return _.compact _.uniq frequentlyUsedEmojis + renderFrequentlyUsedBlock: -> - if $.cookie('frequently_used_emojis') - frequently_used_emojis = @getFrequentlyUsedEmojis() + + if $.cookie 'frequently_used_emojis' + frequentlyUsedEmojis = @getFrequentlyUsedEmojis() ul = $("<ul class='clearfix emoji-menu-list'>") - for emoji in frequently_used_emojis + for emoji in frequentlyUsedEmojis $(".emoji-menu-content [data-emoji='#{emoji}']").closest('li').clone().appendTo(ul) $('input.emoji-search').after(ul).after($('<h5>').text('Frequently used')) + setupSearch: -> + $('input.emoji-search').on 'keyup', (ev) => term = $(ev.target).val() @@ -313,5 +336,7 @@ class @AwardsHandler else $('.emoji-menu-content').children().show() - searchEmojis: (term)-> + + searchEmojis: (term) -> + $(".emoji-menu-content [data-emoji*='#{term}']").closest('li').clone() diff --git a/app/views/award_emoji/_awards_block.html.haml b/app/views/award_emoji/_awards_block.html.haml index e9302c39753..84fd146a26b 100644 --- a/app/views/award_emoji/_awards_block.html.haml +++ b/app/views/award_emoji/_awards_block.html.haml @@ -11,7 +11,7 @@ gl.awardMenuUrl = "#{emojis_path}" .award-menu-holder.js-award-holder - %button.btn.award-control.js-add-award{ type: "button", data: { award_menu_url: emojis_path } } + %button.btn.award-control.js-add-award{ type: "button" } = icon('smile-o', class: "award-control-icon award-control-icon-normal") = icon('spinner spin', class: "award-control-icon award-control-icon-loading") %span.award-control-text diff --git a/app/views/projects/notes/_note.html.haml b/app/views/projects/notes/_note.html.haml index c176778c515..47ab8906316 100644 --- a/app/views/projects/notes/_note.html.haml +++ b/app/views/projects/notes/_note.html.haml @@ -22,7 +22,7 @@ %span.note-role = access - if note_editable - = link_to '#', title: 'Add Reaction', class: 'note-emoji-button js-add-award js-note-emoji', data: { position: 'right' } do + = link_to '#', title: 'Award Emoji', class: 'note-emoji-button js-add-award js-note-emoji', data: { position: 'right' } do = icon('spinner spin') = icon('smile-o') = link_to '#', title: 'Edit comment', class: 'note-action-button js-note-edit' do @@ -35,6 +35,8 @@ = markdown(note.note, pipeline: :note, cache_key: [note, "note"], author: note.author) - if note_editable = render 'projects/notes/edit_form', note: note + .note-awards + = render 'award_emoji/awards_block', awardable: note, inline: false = edited_time_ago_with_tooltip(note, placement: 'bottom', html_class: 'note_edited_ago', include_author: true) - if note.attachment.url |