diff options
| -rw-r--r-- | app/assets/javascripts/gfm_auto_complete.js.coffee | 57 | ||||
| -rw-r--r-- | app/views/layouts/_head_panel.html.haml | 2 | ||||
| -rw-r--r-- | app/views/layouts/_init_auto_complete.html.haml | 17 | ||||
| -rw-r--r-- | app/views/notes/_common_form.html.haml | 46 |
4 files changed, 76 insertions, 46 deletions
diff --git a/app/assets/javascripts/gfm_auto_complete.js.coffee b/app/assets/javascripts/gfm_auto_complete.js.coffee new file mode 100644 index 00000000000..203a5b6745a --- /dev/null +++ b/app/assets/javascripts/gfm_auto_complete.js.coffee @@ -0,0 +1,57 @@ + +### + Creates the variables for setting up GFM auto-completion +### +# Emoji +window.autocompleteEmojiData = []; +window.autocompleteEmojiTemplate = "<li data-value='${insert}'>${name} <img alt='${name}' height='20' src='${image}' width='20' /></li>"; + +# Team Members +window.autocompleteMembersUrl = ""; +window.autocompleteMembersParams = + private_token: "" + page: 1 +window.autocompleteMembersData = []; + + + +### + Add GFM auto-completion to all input fields, that accept GFM input. +### +window.setupGfmAutoComplete = -> + ### + Emoji + ### + $('.gfm-input').atWho ':', + data: autocompleteEmojiData, + tpl: autocompleteEmojiTemplate + + ### + Team Members + ### + $('.gfm-input').atWho '@', (query, callback) -> + (getMoreMembers = -> + $.getJSON(autocompleteMembersUrl, autocompleteMembersParams) + .success (members) -> + # pick the data we need + newMembersData = $.map members, (m) -> m.name + + # add the new page of data to the rest + $.merge autocompleteMembersData, newMembersData + + # show the pop-up with a copy of the current data + callback autocompleteMembersData[..] + + # are we past the last page? + if newMembersData.length == 0 + # set static data and stop callbacks + $('.gfm-input').atWho '@', + data: autocompleteMembersData + callback: null + else + # get next page + getMoreMembers() + + # so the next request gets the next page + autocompleteMembersParams.page += 1; + ).call();
\ No newline at end of file diff --git a/app/views/layouts/_head_panel.html.haml b/app/views/layouts/_head_panel.html.haml index f5e423a5abf..7f89bdf0e9a 100644 --- a/app/views/layouts/_head_panel.html.haml +++ b/app/views/layouts/_head_panel.html.haml @@ -28,6 +28,8 @@ My profile = link_to 'Logout', destroy_user_session_path, class: "logout", method: :delete += render "layouts/init_auto_complete" + :javascript $(function(){ $("#search").autocomplete({ diff --git a/app/views/layouts/_init_auto_complete.html.haml b/app/views/layouts/_init_auto_complete.html.haml new file mode 100644 index 00000000000..87a74655128 --- /dev/null +++ b/app/views/layouts/_init_auto_complete.html.haml @@ -0,0 +1,17 @@ +:javascript + $(function() { + autocompleteMembersUrl = "#{ "/api/v2/projects/#{@project.code}/members" if @project }"; + autocompleteMembersParams.private_token = "#{current_user.authentication_token}"; + + autocompleteEmojiData = #{raw emoji_autocomplete_source}; + // convert the list so that the items have the right format for completion + autocompleteEmojiData = $.map(autocompleteEmojiData, function(value) { + return { + name: value, + insert: value+':', + image: '#{image_path("emoji")}/'+value+'.png' + } + }); + + setupGfmAutoComplete(); + }); diff --git a/app/views/notes/_common_form.html.haml b/app/views/notes/_common_form.html.haml index 4ac26d33e66..a9f2907b05a 100644 --- a/app/views/notes/_common_form.html.haml +++ b/app/views/notes/_common_form.html.haml @@ -36,49 +36,3 @@ %a.file_upload.btn.small Upload File = f.file_field :attachment, class: "input-file" %span.hint Any file less than 10 MB - -:javascript - $(function(){ - // init auto-completion of team members - var membersUrl = "#{root_url}/api/v2/projects/#{@project.code}/members"; - var membersParams = { - private_token: "#{current_user.authentication_token}", - page: 1, - }; - var membersData = []; - $('.gfm-input').atWho('@', function(query, callback) { - (function getMoreMembers() { - $.getJSON(membersUrl, membersParams). - success(function(members) { - // pick the data we need - var newMembersData = $.map(members, function(member) { return member.name }); - - // add the new page of data to the rest - $.merge(membersData, newMembersData); - - // show the pop-up with a copy of the current data - callback(membersData.slice(0)); - - // are we past the last page? - if (newMembersData.length == 0) { - // set static data and stop callbacks - $('.gfm-input').atWho('@', { data: membersData, callback: null }); - } else { - // get next page - getMoreMembers(); - } - }); - // next request will get the next page - membersParams.page += 1; - })(); - }); - - // init auto-completion of emoji - var emoji = #{emoji_for_completion}; - // convert the list so that the items have the right format for completion - emoji = $.map(emoji, function(value) {return { key: value+':', name: value }}); - $('.gfm-input').atWho(':', { - data: emoji, - tpl: "<li data-value='${key}'>${name} #{escape_javascript image_tag('emoji/${name}.png', :size => '20x20')}</li>" - }); - }); |