(Code-Dev).Esther Manrique, Veronica Bernardino, Dianyela Maldonado.

package.json

@@ -33,4 +33,4 @@
     "stylelint": "^10.1.0",
     "stylelint-config-recommended": "^2.2.0"
   }
-}
+}

src/digitalplatform/firebase.js

@@ -0,0 +1,15 @@
+// Your web app's Firebase configuration
+var firebaseConfig = {
+    apiKey: "AIzaSyCkfImtzIXqG7KbK3b6Tu3MABA91hPqdFA",
+    authDomain: "social-network-pruebas.firebaseapp.com",
+    databaseURL: "https://social-network-pruebas.firebaseio.com",
+    projectId: "social-network-pruebas",
+    storageBucket: "social-network-pruebas.appspot.com",
+    messagingSenderId: "327573056555",
+    appId: "1:327573056555:web:38bda7ccadbd1fb70c0e6e",
+    measurementId: "G-ZLRFD83MS0"
+};
+// Initialize Firebase
+firebase.initializeApp(firebaseConfig);
+firebase.analytics();
+var db = firebase.firestore()

src/functions/clickmenus.js

@@ -0,0 +1,38 @@
+import { viewProfile } from '../view/profile.js';
+import { out } from './logout.js';
+import { editionOfProfile } from '../view/editprofile.js';
+import { viewForum } from '../view/fuorum.js';
+import { publicPost, addNewPost } from './publicpoust.js';
+import { readPosts } from './readposts.js';
+import { editProfileUser } from './editprofile.js';
+
+function clickMenus(obtainingPersistenceData) {
+    let nameMenus = document.querySelectorAll('ul.clickMenu li a'); 
+    nameMenus.forEach(function(viewMenus) {
+        viewMenus.addEventListener('click', function(clickedMenu) {
+            clickedMenu.preventDefault();
+            let userClickMenu = clickedMenu.target.dataset.nav;
+            if (userClickMenu == "/Foro") {
+                viewForum(obtainingPersistenceData)
+                    .then(function() {
+                        publicPost(obtainingPersistenceData);
+                        readPosts();
+                    });
+                window.history.pushState('Foro', 'Foro', '/Foro');
+            } else if (userClickMenu == "/Perfil") {
+                viewProfile(obtainingPersistenceData);
+                window.history.pushState('perfil', 'Perfil', '/Perfil');
+            } else if (userClickMenu == "/editarPerfil") {
+                editionOfProfile(obtainingPersistenceData)
+                    .then(function() {
+                        editProfileUser(obtainingPersistenceData);
+                    });
+                window.history.pushState('Editar Perfil', 'Editar Perfil', '/EditarPerfil');
+            } else if (userClickMenu == "/cerrarSesion") {
+                out();
+            };
+        });
+    });
+};
+
+export { clickMenus }

src/functions/editprofile.js

@@ -0,0 +1,94 @@
+import { clickMenus } from './clickmenus.js';
+import { viewForum } from '../view/fuorum.js';
+import { publicPost, addNewPost } from './publicpoust.js';
+import { readPosts } from './readposts.js';
+
+
+function editProfileUser(user) {
+    let savesChanges = document.getElementById('saveChangesButton');
+    let profilePictureInput = document.getElementById('newProfilePhoto'); //aquí pongo en id del input donde voy dar click para entrar a carpeta que muestra imágenes
+    let imageUrl = ''; //la variable está vacia,porque solamente cuando el usuario mande una imagen y la imagen sea subida a firebase, tendremos solo así el link. En caso de que el usuario ponga una imagen se llenará.
+
+    profilePictureInput.onchange = changeProfilePhoto => {
+        console.log(changeProfilePhoto);
+
+        let file = changeProfilePhoto.target.files[0];
+        firebase.storage().ref("devpost").child(file.name).put(file) //le digo a firebase que voy a ocupar su servicio de storage haciendo referencia a la carpeta devpost y que voy a declarar un hijito como mi file que ya declaramos arriba .name ahí entramos a la propiedad name de file, y luego le decimos quiero poner que es PUT este archivo(file) y es tal cual todo el objeto del archivo
+            .then(snap => { ///cuando ya sea exitoso snap es el que me va a retornar la respuesta del storage de firebase
+                return snap.ref.getDownloadURL() //retorname el ref y la url de descarga de mi imagen que acabo de subir a tu servicio, esta url la recibe la siguiente promesa como link
+            })
+            .then(link => { //entonces..Si todo exitoso:
+                console.log(link)
+                imageUrl = link; //devuelveme la url de esta imagen que subiste
+                let img = document.getElementById('userPhoto'); //recueparmos la imagen con su id
+                img.src = imageUrl; //y le decimos que su srrc va ser igual a esa imagen y ya se ve el preview en el circulito 
+            });
+    };
+
+    savesChanges.onclick = function() {
+
+        let callName = document.querySelector('#changeName');
+        let callProfession = document.querySelector('#changeProfession');
+
+        let editDataProfile = {
+            user: callName.value,
+            job: callProfession.value,
+            img: imageUrl,
+            uid: user.uid,
+        };
+
+        addInformationProfileEdit(editDataProfile)
+            .then(function() {
+                // Get the existing data
+                let existing = localStorage.getItem('userdata');
+                // If no existing data, create an array
+                // Otherwise, convert the localStorage string to an array
+                existing = existing ? JSON.parse(existing) : {}; //un objeto vacio en el caso de que no haya para yo llenarlo
+                // Add new data to localStorage Array
+                existing['displayName'] = editDataProfile.user;
+                existing['job'] = editDataProfile.job;
+                existing['photoURL'] = editDataProfile.img;
+                // Save back to localStorage
+                localStorage.setItem('userdata', JSON.stringify(existing));
+                return existing;
+            })
+            .then(function(existing) { //esto es la promesa
+                console.log('este es el bueno', existing);
+
+                alert('se guardaron los datos') //este es el resultado de la promesa
+                viewForum(existing)
+                    .then(function() {
+                        publicPost(existing);
+                        readPosts();
+                    })
+                    .then(function() {
+                        clickMenus(existing);
+                        updatePostPic(user.uid, imageUrl);
+                    })
+            })
+            .catch(err => {
+                console.log(err) //esto es el error cuando la respuesta es negativa
+            });
+    };
+
+};
+
+function addInformationProfileEdit(editDataProfile) {
+    console.log(editDataProfile);
+    return firebase.database().ref('users/' + editDataProfile.uid).set(editDataProfile);
+}
+
+function updatePostPic(uid, photo) {
+    return db.collection("pruebas_020520").where("uid", "==", uid)
+        .get()
+        .then(function(resultAllPost) {
+            resultAllPost.forEach(function(post) {
+                db.collection("pruebas_020520").doc(post.id).update({
+                    photo: photo,
+                });
+            });
+        });
+
+};
+
+export { editProfileUser }

src/functions/loginfacebook.js

@@ -0,0 +1,37 @@
+import { clickMenus } from './clickmenus.js';
+import { viewForum } from '../view/fuorum.js';
+import { publicPost, addNewPost } from './publicpoust.js';
+
+
+//Login with Facebook
+function facebookButton() {
+    let provider = new firebase.auth.FacebookAuthProvider();
+    let movilIcon = document.getElementById('movilIcon');
+
+    firebase.auth().signInWithPopup(provider)
+        .then(function(data) {
+            // This gives you a Facebook Access Token. You can use it to access the Facebook API.
+            let token = data.credential.accessToken;
+            // The signed-in user info.
+            let user = data.user;
+            clickMenus(user);
+            viewForum(user)
+                .then(function() {
+                    publicPost();
+                })
+                .then(function() {
+                    localStorage.setItem('userdata', JSON.stringify(user)); 
+                })
+            movilIcon.classList.add('shown');
+            document.getElementById('hideAndShow').style.display = 'block';
+        })
+        .catch(function(error) {
+            console.log(error);
+            let errorCode = error.code;
+            let errorMessage = error.message;
+            let email = error.email;
+            let credential = error.credential;
+        });
+};
+
+export { facebookButton }

src/functions/logingoogle.js

@@ -0,0 +1,37 @@
+import { clickMenus } from './clickmenus.js';
+import { viewForum } from '../view/fuorum.js';
+import { publicPost, addNewPost } from './publicpoust.js';
+
+
+//Login with Google Acount
+function googleButton() {
+    let provider = new firebase.auth.GoogleAuthProvider();
+    let movilIcon = document.getElementById('movilIcon');
+
+    firebase.auth().signInWithPopup(provider)
+        .then(function(data) {
+            // This gives you a Google Access Token. You can use it to access the Google API.
+            let token = data.credential.accessToken;
+            // The signed-in user info.
+            let user = data.user;
+            clickMenus(user);
+            viewForum(user)
+                .then(function() {
+                    publicPost();
+                })
+                .then(function() {
+                    localStorage.setItem('userdata', JSON.stringify(user)); 
+                });
+            document.getElementById('hideAndShow').style.display = 'block';
+            movilIcon.classList.add('shown');
+
+        })
+        .catch(function(error) {
+            let errorCode = error.code;
+            let errorMessage = error.message;
+            let email = error.email;
+            let credential = error.credential;
+        });
+}
+
+export { googleButton }

src/functions/loginpageone.js

@@ -0,0 +1,35 @@
+//Page one Login
+import { viewForum } from '../view/fuorum.js';
+import { readPosts } from './readposts.js';
+import { clickMenus } from './clickmenus.js';
+import { publicPost, addNewPost } from './publicpoust.js';
+
+function loginPageOne() {
+    let email = document.getElementById('email').value;
+    let pass = document.getElementById('pass').value;
+    let movilIcon = document.getElementById('movilIcon');
+    firebase.auth().signInWithEmailAndPassword(email, pass,)
+        .then((data) => {
+            clickMenus(data.user);
+            viewForum(data.user)
+                .then(function() {
+                    publicPost(data.user);
+                    readPosts();
+                })
+                .then(function() {
+                    localStorage.setItem('userdata', JSON.stringify(data.user));
+                });
+
+            document.getElementById('hideAndShow').style.display = 'block';
+            movilIcon.classList.add('shown');
+        })
+        .catch(function(error) {
+            alert('Los datos ingresados no son correctos');
+            let errorCode = error.code;
+            let errorMessage = error.message;
+            alert(errorMessage);
+        });
+    let cred = firebase.auth.EmailAuthProvider.credential(email, pass);
+}
+
+export { loginPageOne }

src/functions/logout.js

@@ -0,0 +1,68 @@
+//Log out
+import { viewLogin } from '../view/login.js';
+import { loginPageOne } from './loginpageone.js';
+import { viewRegister } from '../view/register.js';
+import { register } from './register.js';
+import { googleButton } from './logingoogle.js';
+import { facebookButton } from './loginfacebook.js';
+
+function out() {
+    console.log('revisando out');
+
+    firebase.auth().signOut()
+        .then(function() {
+            document.getElementById('movilIcon').classList.toggle('shown');
+            document.getElementById('hideAndShow').style.display = 'none';
+        })
+        .then(function() {
+            viewLogin()
+                .then(function() {
+                    localStorage.setItem('userdata', null); 
+                })
+                .then(function() {
+                    let buttonLogin = document.querySelector('#doLogin');
+                    buttonLogin.addEventListener('click', function(e) {
+                        e.preventDefault();
+                        loginPageOne();    
+                        movilIcon.classList.add('shown');
+                    });
+                })
+                .then(function() {
+                    let buttonGoogle = document.querySelector('#loginGoogle');
+                    buttonGoogle.addEventListener('click', function(e) {
+                        e.preventDefault();
+                        googleButton();
+                    });
+                })
+                .then(function() {
+                    let buttonFacebook = document.querySelector('#loginFacebook');
+                    buttonFacebook.addEventListener('click', function(e) {
+                        e.preventDefault();
+                        facebookButton();
+                        document.getElementById('hideAndShow').style.display = 'block';
+                        movilIcon.classList.add('shown');
+                    });
+                })
+                .then(function() {
+                    let ntAccount = document.querySelector('#reg');
+                    ntAccount.addEventListener('click', function(e) {
+                        e.preventDefault();
+                        viewRegister()
+                            .then(function() {
+                                let buttonReg = document.querySelector('#doRegister');
+                                buttonReg.addEventListener('click', function(e) {
+                                    e.preventDefault();
+                                    register();
+                                });
+                            });
+                    });
+                });
+
+            window.history.pushState('cerrar sesion', 'cerrar sesion', '/');
+        })
+        .catch(function(error) {
+            console.log(error);
+        });
+};
+
+export { out }