diff --git a/visual-retrieval-colpali/frontend/app.py b/visual-retrieval-colpali/frontend/app.py index 5e5e89587..ebe239db4 100644 --- a/visual-retrieval-colpali/frontend/app.py +++ b/visual-retrieval-colpali/frontend/app.py @@ -235,6 +235,45 @@ def Home(): ) +def WhatIsThis(): + return Div( + Div( + Div( + H1( + "Vespa.ai + ColPali", + cls="text-5xl font-bold tracking-wide md:tracking-wider", + ), + P( + "Efficient Document Retrieval with Vision Language Models", + cls="text-lg text-muted-foreground md:tracking-wide", + ), + Div( + Img( + src="/static/img/vespa-colpali.png", + alt="Vespa and ColPali", + cls="object-contain h-[377px]", + ), + cls="grid justify-center", + ), + Div( + P( + "This is a demo application showcasing the integration of Vespa.ai and ColPali for visual retrieval of documents.", + cls="text-base", + ), + P( + "The application uses a combination of neural networks and traditional search algorithms to retrieve relevant documents based on visual and textual queries.", + cls="text-base", + ), + cls="grid gap-2 text-center", + ), + cls="grid gap-5 text-center", + ), + cls="grid gap-8 content-start mt-[8vh]", + ), + cls="grid w-full h-full max-w-screen-md gap-4 mx-auto", + ) + + def Search(request, search_results=[]): query_value = request.query_params.get("query", "").strip() ranking_value = request.query_params.get("ranking", "nn+colpali") diff --git a/visual-retrieval-colpali/frontend/layout.py b/visual-retrieval-colpali/frontend/layout.py index f7f5bdd8f..448f11727 100644 --- a/visual-retrieval-colpali/frontend/layout.py +++ b/visual-retrieval-colpali/frontend/layout.py @@ -107,6 +107,11 @@ def ThemeToggle(variant="ghost", cls=None, **kwargs): def Links(): return Nav( + A( + Button("What's this?", variant="link"), + href="/what-is-this", + ), + Separator(orientation="vertical"), A( Button(Lucide(icon="github"), size="icon", variant="ghost"), href="https://github.com/vespa-engine/vespa", @@ -119,7 +124,7 @@ def Links(): ), Separator(orientation="vertical"), ThemeToggle(), - cls="flex items-center space-x-3", + cls="flex items-center space-x-2", ) diff --git a/visual-retrieval-colpali/icons.py b/visual-retrieval-colpali/icons.py index df914e54f..18c5b9743 100644 --- a/visual-retrieval-colpali/icons.py +++ b/visual-retrieval-colpali/icons.py @@ -1 +1 @@ -ICONS = {"chevrons-right": "", "moon": "", "sun": "", "github": "", "slack": "", "settings": "", "arrow-right": "", "search": "", "file-search": "", "message-circle-question": "", "text-search": "", "maximize": "", "expand": "", "fullscreen": "", "images": "", "circle": "", "loader-circle": "", "file-text": ""} \ No newline at end of file +ICONS = {"chevrons-right": "", "moon": "", "sun": "", "github": "", "slack": "", "settings": "", "arrow-right": "", "search": "", "file-search": "", "message-circle-question": "", "text-search": "", "maximize": "", "expand": "", "fullscreen": "", "images": "", "circle": "", "loader-circle": "", "file-text": "", "file-question": ""} \ No newline at end of file diff --git a/visual-retrieval-colpali/main.py b/visual-retrieval-colpali/main.py index 7c9800c81..4ae55d0a0 100644 --- a/visual-retrieval-colpali/main.py +++ b/visual-retrieval-colpali/main.py @@ -6,6 +6,7 @@ import time from concurrent.futures import ThreadPoolExecutor from functools import partial +from pathlib import Path import google.generativeai as genai from fasthtml.common import * @@ -20,7 +21,6 @@ is_special_token, ) from backend.modelmanager import ModelManager -from pathlib import Path from backend.vespa_app import VespaQueryClient from frontend.app import ( ChatResult, @@ -30,6 +30,7 @@ SearchResult, SimMapButtonPoll, SimMapButtonReady, + WhatIsThis, ) from frontend.layout import Layout @@ -124,6 +125,11 @@ def get(): return Layout(Main(Home())) +@rt("/what-is-this") +def get(): + return Layout(Main(WhatIsThis())) + + @rt("/search") def get(request): # Extract the 'query' and 'ranking' parameters from the URL diff --git a/visual-retrieval-colpali/output.css b/visual-retrieval-colpali/output.css index 50469138a..b5b74753c 100644 --- a/visual-retrieval-colpali/output.css +++ b/visual-retrieval-colpali/output.css @@ -809,6 +809,14 @@ body { margin-top: 13vh; } +.mt-\[8vh\] { + margin-top: 8vh; +} + +.mt-\[5vh\] { + margin-top: 5vh; +} + .block { display: block; } @@ -841,6 +849,10 @@ body { aspect-ratio: 1 / 1; } +.aspect-auto { + aspect-ratio: auto; +} + .size-4 { width: 1rem; height: 1rem; @@ -919,6 +931,14 @@ body { height: 1px; } +.h-\[377px\] { + height: 377px; +} + +.h-\[610px\] { + height: 610px; +} + .max-h-96 { max-height: 24rem; } @@ -983,6 +1003,14 @@ body { width: 100%; } +.w-\[377px\] { + width: 377px; +} + +.w-\[233px\] { + width: 233px; +} + .min-w-0 { min-width: 0px; } @@ -1592,6 +1620,11 @@ body { line-height: 1rem; } +.text-4xl { + font-size: 2.25rem; + line-height: 2.5rem; +} + .font-bold { font-weight: 700; } @@ -2652,6 +2685,11 @@ aside { line-height: 1; } + .md\:text-xl { + font-size: 1.25rem; + line-height: 1.75rem; + } + .md\:tracking-wide { letter-spacing: 0.025em; } diff --git a/visual-retrieval-colpali/static/img/carbon.png b/visual-retrieval-colpali/static/img/carbon.png deleted file mode 100644 index 50cbbae06..000000000 Binary files a/visual-retrieval-colpali/static/img/carbon.png and /dev/null differ diff --git a/visual-retrieval-colpali/static/img/energy.png b/visual-retrieval-colpali/static/img/energy.png deleted file mode 100644 index 6b9407a4e..000000000 Binary files a/visual-retrieval-colpali/static/img/energy.png and /dev/null differ diff --git a/visual-retrieval-colpali/static/img/sustainability.png b/visual-retrieval-colpali/static/img/sustainability.png deleted file mode 100644 index 72e7d86ae..000000000 Binary files a/visual-retrieval-colpali/static/img/sustainability.png and /dev/null differ diff --git a/visual-retrieval-colpali/static/img/vespa-colpali.png b/visual-retrieval-colpali/static/img/vespa-colpali.png new file mode 100644 index 000000000..43dd17701 Binary files /dev/null and b/visual-retrieval-colpali/static/img/vespa-colpali.png differ