+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.1/index3.html b/staff/victoria-kolomytseva/unsocial.1/index3.html
new file mode 100644
index 00000000..8db8df08
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.1/index3.html
@@ -0,0 +1,164 @@
+
+
+
+
+
+
+ Unsocial
+
+
+
+
+
+
+
+
Unsocial
+
+
+
+
+
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial1/data.js b/staff/victoria-kolomytseva/unsocial.2/data.js
similarity index 100%
rename from staff/victoria-kolomytseva/unsocial1/data.js
rename to staff/victoria-kolomytseva/unsocial.2/data.js
diff --git a/staff/victoria-kolomytseva/unsocial1/index.html b/staff/victoria-kolomytseva/unsocial.2/index.html
similarity index 99%
rename from staff/victoria-kolomytseva/unsocial1/index.html
rename to staff/victoria-kolomytseva/unsocial.2/index.html
index 357443d7..a46ec165 100644
--- a/staff/victoria-kolomytseva/unsocial1/index.html
+++ b/staff/victoria-kolomytseva/unsocial.2/index.html
@@ -14,8 +14,11 @@
Unsocial
+
+
+
diff --git a/staff/victoria-kolomytseva/unsocial1/logic.js b/staff/victoria-kolomytseva/unsocial.2/logic.js
similarity index 97%
rename from staff/victoria-kolomytseva/unsocial1/logic.js
rename to staff/victoria-kolomytseva/unsocial.2/logic.js
index 1463d7c9..020b2f18 100644
--- a/staff/victoria-kolomytseva/unsocial1/logic.js
+++ b/staff/victoria-kolomytseva/unsocial.2/logic.js
@@ -20,7 +20,7 @@ function registerUser(name, email, username, password, passwordRepeat) {
return user.username === username || user.email === email
})
- if (user !== underfined)
+ if (user !== undefined)
throw new Error('user already exists')
user = { name: name, email: email, username: username, password: password }
diff --git a/staff/victoria-kolomytseva/unsocial1/main.js b/staff/victoria-kolomytseva/unsocial.2/main.js
similarity index 99%
rename from staff/victoria-kolomytseva/unsocial1/main.js
rename to staff/victoria-kolomytseva/unsocial.2/main.js
index a665f777..058f8845 100644
--- a/staff/victoria-kolomytseva/unsocial1/main.js
+++ b/staff/victoria-kolomytseva/unsocial.2/main.js
@@ -187,5 +187,7 @@ loginRegisterLink.addEventListener('click', function (event) {
body.appendChild(registerSection)
})
+
+
var body = document.querySelector('body')
body.appendChild(loginSection)
diff --git a/staff/victoria-kolomytseva/unsocial1/styles.css b/staff/victoria-kolomytseva/unsocial.2/styles.css
similarity index 100%
rename from staff/victoria-kolomytseva/unsocial1/styles.css
rename to staff/victoria-kolomytseva/unsocial.2/styles.css
diff --git a/staff/victoria-kolomytseva/unsocial.3/data.js b/staff/victoria-kolomytseva/unsocial.3/data.js
new file mode 100644
index 00000000..68f31163
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.3/data.js
@@ -0,0 +1,6 @@
+//data
+
+var users = [
+ { name: 'Peter Pan', email: 'peter@pan.com', username: 'peterpan', password: '123123123' },
+ { name: 'Wendy Darling', email: 'wendy@darling.com', username: 'wendydarling', password: '123123123' }
+]
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.3/index.html b/staff/victoria-kolomytseva/unsocial.3/index.html
new file mode 100644
index 00000000..91cd025e
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.3/index.html
@@ -0,0 +1,28 @@
+
+
+
+
+
+
+ Unsocial
+
+
+
+
+
+
+
+
+
Unsocial
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.3/logic.js b/staff/victoria-kolomytseva/unsocial.3/logic.js
new file mode 100644
index 00000000..edb64111
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.3/logic.js
@@ -0,0 +1,44 @@
+function registerUser(name, email, username, password, passwordRepeat) {
+ if (name.length < 2)
+ throw new Error('invalid name')
+
+ if (!/^(([^<>()[\]\.,;:\s@\"]+(\.[^<>()[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i.test(email))
+ throw new Error('invalid e-mail')
+
+ if (username.length < 4 || username.length > 12)
+ throw new Error('invalid username')
+
+ if (password.length < 8)
+ throw new Error('invalid password')
+
+ if (password !== passwordRepeat)
+ throw new Error('passwords do not match')
+
+ var user = users.find(function (user) {
+ return user.username === username || user.email === email
+ })
+
+ if (user !== undefined)
+ throw new Error('user already exists')
+
+ user = { name: name, email: email, username: username, password: password }
+
+ users.push(user)
+}
+
+function authenticateUser(username, password) {
+ if (username.length < 4 || username.length > 12)
+ throw new Error('invalid username')
+
+ if (password.length < 8)
+ throw new Error('invalid password')
+
+ var user = users.find(function (user) {
+ return user.username === username && user.password === password
+ })
+
+ if (user === undefined)
+ throw new Error('wrong credentials')
+
+ return user
+}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.3/main.js b/staff/victoria-kolomytseva/unsocial.3/main.js
new file mode 100644
index 00000000..029a3897
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.3/main.js
@@ -0,0 +1,6 @@
+var loggedInUser = null
+
+var loginSection = buildLoginSection()
+
+var body = document.querySelector('body')
+body.appendChild(loginSection)
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial/style.css b/staff/victoria-kolomytseva/unsocial.3/styles.css
similarity index 100%
rename from staff/victoria-kolomytseva/unsocial/style.css
rename to staff/victoria-kolomytseva/unsocial.3/styles.css
diff --git a/staff/victoria-kolomytseva/unsocial.3/view.js b/staff/victoria-kolomytseva/unsocial.3/view.js
new file mode 100644
index 00000000..aa3b0b68
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.3/view.js
@@ -0,0 +1,209 @@
+function buildLoginSection() {
+ var loginSection = document.createElement('section')
+
+ var loginTitle = document.createElement('h2')
+ loginTitle.innerText = 'Login'
+ loginSection.appendChild(loginTitle)
+
+ var loginForm = document.createElement('form')
+ loginSection.appendChild(loginForm)
+
+ var loginUsernameLabel = document.createElement('label')
+ loginUsernameLabel.htmlFor = 'username'
+ loginUsernameLabel.innerText = 'Username'
+ loginForm.appendChild(loginUsernameLabel)
+
+ var loginUsernameInput = document.createElement('input')
+ loginUsernameInput.type = 'text'
+ loginUsernameInput.id = 'username'
+ loginForm.appendChild(loginUsernameInput)
+
+ var loginPasswordLabel = document.createElement('label')
+ loginPasswordLabel.htmlFor = 'password'
+ loginPasswordLabel.innerText = 'Password'
+ loginForm.appendChild(loginPasswordLabel)
+
+ var loginPasswordInput = document.createElement('input')
+ loginPasswordInput.type = 'password'
+ loginPasswordInput.id = 'password'
+ loginForm.appendChild(loginPasswordInput)
+
+ var loginSubmitButton = document.createElement('button')
+ loginSubmitButton.type = 'submit'
+ loginSubmitButton.innerText = 'Login'
+ loginForm.appendChild(loginSubmitButton)
+
+ loginForm.addEventListener('submit', function (event) {
+ event.preventDefault()
+
+ var username = loginUsernameInput.value
+ var password = loginPasswordInput.value
+
+ try {
+ loggedInUser = authenticateUser(username, password)
+
+ loginForm.reset()
+
+ loginSection.remove()
+
+ var homeSection = buildHomeSection()
+
+ body.appendChild(homeSection)
+ } catch (error) {
+ loginPasswordInput.value = ''
+
+ alert(error.message)
+
+ console.error(error)
+ }
+ })
+
+ var loginRegisterLink = document.createElement('a')
+ loginRegisterLink.href = ''
+ loginRegisterLink.innerText = 'Register'
+ loginSection.appendChild(loginRegisterLink)
+
+ loginRegisterLink.addEventListener('click', function (event) {
+ event.preventDefault()
+
+ loginSection.remove()
+
+ var registerSection = buildRegisterSection()
+
+ body.appendChild(registerSection)
+ })
+
+ return loginSection
+}
+
+function buildRegisterSection() {
+ var registerSection = document.createElement('section')
+
+ var registerTitle = document.createElement('h2')
+ registerTitle.innerText = 'Register'
+ registerSection.appendChild(registerTitle)
+
+ var registerForm = document.createElement('form')
+ registerSection.appendChild(registerForm)
+
+ var registerNameLabel = document.createElement('label')
+ registerNameLabel.htmlFor = 'name'
+ registerNameLabel.innerText = 'Name'
+ registerForm.appendChild(registerNameLabel)
+
+ var registerNameInput = document.createElement('input')
+ registerNameInput.type = 'text'
+ registerNameInput.id = 'name'
+ registerForm.appendChild(registerNameInput)
+
+ var registerEmailLabel = document.createElement('label')
+ registerEmailLabel.htmlFor = 'email'
+ registerEmailLabel.innerText = 'E-mail'
+ registerForm.appendChild(registerEmailLabel)
+
+ var registerEmailInput = document.createElement('input')
+ registerEmailInput.type = 'email'
+ registerEmailInput.id = 'email'
+ registerForm.appendChild(registerEmailInput)
+
+ var registerUsernameLabel = document.createElement('label')
+ registerUsernameLabel.htmlFor = 'username'
+ registerUsernameLabel.innerText = 'Username'
+ registerForm.appendChild(registerUsernameLabel)
+
+ var registerUsernameInput = document.createElement('input')
+ registerUsernameInput.type = 'text'
+ registerUsernameInput.id = 'username'
+ registerForm.appendChild(registerUsernameInput)
+
+ var registerPasswordLabel = document.createElement('label')
+ registerPasswordLabel.htmlFor = 'password'
+ registerPasswordLabel.innerText = 'Password'
+ registerForm.appendChild(registerPasswordLabel)
+
+ var registerPasswordInput = document.createElement('input')
+ registerPasswordInput.type = 'password'
+ registerPasswordInput.id = 'password'
+ registerForm.appendChild(registerPasswordInput)
+
+ var registerPasswordRepeatLabel = document.createElement('label')
+ registerPasswordRepeatLabel.htmlFor = 'password-repeat'
+ registerPasswordRepeatLabel.innerText = 'Repeat Password'
+ registerForm.appendChild(registerPasswordRepeatLabel)
+
+ var registerPasswordRepeatInput = document.createElement('input')
+ registerPasswordRepeatInput.type = 'password'
+ registerPasswordRepeatInput.id = 'password-repeat'
+ registerForm.appendChild(registerPasswordRepeatInput)
+
+ var registerSubmitButton = document.createElement('button')
+ registerSubmitButton.type = 'submit'
+ registerSubmitButton.innerText = 'Register'
+ registerForm.appendChild(registerSubmitButton)
+
+ registerForm.addEventListener('submit', function (event) {
+ event.preventDefault()
+
+ var name = registerNameInput.value
+ var email = registerEmailInput.value
+ var username = registerUsernameInput.value
+ var password = registerPasswordInput.value
+ var passwordRepeat = registerPasswordRepeatInput.value
+
+ try {
+ registerUser(name, email, username, password, passwordRepeat)
+
+ registerForm.reset()
+
+ registerSection.remove()
+
+ body.appendChild(loginSection)
+ } catch (error) {
+ alert(error.message)
+
+ console.error(error)
+ }
+ })
+
+ var registerLoginLink = document.createElement('a')
+ registerLoginLink.href = ''
+ registerLoginLink.innerText = 'Login'
+ registerSection.appendChild(registerLoginLink)
+
+ registerLoginLink.addEventListener('click', function (event) {
+ event.preventDefault()
+
+ registerSection.remove()
+ body.appendChild(loginSection)
+ })
+
+ return registerSection
+}
+
+function buildHomeSection() {
+ var homeSection = document.createElement('section')
+
+ var homeTitle = document.createElement('h2')
+ homeTitle.innerText = 'Home'
+ homeSection.appendChild(homeTitle)
+
+ var homeUserTitle = document.createElement('h3')
+ homeUserTitle.innerText = 'Hello, ' + loggedInUser.name + '!'
+ homeSection.appendChild(homeUserTitle)
+
+ var homeLogoutButton = document.createElement('button')
+ homeLogoutButton.innerText = 'Logout'
+ homeSection.appendChild(homeLogoutButton)
+
+ homeLogoutButton.addEventListener('click', function (event) {
+ event.preventDefault()
+
+ loggedInUser = null
+
+ homeSection.remove()
+
+ body.appendChild(loginSection)
+ })
+
+ return homeSection
+}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.4/data.js b/staff/victoria-kolomytseva/unsocial.4/data.js
new file mode 100644
index 00000000..7478bdcb
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.4/data.js
@@ -0,0 +1,4 @@
+var users = [
+ { name: 'Peter Pan', email: 'peter@pan.com', username: 'peterpan', password: '123123123' },
+ { name: 'Wendy Darling', email: 'wendy@darling.com', username: 'wendydarling', password: '123123123' }
+]
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.4/index.html b/staff/victoria-kolomytseva/unsocial.4/index.html
new file mode 100644
index 00000000..898075c7
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.4/index.html
@@ -0,0 +1,27 @@
+
+
+
+
+
+
+ Unsocial
+
+
+
+
+
+
+
+
Unsocial
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.4/logic.js b/staff/victoria-kolomytseva/unsocial.4/logic.js
new file mode 100644
index 00000000..a13ba2ef
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.4/logic.js
@@ -0,0 +1,44 @@
+function registerUser(name, email, username, password, passwordRepeat) {
+ if (name.length < 2)
+ throw new Error('invalid name')
+
+ if (!/^(([^<>()[\]\.,;:\s@\"]+(\.[^<>()[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i.test(email))
+ throw new Error('invalid e-mail')
+
+ if (username.length < 4 || username.length > 12)
+ throw new Error('invalid username')
+
+ if (password.length < 8)
+ throw new Error('invalid password')
+
+ if (password !== passwordRepeat)
+ throw new Error('passwords do not match')
+
+ var user = users.find(function (user) {
+ return user.username === username || user.email === email
+ })
+
+ if (user !== undefined)
+ throw new Error('user already exists')
+
+ user = { name: name, email: email, username: username, password: password }
+
+ users.push(user)
+}
+
+function authenticateUser(username, password) {
+ if (username.length < 4 || username.length > 12)
+ throw new Error('invalid username')
+
+ if (password.length < 8)
+ throw new Error('invalid password')
+
+ var user = users.find(function (user) {
+ return user.username === username && user.password === password
+ })
+
+ if (user === undefined)
+ throw new Error('wrong credentials')
+
+ return user
+}
diff --git a/staff/victoria-kolomytseva/unsocial.4/main.js b/staff/victoria-kolomytseva/unsocial.4/main.js
new file mode 100644
index 00000000..029a3897
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.4/main.js
@@ -0,0 +1,6 @@
+var loggedInUser = null
+
+var loginSection = buildLoginSection()
+
+var body = document.querySelector('body')
+body.appendChild(loginSection)
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.4/style.css b/staff/victoria-kolomytseva/unsocial.4/style.css
new file mode 100644
index 00000000..0c31a22d
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.4/style.css
@@ -0,0 +1,47 @@
+@import url('https://fonts.googleapis.com/css2?family=Sixtyfour&display=swap');
+
+:root {
+ --color: dodgerblue;
+ --font: 'Sixtyfour';
+ font-family: var(--font);
+
+}
+
+body {
+ background-color: rgb(24, 2, 2);
+ color: var(--color);
+ text-align: center;
+ width: 100%;
+ height: 100vh;
+ margin: 0;
+}
+
+label {
+ margin: 20px;
+}
+
+
+
+
+input {
+ background-color: white;
+ font-family: inherit;
+ margin: 10px;
+}
+
+
+form {
+ display: flex;
+ align-items: center;
+ flex-direction: column
+}
+
+a {
+ padding: 10px;
+ margin-top: 100px;
+
+}
+
+a:visited {
+ color: var(--color);
+}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.4/view.js b/staff/victoria-kolomytseva/unsocial.4/view.js
new file mode 100644
index 00000000..db33c54d
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.4/view.js
@@ -0,0 +1,182 @@
+function buildFormField(id, text, type) {
+ var label = document.createElement('label')
+ label.htmlFor = id
+ label.innerText = text
+
+ var input = document.createElement('input')
+ input.type = type
+ input.id = id
+
+ return [label, input]
+}
+
+function buildButton(text, type) {
+ var button = document.createElement('button')
+ button.type = type
+ button.innerText = text
+
+ return button
+}
+
+function buildLoginSection() {
+ var section = document.createElement('section')
+
+ var title = document.createElement('h2')
+ title.innerText = 'Login'
+ section.appendChild(title)
+
+ var form = document.createElement('form')
+ section.appendChild(form)
+
+ var usernameField = buildFormField('username', 'Username', 'text')
+ form.appendChild(usernameField[0])
+ form.appendChild(usernameField[1])
+
+ var passwordField = buildFormField('password', 'Password', 'password')
+ form.appendChild(passwordField[0])
+ form.appendChild(passwordField[1])
+
+ var submitButton = buildButton('Login', 'submit')
+ form.appendChild(submitButton)
+
+ form.addEventListener('submit', function (event) {
+ event.preventDefault()
+
+ var username = usernameField[1].value
+ var password = passwordField[1].value
+
+ try {
+ loggedInUser = authenticateUser(username, password)
+
+ form.reset()
+
+ section.remove()
+
+ var homeSection = buildHomeSection()
+
+ body.appendChild(homeSection)
+ } catch (error) {
+ passwordField[1].value = ''
+
+ alert(error.message)
+
+ console.error(error)
+ }
+ })
+
+ var registerLink = document.createElement('a')
+ registerLink.href = ''
+ registerLink.innerText = 'Register'
+ section.appendChild(registerLink)
+
+ registerLink.addEventListener('click', function (event) {
+ event.preventDefault()
+
+ section.remove()
+
+ var registerSection = buildRegisterSection()
+
+ body.appendChild(registerSection)
+ })
+
+ return section
+}
+
+function buildRegisterSection() {
+ var section = document.createElement('section')
+
+ var title = document.createElement('h2')
+ title.innerText = 'Register'
+ section.appendChild(title)
+
+ var form = document.createElement('form')
+ section.appendChild(form)
+
+ var nameField = buildFormField('name', 'Name', 'text')
+ form.appendChild(nameField[0])
+ form.appendChild(nameField[1])
+
+ var emailField = buildFormField('email', 'E-mail', 'email')
+ form.appendChild(emailField[0])
+ form.appendChild(emailField[1])
+
+ var usernameField = buildFormField('username', 'Username', 'text')
+ form.appendChild(usernameField[0])
+ form.appendChild(usernameField[1])
+
+ var passwordField = buildFormField('password', 'Password', 'password')
+ form.appendChild(passwordField[0])
+ form.appendChild(passwordField[1])
+
+ var passwordRepeatField = buildFormField('password-repeat', 'Repeat Password', 'password')
+ form.appendChild(passwordRepeatField[0])
+ form.appendChild(passwordRepeatField[1])
+
+ var submitButton = buildButton('Register', 'submit')
+ form.appendChild(submitButton)
+
+ form.addEventListener('submit', function (event) {
+ event.preventDefault()
+
+ var name = nameField[1].value
+ var email = emailField[1].value
+ var username = usernameField[1].value
+ var password = passwordField[1].value
+ var passwordRepeat = passwordRepeatField[1].value
+
+ try {
+ registerUser(name, email, username, password, passwordRepeat)
+
+ form.reset()
+
+ section.remove()
+
+ body.appendChild(loginSection)
+ } catch (error) {
+ alert(error.message)
+
+ console.error(error)
+ }
+ })
+
+ var loginLink = document.createElement('a')
+ loginLink.href = ''
+ loginLink.innerText = 'Login'
+ section.appendChild(loginLink)
+
+ loginLink.addEventListener('click', function (event) {
+ event.preventDefault()
+
+ section.remove()
+ body.appendChild(loginSection)
+ })
+
+ return section
+}
+
+function buildHomeSection() {
+ var section = document.createElement('section')
+
+ var title = document.createElement('h2')
+ title.innerText = 'Home'
+ section.appendChild(title)
+
+ var userTitle = document.createElement('h3')
+ userTitle.innerText = 'Hello, ' + loggedInUser.name + '!'
+ section.appendChild(userTitle)
+
+ var logoutButton = buildButton('Logout', 'button')
+ section.appendChild(logoutButton)
+
+ logoutButton.addEventListener('click', function (event) {
+ event.preventDefault()
+
+ loggedInUser = null
+
+ section.remove()
+
+ body.appendChild(loginSection)
+ })
+
+ return section
+}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.5/compo.js b/staff/victoria-kolomytseva/unsocial.5/compo.js
new file mode 100644
index 00000000..d88f89bb
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.5/compo.js
@@ -0,0 +1,9 @@
+function Compo(container) {
+ this.children = []
+ this.container = container
+}
+
+Compo.prototype.add = function (child) {
+ this.children.push(child)
+ this.container.appendChild(child.container)
+}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.5/data.js b/staff/victoria-kolomytseva/unsocial.5/data.js
new file mode 100644
index 00000000..7478bdcb
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.5/data.js
@@ -0,0 +1,4 @@
+var users = [
+ { name: 'Peter Pan', email: 'peter@pan.com', username: 'peterpan', password: '123123123' },
+ { name: 'Wendy Darling', email: 'wendy@darling.com', username: 'wendydarling', password: '123123123' }
+]
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.5/index.html b/staff/victoria-kolomytseva/unsocial.5/index.html
new file mode 100644
index 00000000..c38a5f3c
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.5/index.html
@@ -0,0 +1,26 @@
+
+
+
+
+
+
+ Unsocial
+
+
+
+
+
+
+
+
Unsocial
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.5/logic.js b/staff/victoria-kolomytseva/unsocial.5/logic.js
new file mode 100644
index 00000000..edb64111
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.5/logic.js
@@ -0,0 +1,44 @@
+function registerUser(name, email, username, password, passwordRepeat) {
+ if (name.length < 2)
+ throw new Error('invalid name')
+
+ if (!/^(([^<>()[\]\.,;:\s@\"]+(\.[^<>()[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i.test(email))
+ throw new Error('invalid e-mail')
+
+ if (username.length < 4 || username.length > 12)
+ throw new Error('invalid username')
+
+ if (password.length < 8)
+ throw new Error('invalid password')
+
+ if (password !== passwordRepeat)
+ throw new Error('passwords do not match')
+
+ var user = users.find(function (user) {
+ return user.username === username || user.email === email
+ })
+
+ if (user !== undefined)
+ throw new Error('user already exists')
+
+ user = { name: name, email: email, username: username, password: password }
+
+ users.push(user)
+}
+
+function authenticateUser(username, password) {
+ if (username.length < 4 || username.length > 12)
+ throw new Error('invalid username')
+
+ if (password.length < 8)
+ throw new Error('invalid password')
+
+ var user = users.find(function (user) {
+ return user.username === username && user.password === password
+ })
+
+ if (user === undefined)
+ throw new Error('wrong credentials')
+
+ return user
+}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.5/main.js b/staff/victoria-kolomytseva/unsocial.5/main.js
new file mode 100644
index 00000000..70b254fe
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.5/main.js
@@ -0,0 +1,6 @@
+var loggedInUser = null
+
+var loginSection = buildLoginSection()
+
+var body = new Compo(document.querySelector('body'))
+body.add(loginSection)
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.5/style.css b/staff/victoria-kolomytseva/unsocial.5/style.css
new file mode 100644
index 00000000..0c31a22d
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.5/style.css
@@ -0,0 +1,47 @@
+@import url('https://fonts.googleapis.com/css2?family=Sixtyfour&display=swap');
+
+:root {
+ --color: dodgerblue;
+ --font: 'Sixtyfour';
+ font-family: var(--font);
+
+}
+
+body {
+ background-color: rgb(24, 2, 2);
+ color: var(--color);
+ text-align: center;
+ width: 100%;
+ height: 100vh;
+ margin: 0;
+}
+
+label {
+ margin: 20px;
+}
+
+
+
+
+input {
+ background-color: white;
+ font-family: inherit;
+ margin: 10px;
+}
+
+
+form {
+ display: flex;
+ align-items: center;
+ flex-direction: column
+}
+
+a {
+ padding: 10px;
+ margin-top: 100px;
+
+}
+
+a:visited {
+ color: var(--color);
+}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.5/view.js b/staff/victoria-kolomytseva/unsocial.5/view.js
new file mode 100644
index 00000000..4b59fa45
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.5/view.js
@@ -0,0 +1,188 @@
+function buildFormField(id, text, type) {
+ var label = document.createElement('label')
+ label.htmlFor = id
+ label.innerText = text
+
+ var input = document.createElement('input')
+ input.type = type
+ input.id = id
+
+ return [label, input]
+}
+
+function buildButton(text, type) {
+ var button = document.createElement('button')
+ button.type = type
+ button.innerText = text
+
+ return button
+}
+
+function buildLoginSection() {
+ var compo = new Compo(document.createElement('section'))
+
+ var section = compo.container
+
+ var title = document.createElement('h2')
+ title.innerText = 'Login'
+ section.appendChild(title)
+
+ var form = document.createElement('form')
+ section.appendChild(form)
+
+ var usernameField = buildFormField('username', 'Username', 'text')
+ form.appendChild(usernameField[0])
+ form.appendChild(usernameField[1])
+
+ var passwordField = buildFormField('password', 'Password', 'password')
+ form.appendChild(passwordField[0])
+ form.appendChild(passwordField[1])
+
+ var submitButton = buildButton('Login', 'submit')
+ form.appendChild(submitButton)
+
+ form.addEventListener('submit', function (event) {
+ event.preventDefault()
+
+ var username = usernameField[1].value
+ var password = passwordField[1].value
+
+ try {
+ loggedInUser = authenticateUser(username, password)
+
+ form.reset()
+
+ section.remove()
+
+ var homeSection = buildHomeSection()
+
+ body.add(homeSection)
+ } catch (error) {
+ passwordField[1].value = ''
+
+ alert(error.message)
+
+ console.error(error)
+ }
+ })
+
+ var registerLink = document.createElement('a')
+ registerLink.href = ''
+ registerLink.innerText = 'Register'
+ section.appendChild(registerLink)
+
+ registerLink.addEventListener('click', function (event) {
+ event.preventDefault()
+
+ section.remove()
+
+ var registerSection = buildRegisterSection()
+
+ body.add(registerSection)
+ })
+
+ return compo
+}
+
+function buildRegisterSection() {
+ var compo = new Compo(document.createElement('section'))
+
+ var section = compo.container
+
+ var title = document.createElement('h2')
+ title.innerText = 'Register'
+ section.appendChild(title)
+
+ var form = document.createElement('form')
+ section.appendChild(form)
+
+ var nameField = buildFormField('name', 'Name', 'text')
+ form.appendChild(nameField[0])
+ form.appendChild(nameField[1])
+
+ var emailField = buildFormField('email', 'E-mail', 'email')
+ form.appendChild(emailField[0])
+ form.appendChild(emailField[1])
+
+ var usernameField = buildFormField('username', 'Username', 'text')
+ form.appendChild(usernameField[0])
+ form.appendChild(usernameField[1])
+
+ var passwordField = buildFormField('password', 'Password', 'password')
+ form.appendChild(passwordField[0])
+ form.appendChild(passwordField[1])
+
+ var passwordRepeatField = buildFormField('password-repeat', 'Repeat Password', 'password')
+ form.appendChild(passwordRepeatField[0])
+ form.appendChild(passwordRepeatField[1])
+
+ var submitButton = buildButton('Register', 'submit')
+ form.appendChild(submitButton)
+
+ form.addEventListener('submit', function (event) {
+ event.preventDefault()
+
+ var name = nameField[1].value
+ var email = emailField[1].value
+ var username = usernameField[1].value
+ var password = passwordField[1].value
+ var passwordRepeat = passwordRepeatField[1].value
+
+ try {
+ registerUser(name, email, username, password, passwordRepeat)
+
+ form.reset()
+
+ section.remove()
+
+ body.add(loginSection)
+ } catch (error) {
+ alert(error.message)
+
+ console.error(error)
+ }
+ })
+
+ var loginLink = document.createElement('a')
+ loginLink.href = ''
+ loginLink.innerText = 'Login'
+ section.appendChild(loginLink)
+
+ loginLink.addEventListener('click', function (event) {
+ event.preventDefault()
+
+ section.remove()
+ body.add(loginSection)
+ })
+
+ return compo
+}
+
+function buildHomeSection() {
+ var compo = new Compo(document.createElement('section'))
+
+ var section = compo.container
+
+ var title = document.createElement('h2')
+ title.innerText = 'Home'
+ section.appendChild(title)
+
+ var userTitle = document.createElement('h3')
+ userTitle.innerText = 'Hello, ' + loggedInUser.name + '!'
+ section.appendChild(userTitle)
+
+ var logoutButton = buildButton('Logout', 'button')
+ section.appendChild(logoutButton)
+
+ logoutButton.addEventListener('click', function (event) {
+ event.preventDefault()
+
+ loggedInUser = null
+
+ section.remove()
+
+ body.appendChild(loginSection)
+ })
+
+ return compo
+}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.6/compo.js b/staff/victoria-kolomytseva/unsocial.6/compo.js
new file mode 100644
index 00000000..d88f89bb
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.6/compo.js
@@ -0,0 +1,9 @@
+function Compo(container) {
+ this.children = []
+ this.container = container
+}
+
+Compo.prototype.add = function (child) {
+ this.children.push(child)
+ this.container.appendChild(child.container)
+}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.6/data.js b/staff/victoria-kolomytseva/unsocial.6/data.js
new file mode 100644
index 00000000..7478bdcb
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.6/data.js
@@ -0,0 +1,4 @@
+var users = [
+ { name: 'Peter Pan', email: 'peter@pan.com', username: 'peterpan', password: '123123123' },
+ { name: 'Wendy Darling', email: 'wendy@darling.com', username: 'wendydarling', password: '123123123' }
+]
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.6/index.html b/staff/victoria-kolomytseva/unsocial.6/index.html
new file mode 100644
index 00000000..c38a5f3c
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.6/index.html
@@ -0,0 +1,26 @@
+
+
+
+
+
+
+ Unsocial
+
+
+
+
+
+
+
+
Unsocial
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.6/logic.js b/staff/victoria-kolomytseva/unsocial.6/logic.js
new file mode 100644
index 00000000..edb64111
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.6/logic.js
@@ -0,0 +1,44 @@
+function registerUser(name, email, username, password, passwordRepeat) {
+ if (name.length < 2)
+ throw new Error('invalid name')
+
+ if (!/^(([^<>()[\]\.,;:\s@\"]+(\.[^<>()[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i.test(email))
+ throw new Error('invalid e-mail')
+
+ if (username.length < 4 || username.length > 12)
+ throw new Error('invalid username')
+
+ if (password.length < 8)
+ throw new Error('invalid password')
+
+ if (password !== passwordRepeat)
+ throw new Error('passwords do not match')
+
+ var user = users.find(function (user) {
+ return user.username === username || user.email === email
+ })
+
+ if (user !== undefined)
+ throw new Error('user already exists')
+
+ user = { name: name, email: email, username: username, password: password }
+
+ users.push(user)
+}
+
+function authenticateUser(username, password) {
+ if (username.length < 4 || username.length > 12)
+ throw new Error('invalid username')
+
+ if (password.length < 8)
+ throw new Error('invalid password')
+
+ var user = users.find(function (user) {
+ return user.username === username && user.password === password
+ })
+
+ if (user === undefined)
+ throw new Error('wrong credentials')
+
+ return user
+}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.6/main.js b/staff/victoria-kolomytseva/unsocial.6/main.js
new file mode 100644
index 00000000..70b254fe
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.6/main.js
@@ -0,0 +1,6 @@
+var loggedInUser = null
+
+var loginSection = buildLoginSection()
+
+var body = new Compo(document.querySelector('body'))
+body.add(loginSection)
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.6/style.css b/staff/victoria-kolomytseva/unsocial.6/style.css
new file mode 100644
index 00000000..0c31a22d
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.6/style.css
@@ -0,0 +1,47 @@
+@import url('https://fonts.googleapis.com/css2?family=Sixtyfour&display=swap');
+
+:root {
+ --color: dodgerblue;
+ --font: 'Sixtyfour';
+ font-family: var(--font);
+
+}
+
+body {
+ background-color: rgb(24, 2, 2);
+ color: var(--color);
+ text-align: center;
+ width: 100%;
+ height: 100vh;
+ margin: 0;
+}
+
+label {
+ margin: 20px;
+}
+
+
+
+
+input {
+ background-color: white;
+ font-family: inherit;
+ margin: 10px;
+}
+
+
+form {
+ display: flex;
+ align-items: center;
+ flex-direction: column
+}
+
+a {
+ padding: 10px;
+ margin-top: 100px;
+
+}
+
+a:visited {
+ color: var(--color);
+}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial.6/view.js b/staff/victoria-kolomytseva/unsocial.6/view.js
new file mode 100644
index 00000000..819cd1c3
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial.6/view.js
@@ -0,0 +1,189 @@
+function buildFormField(id, text, type) {
+ var label = document.createElement('label')
+ label.htmlFor = id
+ label.innerText = text
+
+ var input = document.createElement('input')
+ input.type = type
+ input.id = id
+
+ return [label, input]
+}
+
+function buildForm() {
+ var compo = new Compo(document.createElement('form'))
+
+ return compo
+}
+
+function buildButton(text, type) {
+ var compo = new Compo(document.createElement('button'))
+
+ compo.container.type = type
+ compo.container.innerText = text
+
+ return compo
+}
+
+function buildLoginSection() {
+ var compo = new Compo(document.createElement('section'))
+
+ var title = document.createElement('h2')
+ title.innerText = 'Login'
+ compo.container.appendChild(title)
+
+ var form = buildForm()
+ compo.add(form)
+
+ var usernameField = buildFormField('username', 'Username', 'text')
+ form.container.appendChild(usernameField[0])
+ form.container.appendChild(usernameField[1])
+
+ var passwordField = buildFormField('password', 'Password', 'password')
+ form.container.appendChild(passwordField[0])
+ form.container.appendChild(passwordField[1])
+
+ var submitButton = buildButton('Login', 'submit')
+ form.add(submitButton)
+
+ form.container.addEventListener('submit', function (event) {
+ event.preventDefault()
+
+ var username = usernameField[1].value
+ var password = passwordField[1].value
+
+ try {
+ loggedInUser = authenticateUser(username, password)
+
+ form.container.reset()
+
+ compo.container.remove()
+
+ var homeSection = buildHomeSection()
+
+ body.add(homeSection)
+ } catch (error) {
+ passwordField[1].value = ''
+
+ alert(error.message)
+
+ console.error(error)
+ }
+ })
+
+ var registerLink = document.createElement('a')
+ registerLink.href = ''
+ registerLink.innerText = 'Register'
+ compo.container.appendChild(registerLink)
+
+ registerLink.addEventListener('click', function (event) {
+ event.preventDefault()
+
+ compo.container.remove()
+
+ var registerSection = buildRegisterSection()
+
+ body.add(registerSection)
+ })
+
+ return compo
+}
+
+function buildRegisterSection() {
+ var compo = new Compo(document.createElement('section'))
+
+ var title = document.createElement('h2')
+ title.innerText = 'Register'
+ compo.container.appendChild(title)
+
+ var form = buildForm()
+ compo.add(form)
+
+ var nameField = buildFormField('name', 'Name', 'text')
+ form.container.appendChild(nameField[0])
+ form.container.appendChild(nameField[1])
+
+ var emailField = buildFormField('email', 'E-mail', 'email')
+ form.container.appendChild(emailField[0])
+ form.container.appendChild(emailField[1])
+
+ var usernameField = buildFormField('username', 'Username', 'text')
+ form.container.appendChild(usernameField[0])
+ form.container.appendChild(usernameField[1])
+
+ var passwordField = buildFormField('password', 'Password', 'password')
+ form.container.appendChild(passwordField[0])
+ form.container.appendChild(passwordField[1])
+
+ var passwordRepeatField = buildFormField('password-repeat', 'Repeat Password', 'password')
+ form.container.appendChild(passwordRepeatField[0])
+ form.container.appendChild(passwordRepeatField[1])
+
+ var submitButton = buildButton('Register', 'submit')
+ form.container.appendChild(submitButton.container)
+
+ form.container.addEventListener('submit', function (event) {
+ event.preventDefault()
+
+ var name = nameField[1].value
+ var email = emailField[1].value
+ var username = usernameField[1].value
+ var password = passwordField[1].value
+ var passwordRepeat = passwordRepeatField[1].value
+
+ try {
+ registerUser(name, email, username, password, passwordRepeat)
+
+ form.container.reset()
+
+ compo.container.remove()
+
+ body.add(loginSection)
+ } catch (error) {
+ alert(error.message)
+
+ console.error(error)
+ }
+ })
+
+ var loginLink = document.createElement('a')
+ loginLink.href = ''
+ loginLink.innerText = 'Login'
+ compo.container.appendChild(loginLink)
+
+ loginLink.addEventListener('click', function (event) {
+ event.preventDefault()
+
+ compo.container.remove()
+ body.add(loginSection)
+ })
+
+ return compo
+}
+
+function buildHomeSection() {
+ var compo = new Compo(document.createElement('section'))
+
+ var title = document.createElement('h2')
+ title.innerText = 'Home'
+ compo.container.appendChild(title)
+
+ var userTitle = document.createElement('h3')
+ userTitle.innerText = 'Hello, ' + loggedInUser.name + '!'
+ compo.container.appendChild(userTitle)
+
+ var logoutButton = buildButton('Logout', 'button')
+ compo.add(logoutButton)
+
+ logoutButton.container.addEventListener('click', function (event) {
+ event.preventDefault()
+
+ loggedInUser = null
+
+ compo.container.remove()
+
+ body.add(loginSection)
+ })
+
+ return compo
+}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial/compo.js b/staff/victoria-kolomytseva/unsocial/compo.js
index d88f89bb..8a6258d9 100644
--- a/staff/victoria-kolomytseva/unsocial/compo.js
+++ b/staff/victoria-kolomytseva/unsocial/compo.js
@@ -1,9 +1,235 @@
+/**
+ * Constructs Compo instances
+ *
+ * @param {HTMLElement} container The DOM container of the Compo instance
+ */
function Compo(container) {
this.children = []
this.container = container
+ this.parent = null
}
Compo.prototype.add = function (child) {
this.children.push(child)
+ child.parent = this
+
this.container.appendChild(child.container)
+}
+
+Compo.prototype.remove = function () {
+ var index = this.parent.children.findIndex(function (child) {
+ return child === this
+ }.bind(this))
+
+ if (index > -1)
+ this.parent.children.splice(index, 1)
+
+ this.container.remove()
+}
+
+Compo.prototype.addBehavior = function (type, callback) {
+ this.container.addEventListener(type, callback)
+}
+
+/**
+ * Constructs Form instances
+ */
+function Form() {
+ Compo.call(this, document.createElement('form'))
+}
+
+Form.prototype = Object.create(Compo.prototype)
+Form.prototype.constructor = Form
+
+Form.prototype.reset = function () {
+ this.container.reset()
+}
+
+/**
+ * Constructs Button instances
+ *
+ * @param {string} text The text of the button
+ * @param {string} type The button type
+ */
+function Button(type, text) {
+ Compo.call(this, document.createElement('button'))
+ this.container.innerText = text
+ this.container.type = type
+}
+
+Button.prototype = Object.create(Compo.prototype)
+Button.prototype.constructor = Button
+
+/**
+ * Constructs Label instances
+ *
+ * @param {string} text The text of the label
+ * @param {string} id The id of the input to relate with
+ */
+function Label(text, id) {
+ Compo.call(this, document.createElement('label'))
+ this.container.innerText = text
+ this.container.htmlFor = id
+}
+
+Label.prototype = Object.create(Compo.prototype)
+Label.prototype.constructor = Label
+
+/**
+ * Constructs Input instances
+ *
+ * @param {string} type The input type
+ * @param {string} id The input id
+ */
+function Input(id, type) {
+ Compo.call(this, document.createElement('input'))
+ this.container.id = id
+ this.container.type = type
+}
+
+Input.prototype = Object.create(Compo.prototype)
+Input.prototype.constructor = Input
+
+Input.prototype.getValue = function () {
+ return this.container.value
+}
+
+Input.prototype.setValue = function (value) {
+ this.container.value = value
+}
+
+Input.prototype.getType = function () {
+ return this.container.type
+}
+
+Input.prototype.setType = function (type) {
+ this.container.type = type
+}
+
+/**
+ * Constructs Heading instances
+ *
+ * @param {string} text The text of the heading
+ * @param {number} level The heading level
+ */
+function Heading(text, level) {
+ Compo.call(this, document.createElement('h' + level))
+ this.container.innerText = text
+}
+
+Heading.prototype = Object.create(Compo.prototype)
+Heading.prototype.constructor = Heading
+
+/**
+ * Constructs Link instances
+ *
+ * @param {string} text The text of the link
+ */
+function Link(text) {
+ Compo.call(this, document.createElement('a'))
+ this.container.href = ''
+ this.container.innerText = text
+}
+
+Link.prototype = Object.create(Compo.prototype)
+Link.prototype.constructor = Link
+
+/**
+ * Constructs Span instances
+ *
+ * @param {string} text The text inside span
+ */
+function Span(text) {
+ Compo.call(this, document.createElement('span'))
+
+ this.container.innerText = text
+}
+
+Span.prototype = Object.create(Compo.prototype)
+Span.prototype.constructor = Span
+
+Span.prototype.setText = function (text) {
+ this.container.innerText = text
+}
+
+Span.prototype.getText = function () {
+ return this.container.innerText
+}
+
+Span.prototype = Object.create(Compo.prototype)
+Span.prototype.constructor = Span
+
+/**
+ *
+ */
+function UnorderedList() {
+ Compo.call(this, document.createElement('ul'))
+}
+
+UnorderedList.prototype = Object.create(Compo.prototype)
+UnorderedList.prototype.constructor = UnorderedList
+
+/**
+ *
+ */
+function ListItem() {
+ Compo.call(this, document.createElement('li'))
+}
+
+ListItem.prototype = Object.create(Compo.prototype)
+ListItem.prototype.constructor = ListItem
+
+/**
+ *
+ */
+function Image(address) {
+ Compo.call(this, document.createElement('img'))
+
+ this.container.src = address
+ this.container.style.width = '100%'
+}
+
+Image.prototype = Object.create(Compo.prototype)
+Image.prototype.constructor = Image
+
+/**
+ *
+ * @param {*} text
+ */
+function Paragraph(text) {
+ Compo.call(this, document.createElement('p'))
+
+ this.container.innerText = text
+}
+
+Paragraph.prototype = Object.create(Compo.prototype)
+Paragraph.prototype.constructor = Paragraph
+
+Paragraph.prototype.setText = function (text) {
+ this.container.innerText = text
+}
+
+Paragraph.prototype.getText = function () {
+ return this.container.innerText
+}
+
+/**
+ *
+ * @param {*} text
+ */
+function Time(text) {
+ Compo.call(this, document.createElement('time'))
+
+ this.container.innerText = text
+}
+
+Time.prototype = Object.create(Compo.prototype)
+Time.prototype.constructor = Time
+
+Time.prototype.setText = function (text) {
+ this.container.innerText = text
+}
+
+Time.prototype.getText = function () {
+ return this.container.innerText
}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial/data.js b/staff/victoria-kolomytseva/unsocial/data.js
index 7478bdcb..3babc04e 100644
--- a/staff/victoria-kolomytseva/unsocial/data.js
+++ b/staff/victoria-kolomytseva/unsocial/data.js
@@ -1,4 +1,21 @@
-var users = [
+
+var users = [ // La "base de datos" con los usuarios
{ name: 'Peter Pan', email: 'peter@pan.com', username: 'peterpan', password: '123123123' },
- { name: 'Wendy Darling', email: 'wendy@darling.com', username: 'wendydarling', password: '123123123' }
+ { name: 'Wendy Darling', email: 'wendy@darling.com', username: 'wendydarling', password: '123123123' },
+ { name: 'Javier', email: 'javi@gmail.com', username: 'javi', password: '123123123' }
+]
+
+var posts = [
+ {
+ image: 'https://i.pinimg.com/originals/8c/60/1a/8c601a25311a1a5098896f751a784b54.jpg',
+ text: 'here we are',
+ username: 'peterpan',
+ date: new Date
+ },
+ {
+ image: 'https://pm1.aminoapps.com/8360/ad07e2d2cdf6e1733328d6e7b7848b87db38a2bbr1-1536-2048v2_hq.jpg',
+ text: 'here i am',
+ username: 'wendydarling',
+ date: new Date
+ }
]
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial/index.html b/staff/victoria-kolomytseva/unsocial/index.html
index e0274f77..f711e8cf 100644
--- a/staff/victoria-kolomytseva/unsocial/index.html
+++ b/staff/victoria-kolomytseva/unsocial/index.html
@@ -2,20 +2,17 @@
+
Unsocial
-
-
-
+
-
Unsocial
-
diff --git a/staff/victoria-kolomytseva/unsocial/logic.js b/staff/victoria-kolomytseva/unsocial/logic.js
index 1463d7c9..a4abd924 100644
--- a/staff/victoria-kolomytseva/unsocial/logic.js
+++ b/staff/victoria-kolomytseva/unsocial/logic.js
@@ -1,46 +1,67 @@
-// business
+function authenticateUser(username, password) {
+ if (username.length < 4 || username.length > 12) {
+ throw new Error('invalid username')
+ }
+ if (password.length < 8) {
+ throw new Error('invalid password')
+ }
+ var user = users.find(function (user) { // Miramos si el usuario es válido
+ return user.username === username && user.password === password
+ })
-function registerUser(name, email, username, password, passwordRepeat) {
- if (name.length < 2)
- throw new Error('invalid name')
+ if (user === undefined) {
+ throw new Error('wrong credentials')
+ }
- if (!/^(([^<>()[\]\.,;:\s@\"]+(\.[^<>()[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i.test(email))
- throw new Error('invalid e-mail')
+ return user
+}
- if (username.length < 4 || username.length > 12)
+function registerUser(name, email, username, password, confirmpassword) {
+ if (name.length < 2) {
+ throw new Error('invalid name')
+ }
+ if (!/^(([^<>()[\]\.,;:\s@\"]+(\.[^<>()[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i.test(email)) {
+ throw new Error('invalid e-mail')
+ }
+ if (username.length < 4 || username.length > 12) {
throw new Error('invalid username')
-
- if (password.length < 8)
+ }
+ if (password.length < 8) {
throw new Error('invalid password')
-
- if (password !== passwordRepeat)
- throw new Error('passswords do not match')
+ }
+ if (password !== confirmpassword) { // Comprobar que confirm password tiene el mismo valor que password
+ throw new Error('Incorrect password')
+ }
var user = users.find(function (user) {
return user.username === username || user.email === email
})
- if (user !== underfined)
+ if (user !== undefined) {
throw new Error('user already exists')
+ }
- user = { name: name, email: email, username: username, password: password }
+ user = { 'name': name, 'email': email, 'username': username, 'password': password } // Insertamos el usuario entero
users.push(user)
}
-function authenticateUser(username, password) {
+function createPost(username, image, text) {
if (username.length < 4 || username.length > 12)
throw new Error('invalid username')
- if (password.length < 8)
- throw new Error('invalid password')
+ // TODO input validation (and throw error)
- var user = users.find(function (user) {
- return user.username === username && user.password === password
- })
+ var post = {
+ image: image,
+ text: text,
+ username: username,
+ date: new Date
+ }
- if (user === undefined)
- throw new Error('wrong credentials')
+ posts.push(post)
+}
- return user
+function getPosts() {
+ return posts
}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial/main.js b/staff/victoria-kolomytseva/unsocial/main.js
index 2b30a64f..4cad457e 100644
--- a/staff/victoria-kolomytseva/unsocial/main.js
+++ b/staff/victoria-kolomytseva/unsocial/main.js
@@ -1,8 +1,12 @@
-var loggedInUser = null
-var loginSection = buildLoginSection()
+var loggedInUser = null // Variable para reconocer al usuario conectado
-var body = new Compo(document.querySelector('body'))
-body.add(loginSection)
+var page = new Compo(document.querySelector('body')) // Creamos un componente que contenga a body como container
+var title = new Heading('Unsocial', 1) // TÃtulo de la página
+page.add(title) // Añadimos el tÃtulo a la página
+var login = new Login() // Montamos el login
+page.add(login) // Añadimos el login a la page, es decir a la "view" (será lo que veamos al entrar)
+
+var home
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial/styles.css b/staff/victoria-kolomytseva/unsocial/styles.css
new file mode 100644
index 00000000..f157df54
--- /dev/null
+++ b/staff/victoria-kolomytseva/unsocial/styles.css
@@ -0,0 +1,69 @@
+@import url('https://fonts.googleapis.com/css2?family=Sixtyfour&display=swap');
+
+:root {
+ --color: dodgerblue;
+ --font: 'Sixtyfour';
+ font-family: var(--font);
+}
+
+body {
+ display: flex;
+ flex-direction: column;
+ text-align: center;
+ justify-content: center;
+ align-items: center;
+ justify-content: center;
+ background-color: black;
+ color: var(--color);
+}
+
+section,
+form {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+}
+
+input {
+ color: var(--color);
+ background-color: inherit;
+ font-family: inherit;
+ margin-top: 10px;
+ margin-bottom: 20px;
+}
+
+a:visited {
+ color: var(--color);
+}
+
+h1 {
+ margin-bottom: 10px;
+}
+
+h2 {
+ margin-bottom: 30px;
+}
+
+a {
+ margin-top: 20px;
+}
+
+label,
+input,
+button {
+ display: block;
+}
+
+button {
+ background-color: black;
+ color: var(--color);
+ font-family: var(--font);
+ padding: 5px;
+ border-bottom: 1px solid #545454;
+ border-right: 1px solid #545454
+}
+
+#up {
+ margin-top: 50px;
+ margin-bottom: 10px;
+}
\ No newline at end of file
diff --git a/staff/victoria-kolomytseva/unsocial/view.js b/staff/victoria-kolomytseva/unsocial/view.js
index 53196a41..68379db3 100644
--- a/staff/victoria-kolomytseva/unsocial/view.js
+++ b/staff/victoria-kolomytseva/unsocial/view.js
@@ -1,263 +1,272 @@
-//creamos una function que permita crear todos los label e input de los forms de la app
-function buildFormField(id, text, type) {
- var label = document.createElement('label')
- label.htmlFor = id
- label.innerText = text
+/**
+ * Constructs Login instances
+ */
+function Login() {
+ Compo.call(this, document.createElement('section'))
- var input = document.createElement('input')
- input.type = type
- input.id = id
+ var title = new Heading('Login', 2)
+ this.add(title)
- return [label, input]
-}
-
-//creamos una function que permita crear los botones de la app
-function buildButton(text, type) {
- var button = document.createElement('button')
- button.type = type
- button.innerText = text
-
- return button
-}
-
-//creamos una function para generar la seccion de login
-
-function buildLoginSection() {
- var compo = new Compo(document.createElement('section'))
-
- var section = compo.container
-
- var title = document.createElement('h2')
- title.innerText = 'Login'
- section.appendChild(title)
+ var form = new Form()
+ this.add(form)
- var form = document.createElement('form')
- section.appendChild(form)
+ form.add(new Label('Username', 'username'))
+ var usernameInput = new Input('text', 'username')
+ form.add(usernameInput)
- var usernameField = buildFormField('username', 'Username', 'text')
- form.appendChild(usernameField[0])
- form.appendChild(usernameField[1])
+ form.add(new Label('Password', 'password'))
+ var passwordInput = new Input('password', 'password')
+ form.add(passwordInput)
- var passwordField = buildFormField('password', 'Password', 'password')
- form.appendChild(passwordField[0])
- form.appendChild(passwordField[1])
+ var submitButton = new Button('submit', 'Login')
+ form.add(submitButton)
- var submitButton = buildButton('Login', 'submit')
- form.appendChild(submitButton)
-
- form.addEventListener('submit', function (event) {
+ form.addBehavior('submit', function (event) {
event.preventDefault()
- var username = usernameField[1].value
- var password = passwordField[1].value
+ var username = usernameInput.getValue()
+ var password = passwordInput.getValue()
try {
loggedInUser = authenticateUser(username, password)
form.reset()
- section.remove()
-
- var homeSection = buildHomeSection()
+ this.remove()
- body.add(homeSection)
+ home = new Home()
+ page.add(home)
} catch (error) {
-
- passwordField[1].value = ''
+ passwordInput.setValue('')
alert(error.message)
console.error(error)
}
+ }.bind(this))
- })
-
- var registerLink = document.createElement('a')
- registerLink.href = ''
- registerLink.innerText = 'Register'
- section.appendChild(registerLink)
+ var registerLink = new Link('Register')
+ this.add(registerLink)
- registerLink.addEventListener('click', function (event) {
+ registerLink.addBehavior('click', function (event) {
event.preventDefault()
- section.remove()
+ form.reset()
- var registerSection = buildRegisterSection()
+ this.remove()
- body.add(registerSection)
- })
+ var register = new Register()
- return compo
+ page.add(register)
+ }.bind(this))
}
-//function para crear una section del registro
+Login.prototype = Object.create(Compo.prototype)
+Login.prototype.constructor = Login
-function buildRegisterSection() {
- var compo = new Compo(document.createElement('section'))
+/**
+ * Constructs Register instances
+ */
+function Register() {
+ Compo.call(this, document.createElement('section'))
- var section = compo.container
+ var title = new Heading('Register', 2)
+ this.add(title)
- var title = document.createElement('h2')
- title.innerText = 'Register'
- section.appendChild(title)
+ var form = new Form
+ this.add(form)
- var form = document.createElement('form')
- section.appendChild(form)
+ form.add(new Label('Name', 'name'))
+ var nameInput = new Input('text', 'name')
+ form.add(nameInput)
- var nameField = buildFormField('name', 'Name', 'text')
- form.appendChild(nameField[0])
- form.appendChild(nameField[1])
+ form.add(new Label('E-mail', 'email'))
+ var emailInput = new Input('email', 'email')
+ form.add(emailInput)
- var emailField = buildFormField('email', 'E-mail', 'email')
- form.appendChild(emailField[0])
- form.appendChild(emailField[1])
+ form.add(new Label('Username', 'username'))
+ var usernameInput = new Input('username', 'text')
+ form.add(usernameInput)
- var usernameField = buildFormField('username', 'Username', 'text')
- form.appendChild(usernameField[0])
- form.appendChild(usernameField[1])
+ form.add(new Label('Password', 'password'))
+ var passwordInput = new Input('password', 'password')
+ form.add(passwordInput)
- var passwordField = buildFormField('password', 'Password', 'password')
- form.appendChild(passwordField[0])
- form.appendChild(passwordField[1])
+ form.add(new Label('Confirm Password', 'repeatPassword'))
+ var passwordRepeatInput = new Input('repeatPassword', 'password')
+ form.add(passwordRepeatInput)
- var submitButton = buildButton('Register', 'submit')
- form.appendChild(submitButton)
+ var submitButton = new Button('submit', 'Register')
+ form.add(submitButton)
- form.addEventListener('submit', function (event) {
+ form.addBehavior('submit', function (event) {
event.preventDefault()
- var name = nameField[1].value
- var email = emailField[1].value
- var username = usernameField[1].value
- var password = passwordField[1].value
- var passwordRepeat = passwordRepeatField[1].value
+ var name = nameInput.getValue()
+ var email = emailInput.getValue()
+ var username = usernameInput.getValue()
+ var password = passwordInput.getValue()
+ var confirmpassword = passwordRepeatInput.getValue()
try {
- registerUser(name, email, username, password, passwordRepeat)
+ registerUser(name, email, username, password, confirmpassword) // Registramos al usuario (logic.js)
form.reset()
- section.remove()
+ this.remove()
- body.add(loginSection)
+ page.add(login)
} catch (error) {
alert(error.message)
+
console.error(error)
}
+ }.bind(this))
- })
-
- var loginLink = document.createElement('a')
- loginLink.href = ''
- loginLink.innerText = 'Login'
- section.appendChild(loginLink)
+ var loginLink = new Link('Login')
+ this.add(loginLink)
- loginLink.addEventListener('click', function (event) {
+ loginLink.addBehavior('click', function (event) {
event.preventDefault()
- section.remove()
- body.add(loginSection)
- })
+ this.remove()
- return compo
+ page.add(login)
+ }.bind(this))
}
-function buildHomeSection() {
- var compo = new Compo(document.createElement('section'))
+/**
+ * Constructs Home instances
+ */
+Register.prototype = Object.create(Compo.prototype)
+Register.prototype.constructor = Register
- var section = compo.container
+function Home() {
+ Compo.call(this, document.createElement('section'))
- var title = document.createElement('h2')
- title.innerText = 'Home'
- section.appendChild(title)
+ var title = new Heading('Home', 2)
+ this.add(title)
- var userTitle = document.createElement('h3')
- userTitle.innerText = 'Hello, ' + loggedInUser.name + '!'
- section.appendChild(userTitle)
+ var welcome = new Heading('Welcome, ' + loggedInUser.name + '!', 3)
+ this.add(welcome)
- var logoutButton = buildButton('Logout', 'button')
- section.appendChild(logoutButton)
+ var logoutButton = new Button('button', 'Logout')
+ this.add(logoutButton)
- logoutButton.addEventListener('click', function (event) {
+ logoutButton.addBehavior("click", function (event) {
event.preventDefault()
loggedInUser = null
- section.remove()
-
- body.add(loginSection)
- })
-
- return compo
-}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+ this.remove()
+ page.add(login)
+ }.bind(this))
+ var createPostButton = new Button('button', '+')
+ this.add(createPostButton)
+ createPostButton.addBehavior('click', function (event) {
+ var createPost = new CreatePost()
+ this.children[this.children.length - 1].remove()
+ this.add(createPost)
+ }.bind(this))
+ var postList = new PostList()
+ this.add(postList)
+}
+Home.prototype = Object.create(Compo.prototype)
+Home.prototype.constructor = Home
+function CreatePost() {
+ Compo.call(this, document.createElement('div'))
+ var createPostTitle = new Heading('Create post', 3)
+ this.add(createPostTitle)
+ var form = new Form()
+ form.add(new Label('Imagen', 'img'))
+ var imageInput = new Input('img', 'text')
+ form.add(imageInput)
+ form.add(new Label('Texto', 'txt'))
+ var textInput = new Input('txt', 'text')
+ form.add(textInput)
+ var publishPostButton = new Button('submit', 'Publish')
+ form.add(publishPostButton)
+ this.add(form)
+ form.addBehavior('submit', function (event) {
+ event.preventDefault()
+ var image = imageInput.getValue()
+ var text = textInput.getValue()
+ try {
+ createPost(loggedInUser.username, image, text)
+ this.remove()
+ var postList = new PostList()
+ home.add(postList)
+ } catch (error) {
+ alert(error.message)
+ console.error(error)
+ }
+ }.bind(this))
+}
+CreatePost.prototype = Object.create(Compo.prototype)
+CreatePost.prototype.constructor = CreatePost
+function Post(username, image, text, date) {
+ Compo.call(this, document.createElement('div'))
+ var userTitle = new Heading(username, 4)
+ this.add(userTitle)
+ var picture = new Image(image)
+ this.add(picture)
+ var comment = new Paragraph(text)
+ this.add(comment)
+ var time = new Time(date)
+ this.add(time)
+}
+Post.prototype = Object.create(Compo.prototype)
+Post.prototype.constructor = Post
+function PostList() {
+ Compo.call(this, document.createElement('div'))
+ var title = new Heading('Posts', 3)
+ this.add(title)
+ try {
+ var posts = getPosts().toReversed()
+ posts.forEach(function (post) {
+ var _post = new Post(post.username, post.image, post.text, post.date)
+ this.add(_post)
+ }.bind(this))
+ } catch (error) {
+ alert(error.message)
+ console.error(error)
+ }
+}
+PostList.prototype = Object.create(Compo.prototype)
+PostList.prototype.constructor = PostList
\ No newline at end of file