|
|
@@ -0,0 +1,74 @@
|
|
|
+function Password(parent, open){
|
|
|
+ this.textBox = document.createElement("input")
|
|
|
+ this.textBox.setAttribute("type", "password")
|
|
|
+ parent.appendChild(this.textBox)
|
|
|
+ this.checkBox = document.createElement("input")
|
|
|
+ this.checkBox.setAttribute("type", "checkbox")
|
|
|
+ parent.appendChild(this.checkBox)
|
|
|
+
|
|
|
+ this.isChecked = function(checkBox, textBox) {
|
|
|
+ if(open === false){
|
|
|
+ this.textBox.setAttribute("type", "password")
|
|
|
+ open = true;
|
|
|
+ } else {
|
|
|
+ this.textBox.setAttribute("type", "text")
|
|
|
+ open = false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.getValue = function(arg = this.textBox) {
|
|
|
+ return arg.value
|
|
|
+ }
|
|
|
+ this.setValue = function(inner) {
|
|
|
+ this.textBox.value = inner;
|
|
|
+ }
|
|
|
+ this.getOpen = function() {
|
|
|
+ let str;
|
|
|
+ open == true ? str = "closed" : str = "opened";
|
|
|
+ return str;
|
|
|
+ }
|
|
|
+
|
|
|
+ this.onChange = function(arg) {
|
|
|
+ let data = this.getValue(arg);
|
|
|
+ return data;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ this.checkBox.onchange = () => {
|
|
|
+ this.isChecked(this.checkBox, this.textBox)
|
|
|
+ this.onOpenChange(this.getOpen())
|
|
|
+ };
|
|
|
+ this.textBox.oninput = () => this.onChange(this.getValue(this.textBox));
|
|
|
+ this.setOpen = function(arg) {
|
|
|
+ if(!arg == true){
|
|
|
+ this.checkBox.checked = "checked"
|
|
|
+ } else {
|
|
|
+ this.checkBox.checked = ""
|
|
|
+ }
|
|
|
+ this.isChecked()
|
|
|
+ }
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+let p = new Password(document.body, true)
|
|
|
+
|
|
|
+p.onChange = data => console.log(data)
|
|
|
+
|
|
|
+p.onOpenChange = open => console.log(open)
|
|
|
+
|
|
|
+p.setValue('qwerty')
|
|
|
+console.log(p.getValue())
|
|
|
+
|
|
|
+p.setOpen(false)
|
|
|
+console.log(p.getOpen())
|
|
|
+// Напишите функцию конструктор Password, которая будет в родительском
|
|
|
+//элементе создавать поле ввода для пароля и кнопку/иконку/чекбокс,
|
|
|
+//который будет переключать режим просмотра пароля в поле ввода.
|
|
|
+// Параметры:
|
|
|
+// parent - родительский элемент
|
|
|
+// open - стартовое состояние
|
|
|
+// Методы:
|
|
|
+// setValue/getValue - задают/читают значения
|
|
|
+// setOpen/getOpen - задают/читают открытость текста в поле ввода
|
|
|
+// Колбэки (функции обратного вызова, данные изнутри объекта):
|
|
|
+// onChange - запускается по событию oninput в поле ввода, передает текст наружу
|
|
|
+// onOpenChange - запускается по изменению состояния открытости пароля
|
