QuickFix: minor adjustments to scroll, model selector, hawki cli

Author: Ariansdf

hawki

@@ -7,11 +7,17 @@
 
 // Define color constants
 define('GREEN', "\033[32m");
+define('BLUE', "\033[34m");
 define('RED', "\033[31m");
 define('YELLOW', "\033[33m");
 define('RESET', "\033[0m");
 define('BOLD', "\033[1m");
-
+define('LOGO', "
+▗▖ ▗▖ ▗▄▖ ▗▖ ▗▖▗▖ ▗▖▗▄▄▄▖
+▐▌ ▐▌▐▌ ▐▌▐▌ ▐▌▐▌▗▞▘  █
+▐▛▀▜▌▐▛▀▜▌▐▌ ▐▌▐▛▚▖   █
+▐▌ ▐▌▐▌ ▐▌▐▙█▟▌▐▌ ▐▌▗▄█▄▖
+");
 // Get the command argument
 $command = $argv[1] ?? 'help';
 $flags = array_slice($argv, 2);
@@ -84,7 +90,8 @@ switch ($command) {
 
 function showHelp() {
 
-    echo PHP_EOL;
+    echo PHP_EOL . BLUE . LOGO . RESET . PHP_EOL . PHP_EOL;
+
     echo BOLD . "HAWKI Command Line Utility" . RESET . PHP_EOL;
     echo "Usage: php hawki [command] [options]" . PHP_EOL . PHP_EOL;
     echo "Available commands:" . PHP_EOL;
@@ -275,8 +282,11 @@ function askForNextStep($nextStep){
 }
 
 function initialize() {
+
     echo BOLD . "Initializing HAWKI project..." . RESET . PHP_EOL;
 
+    echo PHP_EOL . BLUE . LOGO . RESET . PHP_EOL . PHP_EOL;
+
     // Check for .env file
     if (!file_exists('.env')) {
         if (file_exists('.env.example')) {

public/js_v2.0.1/chatlog_functions.js

@@ -376,7 +376,6 @@ function setModel(modelID = null){
 // Function to handle the auto-scroll behavior
 let scrollTimeout; // To clear timeout when scrolling
 function scrollToLast(forceScroll, targetElement = null) {
-
     const msgsPanel = document.querySelector('.chatlog .scroll-container');
     if (!msgsPanel) return;
 
@@ -393,21 +392,24 @@ function scrollToLast(forceScroll, targetElement = null) {
                 thread.classList.add('visible');
             }
 
+            const messageHeight = targetElement.offsetHeight;
             // Calculate position based on thread position and the message's position in thread
-            const messageTopOffset = targetElement.offsetTop;
+            const messageTopOffset = targetElement.offsetTop + messageHeight - (window.innerHeight - 200);
+
             const threadTopOffset = thread.offsetTop;
 
             // Position should include parent message position plus the position within the thread
             scrollTargetPosition =  threadTopOffset + messageTopOffset;
 
             // Add some padding to ensure message is fully visible
-            // scrollTargetPosition -= 60;
+            // scrollTargetPosition -= 100;
         } else {
-            // For main thread messages, just use their position
-            scrollTargetPosition = targetElement.offsetTop;
 
             // Add some padding to ensure message is fully visible
             const messageHeight = targetElement.offsetHeight;
+
+            // For main thread messages, just use their position
+            scrollTargetPosition = targetElement.offsetTop + messageHeight;
             if (messageHeight > msgsPanel.clientHeight / 2) {
                 // For tall messages, show the top
                 scrollTargetPosition -= 10;

public/js_v2.0.1/home_functions.js

@@ -151,7 +151,7 @@ document.addEventListener('click', function(event) {
 
 
 
-function openBurgerMenu(id, sender = null, alignToElement = false, isRelativeToElement = false){
+function openBurgerMenu(id, sender = null, alignToElement = false, isRelativeToElement = false, toggleOnSenderClick = false){
     let menu;
     if(isRelativeToElement){
         menu = sender.parentElement.querySelector(`#${id}`)
@@ -176,16 +176,20 @@ function openBurgerMenu(id, sender = null, alignToElement = false, isRelativeToE
     }
 
 
+    if(toggleOnSenderClick && menu.style.display != 'none'){
+        closeBurgerMenus(null);
+    }
+    else{
+        menu.style.display = `block`;
+        setTimeout(() => {
+            //add some buffer to the width
+            //without buffer bold text on hover changes menu width
+            const menuWidth = menu.getBoundingClientRect().width;
+            menu.style.width = `${menuWidth + 10}px`;
 
-    menu.style.display = `block`;
-    setTimeout(() => {
-        //add some buffer to the width
-        //without buffer bold text on hover changes menu width
-        const menuWidth = menu.getBoundingClientRect().width;
-        menu.style.width = `${menuWidth + 10}px`;
-
-        menu.style.opacity = `1`;
-    }, 50);
+            menu.style.opacity = `1`;
+        }, 50);
+    }
 }
 
 

resources/views/partials/home/input-field.blade.php

@@ -54,7 +54,7 @@
                         @include('partials.home.components.models-list')
                     </div>
 
-                    <div class="burger-btn-arrow burger-btn" onclick="openBurgerMenu('model-selector-burger', this, false, true)">
+                    <div class="burger-btn-arrow burger-btn" onclick="openBurgerMenu('model-selector-burger', this, false, true, true)">
                         <div class="icon">
                             <x-icon name="chevron-up"/>
                         </div>