Chapril/date.chapril.org-framadate
Chapril/date.chapril.org-framadate
24
1
Fork 0
Code Issues Pull Requests Releases Activity

Improve the vote link reminder function

Browse Source 
Move the link to a clickable button that copies the link inside the clipboard, and triggers a 2 sec popover to tell it to the user
If the clipboard API fails, the user should be redirected directly to the link

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2018-04-06 11:44:11 +02:00
parent f2078ce2f5
commit 2cf458960e
No known key found for this signature in database
GPG Key ID: A061B9DDE0CA0773
9 changed files with 69 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
js/app/adminstuds.js
View File

@ -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();

3
js/app/studs.js
View File

@ -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);

13
js/jquery-ui.min.js vendored
View File

File diff suppressed because one or more lines are too long

1
locale/en.json
View File

@ -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",

1
locale/fr.json
View File

@ -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",

1
locale/fr_FR.json
View File

@ -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",

7
tpl/part/vote_table_classic.tpl
View File

@ -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}

7
tpl/part/vote_table_date.tpl
View File

@ -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}

1
tpl/studs.tpl
View File

@ -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>