2021-08-03 22:29:33 +12:00
|
|
|
(function (window) {
|
|
|
|
"use strict";
|
2021-07-26 19:24:29 +12:00
|
|
|
//note field below field to validation errors
|
|
|
|
//2021-07-25-17-47-59.png
|
|
|
|
//validation rule
|
2021-08-03 22:29:33 +12:00
|
|
|
window.ls.container.get("view").add({
|
|
|
|
selector: "data-custom-id",
|
2021-08-03 23:23:13 +12:00
|
|
|
controller: function (element, sdk, console) {
|
2021-08-03 22:29:33 +12:00
|
|
|
var prevData = "";
|
2021-08-04 18:39:23 +12:00
|
|
|
let idType = element.dataset["id-type"];
|
2021-08-03 22:29:33 +12:00
|
|
|
|
|
|
|
var div = window.document.createElement("div");
|
|
|
|
|
|
|
|
div.className = "input-copy";
|
|
|
|
|
|
|
|
var button = window.document.createElement("i");
|
|
|
|
|
|
|
|
button.type = "button";
|
|
|
|
button.style.cursor = "pointer";
|
|
|
|
|
|
|
|
var writer = document.createElement("input");
|
|
|
|
writer.type = "text";
|
|
|
|
writer.className = "";
|
|
|
|
writer.setAttribute("maxlength", element.getAttribute("maxlength"));
|
|
|
|
var placeholder = element.getAttribute("placeholder");
|
|
|
|
if (placeholder) {
|
|
|
|
writer.setAttribute("placeholder", placeholder);
|
|
|
|
}
|
|
|
|
|
|
|
|
var info = window.document.createElement("div");
|
|
|
|
info.className = "text-fade text-size-xs margin-top-negative-small margin-bottom";
|
|
|
|
|
|
|
|
div.appendChild(writer);
|
|
|
|
div.appendChild(button);
|
|
|
|
element.parentNode.insertBefore(div, element);
|
|
|
|
element.parentNode.insertBefore(info, div.nextSibling);
|
2021-07-26 19:24:29 +12:00
|
|
|
|
2021-08-03 22:29:33 +12:00
|
|
|
var switchType = function (event) {
|
|
|
|
if (idType == "custom") {
|
|
|
|
idType = "auto";
|
|
|
|
setIdType(idType);
|
|
|
|
} else {
|
|
|
|
idType = "custom";
|
|
|
|
setIdType(idType);
|
2021-07-26 19:24:29 +12:00
|
|
|
}
|
2021-08-03 22:29:33 +12:00
|
|
|
}
|
2021-07-26 19:24:29 +12:00
|
|
|
|
2021-08-04 18:39:23 +12:00
|
|
|
var validate = function (event) {
|
|
|
|
var service = element.dataset["validator"];
|
|
|
|
service = service.split('.');
|
2021-08-03 23:23:13 +12:00
|
|
|
const value = event.target.value;
|
|
|
|
if (value.length < 1) {
|
|
|
|
event.target.setCustomValidity("ID is required");
|
|
|
|
} else {
|
2021-08-04 18:39:23 +12:00
|
|
|
if (service[0] == 'projects') {
|
|
|
|
if (service[1] == 'getPlatform') {
|
|
|
|
var projectId = element.form.elements.namedItem("projectId").value;
|
|
|
|
console[service[0]][service[1]](projectId, value).then(function (res) {
|
|
|
|
if (res.$id == value) {
|
|
|
|
event.target.setCustomValidity("ID already exists");
|
|
|
|
} else {
|
|
|
|
event.target.setCustomValidity("");
|
|
|
|
}
|
|
|
|
}, function (e) {
|
|
|
|
event.target.setCustomValidity("");
|
|
|
|
});
|
2021-08-03 23:23:13 +12:00
|
|
|
} else {
|
2021-08-04 18:39:23 +12:00
|
|
|
console[service[0]][service[1]](value).then(function (res) {
|
|
|
|
if (res.$id == value) {
|
|
|
|
event.target.setCustomValidity("ID already exists");
|
|
|
|
} else {
|
|
|
|
event.target.setCustomValidity("");
|
|
|
|
}
|
|
|
|
}, function (e) {
|
|
|
|
event.target.setCustomValidity("");
|
|
|
|
});
|
2021-08-03 23:23:13 +12:00
|
|
|
}
|
2021-08-04 19:29:10 +12:00
|
|
|
} else if (service[0]=='teams' && service[1] == 'getMembership') {
|
|
|
|
var teamId = element.form.elements.namedItem("teamId").value;
|
|
|
|
sdk[service[0]][service[1]](teamId, value).then(function (res) {
|
|
|
|
if (res.$id == value) {
|
|
|
|
event.target.setCustomValidity("ID already exists");
|
|
|
|
} else {
|
|
|
|
event.target.setCustomValidity("");
|
|
|
|
}
|
|
|
|
}, function (e) {
|
|
|
|
event.target.setCustomValidity("");
|
|
|
|
});
|
2021-08-04 18:39:23 +12:00
|
|
|
} else {
|
|
|
|
sdk[service[0]][service[1]](value).then(function (res) {
|
|
|
|
if (res.$id == value) {
|
|
|
|
event.target.setCustomValidity("ID already exists");
|
|
|
|
} else {
|
|
|
|
event.target.setCustomValidity("");
|
|
|
|
}
|
|
|
|
}, function (e) {
|
|
|
|
event.target.setCustomValidity("");
|
|
|
|
});
|
|
|
|
}
|
2021-08-03 23:23:13 +12:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-08-03 22:29:33 +12:00
|
|
|
var setIdType = function (idType) {
|
2021-08-04 19:29:10 +12:00
|
|
|
element.setAttribute("data-id-type", idType);
|
2021-08-03 22:29:33 +12:00
|
|
|
if (idType == "custom") {
|
2021-08-04 18:39:23 +12:00
|
|
|
info.innerHTML = "Allowed Characters A-Z, a-z, 0-9, and non-leading underscore";
|
2021-08-03 22:29:33 +12:00
|
|
|
writer.value = prevData;
|
|
|
|
writer.disabled = false;
|
|
|
|
element.value = prevData;
|
|
|
|
writer.focus();
|
2021-08-03 23:23:13 +12:00
|
|
|
writer.addEventListener('blur', validate);
|
2021-08-03 22:29:33 +12:00
|
|
|
} else {
|
2021-08-04 18:39:23 +12:00
|
|
|
info.innerHTML = "Appwrite will generate a unique ID";
|
2021-08-03 22:29:33 +12:00
|
|
|
prevData = writer.value;
|
|
|
|
writer.disabled = true;
|
|
|
|
writer.value = 'auto-generated';
|
|
|
|
element.value = 'unique()';
|
2021-07-26 22:05:31 +12:00
|
|
|
}
|
2021-08-03 22:29:33 +12:00
|
|
|
button.className = idType == "custom" ? "icon-cog copy" : "icon-edit copy";
|
|
|
|
}
|
2021-07-26 19:24:29 +12:00
|
|
|
|
2021-08-03 22:29:33 +12:00
|
|
|
var sync = function (event) {
|
|
|
|
if (element.value !== 'unique()') {
|
|
|
|
writer.value = element.value;
|
2021-08-03 21:49:41 +12:00
|
|
|
}
|
2021-08-03 22:29:33 +12:00
|
|
|
}
|
|
|
|
|
|
|
|
var syncE = function (event) {
|
|
|
|
element.value = writer.value;
|
|
|
|
}
|
2021-08-03 21:49:41 +12:00
|
|
|
|
2021-08-03 22:29:33 +12:00
|
|
|
var keypress = function (e) {
|
|
|
|
// which key is pressed, keyPressed = e.which || e.keyCode;
|
|
|
|
const key = e.which || e.keyCode;
|
|
|
|
const ZERO = 48;
|
|
|
|
const NINE = 57;
|
|
|
|
const SMALL_A = 97;
|
|
|
|
const SMALL_Z = 122;
|
|
|
|
const CAPITAL_A = 65;
|
|
|
|
const CAPITAL_Z = 90;
|
|
|
|
const UNDERSCORE = 95;
|
2021-07-26 19:24:29 +12:00
|
|
|
|
2021-08-03 22:29:33 +12:00
|
|
|
const isNotValidDigit = key < ZERO || key > NINE;
|
|
|
|
const isNotValidSmallAlphabet = key < SMALL_A || key > SMALL_Z;
|
|
|
|
const isNotValidCapitalAlphabet = key < CAPITAL_A || key > CAPITAL_Z;
|
|
|
|
|
|
|
|
//Leading underscore is prevented
|
|
|
|
if (key == UNDERSCORE && e.target.value.length == 0) {
|
|
|
|
e.preventDefault();
|
|
|
|
}
|
|
|
|
if (key != UNDERSCORE && isNotValidDigit && isNotValidSmallAlphabet && isNotValidCapitalAlphabet) {
|
|
|
|
e.preventDefault();
|
|
|
|
}
|
2021-07-26 19:24:29 +12:00
|
|
|
}
|
2021-08-03 22:29:33 +12:00
|
|
|
|
|
|
|
sync();
|
|
|
|
setIdType(idType);
|
|
|
|
writer.addEventListener("change", syncE);
|
|
|
|
writer.addEventListener('keypress', keypress);
|
|
|
|
button.addEventListener("click", switchType);
|
|
|
|
|
|
|
|
}
|
|
|
|
});
|
|
|
|
})(window);
|