app.js

/*
   -Kabeers Notes
   (©) 2020 Kabeers Network - All Rights Reserved
   (©) Author(s) Kabeer Jaffri,
*/
/*-----------------------------------------------
    Ping + Created Async LocalStorage System 
------------------------------------------------*/
function ping() {
    let e = !1;
    if (navigator.onLine) {
        null != $.ajax({ url: "https://cdn.jsdelivr.net/gh/kabeer11000/notes/ping.txt", async: !1 }) && (e = !0);
    }
    return e;
}
const asyncLocalStorage = {
    setItem: async function (e, t) {
        return await null, localStorage.setItem(e, t);
    },
    getItem: async function (e) {
        return await null, localStorage.getItem(e);
    },
};
/*-----------------------------
   UI Functions & Speech API 
------------------------------*/
try {
    var SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition,
        recognition = new SpeechRecognition();
} catch (e) {
    console.error(e), document.querySelector(".no-browser-support").classList.add("d-block"), document.querySelector(".app").classList.add("d-none");
}
let user_id;
async function setUserID() {
    null == localStorage.getItem("user_id") ? localStorage.setItem("user_id", "123456") : (user_id = localStorage.getItem("user_id"));
}
setUserID();
let noteTextarea = $("#note-textarea"),
    instructions = $("#recording-instructions"),
    notesList = $("div#notes"),
    noteContent = "";
async function checkSave_Del_list() {
    null == localStorage.getItem("delete-list") && localStorage.setItem("delete-list", JSON.stringify([]));
    let e = JSON.parse(localStorage.getItem("delete-list"));
    if (e.length > -1 && ping()) {
        var t;
        for (t = 0; t < e.length; t++) deleteFromServer(e[t].date, user_id, e[t].note_id);
        asyncLocalStorage.setItem("delete-list", JSON.stringify([]));
    }
    null == localStorage.getItem("save-list") && asyncLocalStorage.setItem("save-list", JSON.stringify([])),
        JSON.parse(localStorage.getItem("save-list")).length > -1 && ping() && (saveToServer(), asyncLocalStorage.setItem("save-list", JSON.stringify([])));
}
document.querySelector("textarea").addEventListener("keyup", function () {
    let e = $(this).val().length,
        t = $("#current"),
        n = $("#maximum"),
        o = $("#the-count");
    t.text(e),
        e < 70 && t.css("color", "#666"),
        e > 70 && e < 90 && t.css("color", "#6d5555"),
        e > 90 && e < 200 && t.css("color", "#793535"),
        e > 100 && e < 520 && t.css("color", "#841c1c"),
        e > 120 && e < 700 && t.css("color", "#8f0001"),
        e >= 140 ? (n.css("color", "#8f0001"), t.css("color", "#8f0001"), o.css("font-weight", "bold")) : (n.css("color", "#666"), o.css("font-weight", "normal"));
});
(recognition.continuous = !0),
    (recognition.onresult = function (e) {
        var t = e.resultIndex,
            n = e.results[t][0].transcript;
        (1 == t && n === e.results[0][0].transcript) || ((noteContent += n), noteTextarea.val(noteContent));
    }),
    (recognition.onstart = async () => {
        instructions.text("Voice recognition activated. Try speaking into the microphone.");
    }),
    (recognition.onspeechend = async () => {
        $("#start-record-btn").html("mic"), instructions.text("You were quiet for a while so voice recognition turned itself off.");
    }),
    (recognition.onerror = async (e) => {
        "no-speech" === e.error && instructions.text("No speech was detected. Try again.");
    });
let r_btn = $("#start-record-btn");
function stopRecogBTNK() {
    r_btn.html("mic"), r_btn.removeAttr("onclick"), recognition.stop();
}
/*-----------------------------
          SnackBar 
------------------------------*/
function Snackbar(e, t) {
    let n = document.createElement("DIV");
    if (((n.className = "snackbar"), (n.innerHTML = '<div class="content"><div class="msg">' + e.message + "</div></div></div>"), e.actiontext)) {
        let o = document.createElement("DIV");
        (o.className = "action"), (o.innerText = e.actiontext), o.addEventListener("click", t), n.querySelector(".content").appendChild(o);
    }
    document.body.appendChild(n),
        n.offsetTop,
        n.classList.add("show"),
        setTimeout(() => {
            document.addEventListener("click", (e) => {
                e.target === n || n.contains(e.target) || o();
            });
        }),
        setTimeout(() => {
            o();
        }, 4e3);
    const o = () => {
        n.classList.remove("show"),
            n.addEventListener("transitionend", () => {
                n.remove();
            });
    };
}
/*-----------------------------
       Highlight URLS 
------------------------------*/
function urlify(e) {
    return e.replace(/(https?:\/\/[^\s]+)/g, function (e) {
        return '<a href="' + e + '">' + e + "</a>";
    });
}
/*-----------------------------
      ContentEditable Note 
------------------------------*/
function contentEditableSaveHelper(e) {
    if (("s" === e.key || "S" === e.key) && (e.ctrlKey || e.metaKey)) {
        $(this).html(unescape($(this).html()));
        let t = $(e.target);
        contentEditable({ noteContent: t.closest(".note").find(".note-Content").text(), date: t.closest(".note").find(".date").text(), id: t.closest(".note").find(".id").text() }),
            e.preventDefault(),
            Snackbar({ message: "Note Saved!" }),
            addEventListener_OnKeyDown().then();
    }
}
async function addEventListener_OnKeyDown() {
    $(".note-Content").on("keydown", function (e) {
        contentEditableSaveHelper(e);
    });
}
function contentEditableSaveHelperEle(e) {
    $(e).text($(e).text());
    let t = $(e);
    contentEditable({ noteContent: t.closest(".note").find(".note-Content").text(), date: t.closest(".note").find(".date").text(), id: t.closest(".note").find(".id").text() }),
        Snackbar({ message: "Note Saved!" }),
        addEventListener_OnKeyDown();
}
/*-----------------------------
       Helper Functions 
------------------------------*/
function readOutLoud(e, t) {
    var n = new SpeechSynthesisUtterance();
    (n.text = e), (n.volume = 1), (n.rate = 0.8), (n.pitch = 1), window.speechSynthesis.speak(n), (n.onend = t());
}
function replaceAll(e, t, n) {
    return e.split(t).join(n);
}
function escapeHtml(e) {
    var t = { "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#039;" };
    return e.replace(/[&<>"']/g, function (e) {
        return t[e];
    });
}
//Main Render Function
function renderNotes(e) {
    var t = "";
    e.length
        ? e.forEach(function (e) {
              let n = e.content.split("\n")[0];
              var o;
              (e.content = e.content.substring(n.length)),
                  (t += `<div class="col-md-6 mt-3 note pt-2 ${
                      e.uniqid
                  }">\n            <div class=" card border h-100 w-100">\n            <p class="header d-flex p-3" style="justify-content:space-around">\n            <span class="d-none id">${
                      e.uniqid
                  }</span>\n            <span class="date">${e.date}</span>\n            <a href="#" class="listen-note material-icons" title="Listen to Note">volume_up</a>\n            <a onclick="deleteFromServer('${
                      e.date
                  }','${user_id}', '${
                      e.uniqid
                  }')" href="#" class="delete-note material-icons" title="Delete">delete</a>\n            </p>\n            <span class="note-Content p-4" onclick="this.contentEditable=true;$(this).remove('h3')" onblur="this.contentEditable=false;contentEditableSaveHelperEle(this);" contenteditable="false">\n            <h3>${n}</h3><p class="pb-2"><div class="-show-read-more" style="word-wrap: break-word; white-space: pre-wrap;">${urlify(
                      ((o = e.content), o.replace(/</g, "&lt;").replace(/>/g, "&gt;"))
                  )}</div></p></span></div></div>`);
          })
        : (t =
              '<div class="col-md-12 d-flex justify-content-center">\n              <img src="assets/icons/ic_launcher.png" style="width: 10rem;height: auto;opacity:100%">\n            </div>\n            <div class="col-md-12"><p class="text-center text-muted">Notes you add appear here</p></div>\n            </div></div>'),
        notesList.html(t);
}
/*-----------------------------
       Main Functions 
------------------------------*/
function contentEditable(e) {
    let t = { content: e.noteContent, uniqid: uniqid() };
    var n, o;
    deleteFromServer(e.date, user_id, e.id),
        saveNote(
            e.date,
            ((n = JSON.stringify(t)),
            (o = { "\n": " " }),
            n.replace(/\n/g, function (e) {
                return o[e];
            }))
        );
}
function saveNote(e, t) {
    asyncLocalStorage.setItem("note-" + e, t).then(function () {
        ping() ? sync_now(!1) : sync_now(), getFromServer(user_id, renderNotes);
    });
}
async function getAllNotes() {
    let e;
    return (e = ping()
        ? function (e) {
              return getFromServer(user_id);
          }
        : (function () {
              function e(e) {
                  var t = { "<": "&lt;", ">": "&gt;" };
                  return e.replace(/[<>]/g, function (e) {
                      return t[e];
                  });
              }
              let t,
                  n = [];
              for (var o = 0; o < localStorage.length; o++)
                  "note-" === (t = localStorage.key(o)).substring(0, 5) &&
                      n.push({ date: t.replace("note-", ""), content: JSON.parse(e(localStorage.getItem(localStorage.key(o)))).content, uniqid: JSON.parse(e(localStorage.getItem(localStorage.key(o)))).uniqid });
              return n;
          })());
}
function deleteNote(e) {
    localStorage.removeItem("note-" + e);
}
function refresh() {
    getFromServer(user_id, renderNotes), checkSave_Del_list(), Snackbar({ message: "Refreshed!" });
}
function Utils() {}
r_btn.on("click", function () {
    noteContent.length && (noteContent += " "), r_btn.html("mic_off"), r_btn.attr("onclick", "stopRecogBTNK()"), recognition.start();
}),
    $("#pause-record-btn").on("click", function () {
        recognition.stop(), instructions.text("Voice recognition paused."), r_btn.html("mic");
    }),
    noteTextarea.on("input", function () {
        noteContent = $(this).val();
    }),
    $("#save-note-btn").on("click", function () {
        if ((recognition.stop(), noteContent.length)) {
            let n = { content: noteContent, uniqid: uniqid() },
                o = new Date().toLocaleString();
            saveNote(o, ((e = JSON.stringify(n)), (t = { "\n": " " }), e.replace(/\n/g, async (e) => t[e]))),
                (noteContent = ""),
                getFromServer(user_id, renderNotes),
                noteTextarea.val(""),
                instructions.text("Note saved successfully."),
                Snackbar({ message: "Note Saved!", actiontext: "Delete" }, () => {
                    deleteFromServer(o, user_id, n.uniqid);
                    let e = JSON.parse(localStorage.getItem("save-list")),
                        t = 0;
                    for (t = 0; t < e.length; t++)
                        if (e[t].uniqid === n.uniqid) {
                            e.splice(t, 1);
                            break;
                        }
                    asyncLocalStorage.setItem("save-list", JSON.stringify(e));
                });
        } else instructions.text("Could not save empty note. Please add a message to your note.");
        var e, t;
    }),
    notesList.on("click", function (e) {
        e.preventDefault();
        var t = $(e.target);
        if (t.hasClass("listen-note")) {
            var n = t.closest(".note").find(".note-Content").text();
            $(".listen-note").addClass("btn-disabled"),
                readOutLoud(n, function () {
                    $(".listen-note").removeClass("btn-disabled");
                });
        }
    }),
    addEventListener_OnKeyDown(),
    (Utils.prototype = {
        constructor: Utils,
        isElementInView: function (e, t) {
            let n = $(window).scrollTop(),
                o = n + $(window).height(),
                r = $(e).offset().top,
                a = r + $(e).height();
            return !0 === t ? n < r && o > a : r <= o && a >= n;
        },
    });
var Utils = new Utils();
function uniqid(e = "", t = !1) {
    let n = (Date.now() / 1e3).toString(16).split(".").join("");
    for (; n.length < 14; ) n += "0";
    let o = "";
    return t && ((o = "."), (o += Math.round(1e8 * Math.random()))), e + n + o;
}
/*-----------------------------
       Server Functions 
------------------------------*/
function saveToServer() {
    function e(e) {
        if (!ping()) {
            let t = JSON.parse(localStorage.getItem("save-list"));
            t.push({ date: e.date, user_id: e.user_id, content: e.content, uniqid: e.uniqid }), asyncLocalStorage.setItem("save-list", JSON.stringify(t));
        }
        var t;
        $.ajax({
            url: "https://hosted-kabeersnetwork.000webhostapp.com/notes/server/alternate/savetoserver.php",
            type: "POST",
            dataType: "json",
            data: {
                date: e.date,
                user_id: e.user_id,
                content: btoa(encodeURIComponent(((t = e.content), t.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/\\/g, "&#92;").replace(/'/g, "&#039;")))),
                uniqid: e.uniqid,
            },
            async: !0,
            success: function () {
                console.log("Saved Notes to The Server");
            },
        });
    }
    let t,
        n,
        o = [];
    for (n = 0; n < localStorage.length; n++)
        if ("note-" === (t = localStorage.key(n)).substring(0, 5)) {
            o.push({ date: t.replace("note-", ""), content: localStorage.getItem(localStorage.key(n)) });
            const r = JSON.parse(localStorage.getItem(localStorage.key(n)));
            e({ date: t.replace("note-", ""), user_id: user_id, content: r.content, uniqid: r.uniqid });
        }
}
async function getFromServer(e, t = renderNotes) {
    let n = [];
    ping()
        ? t(
              (function () {
                  let t,
                      o = $.ajax({ url: "https://hosted-kabeersnetwork.000webhostapp.com/notes/server/alternate/getnotes.php?user_id=" + e, type: "GET", async: !1 });
                  for (o = o.responseJSON, t = 0; t < o.length; t++) n.push({ date: o[t].date, content: o[t].content, uniqid: o[t].uniqid });
                  return n;
              })()
          )
        : (console.warn("Cannot Fetch No Connection"), t(getNotesFromLocalStorage()));
}
function deleteFromServer(e, t, n) {
    if (!ping()) {
        let t = JSON.parse(localStorage.getItem("delete-list"));
        t.push({ note_id: n, date: e }), asyncLocalStorage.setItem("delete-list", JSON.stringify(t));
    }
    var o;
    (o = { user_id: t, uniqid: n }),
        $.ajax({
            url: "https://hosted-kabeersnetwork.000webhostapp.com/notes/server/alternate/delete.php?user_id=" + o.user_id + "&uniqid=" + o.uniqid,
            type: "GET",
            async: !0,
            success: function () {
                console.log("Delete Note From The Server");
            },
        }),
        deleteNote(e),
        $("." + n).remove(),
        Snackbar({ message: "Deleted!" });
}
async function sync_now(e = !0) {
    checkSave_Del_list(),
        ping()
            ? (saveToServer(), e && Snackbar({ message: "Synced!" }))
            : e &&
              Snackbar({ message: "Sync Failed, No Connection!", actiontext: "Retry" }, () => {
                  sync_now();
              }),
        saveToServer();
}
function getNotesFromLocalStorage() {
    function e(e) {
        var t = { "<": "&lt;", ">": "&gt;" };
        return e.replace(/[<>]/g, function (e) {
            return t[e];
        });
    }
    let t,
        n = [];
    for (var o = localStorage.length - 1; o >= 0; o--)
        "note-" === (t = localStorage.key(o)).substring(0, 5) &&
            n.push({ date: t.replace("note-", ""), content: JSON.parse(e(localStorage.getItem(localStorage.key(o)))).content, uniqid: JSON.parse(e(localStorage.getItem(localStorage.key(o)))).uniqid });
    return n;
}
function dE() {
    localStorage.clear(),
        $.ajax({
            url: "http://hosted-kabeersnetwork.000webhostapp.com/notes/server/alternate/del_all.php?user_id=" + user_id,
            type: "GET",
            async: !0,
            success: function () {
                console.log("Delete Note From The Server");
            },
        });
}
function saveToDeviceFromServerHelper(e) {
    saveToDeviceFromServer(e, getNotesFromLocalStorage());
}
async function saveToDeviceFromServer(e, t) {
    let n = ((o = t), e.filter((e) => !o.includes(e)));
    var o;
    if (n.length > -1)
        for (var r = n.length - 1; r >= 0; r--) {
            let e = { content: n[r].content, uniqid: n[r].uniqid };
            saveNote(n[r].date, JSON.stringify(e));
        }
}
/*--------------------------------------------------------------------------------------
         Sync Functions - Connected With Service Worker Background Sync API 
---------------------------------------------------------------------------------------*/
let dayInMilliseconds = 18e5;
function focusTextarea() {
    $("#note-textarea").focus();
}
setInterval(function () {
    sync_now(), getFromServer(user_id, saveToDeviceFromServerHelper);
}, dayInMilliseconds),
    $(".year").html(new Date().getFullYear()),
    getFromServer(user_id, renderNotes),
    $("#preloader").remove();

index.html

<!DOCTYPE html>
<head>
   <meta charset=utf-8>
   <meta http-equiv=X-UA-Compatible content="IE=edge">
   <title>Kabeers Notes - Smart for your needs</title>
   <meta name=description content="Kabeer Jaffri at Kabeers Network">
   <meta name=viewport content="width=device-width, initial-scale=1">
   <link rel=stylesheet href=style.css>
   <link rel=stylesheet type=text/css href=vendor/bootstrap.min.css>
   <link rel=stylesheet href="https://fonts.googleapis.com/icon?family=Material+Icons">
   <link href=vendor/material-components-web.min.css rel=stylesheet>
   <link rel=apple-touch-icon sizes=57x57 href=assets/favicons/apple-touch-icon-57x57.png>
   <link rel=apple-touch-icon sizes=60x60 href=assets/favicons/apple-touch-icon-60x60.png>
   <link rel=apple-touch-icon sizes=72x72 href=assets/favicons/apple-touch-icon-72x72.png>
   <link rel=apple-touch-icon sizes=76x76 href=assets/favicons/apple-touch-icon-76x76.png>
   <link rel=apple-touch-icon sizes=114x114 href=assets/favicons/apple-touch-icon-114x114.png>
   <link rel=apple-touch-icon sizes=120x120 href=assets/favicons/apple-touch-icon-120x120.png>
   <link rel=apple-touch-icon sizes=144x144 href=assets/favicons/apple-touch-icon-144x144.png>
   <link rel=apple-touch-icon sizes=152x152 href=assets/favicons/apple-touch-icon-152x152.png>
   <link rel=apple-touch-icon sizes=180x180 href=assets/favicons/apple-touch-icon-180x180.png>
   <link rel=icon type=image/png sizes=32x32 href=assets/favicons/favicon-32x32.png>
   <link rel=icon type=image/png sizes=16x16 href=assets/favicons/favicon-16x16.png>
   <link rel=manifest href=manifest.json crossorigin=use-credentials>
   <link rel=mask-icon href=assets/favicons/safari-pinned-tab.svg color=#f8f8f8>
   <link rel="shortcut icon" href=assets/favicons/favicon.ico>
   <meta name=msapplication-TileColor content=#FFC400>
   <meta name=msapplication-config content=assets/favicons/browserconfig.xml>
   <meta name=theme-color content=#FFC400>
</head>
<body style=scroll-behavior:smooth>
   <div id=preloader style=position:fixed;display:block;z-index:200002;width:100%;height:100%;background-image:linear-gradient(#eee,#eee);background-repeat:no-repeat;background-size:cover class=text-center>
      <div class="md-preloader bg-light">
         <div role=progressbar class="mdc-linear-progress mdc-linear-progress--indeterminate">
            <div class=mdc-linear-progress__buffering-dots></div>
            <div class=mdc-linear-progress__buffer></div>
            <div class="mdc-linear-progress__bar mdc-linear-progress__primary-bar"><span class=mdc-linear-progress__bar-inner></span></div>
            <div class="mdc-linear-progress__bar mdc-linear-progress__secondary-bar"><span class=mdc-linear-progress__bar-inner></span></div>
         </div>
      </div>
   </div>
   <aside class="mdc-drawer mdc-drawer--modal">
      <div class=mdc-drawer__content>
         <div style=width:100%;height:8rem>
            <span class="text-light position-absolute display-4 mt-5 pt-4 px-4">Notes <span class="user_id_drawer small" style=font-size:1rem;margin-top:-1rem></span></span>
            <div style=background-color:#ffc400;width:100%;height:8rem></div>
         </div>
         <nav class=mdc-list>
            <a class="mdc-list-item mdc-list-item--activated" href=# aria-selected=true><i class="material-icons mdc-list-item__graphic" aria-hidden=true>home</i><span class=mdc-list-item__text>Home</span></a>
            <hr class="material-divider divider border">
            <a class=mdc-list-item href=legal.html><i class="material-icons mdc-list-item__graphic" aria-hidden=true>policy</i><span class=mdc-list-item__text>Legal</span></a><a class=mdc-list-item href=opensource.html><i class="material-icons mdc-list-item__graphic" aria-hidden=true>source</i><span class=mdc-list-item__text>Open Source</span></a><a class=mdc-list-item onclick=dE() href=#><i class="material-icons mdc-list-item__graphic" aria-hidden=true>delete</i><span class=mdc-list-item__text>Reset</span></a>
            <hr>
            <div class=mdc-list-item>
               <div class="mdc-list-item__text k_auth_btn text-muted">&copy;&nbsp;<span class=year></span>&nbsp;Kabeers Network<br><a href=http://policies.kabeersnetwork.rf.gd/apps/notes/><small>Privacy</small></a></div>
            </div>
         </nav>
      </div>
   </aside>
   <div class=mdc-drawer-scrim></div>
   <header class="mdc-top-app-bar app-bar" id=app-bar>
      <div class=mdc-top-app-bar__row>
         <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start"><button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button mat-drawer-btn-k text-light">menu</button><span class=mdc-top-app-bar__title>Notes</span><span _ngcontent-pjn-c47 class=fill-space style="flex:1 1 auto"></span><button class="mdc-icon-button material-icons text-light" onclick=sync_now()>sync</button><button class="mdc-icon-button material-icons text-light refresh" onclick=refresh()>refresh</button></section>
      </div>
   </header>
   <noscript>Javascript Is Required to run this Application</noscript>
   <div class="mdc-drawer-app-content mdc-top-app-bar--fixed-adjust">
      <main class=main-content id=main-content>
         <div class=container>
            <div class=row>
               <h3 class=no-browser-support>Sorry, Your Browser Doesn't Support the Web Speech API. Try Opening This Demo In Google Chrome.</h3>
               <div class=app>
                  <div class="col-md-12 addNotes">
                     <h3>Add New Note</h3>
                     <div class=input-single>
                        <div class="col-md-12 d-flex justify-content-center"><textarea maxlength=1600 id=note-textarea class="form-control textarea main-textarea" placeholder="Create a new note by typing or using voice recognition." rows=6></textarea></div>
                        <div class="col-md-12 text-right" style=margin-right:5%;margin-top:-1rem>
                           <div id=the-count class="small text-muted char_count"><span id=current>0</span><span id=maximum>/ 1600</span></div>
                        </div>
                     </div>
                     <div><button id=start-record-btn class="border mx-2 bg-light rounded-circle mdc-icon-button material-icons" title="Start Recording">mic</button><button id=save-note-btn class="border mx-2 bg-light rounded-circle mdc-icon-button material-icons" title="Save Note">save</button></div>
                     <p id=recording-instructions>Press the <strong>Start Recognition</strong> button and allow access.</p>
                  </div>
                  <br class="border-none my-5">
                  <h3>All Notes</h3>
                  <div>
                     <div class="row text-left" id=notes>
                        <p class=no-notes></p>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </main>
   </div>
   <div class=k_fab style=position:fixed;bottom:3%;right:2.5%>
      <button class="mdc-fab bg-warning" onclick=focusTextarea() aria-label=Favorite>
         <div class=mdc-fab__ripple></div>
         <span class="mdc-fab__icon text-light material-icons">add</span>
      </button>
   </div>
   <script src=vendor/jquery.js></script><script async src=app.js></script> <script defer async src=vendor/auto-resize.min.js></script><script type=text/javascript src=vendor/localStorage.js></script> <script defer>if("serviceWorker" in navigator){navigator.serviceWorker.register("sw.js").then(function(){console.log("Service Worker Registered")})}</script><script async defer type=text/javascript src=vendor/pulltorefresh.umd.min.js></script> <script async defer src=vendor/material-components-web.min.js></script><script defer async type=text/javascript>window.onload=function(){PullToRefresh.init({mainElement:"#main-content",onRefresh:function(){setTimeout(function(){refresh()},500)}});let drawer=mdc.drawer.MDCDrawer.attachTo(document.querySelector(".mdc-drawer")),button=document.querySelector(".mat-drawer-btn-k");button.addEventListener("click",function(){drawer.open=true});document.querySelector(".mdc-drawer-scrim").addEventListener("click",function(){drawer.open=!1?drawer.open=!1:$(".mdc-drawer").addClass("mdc-drawer--closing")});autosize(document.getElementById("note-textarea"))};</script> <script defer src=vendor/protect.min.js></script>
</body>
</html>
<!--
   -Kabeers Notes
   (©) 2020 Kabeers Network - All Rights Reserved
   (©) Author(s) Kabeer Jaffri,
--->

protect.js

/*
   -Kabeers Protect JS
   (©) 2019 Kabeers Network - All Rights Reserved
   (©) Author(s) Kabeer Jaffri,
*/
!(function () {
    try {
        let t = console;
        Object.defineProperty(window, "console", {
            get: function () {
                if (t._commandLineAPI) throw "Sorry, for security reasons, the script console is deactivated on netflix.com";
                return t;
            },
            set: function (e) {
                t = e;
            },
        });
    } catch (t) {}
})();
const MAIN = window,
    VOID = void 0,
    HOST = `https://${location.host}`,
    stak = function (t, e, n, i, r, o, a) {
        return (
            (e = e || ""),
            (i = new Error(".").stack.split("\n")).shift(),
            (r = []),
            (o = HOSTPURL),
            (a = ["_fake_"]),
            i.forEach((t) => {
                if (t.indexOf(o) < 0) return;
                let n, i, c, l, f;
                (f = 1),
                    (n = t.trim().split(o)),
                    (i = (i = n[0].split("@").join("").split("at ").join("").trim()).split(" ")[0]) || (i = "anon"),
                    a.forEach((t) => {
                        (0 == i.indexOf(t) || i.indexOf("." + t) > 0) && e.indexOf(t) < 0 && (f = 0);
                    }),
                    f && ((c = (n = n[1].split(" "))[0]).indexOf(":") > 0 ? ((n = c.split(":")), (c = n[0])) : (n = n.pop().split(":")), "/" != c && ((l = n[1]), (r[r.length] = [i, c, l].join(" "))));
            }),
            isNaN(1 * t) ? r : r[t]
        );
    },
    bore = function (t, e, n) {
        if (!("string" != typeof e || e.trim().length < 1)) return n === VOID ? new Function("a", `return a.${e}`)(t) : null === n ? (new Function("a", `delete a.${e}`)(t), !0) : (new Function("a", "z", `a.${e}=z`)(t, n), !0);
    },
    bake = function (t, e, n) {
        if (!t || !t.hasOwnProperty) return;
        n == VOID && (n = t[e]);
        let i = { enumerable: !1, configurable: !1, writable: !1, value: n },
            r = !0;
        try {
            Object.defineProperty(t, e, i);
        } catch (t) {
            r = !1;
        }
        return r;
    },
    jack = function (t, e) {
        if ("string" != typeof t || !t.trim()) return;
        if (e && "function" != typeof e) return;
        if (!e) return this[t];
        if (t in this) return void (this[t].list[this[t].list.length] = e);
        let n, i;
        (i = (n = t.split(".")).pop()), (n = n.join(".")), (this[t] = { func: bore(MAIN, t), list: [e] }), bore(MAIN, t, null);
        let r = {
            [`_fake_${t}`]: function () {
                let t, e, n, i, r;
                if ((t = ((t = stak(0, (e = "_fake_"))) || "").split(" ")[0]).startsWith(e) || !(t.indexOf(`.${e}`) < 0)) {
                    (t = jack(t.split(e).pop())), (n = [].slice.call(arguments));
                    for (let o in t.list) {
                        if (!t.list.hasOwnProperty(o) || r) continue;
                        let a, c;
                        if (((a = t.list[o].toString()), (r = (c = new Function("y", `return {[y]:${a}}[y];`)(e)).apply(t, n)) == VOID)) return;
                        Array.isArray(r) || (r = [r]), (i = t.func.apply(this, r));
                    }
                    return i;
                }
                fail(":(");
            },
        }[`_fake_${t}`];
        bake(r, "name", `_fake_${t}`), bake(n ? bore(MAIN, n) : MAIN, i, r);
        try {
            bore(MAIN, t).prototype = Object.create(this[t].func.prototype);
        } catch (t) {}
    }.bind({});
jack("eval", function (t) {
    if (stak(0)) return t;
    alert("We Have a hacker here!");
}),
    jack("toString", function (t) {
        if (stak(0)) return t;
        alert("We Have a hacker here!");
    }),
    jack("console.log", function (t) {
        if (stak(0)) return t;
        alert("We Have a hacker here!");
    });

style.css

/*
   -Kabeers Notes
   (©) 2020 Kabeers Network - All Rights Reserved
   (©) Author(s) Kabeer Jaffri,
*/
:focus {
    outline: none !important;
}
root {
    --accent-yellow: #ffc400;
}
ul {
    list-style: none;
    padding: 0;
}
p {
    color: #444;
}
button:focus {
    outline: 0;
}
.container {
    max-width: 700px;
    margin: 0 auto;
    padding: 100px 50px;
    text-align: center;
}
.container h1 {
    margin-bottom: 20px;
}
.page-description {
    font-size: 1.1rem;
    margin: 0 auto;
}
.tz-link {
    font-size: 1em;
    color: #1da7da;
    text-decoration: none;
}
.no-browser-support {
    display: none;
    font-size: 1.2rem;
    color: #e64427;
    margin-top: 35px;
}
.app {
    margin: 40px auto;
}
#note-textarea {
    margin: 20px 0;
}
#recording-instructions {
    margin: 15px auto 60px;
}
#notes {
    padding-top: 20px;
}
.note .header {
    font-size: 0.9em;
    color: #888;
    margin-bottom: 10px;
}
.note .delete-note,
.note .listen-note {
    text-decoration: none;
    margin-left: 15px;
}
@media (max-width: 768px) {
    .container {
        padding: 50px 25px;
    }
    button {
        margin-bottom: 10px;
    }
}
@media (max-width: 1200px) {
    #bsaHolder {
        display: none;
    }
}
.main-textarea {
    width: 70% !important;
    resize: both;
    font-smoothing: subpixel-antialiased;
}
.char_count {
    margin-right: 20%;
    margin-top: -1rem;
}
.main-textarea:focus {
    outline-color: #ffc400 !important;
}
@media screen and (max-width: 600px) {
    .main-textarea {
        width: 100% !important;
    }
    .char_count {
        margin-right: 5%;
        margin-top: -1rem;
    }
}
.app-bar {
    background-color: #ffc400 !important;
}
.material-icons {
    color: #ffab40 !important;
}
@keyframes moveIn {
    0% {
        margin-top: 50px;
        opacity: 0;
    }
    100% {
        opacity: 1;
        margin-top: -20px;
    }
}
img[src*="https://cdn.000webhost.com/000webhost/logo/footer-powered-by-000webhost-white2.png"]
{
    display: none;
}
.show-read-more .more-text {
    display: none;
}
.mdc-list-item--activated {
    color: #ffab40 !important;
}
.inEdit {
    border: #ffc400 !important;
    border-width: 2px;
}
.snackbar,
.snackbar div {
    display: flex;
    align-items: center;
}
.snackbar {
    transition: transform 0.3s ease, opacity 0.3s ease;
    position: fixed;
    color: #fff;
    z-index: 100;
    left: 0;
    right: 0;
    bottom: 1rem;
    font-size: 14px;
    transform: translateY(150px);
}
.snackbar.show {
    transform: translateY(0px);
}
.snackbar .content {
    max-width: 568px;
    min-width: 288px;
    margin: 0 auto;
    border-radius: 0.25rem;
    background-color: #323232;
    pointer-events: auto;
    padding: 14px 22px;
}
.snackbar .msg {
    width: 100%;
    justify-content: space-between;
    max-height: 64px;
    overflow: hidden;
}
.snackbar .action {
    margin-left: 18px;
    cursor: pointer;
    color: #4caf50;
    font-weight: 500;
    text-transform: uppercase;
}
@media (max-width: 600px) {
    .snackbar {
        bottom: 0;
        border-radius: 0.25rem 0.25rem 0 0;
    }
    .snackbar .content {
        width: 100%;
    }
}
.menu {
    height: 40px;
    background: #eee;
    line-height: 40px;
    outline: 0;
    padding: 0 22px;
    margin-right: 20px;
    box-shadow: 0 1.5px 4px rgba(0, 0, 0, 0.24), 0 1.5px 1px rgba(0, 0, 0, 0.12);
    border-radius: 2px;
    cursor: pointer;
}
.parent {
    margin: 60px;
    font-family: "Roboto", sans-serif;
    text-align: center;
}
body {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}