Scribd Logo
Upload

Welcome to Scribd!

  • Group: MT-2105 Students: Aigerim Yesseyeva, Danial Muntinov Assignment 2 Index - HTML

    Uploaded by

    Aigerim Yesseyeva
    9 views4 pages

    Original Title

    Assignment2_backend

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    9 views4 pages

    Group: MT-2105 Students: Aigerim Yesseyeva, Danial Muntinov Assignment 2 Index - HTML

    Uploaded by

    Aigerim Yesseyeva

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 4

    Group: MT-2105

    Students: Aigerim Yesseyeva, Danial Muntinov


    Assignment 2

    Index.html
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8">

    <title>Biscuits</title>

    </head>
    <body>
    <H1 class = "title"> Internships </H1>

    <!-- <p> <h2> We are going to focus on front later in process</h2></p> -->
    <head>
    <title>Cookies</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
    </head>
    <body>
    <!-- bootstrap form -->
    <div class="container">
    <div id="userinfo" style="display: none;">
    <p><b>Name</b>: Hello, <span id="my-name"></span> !!!</p>
    <p><b>Email</b>: <span id="my-email"></span></p>
    <p><b>Country</b>: <span id="my-country"></span></p>
    <p><i>You logged in <b id="my-time"></b> seconds ago</i></p>
    <div class="float-right"><button class="btn btn-danger" onclick="deleteCookies()">Delete
    cookies</button></div>
    </div>
    <h2 class="text-center">Registration Form</h2>
    <form id="registrationForm" action="#">
    <div class="form-group">
    <label for="name">Name:</label>
    <input type="text" class="form-control" id="name" placeholder="Enter name" name="name">
    </div>

    <div class="form-group">
    <label for="email">Email:</label>
    <input type="email" class="form-control" id="email" placeholder="Enter email" name="email">
    </div>
    <div class="form-group">
    <label for="country">Country:</label>
    <select name="country" class="form-control" id="country">
    <option value="Kazakhstan">Kazakhstan</option>
    <option value="USA">USA</option>
    <option value="Russia">Russia</option>
    <option value="China">China</option>
    </select>
    </div>

    <button type="button" onclick="onFormSubmit()" id="save_btn" class="btn btn-default">Submit</button>


    </form>
    </div>

    <footer>
    <script src="/script.js"></script>
    </footer>
    </body>

    </html>

    Script.js

    function setCookie(cname, cvalue, exdays) {


    const d = new Date();
    d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
    let expires = "expires="+d.toUTCString();
    document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
    }

    function getCookie(cname) {
    let name = cname + "=";
    let ca = document.cookie.split(';');
    for(let i = 0; i < ca.length; i++) {
    let c = ca[i];
    while (c.charAt(0) == ' ') {
    c = c.substring(1);
    }
    if (c.indexOf(name) == 0) {
    return c.substring(name.length, c.length);
    }
    }
    return "";
    }

    function deleteCookie(cname) {
    document.cookie = cname + "=;expires=Thu, 01 Jan 1970 00:00:01 GMT;path=/";//stable date everywhere
    }

    function hasCookie() {
    return getCookie("name") != ""; //not empty
    }

    function addUserInfo() {
    $("#userinfo #my-name").text(getCookie("name"));
    $("#userinfo #my-email").text(getCookie("email"));
    $("#userinfo #my-country").text(getCookie("country"));

    let t = getCookie("time");//temporary holder


    let differenceInSeconds = (Date.now() - t) / 1000;//turning mileseconds to seconds
    $("#userinfo #my-time").text(differenceInSeconds);

    $("#userinfo").show();
    }

    function deleteCookies() {
    deleteCookie("name");
    deleteCookie("email");
    deleteCookie("country");
    deleteCookie("time");
    $("#userinfo").hide();
    }

    function onFormSubmit() {
    let email = $("#registrationForm #email").val();
    let name = $("#registrationForm #name").val();
    let country = $("#registrationForm #country").val();

    console.log(email, name, country);// google console


    setCookie("name", name, 30); // 30 means that data will be stored for 30 days in website
    setCookie("email", email, 30);
    setCookie("country", country, 30);

    setCookie("time", Date.now(), 30);

    }
    function greetCookie() {
    var user = getCookie("name");
    if(user != ""){
    alert("Welcome again to Internships" + user);
    }
    }

    $(document).ready(function() { // when DOM will be finish


    if (hasCookie()) {
    addUserInfo();
    }
    });

    You might also like