feat(calendar): add copy to clipboard button in "links to calendar" panel

This commit is contained in:
Hivert Quentin
2023-05-19 13:14:51 +02:00
parent 6050c4ee61
commit 5c4d467d06
4 changed files with 47 additions and 12 deletions

View File

@@ -565,6 +565,7 @@ vtodo_class2 = "(Confidential task)";
"CalDAV URL" = "CalDAV URL ";
"WebDAV ICS URL" = "WebDAV ICS URL";
"WebDAV XML URL" = "WebDAV XML URL";
"Clipboard" = "Copy to clipboard";
/* Error messages */
"dayFieldInvalid" = "Please specify a numerical value in the Days field greater or equal to 1.";

View File

@@ -35,34 +35,58 @@
<div layout="column" ng-hide="::links.calendar.isWebCalendar">
<div class="sg-md-title"><var:string label:value="Authenticated User Access"/></div>
<md-input-container class="md-block">
<md-input-container class="md-input-clipboard">
<label><var:string label:value="CalDAV URL"/></label>
<input type="text" ng-model="::links.calendar.urls.calDavURL" ng-readonly="true"/>
<input id="user-caldav-url" type="text" ng-model="::links.calendar.urls.calDavURL" ng-readonly="true"/>
<md-button aria-label="Copy to clipboard" class="md-icon-button" ng-click="links.clipboard('user-caldav-url')">
<md-tooltip><var:string label:value="Clipboard"/></md-tooltip>
<md-icon label:aria-label="Copy Icon">content_copy</md-icon>
</md-button>
</md-input-container>
<md-input-container class="md-block">
<md-input-container class="md-input-clipboard">
<label><var:string label:value="WebDAV ICS URL"/></label>
<input type="text" ng-model="::links.calendar.urls.webDavICSURL" ng-readonly="true"/>
<input id="user-webdav-ics-url" type="text" ng-model="::links.calendar.urls.webDavICSURL" ng-readonly="true"/>
<md-button aria-label="Copy to clipboard" class="md-icon-button" ng-click="links.clipboard('user-webdav-ics-url')">
<md-tooltip><var:string label:value="Clipboard"/></md-tooltip>
<md-icon label:aria-label="Content_copy">content_copy</md-icon>
</md-button>
</md-input-container>
<md-input-container class="md-block">
<md-input-container class="md-input-clipboard">
<label><var:string label:value="WebDAV XML URL"/></label>
<input type="text" ng-model="::links.calendar.urls.webDavXMLURL" ng-readonly="true"/>
<input id="user-webdav-xml-url" type="text" ng-model="::links.calendar.urls.webDavXMLURL" ng-readonly="true"/>
<md-button aria-label="Copy to clipboard" class="md-icon-button" ng-click="links.clipboard('user-webdav-xml-url')">
<md-tooltip><var:string label:value="Clipboard"/></md-tooltip>
<md-icon label:aria-label="Content_copy">content_copy</md-icon>
</md-button>
</md-input-container>
</div>
<var:if condition="isPublicAccessEnabled">
<div layout="column" ng-hide="::links.calendar.isWebCalendar">
<div class="sg-md-title"><var:string label:value="Public Access"/></div>
<md-input-container class="md-block">
<md-input-container class="md-input-clipboard">
<label><var:string label:value="CalDAV URL"/></label>
<input type="text" ng-model="::links.calendar.urls.publicCalDavURL" ng-readonly="true"/>
<input id="public-caldav-url" type="text" ng-model="::links.calendar.urls.publicCalDavURL" ng-readonly="true"/>
<md-button aria-label="Copy to clipboard" class="md-icon-button" ng-click="links.clipboard('public-caldav-url')">
<md-tooltip><var:string label:value="Clipboard"/></md-tooltip>
<md-icon label:aria-label="Content_copy">content_copy</md-icon>
</md-button>
</md-input-container>
<md-input-container class="md-block">
<md-input-container class="md-input-clipboard">
<label><var:string label:value="WebDAV ICS URL"/></label>
<input type="text" ng-model="::links.calendar.urls.publicWebDavICSURL" ng-readonly="true"/>
<input id="public-webdav-ics-url" type="text" ng-model="::links.calendar.urls.publicWebDavICSURL" ng-readonly="true"/>
<md-button aria-label="Copy to clipboard" class="md-icon-button" ng-click="links.clipboard('public-webdav-ics-url')">
<md-tooltip><var:string label:value="Clipboard"/></md-tooltip>
<md-icon label:aria-label="Content_copy">content_copy</md-icon>
</md-button>
</md-input-container>
<md-input-container class="md-block">
<md-input-container class="md-input-clipboard">
<label><var:string label:value="WebDAV XML URL"/></label>
<input type="text" ng-model="::links.calendar.urls.publicWebDavXMLURL" ng-readonly="true"/>
<input id="public-webdav-xml-url" type="text" ng-model="::links.calendar.urls.publicWebDavXMLURL" ng-readonly="true"/>
<md-button aria-label="Copy to clipboard" class="md-icon-button" ng-click="links.clipboard('public-webdav-xml-url')">
<md-tooltip><var:string label:value="Clipboard"/></md-tooltip>
<md-icon label:aria-label="Content_copy">content_copy</md-icon>
</md-button>
</md-input-container>
</div>
</var:if>

View File

@@ -293,10 +293,16 @@
var vm = this;
vm.calendar = calendar;
vm.close = close;
vm.clipboard = clipboard
function close() {
$mdDialog.hide();
}
function clipboard(elem_id) {
let linkUrl = document.getElementById(elem_id);
navigator.clipboard.writeText(linkUrl.value);
}
}
};

View File

@@ -12,6 +12,10 @@ md-input-container {
&.md-no-flex {
flex: none !important;
}
&.md-input-clipboard {
display: flex;
flex-direction: row-reverse;
}
.md-errors-spacer {
// Temporary fix for https://github.com/angular/material/issues/6214
min-height: 0 !important;