In this guide, you will find instructions about Helpdesk virtual assistant.

The virtual assistant Tiksu is an artificial intelligence-based chatbot that is trained to answer questions based on this wiki.

Key Features:

Regular data reading and updating: the virtual assistant reads the Helpdesk wiki documentation once a day, checks the changes in the documents and saves the information in the system
Answer guide and style examples:
- if information is not found, refers to the home page of Helpdesk (suggests to contact Helpdesk)
- answers in the same language in which the question is asked
- adds a reference to several basic documents (can answer and refer to both English and Estonian wiki guides)
All questions and answers are stored anonymously in order to improve the quality of the service.

How to use

The virtual assistant is added on the front page of Helpdesk.

To open the chatbox, click the Need some help? button on the bottom-right of the screen.
Enter the question and press the button on the right.
The virtual assistant will answer the question with a reference after a few moments.

Leaving feedback

NB! Feedback is anonymous and stored in the database in order to develop the service.

For feedback, click on the bubble icon below the virtual assistant's response and leave feedback in the box.

<!-- Chat Button -->
<button id="openChatBtn" style="position: fixed; bottom: 20px; right: 20px; cursor: pointer; border: none; background: none; z-index: 1000;">
    <img id="chatAvatar" alt="Chat Avatar" width="160" height="84" />
</button>

<!-- Chat Container -->
<div id="chatContainer" style="position: fixed; bottom: 0; right: 0; width: 100%; max-width: 500px; height: 80vh; border: 1px solid #ccc; background-color: white; z-index: 1000; display: none; border-radius: 20px 20px 0px 0px;">
    <!-- Chat Header with Close Button -->
    <div style="background-color: #2C569B; padding: 10px; text-align: right; height: 50px; border-radius: 20px 20px 0 0; display: flex; align-items: center; justify-content: space-between;">
        <img src="https://demo.tehisintellekt.ee/ut/tiksu.png" alt="Logo" style="height: 46px; margin-left: 12px;">
        <button id="closeChatBtn" style="border: none; background: none; cursor: pointer; padding-right: 12px; display: flex; align-items: center;">
            <img src="https://demo.tehisintellekt.ee/ut/close_button.svg" alt="Close" />
        </button>
    </div>
    <!-- Chat iFrame -->
    <iframe id="chatIframe" src="https://demo.tehisintellekt.ee/ut/assistant" style="width: 100%; height: calc(100% - 70px); border: none; border-radius: 0 0 20px 20px;"></iframe>
</div>

<script>
    // Language resources
    const resources = {
        english: {
            avatar: "https://demo.tehisintellekt.ee/ut/need_some_help.svg",
        },
        estonian: {
            avatar: "https://demo.tehisintellekt.ee/ut/kas_vajad_abi.svg",
        },
    };

    // Get elements
    const chatAvatar = document.getElementById('chatAvatar');

    // Function to set language based on referrer URL
    function setLanguage() {
        if (typeof window !== "undefined") {
            console.log("Referrer URL:", document.referrer);
            if (window.location.href.startsWith("https://wiki.ut.ee/display/IT") || 
                window.location.href.startsWith("https://wiki-test.ut.ee/display/IT")) {
                // Set English
                chatAvatar.src = resources.english.avatar;
            } else {
                // Set Estonian
                chatAvatar.src = resources.estonian.avatar;
            }
        }
    }

    // Initialize the language
    setLanguage();

    // Open Chat
    document.getElementById('openChatBtn').addEventListener('click', function() {
        document.getElementById('chatContainer').style.display = 'block';
    });

    // Close Chat
    document.getElementById('closeChatBtn').addEventListener('click', function() {
        document.getElementById('chatContainer').style.display = 'none';
    });
</script>