gui: Add copy to clipboard, share by email, and share by SMS buttons to device IDs (fixes #2771, ref #3868) Add buttons to allow for simpler sharing device IDs with others. The first one copies the ID to clipboard (trying to use three different methods, depending on the browser). The second one triggers a mailto link with prefilled subject and body. The third one triggers an sms link with prefilled body. The short description of Syncthing included in the latter part of the body is a direct copy from the description at the official website https://syncthing.net. Issue #3868 is referred here, because the copy to clipboard button offers an alternative method for IE11 users to actually be able to copy device IDs without having to select it manually (which doesn't work). Signed-off-by: Tomasz Wilczyński <twilczynski@naver.com>
25 lines
1.4 KiB
HTML
25 lines
1.4 KiB
HTML
<modal id="idqr" status="info" icon="fas fa-qrcode" heading="{{'Device Identification' | translate}} - {{deviceName(currentDevice)}}" large="yes" closeable="yes">
|
|
<div class="modal-body text-center">
|
|
<div class="well well-sm text-monospace" select-on-click>{{currentDevice.deviceID}}</div>
|
|
<div ng-if="currentDevice.deviceID">
|
|
<img class="img-thumbnail" ng-src="qr/?text={{currentDevice.deviceID}}" height="328" width="328" alt="{{'QR code' | translate}}" />
|
|
<div class="btn-group-vertical" style="vertical-align: top;">
|
|
<button type="button" class="btn btn-default" ng-click="copyToClipboard($event, currentDevice.deviceID)">
|
|
<span class="fa fa-lg fa-clone text-left"></span> <span translate>Copy</span>
|
|
</button>
|
|
<button type="button" class="btn btn-default" ng-click="shareDeviceIdDialog('email')">
|
|
<span class="fa fa-lg fa-envelope-o"></span> <span translate>Share by Email</span>
|
|
</button>
|
|
<button type="button" class="btn btn-default" ng-click="shareDeviceIdDialog('sms')">
|
|
<span class="fa fa-lg fa-comments-o"></span> <span translate>Share by SMS</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-default btn-sm" data-dismiss="modal">
|
|
<span class="fas fa-times"></span> <span translate>Close</span>
|
|
</button>
|
|
</div>
|
|
</modal>
|