From e023704e845946e0b716090a3366bdb6d4c191a0 Mon Sep 17 00:00:00 2001 From: HagerDakroury Date: Thu, 3 Jun 2021 19:30:54 +0200 Subject: [PATCH 01/11] feat: Add a copy URI icon --- css/index.css | 11 +++++++++++ js/index.js | 18 ++++++++++++++++++ js/tree-edam-stand-alone.js | 12 +++++++++++- 3 files changed, 40 insertions(+), 1 deletion(-) diff --git a/css/index.css b/css/index.css index f3ae3e83..c2d2ddd7 100644 --- a/css/index.css +++ b/css/index.css @@ -248,4 +248,15 @@ svg{ .user-select-none{ user-select:none; } + +.cpy-clipboard { + padding-left: 1rem; + padding-top: 1rem; + color : #01308d ; +} + +.cpy-clipboard:hover { + color : #020c22 ; + cursor: pointer; +} /*end of file*/ diff --git a/js/index.js b/js/index.js index 2bbc54e4..9434d96e 100644 --- a/js/index.js +++ b/js/index.js @@ -90,4 +90,22 @@ window.onload = function() { } $("input[name='show-detail']").prop("checked" , (localStorage.getItem("show-detail")||"true") == "true"); $("input[name='show-community-usage']").prop("checked" , (localStorage.getItem("show-community-usage")||"false") == "true"); + + //copies the uri to the clipboard + //placed here because it needs the DOM to be fully loaded first + $(document).on('click','#cpy-uri',function(e){ + var text = document.querySelector('.uri-val > .label') + //copying to the clipboard + navigator.clipboard.writeText(text.innerText) + + //showing the copied tooltip + $("#cpy-uri").attr('title', "Copied!") + .tooltip('show'); + + //changing the icon to a check shape indicating success + $(this).addClass("fa-check").removeClass("fa-copy"); + + + } + ) }; diff --git a/js/tree-edam-stand-alone.js b/js/tree-edam-stand-alone.js index f48bb219..fbeb7a43 100644 --- a/js/tree-edam-stand-alone.js +++ b/js/tree-edam-stand-alone.js @@ -496,7 +496,17 @@ function interactive_edam_browser(){ if (tootip !== undefined) { html_tootip=" data-toggle=\"tooltip\" data-placement='top' title=\""+tootip+"\""; } - $(""+name+""+interactive_edam_uri(value, translate_uri_to_text)+"").appendTo(table); + + //adding the copy icon, can be extendable to other rows + let cpyInfo ="" + if (id=="uri-val"){ + cpyInfo ="" + + "" + " " + + ""; + } + $(""+name+""+interactive_edam_uri(value, translate_uri_to_text)+cpyInfo+"").appendTo(table); return id; } From 3a3896bd3930e410d6f1a2d7f41dc9bacc254b33 Mon Sep 17 00:00:00 2001 From: HagerDakroury Date: Thu, 3 Jun 2021 19:48:29 +0200 Subject: [PATCH 02/11] Fix build issues with semicolons --- js/index.js | 4 ++-- js/tree-edam-stand-alone.js | 8 ++------ 2 files changed, 4 insertions(+), 8 deletions(-) diff --git a/js/index.js b/js/index.js index 9434d96e..7b67e43e 100644 --- a/js/index.js +++ b/js/index.js @@ -94,9 +94,9 @@ window.onload = function() { //copies the uri to the clipboard //placed here because it needs the DOM to be fully loaded first $(document).on('click','#cpy-uri',function(e){ - var text = document.querySelector('.uri-val > .label') + var text = document.querySelector('.uri-val > .label'); //copying to the clipboard - navigator.clipboard.writeText(text.innerText) + navigator.clipboard.writeText(text.innerText); //showing the copied tooltip $("#cpy-uri").attr('title', "Copied!") diff --git a/js/tree-edam-stand-alone.js b/js/tree-edam-stand-alone.js index fbeb7a43..7192e4df 100644 --- a/js/tree-edam-stand-alone.js +++ b/js/tree-edam-stand-alone.js @@ -498,13 +498,9 @@ function interactive_edam_browser(){ } //adding the copy icon, can be extendable to other rows - let cpyInfo ="" + let cpyInfo =""; if (id=="uri-val"){ - cpyInfo ="" + - "" - " " + - ""; + cpyInfo ="" + "" + " " ; } $(""+name+""+interactive_edam_uri(value, translate_uri_to_text)+cpyInfo+"").appendTo(table); return id; From 6613e95bd09cd071b6015929fdf128ac2ad44c0d Mon Sep 17 00:00:00 2001 From: HagerDakroury Date: Thu, 3 Jun 2021 19:51:03 +0200 Subject: [PATCH 03/11] Add a missing semicolon --- js/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/index.js b/js/index.js index 7b67e43e..3b98643c 100644 --- a/js/index.js +++ b/js/index.js @@ -107,5 +107,5 @@ window.onload = function() { } - ) + ); }; From 775a9ac7076f8e545758cbbe4b3c77afb793f112 Mon Sep 17 00:00:00 2001 From: bryan brancotte Date: Mon, 7 Jun 2021 09:40:39 +0200 Subject: [PATCH 04/11] Link n btn to cpy (#212) * Warping the link in a btn-group so copy functionality can be appended after * Reducing text length of the URI when not translated --- js/tree-edam-stand-alone.js | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/js/tree-edam-stand-alone.js b/js/tree-edam-stand-alone.js index 7192e4df..16de68bb 100644 --- a/js/tree-edam-stand-alone.js +++ b/js/tree-edam-stand-alone.js @@ -434,20 +434,26 @@ function interactive_edam_browser(){ text=value; } }else{ - text=value; + text=value.substring(value.lastIndexOf('/')+1); } /* jshint -W014 */ - return ""+ text+ - "" + ""+ + ''+ + '' //+' ' //+''+branch_of_term+'' //+''+branch_of_term+'' From fde93a0272111689262b10e5798f766552c8a131 Mon Sep 17 00:00:00 2001 From: HagerDakroury Date: Mon, 7 Jun 2021 12:23:24 +0200 Subject: [PATCH 05/11] Remove duplicate copy icon --- js/tree-edam-stand-alone.js | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/js/tree-edam-stand-alone.js b/js/tree-edam-stand-alone.js index 16de68bb..d75c7696 100644 --- a/js/tree-edam-stand-alone.js +++ b/js/tree-edam-stand-alone.js @@ -451,7 +451,7 @@ function interactive_edam_browser(){ text+ ""+ ''+ '' //+' ' @@ -502,13 +502,7 @@ function interactive_edam_browser(){ if (tootip !== undefined) { html_tootip=" data-toggle=\"tooltip\" data-placement='top' title=\""+tootip+"\""; } - - //adding the copy icon, can be extendable to other rows - let cpyInfo =""; - if (id=="uri-val"){ - cpyInfo ="" + "" + " " ; - } - $(""+name+""+interactive_edam_uri(value, translate_uri_to_text)+cpyInfo+"").appendTo(table); + $(""+name+""+interactive_edam_uri(value, translate_uri_to_text)+"").appendTo(table); return id; } From c7ae2f369d12dea0faf7c0f6c9063e085fe7caea Mon Sep 17 00:00:00 2001 From: HagerDakroury Date: Mon, 7 Jun 2021 13:41:21 +0200 Subject: [PATCH 06/11] Make copyToClipboard reusable --- js/index.js | 18 ------------------ js/tree-edam-stand-alone.js | 18 +++++++++++++++++- 2 files changed, 17 insertions(+), 19 deletions(-) diff --git a/js/index.js b/js/index.js index 3b98643c..2bbc54e4 100644 --- a/js/index.js +++ b/js/index.js @@ -90,22 +90,4 @@ window.onload = function() { } $("input[name='show-detail']").prop("checked" , (localStorage.getItem("show-detail")||"true") == "true"); $("input[name='show-community-usage']").prop("checked" , (localStorage.getItem("show-community-usage")||"false") == "true"); - - //copies the uri to the clipboard - //placed here because it needs the DOM to be fully loaded first - $(document).on('click','#cpy-uri',function(e){ - var text = document.querySelector('.uri-val > .label'); - //copying to the clipboard - navigator.clipboard.writeText(text.innerText); - - //showing the copied tooltip - $("#cpy-uri").attr('title', "Copied!") - .tooltip('show'); - - //changing the icon to a check shape indicating success - $(this).addClass("fa-check").removeClass("fa-copy"); - - - } - ); }; diff --git a/js/tree-edam-stand-alone.js b/js/tree-edam-stand-alone.js index d75c7696..55b8288c 100644 --- a/js/tree-edam-stand-alone.js +++ b/js/tree-edam-stand-alone.js @@ -451,7 +451,7 @@ function interactive_edam_browser(){ text+ ""+ ''+ '' //+' ' @@ -772,3 +772,19 @@ function toggleFullscreen(){ $('#go-fullscreen').show(); } } + +/** + * + * @param {string} value Copies the value of the passed uri to the clipboard + */ +function cpyToClipboard(value){ + //copying the uri value to the clipboard + navigator.clipboard.writeText(value); + + //showing a tooltip indicating the value is copied + $(event.srcElement).attr('title', "Copied!") + .tooltip('show'); + + //changing the icon to a check shape indicating success + $(event.srcElement).addClass("fa-check").removeClass("fa-copy"); +} \ No newline at end of file From be84771e4ae84f1a5d4b068968bd2857beebdf32 Mon Sep 17 00:00:00 2001 From: HagerDakroury Date: Mon, 7 Jun 2021 13:48:15 +0200 Subject: [PATCH 07/11] Fix the html string format --- js/tree-edam-stand-alone.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/tree-edam-stand-alone.js b/js/tree-edam-stand-alone.js index 55b8288c..a867600f 100644 --- a/js/tree-edam-stand-alone.js +++ b/js/tree-edam-stand-alone.js @@ -451,7 +451,7 @@ function interactive_edam_browser(){ text+ ""+ ''+ '' //+' ' From c8248a13447d23859672445d9270dcea959e2789 Mon Sep 17 00:00:00 2001 From: HagerDakroury Date: Mon, 7 Jun 2021 15:10:35 +0200 Subject: [PATCH 08/11] Enable toggling back to the copy icon with timeout --- js/tree-edam-stand-alone.js | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/js/tree-edam-stand-alone.js b/js/tree-edam-stand-alone.js index a867600f..074952bd 100644 --- a/js/tree-edam-stand-alone.js +++ b/js/tree-edam-stand-alone.js @@ -781,10 +781,18 @@ function cpyToClipboard(value){ //copying the uri value to the clipboard navigator.clipboard.writeText(value); + const element = event.srcElement + //showing a tooltip indicating the value is copied - $(event.srcElement).attr('title', "Copied!") + $(element).attr('title', "Copied!") .tooltip('show'); //changing the icon to a check shape indicating success - $(event.srcElement).addClass("fa-check").removeClass("fa-copy"); + $(element).addClass("fa-check").removeClass("fa-copy"); + + //toggling back the icon and removing the copied tooltip + setTimeout(function(){ + $(element).addClass("fa-copy").removeClass("fa-check"); + $(element).tooltip('destroy'); + }, 1000); } \ No newline at end of file From 2cdb15d9006bec70238fc042de7b6a27b09ef012 Mon Sep 17 00:00:00 2001 From: HagerDakroury Date: Mon, 7 Jun 2021 15:12:37 +0200 Subject: [PATCH 09/11] Add missing semicolon --- js/tree-edam-stand-alone.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/tree-edam-stand-alone.js b/js/tree-edam-stand-alone.js index 074952bd..e3618282 100644 --- a/js/tree-edam-stand-alone.js +++ b/js/tree-edam-stand-alone.js @@ -781,7 +781,7 @@ function cpyToClipboard(value){ //copying the uri value to the clipboard navigator.clipboard.writeText(value); - const element = event.srcElement + const element = event.srcElement; //showing a tooltip indicating the value is copied $(element).attr('title', "Copied!") From a124fb6e74516255d93d34263b9edd7ff150984e Mon Sep 17 00:00:00 2001 From: bryan brancotte Date: Mon, 7 Jun 2021 15:35:01 +0200 Subject: [PATCH 10/11] Language update --- js/tree-edam-stand-alone.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/js/tree-edam-stand-alone.js b/js/tree-edam-stand-alone.js index e3618282..f8d375c9 100644 --- a/js/tree-edam-stand-alone.js +++ b/js/tree-edam-stand-alone.js @@ -784,7 +784,7 @@ function cpyToClipboard(value){ const element = event.srcElement; //showing a tooltip indicating the value is copied - $(element).attr('title', "Copied!") + $(element).attr('title', "URI copied!") .tooltip('show'); //changing the icon to a check shape indicating success @@ -795,4 +795,4 @@ function cpyToClipboard(value){ $(element).addClass("fa-copy").removeClass("fa-check"); $(element).tooltip('destroy'); }, 1000); -} \ No newline at end of file +} From 29fc552d70b4086c768d630c7991bd0617c1233e Mon Sep 17 00:00:00 2001 From: HagerDakroury Date: Mon, 7 Jun 2021 15:43:39 +0200 Subject: [PATCH 11/11] Remove unused styling --- css/index.css | 11 ----------- 1 file changed, 11 deletions(-) diff --git a/css/index.css b/css/index.css index c2d2ddd7..f3ae3e83 100644 --- a/css/index.css +++ b/css/index.css @@ -248,15 +248,4 @@ svg{ .user-select-none{ user-select:none; } - -.cpy-clipboard { - padding-left: 1rem; - padding-top: 1rem; - color : #01308d ; -} - -.cpy-clipboard:hover { - color : #020c22 ; - cursor: pointer; -} /*end of file*/