{"id":14745,"date":"2000-01-01T11:11:00","date_gmt":"2000-01-01T11:11:00","guid":{"rendered":"https:\/\/aurelis.org\/blog\/?p=14745"},"modified":"2024-05-21T07:52:44","modified_gmt":"2024-05-21T07:52:44","slug":"asking-wiki-lisa","status":"publish","type":"post","link":"https:\/\/aurelis.org\/blog\/lisa\/asking-wiki-lisa","title":{"rendered":"Asking Wiki-Lisa"},"content":{"rendered":"\n<p>Here comes your possibility to interact with Wiki-Lisa, asking about any mind-related subjects in the vein of the AURELIS blog-<a href=\"https:\/\/chatgpt.com\/g\/g-KBW1SBCmR-poc-lisa\" target=\"_blank\" rel=\"noreferrer noopener\">wiki<\/a>.<\/p>\n\n\n\n<p>Enjoy!<\/p>\n\n\n\n<!--<script src=\"\/\/www.socialintents.com\/api\/chat\/socialintents.1.3.js#2c9fab358e116786018e1e0962eb158f\" async=\"async\"><\/script>-->\n\n\n\n<!--<iframe src=\"https:\/\/chat.socialintents.com\/c\/chat-1709900915435\" width=\"100%\" style=\"height:100%;min-height:550px;\" frameborder=\"0\"><\/iframe>-->\n<style>\n    \/*style.css*\/\n    * {\n        box-sizing: border-box;\n        margin: 0;\n        padding: 0;\n    }\n    \n    body {\n        font-family: \"Poppins\", sans-serif;\n        font-weight: 400;\n        font-style: normal;\n        background-color: #f7f7f7;\n    }\n    \n    .chatBot {\n        background: white;\n        border-radius: 10px;\n        box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);\n       \n    }\n    \n    .chatbox {\n        background: rgb(255, 255, 255) url(gfg-gg-logo.svg);\n        background-size: contain;\n        background-repeat: no-repeat;\n        background-position: center;\n    }\n    \n    .chatbox {\n        overflow-y: scroll;\n    }\n    \n    .chatbox::-webkit-scrollbar-track {\n        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);\n        border-radius: 10px;\n        background-color: #F5F5F5;\n    }\n    \n    .chatbox::-webkit-scrollbar {\n        width: 3px;\n        background-color: #F5F5F5;\n    }\n    \n    .chatbox::-webkit-scrollbar-thumb {\n        border-radius: 10px;\n        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);\n        background-color: #2ca598;\n    }\n    \n    .chatbot-name {\n        background-color: #09766c;\n        text-align: center;\n        border-radius: 7px 7px 0 0;\n        display: flex;\n        gap: 10px;\n        align-items: center;\n        padding: 10px 10px;\n    }\n    \n    .chatbot-name h2 {\n        color: #fff;\n        font-family: \"Poppins\", sans-serif;\n        margin: 0;\n    }\n    \n    .chatbox {\n        padding: 15px;\n        list-style: none;\n        overflow-y: auto;\n        height: 400px;\n    }\n    \n    .chatbox li {\n        margin-bottom: 10px;\n    }\n    \n    .chat p {\n        padding: 10px!important;\n        border-radius: 10px;\n        max-width: 70%;\n        word-wrap: break-word;\n    }\n    \n    .chat-outgoing {\n        display: flex;\n        justify-content: end;\n    }\n    \n    .chat-outgoing p {\n        background-color: #2ca598;\n        align-self: flex-end;\n        color: #fff;\n    }\n    \n    .chat-incoming p {\n        background-color: #eaeaea;\n    }\n    \n    .chat-input {\n        padding: 10px;\n        border-top: 1px solid #ccc;\n        display: flex;\n        align-items: center;\n        gap: 10px;\n        padding: 15px;\n    }\n    \n    .chat-input textarea {\n        width: 100%;\n        padding: 10px;\n        border: 1px solid #ccc;\n        border-radius: 10px;\n        resize: none;\n        outline: none;\n        overflow-y: scroll;\n        background-color: #dcdcdc85;\n        font-size: 16px;\n        color: #00766c;\n        font-weight: 600;\n        height: 71px;\n        overflow: auto;\n    }\n    \n    #cross {\n        float: right;\n        cursor: pointer;\n        color: white;\n        font-weight: bolder;\n        font-size: 28px;\n    }\n    \n    #cross:hover {\n        color: red;\n        transition: all .5s;\n    }\n    \n    .chatbox .chat p.error {\n        color: #ffffff;\n        background-color: #ff3737e8;\n    }\n    \n    #sendBTN {\n        \/* width: 100%; *\/\n        padding: 18px;\n        border: 0;\n        outline: none;\n        font-size: 20px;\n        font-weight: 600;\n        border-radius: 7px;\n        background-color: #FFB33D;\n        cursor: pointer;\n        color: white;\n    }\n    \n    #sendBTN i {\n        color: #7d581f !important;\n    }\n    \n    .lastMessage {\n        margin-top: 50px;\n        font-size: 35px;\n        font-weight: 600;\n        color: darkgreen;\n        text-align: center;\n    }\n<\/style>\n\n<body>\n\n        <div class=\"row justify-content-center align-items-center\">\n            <div class=\"col\">\n                <div class=\"chatBot\">\n                    <header class=\"chatbot-name\">\n                        <img loading=\"lazy\" style=\"margin-bottom:0px;\" src=\"https:\/\/i2.wp.com\/aurelis.org\/blog\/wp-content\/uploads\/2024\/05\/wiki-lisa.png?resize=50%2C50&#038;ssl=1\" width=\"50 px\" height=\"50 px\" alt=\"\" data-recalc-dims=\"1\">\n                        <h2  style=\"margin-right: 40px; margin-bottom:0px;\">Ask Wiki Lisa<\/h2>\n                        <!-- <span alt=\"Close\" id=\"cross\" onclick=\"cancel()\">X<\/span> -->\n                    <\/header>\n                    <ul class=\"chatbox\">\n                        <li class=\"chat-incoming chat\">\n                            <p>Hey! How can I assist you today?<\/p>\n                        <\/li>\n                    <\/ul>\n                    <div class=\"chat-input\">\n                        <textarea rows=\"0\" cols=\"17\" placeholder=\"Enter a message...\"><\/textarea>\n                        <button id=\"sendBTN\">\n                            <i class=\"fa fa-paper-plane-o text-white\"><\/i>\n                        <\/button>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n   <script>\n    \/\/ script.js\n\n    const chatInput =\n        document.querySelector('.chat-input textarea');\n    const sendChatBtn =\n        document.querySelector('.chat-input button');\n    const chatbox = document.querySelector(\".chatbox\");\n\n    let userMessage;\n\n    let apiKey = null;\n\n    \/\/ Function to generate a new API key\n    const generateAPIKey = () => {\n        const API_URL = \"https:\/\/lisa.ai.science\/users\/login\";\n        const requestOptions = {\n            method: \"POST\",\n            headers: {\n                \"Content-Type\": \"application\/json\"\n            },\n            body: JSON.stringify({\n                \"email\": \"demo@lisa.com\",\n                \"password\": \"123456\"\n            })\n        };\n\n        return fetch(API_URL, requestOptions)\n            .then(res => {\n                if (!res.ok) {\n                    throw new Error(\"Network response was not ok\");\n                }\n                return res.json();\n                console.log('res', res);\n\n            })\n            .then(data => {\n                return data.accessToken; \/\/ Return the generated API key\n            })\n            .catch(error => {\n                console.error(\"Error generating API key:\", error);\n                return null; \/\/ Return null if there's an error\n            });\n    };\n\n    const createChatLi = (message, className) => {\n        const chatLi = document.createElement(\"li\");\n        chatLi.classList.add(\"chat\", className);\n        let chatContent =\n            className === \"chat-outgoing\" ? `<p>${message}<\/p>` : `<p>${message}<\/p>`;\n        chatLi.innerHTML = chatContent;\n        return chatLi;\n    }\n\n\n    const generateResponse = (incomingChatLi, apiKey) => {\n\n        const API_URL = \"https:\/\/lisa.ai.science\/messages\/send\";\n        const API_KEY = apiKey;\n        const messageElement = incomingChatLi\n            .querySelector(\"p\");\n        const requestOptions = {\n            method: \"POST\",\n            headers: {\n                \"Content-Type\": \"application\/json\",\n                \"Authorization\": `Bearer ${API_KEY}`\n            },\n            body: JSON.stringify({\n                \/\/ \"model\": \"gpt-3.5-turbo\",\n                \/\/ role: \"user\",\n                content: userMessage\n\n            })\n        };\n\n        fetch(API_URL, requestOptions)\n            .then(res => {\n                if (!res.ok) {\n                    throw new Error(\"Network response was not ok\");\n                }\n                return res.json();\n            })\n            .then(data => {\n                messageElement\n                    .textContent = data.response;\n                \/\/ Calculate the difference between the height of the chatbox and the height of the incoming message\n                const diffHeight = chatbox.scrollHeight - incomingChatLi.offsetHeight;\n                \/\/ Adjust the scroll position to ensure the response starts from the bottom of the chatbot and scrolls up to 300px\n                chatbox.scrollTop = diffHeight - 100;\n            })\n            .catch((error) => {\n                messageElement\n                    .classList.add(\"error\");\n                messageElement\n                    .textContent = \"Oops! Something went wrong. Please try again!\";\n            })\n            \/\/ .finally(() => chatbox.scrollTo(0, chatbox.scrollHeight));\n    };\n\n\n    \/\/ Function to generate API key only once when the page loads\n    const generateAPIKeyOnce = async() => {\n        if (!apiKey) {\n            apiKey = await generateAPIKey();\n        }\n        return apiKey;\n    };\n\n    const handleChat = async() => {\n        const currentAPIKey = await generateAPIKeyOnce();\n        userMessage = chatInput.value.trim();\n        if (!userMessage) {\n            return;\n        }\n        chatbox\n            .appendChild(createChatLi(userMessage, \"chat-outgoing\"));\n        chatbox\n            .scrollTo(0, chatbox.scrollHeight);\n\n        chatInput.value = '';\n        setTimeout(() => {\n            const incomingChatLi = createChatLi(\"...\", \"chat-incoming\")\n            chatbox.appendChild(incomingChatLi);\n            chatbox.scrollTo(0, chatbox.scrollHeight);\n            generateResponse(incomingChatLi, apiKey);\n        }, 600);\n    }\n\n    sendChatBtn.addEventListener(\"click\", handleChat);\n\n    chatInput.addEventListener('keypress', function(event) {\n        \/\/ Check if the key pressed is Enter\n        if (event.key === 'Enter') {\n            \/\/ Prevent the default form submission behavior\n            event.preventDefault();\n            \/\/ Trigger the handleChat function\n            handleChat();\n        }\n    });\n    \/\/ Generate API key when the page loads\n    window.addEventListener(\"load\", async() => {\n        await generateAPIKeyOnce();\n    });\n\n    function cancel() {\n        let chatbotcomplete = document.querySelector(\".chatBot\");\n        if (chatbotcomplete.style.display != 'none') {\n            chatbotcomplete.style.display = \"none\";\n            let lastMsg = document.createElement(\"p\");\n            lastMsg.textContent = 'Thanks for using our Chatbot!';\n            lastMsg.classList.add('lastMessage');\n            document.body.appendChild(lastMsg)\n        }\n    }\n<\/script>\n\n\n\n<p><\/p>\n<div data-object_id=\"14745\" class=\"cbxwpbkmarkwrap cbxwpbkmarkwrap_no_cat cbxwpbkmarkwrap-post \"><a  data-redirect-url=\"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/posts\/14745\"  data-display-label=\"0\" data-show-count=\"0\" data-bookmark-label=\" \"  data-bookmarked-label=\" \"  data-loggedin=\"0\" data-type=\"post\" data-object_id=\"14745\" class=\"cbxwpbkmarktrig  cbxwpbkmarktrig-button-addto\" title=\"Bookmark This\" href=\"#\"><span class=\"cbxwpbkmarktrig-label\"  style=\"display:none;\" > <\/span><\/a> <div  data-type=\"post\" data-object_id=\"14745\" class=\"cbxwpbkmarkguestwrap\" id=\"cbxwpbkmarkguestwrap-14745\"><div class=\"cbxwpbkmarkguest-message\"><a href=\"#\" class=\"cbxwpbkmarkguesttrig_close\"><\/a><h3 class=\"cbxwpbookmark-title cbxwpbookmark-title-login\">Please login to bookmark<\/h3>\n\t\t<form name=\"loginform\" id=\"loginform\" action=\"https:\/\/aurelis.org\/blog\/wp-login.php\" method=\"post\">\n\t\t\t\n\t\t\t<p class=\"login-username\">\n\t\t\t\t<label for=\"user_login\">Username or Email Address<\/label>\n\t\t\t\t<input type=\"text\" name=\"log\" id=\"user_login\" class=\"input\" value=\"\" size=\"20\" \/>\n\t\t\t<\/p>\n\t\t\t<p class=\"login-password\">\n\t\t\t\t<label for=\"user_pass\">Password<\/label>\n\t\t\t\t<input type=\"password\" name=\"pwd\" id=\"user_pass\" class=\"input\" value=\"\" size=\"20\" \/>\n\t\t\t<\/p>\n\t\t\t\n\t\t\t<p class=\"login-remember\"><label><input name=\"rememberme\" type=\"checkbox\" id=\"rememberme\" value=\"forever\" \/> Remember Me<\/label><\/p>\n\t\t\t<p class=\"login-submit\">\n\t\t\t\t<input type=\"submit\" name=\"wp-submit\" id=\"wp-submit\" class=\"button button-primary\" value=\"Log In\" \/>\n\t\t\t\t<input type=\"hidden\" name=\"redirect_to\" value=\"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/posts\/14745\" \/>\n\t\t\t<\/p>\n\t\t\t\n\t\t<\/form><\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"<p>Here comes your possibility to interact with Wiki-Lisa, asking about any mind-related subjects in the vein of the AURELIS blog-wiki. Enjoy! Ask Wiki Lisa Hey! How can I assist you today?<\/p>\n<div data-object_id=\"14745\" class=\"cbxwpbkmarkwrap cbxwpbkmarkwrap_no_cat cbxwpbkmarkwrap-post \"><a  data-redirect-url=\"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/posts\/14745\"  data-display-label=\"0\" data-show-count=\"0\" data-bookmark-label=\" \"  data-bookmarked-label=\" \"  data-loggedin=\"0\" data-type=\"post\" data-object_id=\"14745\" class=\"cbxwpbkmarktrig  cbxwpbkmarktrig-button-addto\" title=\"Bookmark This\" href=\"#\"><span class=\"cbxwpbkmarktrig-label\"  style=\"display:none;\" > <\/span><\/a> <div  data-type=\"post\" data-object_id=\"14745\" class=\"cbxwpbkmarkguestwrap\" id=\"cbxwpbkmarkguestwrap-14745\"><div class=\"cbxwpbkmarkguest-message\"><a href=\"#\" class=\"cbxwpbkmarkguesttrig_close\"><\/a><h3 class=\"cbxwpbookmark-title cbxwpbookmark-title-login\">Please login to bookmark<\/h3>\n\t\t<form name=\"loginform\" id=\"loginform\" action=\"https:\/\/aurelis.org\/blog\/wp-login.php\" method=\"post\">\n\t\t\t\n\t\t\t<p class=\"login-username\">\n\t\t\t\t<label for=\"user_login\">Username or Email Address<\/label>\n\t\t\t\t<input type=\"text\" name=\"log\" id=\"user_login\" class=\"input\" value=\"\" size=\"20\" \/>\n\t\t\t<\/p>\n\t\t\t<p class=\"login-password\">\n\t\t\t\t<label for=\"user_pass\">Password<\/label>\n\t\t\t\t<input type=\"password\" name=\"pwd\" id=\"user_pass\" class=\"input\" value=\"\" size=\"20\" \/>\n\t\t\t<\/p>\n\t\t\t\n\t\t\t<p class=\"login-remember\"><label><input name=\"rememberme\" type=\"checkbox\" id=\"rememberme\" value=\"forever\" \/> Remember Me<\/label><\/p>\n\t\t\t<p class=\"login-submit\">\n\t\t\t\t<input type=\"submit\" name=\"wp-submit\" id=\"wp-submit\" class=\"button button-primary\" value=\"Log In\" \/>\n\t\t\t\t<input type=\"hidden\" name=\"redirect_to\" value=\"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/posts\/14745\" \/>\n\t\t\t<\/p>\n\t\t\t\n\t\t<\/form><\/div><\/div><\/div>","protected":false},"author":2,"featured_media":14749,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"spay_email":"","jetpack_publicize_message":""},"categories":[48],"tags":[],"jetpack_featured_media_url":"https:\/\/i1.wp.com\/aurelis.org\/blog\/wp-content\/uploads\/2024\/01\/2363.jpg?fit=960%2C373&ssl=1","jetpack_publicize_connections":[],"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p9Fdiq-3PP","jetpack-related-posts":[],"_links":{"self":[{"href":"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/posts\/14745"}],"collection":[{"href":"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/comments?post=14745"}],"version-history":[{"count":35,"href":"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/posts\/14745\/revisions"}],"predecessor-version":[{"id":15590,"href":"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/posts\/14745\/revisions\/15590"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/media\/14749"}],"wp:attachment":[{"href":"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/media?parent=14745"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/categories?post=14745"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/aurelis.org\/blog\/wp-json\/wp\/v2\/tags?post=14745"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}