diff options
author | Jakob Borg <jakob@kastelo.net> | 2023-06-05 13:16:02 +0200 |
---|---|---|
committer | Jakob Borg <jakob@kastelo.net> | 2023-06-06 09:06:51 +0200 |
commit | 73c52eafb6566435dffd979c3c49562b6d5a4238 (patch) | |
tree | e93c84e37c705fc164fe18e94c1c242b64ba9fbb | |
parent | be5961f59b1a611befd47057fd2852dd310c61b8 (diff) |
gui: Avoid code generating HTML (#8923)v1.23.5
-rw-r--r-- | gui/default/assets/css/overrides.css | 2 | ||||
-rw-r--r-- | gui/default/index.html | 22 | ||||
-rw-r--r-- | gui/default/syncthing/core/aboutModalView.html | 20 | ||||
-rw-r--r-- | gui/default/syncthing/core/editShareTemplate.html | 8 | ||||
-rwxr-xr-x | gui/default/syncthing/core/syncthingController.js | 46 | ||||
-rw-r--r-- | gui/default/syncthing/device/editDeviceModalView.html | 2 | ||||
-rw-r--r-- | gui/default/syncthing/device/globalChangesModalView.html | 2 | ||||
-rw-r--r-- | gui/default/syncthing/folder/editFolderModalView.html | 2 | ||||
-rw-r--r-- | gui/default/syncthing/transfer/localChangedFilesModalView.html | 2 | ||||
-rw-r--r-- | gui/default/syncthing/transfer/remoteNeededFilesModalView.html | 2 |
10 files changed, 41 insertions, 67 deletions
diff --git a/gui/default/assets/css/overrides.css b/gui/default/assets/css/overrides.css index 06f705629a..8b0e9fb459 100644 --- a/gui/default/assets/css/overrides.css +++ b/gui/default/assets/css/overrides.css @@ -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; } diff --git a/gui/default/index.html b/gui/default/index.html index ac84df04c6..cf4d603144 100644 --- a/gui/default/index.html +++ b/gui/default/index.html @@ -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> <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> <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"> diff --git a/gui/default/syncthing/core/aboutModalView.html b/gui/default/syncthing/core/aboutModalView.html index 46932f74ff..b81a9291fe 100644 --- a/gui/default/syncthing/core/aboutModalView.html +++ b/gui/default/syncthing/core/aboutModalView.html @@ -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> diff --git a/gui/default/syncthing/core/editShareTemplate.html b/gui/default/syncthing/core/editShareTemplate.html index c03bba16e1..701451dde0 100644 --- a/gui/default/syncthing/core/editShareTemplate.html +++ b/gui/default/syncthing/core/editShareTemplate.html @@ -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"> diff --git a/gui/default/syncthing/core/syncthingController.js b/gui/default/syncthing/core/syncthingController.js index 9be6a988b4..20c3ec3841 100755 --- a/gui/default/syncthing/core/syncthingController.js +++ b/gui/default/syncthing/core/syncthingController.js @@ -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) { diff --git a/gui/default/syncthing/device/editDeviceModalView.html b/gui/default/syncthing/device/editDeviceModalView.html index 11005313f7..e74e1692c2 100644 --- a/gui/default/syncthing/device/editDeviceModalView.html +++ b/gui/default/syncthing/device/editDeviceModalView.html @@ -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> diff --git a/gui/default/syncthing/device/globalChangesModalView.html b/gui/default/syncthing/device/globalChangesModalView.html index d1dfb8e6d8..77799eba11 100644 --- a/gui/default/syncthing/device/globalChangesModalView.html +++ b/gui/default/syncthing/device/globalChangesModalView.html @@ -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> diff --git a/gui/default/syncthing/folder/editFolderModalView.html b/gui/default/syncthing/folder/editFolderModalView.html index 6564479d0f..deff5f7f9c 100644 --- a/gui/default/syncthing/folder/editFolderModalView.html +++ b/gui/default/syncthing/folder/editFolderModalView.html @@ -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> diff --git a/gui/default/syncthing/transfer/localChangedFilesModalView.html b/gui/default/syncthing/transfer/localChangedFilesModalView.html index 2ca483163a..b2a81ba201 100644 --- a/gui/default/syncthing/transfer/localChangedFilesModalView.html +++ b/gui/default/syncthing/transfer/localChangedFilesModalView.html @@ -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> diff --git a/gui/default/syncthing/transfer/remoteNeededFilesModalView.html b/gui/default/syncthing/transfer/remoteNeededFilesModalView.html index 0ad2a8b144..f2dfbd07ec 100644 --- a/gui/default/syncthing/transfer/remoteNeededFilesModalView.html +++ b/gui/default/syncthing/transfer/remoteNeededFilesModalView.html @@ -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> |