mirror of
https://github.com/octoleo/syncthing.git
synced 2024-12-22 10:58:57 +00:00
gui: Make device ID read-only and hide "nearby devices" when adding a new pending device (fixes #8083) (#8091)
* gui: Make ID read-only and hide nearby devices when adding pending devices (fixes #8083) Currently, there is no distinction between adding "new" and "pending" devices. For this reason, the user is always presented with a list of "nearby devices" to choose from. This commit adds such distinction to the code, and in the case of "pending" device, both the device ID is made read-only and the nearby devices list is hidden. As a by-product of the function rename and clean-up, this commit also hides the non-functional "remove" button that is shown when editing device defaults. Signed-off-by: Tomasz Wilczyński <twilczynski@naver.com>
This commit is contained in:
tomasz1986
GitHub
parent
479712cdc5
commit
73e2e2a794
@ -1614,6 +1614,11 @@ angular.module('syncthing.core')
|
||||
return $scope.currentDevice._editing == 'existing';
|
||||
}
|
||||
|
||||
$scope.editingDeviceNew = function() {
|
||||
// The "new-pending" value is intentionally disregarded here.
|
||||
return $scope.currentDevice._editing == 'new';
|
||||
}
|
||||
|
||||
$scope.editDeviceExisting = function (deviceCfg) {
|
||||
$scope.currentDevice = $.extend({}, deviceCfg);
|
||||
$scope.currentDevice._editing = "existing";
|
||||
@ -1683,7 +1688,11 @@ angular.module('syncthing.core')
|
||||
$scope.currentDevice = p.data;
|
||||
$scope.currentDevice.name = name;
|
||||
$scope.currentDevice.deviceID = deviceID;
|
||||
$scope.currentDevice._editing = "add";
|
||||
if (deviceID) {
|
||||
$scope.currentDevice._editing = "new-pending";
|
||||
} else {
|
||||
$scope.currentDevice._editing = "new";
|
||||
}
|
||||
initShareEditing('device');
|
||||
$scope.currentSharing.unrelated = $scope.folderList();
|
||||
editDeviceModal();
|
||||
|
||||
@ -4,23 +4,18 @@ angular.module('syncthing.core')
|
||||
require: 'ngModel',
|
||||
link: function (scope, elm, attrs, ctrl) {
|
||||
ctrl.$parsers.unshift(function (viewValue) {
|
||||
if (scope.currentDevice._editing != "add") {
|
||||
// we shouldn't validate
|
||||
ctrl.$setValidity('validDeviceid', true);
|
||||
} else {
|
||||
$http.get(urlbase + '/svc/deviceid?id=' + viewValue).success(function (resp) {
|
||||
if (resp.error) {
|
||||
ctrl.$setValidity('validDeviceid', false);
|
||||
} else {
|
||||
ctrl.$setValidity('validDeviceid', true);
|
||||
}
|
||||
});
|
||||
//Prevents user from adding a duplicate ID
|
||||
if (scope.devices.hasOwnProperty(viewValue)) {
|
||||
ctrl.$setValidity('unique', false);
|
||||
$http.get(urlbase + '/svc/deviceid?id=' + viewValue).success(function (resp) {
|
||||
if (resp.error) {
|
||||
ctrl.$setValidity('validDeviceid', false);
|
||||
} else {
|
||||
ctrl.$setValidity('unique', true);
|
||||
ctrl.$setValidity('validDeviceid', true);
|
||||
}
|
||||
});
|
||||
//Prevents user from adding a duplicate ID
|
||||
if (scope.devices.hasOwnProperty(viewValue)) {
|
||||
ctrl.$setValidity('unique', false);
|
||||
} else {
|
||||
ctrl.$setValidity('unique', true);
|
||||
}
|
||||
return viewValue;
|
||||
});
|
||||
|
||||
@ -10,19 +10,20 @@
|
||||
<div id="device-general" class="tab-pane in active">
|
||||
<div ng-if="!editingDeviceDefaults()" class="form-group" ng-class="{'has-error': deviceEditor.deviceID.$invalid && deviceEditor.deviceID.$dirty}" ng-init="loadFormIntoScope(deviceEditor)">
|
||||
<label translate for="deviceID">Device ID</label>
|
||||
<div ng-if="!editingDeviceExisting()">
|
||||
<div class="input-group">
|
||||
<input name="deviceID" id="deviceID" class="form-control text-monospace" type="text" ng-model="currentDevice.deviceID" required="" valid-deviceid list="discovery-list" aria-required="true" />
|
||||
<div class="input-group-btn">
|
||||
<button type="button" class="btn btn-default" data-toggle="modal" data-target="#idqr" ng-disabled="!deviceEditor.deviceID.$valid">
|
||||
<span class="fas fa-qrcode"></span> <span translate>Show QR</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="input-group">
|
||||
<input ng-if="editingDeviceNew()" name="deviceID" id="deviceID" class="form-control text-monospace" type="text" ng-model="currentDevice.deviceID" required="" valid-deviceid list="discovery-list" aria-required="true" />
|
||||
<div ng-if="!editingDeviceNew()" class="well well-sm form-control text-monospace" style="height: auto;" select-on-click>{{currentDevice.deviceID}}</div>
|
||||
<div class="input-group-btn">
|
||||
<button type="button" class="btn btn-default" data-toggle="modal" data-target="#idqr" ng-disabled="editingDeviceNew() && !deviceEditor.deviceID.$valid">
|
||||
<span class="fas fa-qrcode"></span> <span translate>Show QR</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-if="editingDeviceNew()">
|
||||
<datalist id="discovery-list">
|
||||
<option ng-repeat="id in discovery" value="{{id}}" />
|
||||
</datalist>
|
||||
<p class="help-block" ng-if="discovery && discovery.length !== 0">
|
||||
<div class="help-block" ng-if="discovery && discovery.length !== 0">
|
||||
<span translate>You can also select one of these nearby devices:</span>
|
||||
<ul>
|
||||
<li ng-repeat="id in discovery" style="list-style-type: none;">
|
||||
@ -31,7 +32,7 @@
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</p>
|
||||
</div>
|
||||
<p class="help-block">
|
||||
<span translate ng-if="deviceEditor.deviceID.$valid || deviceEditor.deviceID.$pristine">The device ID to enter here can be found in the "Actions > Show ID" dialog on the other device. Spaces and dashes are optional (ignored).</span>
|
||||
<span translate ng-show="deviceEditor.deviceID.$valid || deviceEditor.deviceID.$pristine">When adding a new device, keep in mind that this device must be added on the other side too.</span>
|
||||
@ -40,14 +41,6 @@
|
||||
<span translate ng-if="deviceEditor.deviceID.$error.unique && deviceEditor.deviceID.$dirty">A device with that ID is already added.</span>
|
||||
</p>
|
||||
</div>
|
||||
<div ng-if="editingDeviceExisting()" class="input-group">
|
||||
<div class="well well-sm text-monospace form-control" style="height: auto;" select-on-click>{{currentDevice.deviceID}}</div>
|
||||
<div class="input-group-btn">
|
||||
<button type="button" class="btn btn-default" data-toggle="modal" data-target="#idqr">
|
||||
<span class="fas fa-qrcode"></span> <span translate>Show QR</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label translate for="name">Device Name</label>
|
||||
@ -172,7 +165,7 @@
|
||||
<button type="button" class="btn btn-default btn-sm" data-dismiss="modal">
|
||||
<span class="fas fa-times"></span> <span translate>Close</span>
|
||||
</button>
|
||||
<div ng-if="has(['existing', 'defaults'], currentDevice._editing)" class="pull-left">
|
||||
<div ng-if="editingDeviceExisting()" class="pull-left">
|
||||
<button type="button" class="btn btn-warning btn-sm" data-toggle="modal" data-target="#remove-device-confirmation">
|
||||
<span class="fas fa-minus-circle"></span> <span translate>Remove</span>
|
||||
</button>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user