mirror of
https://github.com/McShelby/hugo-theme-relearn.git
synced 2024-11-27 01:33:04 +00:00
clipboard: remove jQuery #452
This commit is contained in:
parent
fc040e73d3
commit
8e0013647b
1 changed files with 61 additions and 42 deletions
|
@ -268,7 +268,7 @@ function initSwagger( update, attrs ){
|
||||||
function initAnchorClipboard(){
|
function initAnchorClipboard(){
|
||||||
document.querySelectorAll( 'h1~h2,h1~h3,h1~h4,h1~h5,h1~h6').forEach( function( element ){
|
document.querySelectorAll( 'h1~h2,h1~h3,h1~h4,h1~h5,h1~h6').forEach( function( element ){
|
||||||
var url = encodeURI(document.location.origin + document.location.pathname);
|
var url = encodeURI(document.location.origin + document.location.pathname);
|
||||||
var link = url + "#"+element.id;
|
var link = url + "#" + element.id;
|
||||||
var new_element = document.createElement( 'span' );
|
var new_element = document.createElement( 'span' );
|
||||||
new_element.classList.add( 'anchor' );
|
new_element.classList.add( 'anchor' );
|
||||||
new_element.setAttribute( 'title', window.T_Copy_link_to_clipboard );
|
new_element.setAttribute( 'title', window.T_Copy_link_to_clipboard );
|
||||||
|
@ -277,23 +277,27 @@ function initAnchorClipboard(){
|
||||||
element.appendChild( new_element );
|
element.appendChild( new_element );
|
||||||
});
|
});
|
||||||
|
|
||||||
$(".anchor").on('mouseleave', function(e) {
|
var anchors = document.querySelectorAll( '.anchor' );
|
||||||
$(this).attr('aria-label', null).removeClass('tooltipped tooltipped-se tooltipped-sw');
|
for( var i = 0; i < anchors.length; i++ ) {
|
||||||
|
anchors[i].addEventListener( 'mouseleave', function( e ){
|
||||||
|
this.removeAttribute( 'aria-label' );
|
||||||
|
this.classList.remove( 'tooltipped', 'tooltipped-se', 'tooltipped-sw' );
|
||||||
});
|
});
|
||||||
|
}
|
||||||
|
|
||||||
var clip = new ClipboardJS('.anchor');
|
var clip = new ClipboardJS( '.anchor' );
|
||||||
clip.on('success', function(e) {
|
clip.on( 'success', function( e ){
|
||||||
e.clearSelection();
|
e.clearSelection();
|
||||||
var rtl = $(e.trigger).closest('*[dir]').attr('dir') == 'rtl';
|
var rtl = e.trigger.closest( '*[dir]' ).getAttribute( 'dir' ) == 'rtl';
|
||||||
$(e.trigger).attr('aria-label', window.T_Link_copied_to_clipboard).addClass('tooltipped tooltipped-s'+(rtl?'e':'w') );
|
e.trigger.setAttribute( 'aria-label', window.T_Link_copied_to_clipboard );
|
||||||
|
e.trigger.classList.add( 'tooltipped', 'tooltipped-s'+(rtl?'e':'w') );
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function initCodeClipboard(){
|
function initCodeClipboard(){
|
||||||
function fallbackMessage(action) {
|
function fallbackMessage( action ){
|
||||||
var actionMsg = '';
|
var actionMsg = '';
|
||||||
var actionKey = (action === 'cut' ? 'X' : 'C');
|
var actionKey = (action === 'cut' ? 'X' : 'C');
|
||||||
|
|
||||||
if (/iPhone|iPad/i.test(navigator.userAgent)) {
|
if (/iPhone|iPad/i.test(navigator.userAgent)) {
|
||||||
actionMsg = 'No support :(';
|
actionMsg = 'No support :(';
|
||||||
}
|
}
|
||||||
|
@ -303,60 +307,75 @@ function initCodeClipboard(){
|
||||||
else {
|
else {
|
||||||
actionMsg = 'Press Ctrl-' + actionKey + ' to ' + action;
|
actionMsg = 'Press Ctrl-' + actionKey + ' to ' + action;
|
||||||
}
|
}
|
||||||
|
|
||||||
return actionMsg;
|
return actionMsg;
|
||||||
}
|
}
|
||||||
|
|
||||||
$('code').each(function() {
|
var codeElements = document.querySelectorAll( 'code' );
|
||||||
var code = $(this);
|
for( var i = 0; i < codeElements.length; i++ ){
|
||||||
var text = code.text();
|
var code = codeElements[i];
|
||||||
var parent = code.parent();
|
var text = code.textContent;
|
||||||
var inPre = parent.prop('tagName') == 'PRE';
|
var parent = code.parentNode;
|
||||||
|
var inPre = parent.tagName.toLowerCase() == 'pre';
|
||||||
|
|
||||||
if (inPre || text.length > 5) {
|
if( inPre || text.length > 5 ){
|
||||||
var clip = new ClipboardJS('.copy-to-clipboard-button', {
|
var clip = new ClipboardJS( '.copy-to-clipboard-button', {
|
||||||
text: function(trigger) {
|
text: function( trigger ){
|
||||||
var text = $(trigger).prev('code').text();
|
var text = trigger.previousElementSibling && trigger.previousElementSibling.matches( 'code' ) && trigger.previousElementSibling.textContent;
|
||||||
// remove a trailing line break, this may most likely
|
// remove a trailing line break, this may most likely
|
||||||
// come from the browser / Hugo transformation
|
// come from the browser / Hugo transformation
|
||||||
text = text.replace(/\n$/, '');
|
text = text.replace( /\n$/, '' );
|
||||||
// removes leading $ signs from text in an assumption
|
// removes leading $ signs from text in an assumption
|
||||||
// that this has to be the unix prompt marker - weird
|
// that this has to be the unix prompt marker - weird
|
||||||
return text.replace(/^\$\s/gm, '');
|
return text.replace( /^\$\s/gm, '' );
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
clip.on('success', function(e) {
|
clip.on( 'success', function( e ){
|
||||||
e.clearSelection();
|
e.clearSelection();
|
||||||
var inPre = $(e.trigger).parent().prop('tagName') == 'PRE';
|
var inPre = e.trigger.parentNode.tagName.toLowerCase() == 'pre';
|
||||||
var rtl = $(e.trigger).closest('*[dir]').attr('dir') == 'rtl';
|
var rtl = e.trigger.closest( '*[dir]' ).getAttribute( 'dir' ) == 'rtl';
|
||||||
$(e.trigger).attr('aria-label', window.T_Copied_to_clipboard).addClass('tooltipped tooltipped-' + (inPre ? 'w' : 's'+(rtl?'e':'w')));
|
e.trigger.setAttribute( 'aria-label', window.T_Copied_to_clipboard );
|
||||||
|
e.trigger.classList.add( 'tooltipped', 'tooltipped-' + (inPre ? 'w' : 's'+(rtl?'e':'w')) );
|
||||||
});
|
});
|
||||||
|
|
||||||
clip.on('error', function(e) {
|
clip.on( 'error', function( e ){
|
||||||
var inPre = $(e.trigger).parent().prop('tagName') == 'PRE';
|
var inPre = e.trigger.parentNode.tagName.toLowerCase() == 'pre';
|
||||||
var rtl = $(this).closest('*[dir]').attr('dir') == 'rtl';
|
var rtl = e.trigger.closest( '*[dir]' ).getAttribute( 'dir' ) == 'rtl';
|
||||||
$(e.trigger).attr('aria-label', fallbackMessage(e.action)).addClass('tooltipped tooltipped-' + (inPre ? 'w' : 's'+(rtl?'e':'w')));
|
e.trigger.setAttribute( 'aria-label', fallbackMessage(e.action) );
|
||||||
$(document).one('copy', function(){
|
e.trigger.classList.add( 'tooltipped', 'tooltipped-' + (inPre ? 'w' : 's'+(rtl?'e':'w')) );
|
||||||
$(e.trigger).attr('aria-label', window.T_Copied_to_clipboard).addClass('tooltipped tooltipped-' + (inPre ? 'w' : 's'+(rtl?'e':'w')));
|
var f = function(){
|
||||||
});
|
e.trigger.setAttribute( 'aria-label', window.T_Copied_to_clipboard );
|
||||||
|
e.trigger.classList.add( 'tooltipped', 'tooltipped-' + (inPre ? 'w' : 's'+(rtl?'e':'w')) );
|
||||||
|
document.removeEventListener( 'copy', f );
|
||||||
|
};
|
||||||
|
document.addEventListener( 'copy', f );
|
||||||
});
|
});
|
||||||
|
|
||||||
code.addClass('copy-to-clipboard-code');
|
code.classList.add( 'copy-to-clipboard-code' );
|
||||||
if( inPre ){
|
if( inPre ){
|
||||||
parent.addClass( 'copy-to-clipboard' ).addClass( 'pre-code' );
|
code.classList.add( 'copy-to-clipboard' );
|
||||||
|
code.classList.add( 'pre-code' );
|
||||||
}
|
}
|
||||||
else{
|
else{
|
||||||
code.replaceWith($('<span/>', {'class': 'copy-to-clipboard'}).append(code.clone() ));
|
var clone = code.cloneNode( true );
|
||||||
code = parent.children('.copy-to-clipboard').last().children('.copy-to-clipboard-code');
|
var span = document.createElement( 'span' );
|
||||||
|
span.classList.add( 'copy-to-clipboard' );
|
||||||
|
span.appendChild( clone );
|
||||||
|
code.replaceWith( span );
|
||||||
|
code = clone;
|
||||||
}
|
}
|
||||||
code.after( $('<span>').addClass("copy-to-clipboard-button").attr("title", window.T_Copy_to_clipboard).append("<i class='fas fa-copy'></i>") );
|
var button = document.createElement( 'span' );
|
||||||
code.next('.copy-to-clipboard-button').on('mouseleave', function() {
|
button.classList.add( 'copy-to-clipboard-button' );
|
||||||
var rtl = $(this).closest('*[dir]').attr('dir') == 'rtl';
|
button.setAttribute( 'title', window.T_Copy_to_clipboard );
|
||||||
$(this).attr('aria-label', null).removeClass('tooltipped tooltipped-w tooltipped-se tooltipped-sw');
|
button.innerHTML = '<i class="fas fa-copy"></i>';
|
||||||
|
button.addEventListener( 'mouseleave', function() {
|
||||||
|
var rtl = this.closest( '*[dir]' ).getAttribute( 'dir' ) == 'rtl';
|
||||||
|
this.removeAttribute( 'aria-label' );
|
||||||
|
this.classList.remove( 'tooltipped', 'tooltipped-w', 'tooltipped-se', 'tooltipped-sw' );
|
||||||
});
|
});
|
||||||
|
code.after( button );
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function initArrowNav(){
|
function initArrowNav(){
|
||||||
|
|
Loading…
Reference in a new issue