Merge branch 'improve-vote-link' into 'develop'

Improve the vote link reminder function

Closes #307

See merge request framasoft/framadate!280

js/app/adminstuds.js

@@ -2,7 +2,62 @@ $(document).ready(function() {
 
     wrapper = new MDEWrapper($('.js-desc textarea')[0], $('#rich-editor-button'), $('#simple-editor-button'));
     var firstOpening = true;
+    $('[data-toggle="popover"]').popover();
 
+    function createNode(text) {
+        var node = document.createElement('pre');
+        node.style.width = '1px';
+        node.style.height = '1px';
+        node.style.position = 'fixed';
+        node.style.top = '5px';
+        node.textContent = text;
+        return node;
+    }
+
+    function copyNode(node) {
+        var selection = getSelection();
+        selection.removeAllRanges();
+
+        var range = document.createRange();
+        range.selectNodeContents(node);
+        selection.addRange(range);
+
+        document.execCommand('copy');
+        selection.removeAllRanges();
+    }
+
+    function copyText(text) {
+        var node = createNode(text);
+        document.body.appendChild(node);
+        copyNode(node);
+        document.body.removeChild(node);
+    }
+
+    /**
+     * When clicked on a .clipboard-url link, copy link inside clipboard and show popover confirmation for 2 seconds
+     */
+    $('body').on('click', '.clipboard-url', function(e) {
+        var btn = $(e.target);
+        /**
+         * Kind of workaround for clicking child instead of button (because propagation is stopped with preventDefault())
+         */
+        if (!btn.get(0).hasAttribute('data-toggle')) {
+            btn = btn.parent();
+        }
+        /**
+         * Try catch because reasons : https://caniuse.com/#feat=clipboard
+         */
+        try {
+            copyText(btn.attr('href'));
+            btn.popover('show');
+            setTimeout(function () {
+                btn.popover('hide');
+            }, 2000);
+            e.preventDefault();
+        } catch (err) {
+            console.log('Oops, unable to copy');
+        }
+    });
 
     $('#title-form .btn-edit').on('click', function() {
         $('#title-form h3').hide();

js/app/studs.js

@@ -75,7 +75,8 @@ $(document).ready(function () {
                         var lastComment = $('#comments_list')
                             .find('div.comment')
                             .last();
-                        lastComment.effect('highlight', {color: 'green'}, 401);
+                        // TODO : replace old jQuery UI Effect with Modern CSS
+                        // lastComment.effect('highlight', {color: 'green'}, 401);
                         $('html, body').animate({
                             scrollTop: lastComment.offset().top
                         }, 750);

locale/en.json

@@ -273,6 +273,7 @@
       "Display the chart of the results": "Display the chart of the results",
       "Edit the line: %s": "Edit line: %s",
       "Link to edit this particular line": "Link to edit this particular line",
+      "Link to edit this particular line has been copied inside the clipboard!": "Link to edit this particular line has been copied inside the clipboard!",
       "Remove the line:": "Remove line:",
       "Save the choices": "Save choices",
       "Scroll to the left": "Scroll to the left",

locale/fr.json

@@ -273,6 +273,7 @@
       "Display the chart of the results": "Afficher le graphique des résultats",
       "Edit the line: %s": "Modifier la ligne : %s",
       "Link to edit this particular line": "Lien pour éditer cette ligne",
+      "Link to edit this particular line has been copied!": "Le lien pour éditer cette ligne a bien été copié dans le presse-papiers !",
       "Remove the line:": "Supprimer la ligne :",
       "Save the choices": "Enregistrer les choix",
       "Scroll to the left": "Faire défiler à gauche",

locale/fr_FR.json

@@ -273,6 +273,7 @@
       "Display the chart of the results": "Afficher le graphique des résultats",
       "Edit the line: %s": "Modifier la ligne : %s",
       "Link to edit this particular line": "Lien pour éditer cette ligne",
+      "Link to edit this particular line has been copied!": "Le lien pour éditer cette ligne a bien été copié dans le presse-papiers !",
       "Remove the line:": "Supprimer la ligne :",
       "Save the choices": "Enregistrer les choix",
       "Scroll to the left": "Faire défiler à gauche",

tpl/part/vote_table_classic.tpl

@@ -146,16 +146,15 @@
                                 <i class="glyphicon glyphicon-pencil"></i><span class="sr-only">{__('Generic', 'Edit')}</span>
                             </a>
                             {if $admin}
+                                <a href="{poll_url id=$poll->id vote_id=$vote->uniqId}" class="btn btn-default btn-sm clipboard-url" data-toggle="popover" data-trigger="manual" title="{__('Poll results', 'Link to edit this particular line')}" data-content="{__('Poll results', 'Link to edit this particular line has been copied!')}">
+                                    <span class="btn-link glyphicon glyphicon-link"></span>
+                                </a>
                                 <a href="{poll_url id=$admin_poll_id admin=true action='delete_vote' action_value=$vote->id}"
                                    class="btn btn-default btn-sm"
                                    title="{__('Poll results', 'Remove the line:')} {$vote->name|html}">
                                     <i class="glyphicon glyphicon-remove text-danger"></i><span class="sr-only">{__('Generic', 'Remove')}</span>
                                 </a>
 
-                                <a href="{poll_url id=$poll->id vote_id=$vote->uniqId}" class="btn btn-default btn-sm">
-                                    {__('Poll results', 'Link to edit this particular line')} <span class="btn-link glyphicon glyphicon-link"></span>
-                                </a>
-                                
                             {/if}
                         </td>
                     {else}

tpl/part/vote_table_date.tpl

@@ -204,16 +204,15 @@
                                 <i class="glyphicon glyphicon-pencil"></i><span class="sr-only">{__('Generic', 'Edit')}</span>
                             </a>
                             {if $admin}
+                                <a href="{poll_url id=$poll->id vote_id=$vote->uniqId}" class="btn btn-default btn-sm clipboard-url" data-toggle="popover" data-trigger="manual" title="{__('Poll results', 'Link to edit this particular line')}" data-content="{__('Poll results', 'Link to edit this particular line has been copied!')}">
+                                    <i class="glyphicon glyphicon-link"></i><span class="sr-only">{__('Generic', 'Link')}</span>
+                                </a>
                                 <a href="{poll_url id=$admin_poll_id admin=true action='delete_vote' action_value=$vote->id}"
                                    class="btn btn-default btn-sm"
                                    title="{__('Poll results', 'Remove the line:')} {$vote->name|html}">
                                     <i class="glyphicon glyphicon-remove text-danger"></i><span class="sr-only">{__('Generic', 'Remove')}</span>
                                 </a>
 
-                                <a href="{poll_url id=$poll->id vote_id=$vote->uniqId}" class="btn btn-default btn-sm">
-                                    {__('Poll results', 'Link to edit this particular line')} <span class="btn-link glyphicon glyphicon-link"></span>
-                                </a>
-                                
                             {/if}
                         </td>
                     {else}

tpl/studs.tpl

@@ -1,7 +1,6 @@
 {extends file='page.tpl'}
 
 {block name="header"}
-    <script src="{"js/jquery-ui.min.js"|resource}" type="text/javascript"></script>
     <script src="{"js/Chart.min.js"|resource}" type="text/javascript"></script>
     <script src="{"js/Chart.StackedBar.js"|resource}" type="text/javascript"></script>
     <script src="{"js/app/studs.js"|resource}" type="text/javascript"></script>