Martchus
/
syncthing
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

gui: Avoid code generating HTML (#8923)

This commit is contained in:
Jakob Borg 2023-06-05 13:16:02 +02:00
parent be5961f59b
commit 73c52eafb6
10 changed files with 41 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
gui/default/assets/css/overrides.css
View File

@ -185,7 +185,7 @@ td input[type="checkbox"] {
}
/* Wrap long file paths to prevent text overflow. See issue #6268. */
.file-path {
.word-break-all {
word-break: break-all;
}

22
gui/default/index.html
View File

@ -288,7 +288,7 @@
<div class="panel-body">
<p ng-repeat="err in errorList()">
<small>{{err.when | date:"yyyy-MM-dd HH:mm:ss"}}:</small>
<span ng-bind-html="friendlyDevices(err.message) | linky: '_blank'"></span>
<span ng-bind="friendlyDevices(err.message)"></span>
</p>
</div>
<div class="panel-footer">
@ -553,8 +553,14 @@
</tr>
<tr>
<th><span class="fas fa-fw fa-share-alt"></span>&nbsp;<span translate>Shared With</span></th>
<td class="text-right">
<span tooltip data-original-title="{{sharesFolder(folder)}} {{folderHasUnacceptedDevices(folder) ? '<br/>(<sup>1</sup>' + ('The remote device has not accepted sharing this folder.' | translate) + ')' : ''}} {{folderHasPausedDevices(folder) ? '<br/>(<sup>2</sup>' + ('The remote device has paused this folder.' | translate) + ')' : ''}}" ng-bind-html="sharesFolder(folder)"></span>
<td class="text-right no-overflow-ellipse word-break-all">
<span ng-repeat="device in folder.devices">
<span ng-if="device.deviceID != myID" ng-switch="completion[device.deviceID][folder.id].remoteState">
<span ng-switch-when="notSharing" data-original-title="{{'The remote device has not accepted sharing this folder.' | translate}}" tooltip>{{deviceName(devices[device.deviceID])}}<sup>1</sup><span ng-if="!$last">,</span></span>
<span ng-switch-when="paused" data-original-title="{{'The remote device has paused this folder.' | translate}}" tooltip>{{deviceName(devices[device.deviceID])}}<sup>2</sup><span ng-if="!$last">,</span></span>
<span ng-switch-default>{{deviceName(devices[device.deviceID])}}<span ng-if="!$last">,</span></span>
</span>
</span>
</td>
</tr>
<tr ng-if="folderStats[folder.id].lastScan">
@ -883,8 +889,14 @@
</tr>
<tr ng-if="deviceFolders(deviceCfg).length > 0">
<th><span class="fas fa-fw fa-folder"></span>&nbsp;<span translate>Folders</span></th>
<td class="text-right">
<span tooltip data-original-title="{{sharedFolders(deviceCfg)}} {{deviceHasUnacceptedFolders(deviceCfg) ? '<br/>(<sup>1</sup>' + ('The remote device has not accepted sharing this folder.' | translate) + ')' : '' }} {{deviceHasPausedFolders(deviceCfg) ? '<br/>(<sup>2</sup>' + ('The remote device has paused this folder.' | translate) + ')' : '' }}" ng-bind-html="sharedFolders(deviceCfg)"></span>
<td class="text-right no-overflow-ellipse word-break-all">
<span ng-repeat="folderID in deviceFolders(deviceCfg)">
<span ng-switch="completion[deviceCfg.deviceID][folderID].remoteState">
<span ng-switch-when="notSharing" data-original-title="{{'The remote device has not accepted sharing this folder.' | translate}}" tooltip>{{folderLabel(folderID)}}<sup>1</sup><span ng-if="!$last">,</span></span>
<span ng-switch-when="paused" data-original-title="{{'The remote device has paused this folder.' | translate}}" tooltip>{{folderLabel(folderID)}}<sup>2</sup><span ng-if="!$last">,</span></span>
<span ng-switch-default>{{folderLabel(folderID)}}<span ng-if="!$last">,</span></span>
</span>
</span>
</td>
</tr>
<tr ng-if="deviceCfg.remoteGUIPort > 0">

20
gui/default/syncthing/core/aboutModalView.html
View File

@ -86,37 +86,37 @@ Jakob Borg, Audrius Butkevicius, Jesse Lucas, Simon Frei, Alexander Graf, Alexan
<tbody>
<tr>
<th translate>User Home</th>
<td><code class="file-path">{{ about.paths['baseDir-userHome'] }}</code></td>
<td><code class="word-break-all">{{ about.paths['baseDir-userHome'] }}</code></td>
</tr>
<tr>
<th><strong translate>Configuration Directory</strong></th>
<td><code class="file-path"><strong>{{ about.paths['baseDir-config'] }}</strong></code></td>
<td><code class="word-break-all"><strong>{{ about.paths['baseDir-config'] }}</strong></code></td>
</tr>
<tr>
<th translate>Configuration File</th>
<td><code class="file-path">{{ about.paths['config'] }}</code></td>
<td><code class="word-break-all">{{ about.paths['config'] }}</code></td>
</tr>
<tr>
<th translate>Device Certificate</th>
<td><code class="file-path">{{ about.paths['certFile'] }}</code>
<br /><code class="file-path">{{ about.paths['keyFile'] }}</code></td>
<td><code class="word-break-all">{{ about.paths['certFile'] }}</code>
<br /><code class="word-break-all">{{ about.paths['keyFile'] }}</code></td>
</tr>
<tr>
<th translate>GUI / API HTTPS Certificate</th>
<td><code class="file-path">{{ about.paths['httpsCertFile'] }}</code>
<br /><code class="file-path">{{ about.paths['httpsKeyFile'] }}</code></td>
<td><code class="word-break-all">{{ about.paths['httpsCertFile'] }}</code>
<br /><code class="word-break-all">{{ about.paths['httpsKeyFile'] }}</code></td>
</tr>
<tr>
<th translate>Database Location</th>
<td><code class="file-path">{{ about.paths['database'] }}</code></td>
<td><code class="word-break-all">{{ about.paths['database'] }}</code></td>
</tr>
<tr>
<th translate>Log File</th>
<td><code class="file-path">{{ about.paths['logFile'] }}</code></td>
<td><code class="word-break-all">{{ about.paths['logFile'] }}</code></td>
</tr>
<tr>
<th translate>GUI Override Directory</th>
<td><code class="file-path">{{ about.paths['guiAssets'] }}</code></td>
<td><code class="word-break-all">{{ about.paths['guiAssets'] }}</code></td>
</tr>
</tbody>
</table>

8
gui/default/syncthing/core/editShareTemplate.html
View File

@ -1,7 +1,13 @@
<div class="col-md-6 checkbox">
<label for="sharedwith-{{id}}">
<input id="sharedwith-{{id}}" ng-model="selected[id]" type="checkbox" />
<span tooltip data-original-title="{{id}}" ng-bind-html="label"></span>
<span tooltip data-original-title="{{id}}">
<span ng-switch="remoteState">
<span ng-switch-when="notSharing">{{label}}<sup>1</sup></span>
<span ng-switch-when="paused">{{label}}<sup>2</sup></span>
<span ng-switch-default>{{label}}</span>
</span>
</span>
</label>
</div>
<div class="col-md-6">

46
gui/default/syncthing/core/syncthingController.js
View File

@ -2452,30 +2452,6 @@ angular.module('syncthing.core')
+ '&device=' + encodeURIComponent(deviceID));
};
$scope.deviceNameMarkRemoteState = function (deviceID, folderID) {
var name = $scope.deviceName($scope.devices[deviceID]);
// Add footnote if sharing was not accepted on the remote device
if (deviceID in $scope.completion && folderID in $scope.completion[deviceID]) {
if ($scope.completion[deviceID][folderID].remoteState == 'notSharing') {
name += '<sup>1</sup>';
} else if ($scope.completion[deviceID][folderID].remoteState == 'paused') {
name += '<sup>2</sup>';
}
}
return name;
};
$scope.sharesFolder = function (folderCfg) {
var names = [];
folderCfg.devices.forEach(function (device) {
if (device.deviceID !== $scope.myID) {
names.push($scope.deviceNameMarkRemoteState(device.deviceID, folderCfg.id));
}
});
names.sort();
return names.join(", ");
};
$scope.folderHasUnacceptedDevices = function (folderCfg) {
for (var deviceID in $scope.completion) {
if (deviceID in $scope.devices
@ -2519,27 +2495,6 @@ angular.module('syncthing.core')
return label && label.length > 0 ? label : folderID;
};
$scope.folderLabelMarkRemoteState = function (folderID, deviceID) {
var label = $scope.folderLabel(folderID);
// Add footnote if sharing was not accepted on the remote device
if (deviceID in $scope.completion && folderID in $scope.completion[deviceID]) {
if ($scope.completion[deviceID][folderID].remoteState == 'notSharing') {
label += '<sup>1</sup>';
} else if ($scope.completion[deviceID][folderID].remoteState == 'paused') {
label += '<sup>2</sup>';
}
}
return label;
};
$scope.sharedFolders = function (deviceCfg) {
var labels = [];
$scope.deviceFolders(deviceCfg).forEach(function (folderID) {
labels.push($scope.folderLabelMarkRemoteState(folderID, deviceCfg.deviceID));
});
return labels.join(', ');
};
$scope.deviceHasUnacceptedFolders = function (deviceCfg) {
if (!(deviceCfg.deviceID in $scope.completion)) {
return false;
@ -3429,6 +3384,7 @@ angular.module('syncthing.core')
id: '@',
label: '@',
folderType: '@',
remoteState: '@',
untrusted: '=',
},
link: function (scope, elem, attrs) {

2
gui/default/syncthing/device/editDeviceModalView.html
View File

@ -92,7 +92,7 @@
<a href="#" ng-click="selectAllSharedFolders(false)" translate>Deselect All</a></small>
</p>
<div class="form-group" ng-repeat="folder in currentSharing.shared">
<share-template selected="currentSharing.selected" encryption-passwords="currentSharing.encryptionPasswords" id="{{folder.id}}" label="{{folderLabelMarkRemoteState(folder.id, currentDevice.deviceID)}}" folder-type="{{folder.type}}" untrusted="currentDevice.untrusted" />
<share-template selected="currentSharing.selected" encryption-passwords="currentSharing.encryptionPasswords" id="{{folder.id}}" label="{{folderLabel(folder.id)}}" folder-type="{{folder.type}}" untrusted="currentDevice.untrusted" remote-state="{{completion[currentDevice.deviceID][folder.id].remoteState}}" />
</div>
<p class="help-block" ng-if="deviceHasUnacceptedFolders(currentDevice)">
<sup>1</sup> <span translate>The remote device has not accepted sharing this folder.</span>

2
gui/default/syncthing/device/globalChangesModalView.html
View File

@ -28,7 +28,7 @@
<span ng-switch-default>{{changeEvent.data.type}}</span>
</td>
<td class="no-overflow-ellipse">{{folderLabel(changeEvent.data.folder)}}</td>
<td class="file-path no-overflow-ellipse">{{changeEvent.data.path}}</td>
<td class="word-break-all no-overflow-ellipse">{{changeEvent.data.path}}</td>
<td class="no-overflow-ellipse">{{changeEvent.time | date:"yyyy-MM-dd HH:mm:ss"}}</td>
</tr>
</tbody>

2
gui/default/syncthing/folder/editFolderModalView.html
View File

@ -56,7 +56,7 @@
<a href="#" ng-click="selectAllSharedDevices(false)" translate>Deselect All</a></small>
</p>
<div class="form-group" ng-repeat="device in currentSharing.shared">
<share-template selected="currentSharing.selected" encryption-passwords="currentSharing.encryptionPasswords" id="{{device.deviceID}}" label="{{deviceNameMarkRemoteState(device.deviceID, currentFolder.id)}}" folder-type="{{currentFolder.type}}" untrusted="device.untrusted || pendingIsRemoteEncrypted(currentFolder.id, device.deviceID)" />
<share-template selected="currentSharing.selected" encryption-passwords="currentSharing.encryptionPasswords" id="{{device.deviceID}}" label="{{deviceName(device)}}" folder-type="{{currentFolder.type}}" untrusted="device.untrusted || pendingIsRemoteEncrypted(currentFolder.id, device.deviceID)" remote-state="{{completion[device.deviceID][currentFolder.id].remoteState}}" />
</div>
<p class="help-block" ng-if="folderHasUnacceptedDevices(currentFolder)">
<sup>1</sup> <span translate>The remote device has not accepted sharing this folder.</span>

2
gui/default/syncthing/transfer/localChangedFilesModalView.html
View File

@ -15,7 +15,7 @@
</tr>
</thead>
<tr dir-paginate="file in localChanged.files | itemsPerPage: localChanged.perpage" current-page="localChanged.page" total-items="model[localChangedFolder].receiveOnlyTotalItems" pagination-id="localChanged">
<td class="file-path">{{file.name}}</td>
<td class="word-break-all">{{file.name}}</td>
<td><span ng-hide="file.type == 'DIRECTORY'">{{file.size | binary}}B</span></td>
</tr>
</table>

2
gui/default/syncthing/transfer/remoteNeededFilesModalView.html
View File

@ -22,7 +22,7 @@
</tr>
</thead>
<tr dir-paginate="file in remoteNeed[folder].files | itemsPerPage: remoteNeed[folder].perpage" current-page="remoteNeed[folder].page" total-items="completion[remoteNeedDevice.deviceID][folder].needItems" pagination-id="'remoteNeed-' + folder">
<td class="file-path">{{file.name}}</td>
<td class="word-break-all">{{file.name}}</td>
<td><span ng-hide="file.type == 'DIRECTORY'">{{file.size | binary}}B</span></td>
<td>{{file.modified | date:"yyyy-MM-dd HH:mm:ss"}}</td>
<td ng-if="file.modifiedBy">{{friendlyNameFromShort(file.modifiedBy)}}</td>