Upgraded ui

configs/config.yaml

@@ -1,5 +1,9 @@
 # =================== Lord Of Large Language Multimodal Systems Configuration file =========================== 
-version: 140
+version: 141
+
+# video viewing and news recovering
+last_viewed_video: null
+
 binding_name: null
 model_name: null
 model_variant: null

endpoints/libraries/lollms_client_js.js

@@ -126,7 +126,7 @@ class LollmsClient {
   updateServerAddress(newAddress) {
       this.serverAddress = newAddress;
     }    
-  async tokenize(prompt) {
+  async tokenize(prompt, return_named=false) {
       /**
        * Tokenizes the given prompt using the model's tokenizer.
        *
@@ -134,17 +134,17 @@ class LollmsClient {
        * @returns {Array} A list of tokens representing the tokenized prompt.
        */
       console.log("Tokenizing",prompt)
-      const output = await axios.post("/lollms_tokenize", {"prompt": prompt});
+      const output = await axios.post("/lollms_tokenize", {"prompt": prompt, "return_named": return_named});
       return output.data.named_tokens
     }
-  async detokenize(tokensList) {
+  async detokenize(tokensList, return_named=false) {
       /**
        * Detokenizes the given list of tokens using the model's tokenizer.
        *
        * @param {Array} tokensList - A list of tokens to be detokenized.
        * @returns {string} The detokenized text as a string.
        */
-      const output = await axios.post("/lollms_detokenize", {"tokens": tokensList});
+      const output = await axios.post("/lollms_detokenize", {"tokens": tokensList, "return_named": return_named});
       console.log(output.data.text)
       return output.data.text
   }

endpoints/lollms_webui_infos.py

@@ -10,7 +10,7 @@ description:
 """
 
 from fastapi import APIRouter, Request
-from pydantic import BaseModel
+from pydantic import BaseModel, Field
 import pkg_resources
 from lollms_webui import LOLLMSWebUI
 from ascii_colors import ASCIIColors
@@ -27,6 +27,10 @@ import time
 lollmsElfServer:LOLLMSWebUI = LOLLMSWebUI.get_instance()
 router = APIRouter()
 
+class LastViewedVideoUrlRequest(BaseModel):
+    client_id: str  = Field(...)
+    last_viewed_video_url: str = Field(..., description="Last viewed model")
+
 
 @router.get("/get_versionID")
 async def get_lollms_version():
@@ -49,14 +53,45 @@ async def get_lollms_version():
     base_path = Path(__file__).parent
     infos = base_path/"news"/"current.html"
     return infos.read_text(encoding="utf8")
+from pathlib import Path
+import json
 
 @router.get("/get_last_video_url")
+async def get_last_video_url():
+    """Get the URL and type of the last video."""
+    base_path = Path(__file__).parent
+    info_file = base_path / "news" / "latest_video.json"
+    
+    try:
+        with open(info_file, 'r', encoding='utf-8') as file:
+            video_info = json.load(file)
+        
+        return {
+            "url": video_info["url"],
+            "type": video_info["type"]
+        }
+    except FileNotFoundError:
+        return {"error": "Video information not found"}
+    except json.JSONDecodeError:
+        return {"error": "Invalid JSON format in the video information file"}
+    except KeyError as e:
+        return {"error": f"Missing key in JSON: {str(e)}"}
+
+
+@router.get("/get_last_viewed_video_url")
 async def get_last_video_url():
     """Get the URL of the last video."""
     # This is a static URL for demonstration purposes
-    base_path = Path(__file__).parent
+    return lollmsElfServer.config.last_viewed_video
-    infos = base_path/"news"/"latest_video.txt"
+
-    return infos.read_text(encoding="utf8")
+
+@router.post("/set_last_viewed_video_url")
+async def set_last_video_url(req:LastViewedVideoUrlRequest):
+    """Get the URL of the last video."""
+    # This is a static URL for demonstration purposes
+    check_access(lollmsElfServer,req.client_id)
+    lollmsElfServer.config.last_viewed_video = req.last_viewed_video_url
+    lollmsElfServer.config.save_config()
 
 @router.get("/get_themes")
 async def get_themes():

endpoints/news/latest_video.json

@@ -0,0 +1,4 @@
+{
+    "url":"https://www.youtube.com/watch?v=VNzgvCXSjq4&ab_channel=ParisNeo",
+    "type":"music"
+}

endpoints/news/latest_video.txt

@@ -1 +0,0 @@
-https://youtu.be/7HrXF_Y_f5c

web/dist/index.html

@@ -6,8 +6,8 @@
     <script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js"></script>
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>LoLLMS WebUI</title>
-    <script type="module" crossorigin src="/assets/index-C_G9-j_h.js"></script>
+    <script type="module" crossorigin src="/assets/index-DarecFUp.js"></script>
-    <link rel="stylesheet" crossorigin href="/assets/index-DBWXZ2MB.css">
+    <link rel="stylesheet" crossorigin href="/assets/index-p7Rdmrpr.css">
   </head>
   <body>
     <div id="app"></div>

web/src/components/WelcomeComponent.vue

@@ -40,7 +40,11 @@
     <div v-if="showVideoButton" class="floating-button-container">
       <a :href="videoUrl" target="_blank" class="floating-button" @click="handleClick">
         <span class="tooltip">New ParisNeo Video!</span>
-        <img src="/play_video.png" alt="New Video" class="w-full h-full object-cover">
+        <img 
+          :src="getImageForVideoType" 
+          :alt="'New ' + videoType" 
+          class="w-full h-full object-cover"
+        >
       </a>
     </div>
   </div>
@@ -55,6 +59,7 @@ export default {
   data() {
     return {
       videoUrl: "",
+      videoType: "",
       latestNews: "",
       error: "",
       showVideoButton: false,
@@ -62,6 +67,20 @@ export default {
     }
   },
   computed: {
+    getImageForVideoType() {
+      switch (this.videoType.toLowerCase()) {
+        case 'podcast':
+          return '/podcast.png';
+        case 'music':
+          return '/music.png';
+        case 'movie':
+          return '/movie.png';
+        case 'tutorial':
+          return '/tutorial.png';
+        default:
+          return '/play_video.png'; // fallback to default image
+      }
+    },    
     logoSrc() {
       if (!this.$store.state.config) return storeLogo
       return this.$store.state.config.app_custom_logo 
@@ -72,37 +91,41 @@ export default {
   methods: {
     async fetchLatestNews() {
       try {
-        const response = await axios.get('/get_news')
+        const response = await axios.get('/get_news');
-        this.latestNews = response.data
+        this.latestNews = response.data;
       } catch (err) {
-        console.error('Failed to fetch latest news:', err)
+        console.error('Failed to fetch latest news:', err);
-        this.error = 'Unable to fetch the latest news. Please try again later.'
+        this.error = 'Unable to fetch the latest news. Please try again later.';
       }
     },
     async fetchVideoUrl() {
       try {
-        const response = await axios.get('/get_last_video_url')
+        const response = await axios.get('/get_last_video_url');
-        this.videoUrl = response.data
+        this.videoUrl = response.data.url;
-        this.checkVideoUpdate()
+        this.videoType = response.data.type;
+        this.checkVideoUpdate();
       } catch (err) {
-        console.error('Failed to fetch video URL:', err)
+        console.error('Failed to fetch video information:', err);
-        this.error = 'Unable to fetch the latest video URL. Please try again later.'
+        this.error = 'Unable to fetch the latest video information. Please try again later.';
       }
     },
-    handleClick() {
+    async handleClick() {
-      localStorage.setItem('lastVideoUrl', this.videoUrl)
+      await axios.post("/set_last_viewed_video_url",{client_id:this.$store.state.client_id, last_viewed_video_url:this.videoUrl});
-      this.showVideoButton = false
+      this.showVideoButton = false;
     },
-    checkVideoUpdate() {
+    async checkVideoUpdate() {
-      const storedVideoUrl = localStorage.getItem('lastVideoUrl')
+      const response = await axios.get("/get_last_viewed_video_url");
+      const storedVideoUrl = response.data
+      console.log("storedVideoUrl");
+      console.log(storedVideoUrl);
       if (this.videoUrl !== storedVideoUrl) {
-        this.showVideoButton = true
+        this.showVideoButton = true;
       }
     }
   },
   mounted() {
-    this.fetchLatestNews()
+    this.fetchLatestNews();
-    this.fetchVideoUrl()
+    this.fetchVideoUrl();
   }
 }
 </script>

web/src/views/DiscussionsView.vue

@@ -1262,7 +1262,10 @@ export default {
         return {
             interestingFacts: [
                 "ParisNeo, the creator of LoLLMs, originally built his high-performance PC to play Cyberpunk 2077. However, his passion for AI took an unexpected turn, leading him to develop LoLLMs instead. Ironically, he never found the time to actually play the game that inspired his powerful setup!",
-                "Saïph, the new version of LoLLMs, is named after a star in Orion's constellation (Kappa Orionis), representing bright guidance in AI!",
+                "Saïph, version 14 of LoLLMs, is named after a star in Orion's constellation (Kappa Orionis), representing bright guidance in AI!",
+                "At 12, ParisNeo coded 'Saif14' in BASIC on a Tandy 1000, an 'all-in-one' suite named with a friend. LoLLMs v14 'Saïph' - a star in Orion - echoes this BASIC creation's spirit and hints at OpenAI's future.",
+                "The new AI Village app in LoLLMs, simulating AI agents believing they're human, mirrors \"The Hitchhiker's Guide to the Galaxy\" (ParisNeo's favorite) where Earth was a simulation to compute the Ultimate Question. Both explore the idea of unsuspecting inhabitants participating in a grand cosmic calculation!",
+                "Once upon a time, young ParisNeo dove so deep into \"The Matrix\" that he watched it 60 times in two months, practically becoming a human DVD player! Fast forward to today, and this same Matrix-obsessed kid grew up to create LoLLMs, where AI personas are like digital kung-fu masters, and users are the chosen ones. Talk about life imitating art - ParisNeo went from \"I know kung fu\" to \"I code AI\"! Who knew binge-watching could lead to bending the rules of AI reality?",
                 "Did you know? The first computer programmer was a woman - Ada Lovelace!",
                 "Large Language Models (LLMs) have evolved from having millions of parameters to hundreds of billions in just a few years.",
                 "LoLLMs (Lord of Large Language Multimodal Systems) is an open-source AI assistant platform created by ParisNeo.",