Move name and logo into branding page

This commit is contained in:
Girish Ramakrishnan
2020-03-18 21:31:51 -07:00
parent cead5b74ae
commit 14348eba38
5 changed files with 314 additions and 317 deletions

View File

@@ -24,12 +24,23 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
$scope.update = {
error: {}, // this is for the dialog
busy: false,
checking: false,
percent: 0,
message: 'Downloading',
errorMessage: '', // this shows inline
taskId: '',
skipBackup: false,
checkNow: function () {
$scope.update.checking = true;
Client.checkForUpdates(function (error) {
if (error) Client.error(error);
$scope.update.checking = false;
});
},
show: function () {
$scope.update.error.generic = null;
$scope.update.busy = false;
@@ -117,118 +128,6 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
}
};
$scope.avatarChange = {
busy: false,
error: {},
avatar: null,
availableAvatars: [{
file: null,
data: null,
url: '/img/avatars/logo.png',
}, {
file: null,
data: null,
url: '/img/avatars/logo-green.png'
}, {
file: null,
data: null,
url: '/img/avatars/logo-orange.png'
}, {
file: null,
data: null,
url: '/img/avatars/logo-darkblue.png'
}, {
file: null,
data: null,
url: '/img/avatars/logo-red.png'
}, {
file: null,
data: null,
url: '/img/avatars/logo-yellow.png'
}, {
file: null,
data: null,
url: '/img/avatars/logo-black.png'
}],
getBlobFromImg: function (img, callback) {
var size = 256;
var canvas = document.createElement('canvas');
canvas.width = size;
canvas.height = size;
var imageDimensionRatio = img.width / img.height;
var canvasDimensionRatio = canvas.width / canvas.height;
var renderableHeight, renderableWidth, xStart, yStart;
if (imageDimensionRatio > canvasDimensionRatio) {
renderableHeight = canvas.height;
renderableWidth = img.width * (renderableHeight / img.height);
xStart = (canvas.width - renderableWidth) / 2;
yStart = 0;
} else if (imageDimensionRatio < canvasDimensionRatio) {
renderableWidth = canvas.width;
renderableHeight = img.height * (renderableWidth / img.width);
xStart = 0;
yStart = (canvas.height - renderableHeight) / 2;
} else {
renderableHeight = canvas.height;
renderableWidth = canvas.width;
xStart = 0;
yStart = 0;
}
var ctx = canvas.getContext('2d');
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.drawImage(img, xStart, yStart, renderableWidth, renderableHeight);
canvas.toBlob(callback);
},
doChangeAvatar: function () {
$scope.avatarChange.error.avatar = null;
$scope.avatarChange.busy = true;
var img = document.getElementById('previewAvatar');
$scope.avatarChange.avatar.file = $scope.avatarChange.getBlobFromImg(img, function (blob) {
Client.changeCloudronAvatar(blob, function (error) {
if (error) {
console.error('Unable to change cloudron avatar.', error);
} else {
Client.resetAvatar();
}
$('#avatarChangeModal').modal('hide');
$scope.avatarChange.avatarChangeReset();
});
});
},
setPreviewAvatar: function (avatar) {
$scope.avatarChange.avatar = avatar;
},
avatarChangeReset: function () {
$scope.avatarChange.error.avatar = null;
$scope.avatarChange.avatar = null;
$scope.avatarChange.busy = false;
},
showChangeAvatar: function () {
$scope.avatarChange.avatarChangeReset();
$('#avatarChangeModal').modal('show');
},
showCustomAvatarSelector: function () {
$('#avatarFileInput').click();
}
};
$scope.s3like = function (provider) {
return provider === 's3' || provider === 'minio' || provider === 's3-v4-compat' || provider === 'exoscale-sos' || provider === 'digitalocean-spaces';
};
$scope.timeZone = {
busy: false,
success: false,
@@ -252,38 +151,25 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
$scope.timeZone.success = true;
});
}
}
};
$scope.autoUpdate = {
busy: false,
success: false,
error: '',
pattern: '',
currentPattern: '',
checkNow: function () {
$scope.autoUpdate.busy = true;
Client.checkForUpdates(function (error) {
if (error) $scope.autoUpdate.error = error.message;
$scope.autoUpdate.busy = false;
});
},
submit: function () {
if ($scope.autoUpdate.pattern === $scope.autoUpdate.currentPattern) return;
$scope.autoUpdate.error = '';
$scope.autoUpdate.busy = true;
$scope.autoUpdate.success = false;
Client.setAppAutoupdatePattern($scope.autoUpdate.pattern, function (error) {
if (error) $scope.autoUpdate.error = error.message;
if (error) Client.error(error);
else $scope.autoUpdate.currentPattern = $scope.autoUpdate.pattern;
$scope.autoUpdate.busy = false;
$scope.autoUpdate.success = true;
$timeout(function () {
$scope.autoUpdate.busy = false;
}, 3000);
});
}
};
@@ -334,23 +220,6 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
Client.openSubscriptionSetup($scope.subscription);
};
$('#avatarFileInput').get(0).onchange = function (event) {
var fr = new FileReader();
fr.onload = function () {
$scope.$apply(function () {
var tmp = {
file: event.target.files[0],
data: fr.result,
url: null
};
$scope.avatarChange.availableAvatars.push(tmp);
$scope.avatarChange.setPreviewAvatar(tmp);
});
};
fr.readAsDataURL(event.target.files[0]);
};
$scope.registryConfig = {
busy: false,
error: null,
@@ -403,53 +272,6 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
}
};
$scope.cloudronNameChange = {
busy: false,
error: {},
name: '',
reset: function () {
$scope.cloudronNameChange.busy = false;
$scope.cloudronNameChange.error.name = null;
$scope.cloudronNameChange.name = '';
$scope.cloudronNameChangeForm.$setUntouched();
$scope.cloudronNameChangeForm.$setPristine();
},
show: function () {
$scope.cloudronNameChange.reset();
$scope.cloudronNameChange.name = $scope.config.cloudronName;
$('#cloudronNameChangeModal').modal('show');
},
submit: function () {
$scope.cloudronNameChange.error.name = null;
$scope.cloudronNameChange.busy = true;
Client.changeCloudronName($scope.cloudronNameChange.name, function (error) {
$scope.cloudronNameChange.busy = false;
if (error) {
if (error.statusCode === 400) {
$scope.cloudronNameChange.error.name = 'Invalid name';
$scope.cloudronNameChange.name = '';
$('#inputCloudronName').focus();
$scope.cloudronNameChangeForm.password.$setPristine();
} else {
console.error('Unable to change name.', error);
return;
}
}
$scope.cloudronNameChange.reset();
$('#cloudronNameChangeModal').modal('hide');
Client.refreshConfig();
});
}
};
Client.onReady(function () {
getAutoupdatePattern();
getRegistryConfig();
@@ -461,7 +283,7 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
});
// setup all the dialog focus handling
['planChangeModal', 'appstoreLoginModal', 'cloudronNameChangeModal'].forEach(function (id) {
['planChangeModal', 'appstoreLoginModal'].forEach(function (id) {
$('#' + id).on('shown.bs.modal', function () {
$(this).find("[autofocus]:first").focus();
});