mirror of
https://github.com/khoaliber/khoj.git
synced 2026-03-07 21:29:13 +00:00
Add About page for Khoj to Desktop app. Expose it via system tray
- Pass current khoj version from package.json to about page via electron IPC between backend js and frontend page - Update Khoj information in default About screen as well, in case it's exposed anywhere else
This commit is contained in:
Debanjum Singh Solanky
88
src/interface/desktop/about.html
Normal file
88
src/interface/desktop/about.html
Normal file
@@ -0,0 +1,88 @@
|
|||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0 maximum-scale=1.0">
|
||||||
|
<title>Khoj - About</title>
|
||||||
|
|
||||||
|
<link rel="icon" type="image/png" sizes="128x128" href="./assets/icons/favicon-128x128.png">
|
||||||
|
<link rel="manifest" href="/static/khoj_chat.webmanifest">
|
||||||
|
<link rel="stylesheet" href="./assets/khoj.css">
|
||||||
|
</head>
|
||||||
|
<script type="text/javascript" src="./utils.js"></script>
|
||||||
|
<style>
|
||||||
|
html, body {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0px;
|
||||||
|
margin: 0px;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
display: grid;
|
||||||
|
grid-template-rows: auto;
|
||||||
|
background: var(--background-color);
|
||||||
|
color: var(--main-text-color);
|
||||||
|
text-align: center;
|
||||||
|
font-family: roboto, karma, segoe ui, sans-serif;
|
||||||
|
font-size: small;
|
||||||
|
font-weight: 300;
|
||||||
|
line-height: 1.5em;
|
||||||
|
}
|
||||||
|
header > *,
|
||||||
|
body > * {
|
||||||
|
padding: 0px;
|
||||||
|
margin: 0px;
|
||||||
|
}
|
||||||
|
header > * {
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
margin-top: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
#about-page-version {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
display: block;
|
||||||
|
width: 60%;
|
||||||
|
padding: 10px 16px;
|
||||||
|
margin: 10px auto;
|
||||||
|
background-color: var(--primary);
|
||||||
|
border: none;
|
||||||
|
border-radius: 8px;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background-color 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button:hover {
|
||||||
|
background-color: var(--primary-hover);
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
font-size: 10px;
|
||||||
|
color: slategray;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<img id="logo" src="./assets/icons/favicon-128x128.png" alt="Khoj Logo">
|
||||||
|
<p id="about-page-title"><b>Khoj for Desktop</b>
|
||||||
|
<p id="about-page-version"></p>
|
||||||
|
</header>
|
||||||
|
<div class="action">
|
||||||
|
<button class="button" onclick="window.open('https://khoj.dev/terms-of-service', '_blank')">Terms of Service</button>
|
||||||
|
<button class="button" onclick="window.open('https://khoj.dev/privacy-policy', '_blank')">Privacy Policy</button>
|
||||||
|
</div>
|
||||||
|
<footer>
|
||||||
|
© 2023 Khoj Inc. All rights reserved.
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -1,5 +1,6 @@
|
|||||||
const { app, BrowserWindow, ipcMain, Tray, Menu, nativeImage } = require('electron');
|
const { app, BrowserWindow, ipcMain, Tray, Menu, nativeImage, shell } = require('electron');
|
||||||
const todesktop = require("@todesktop/runtime");
|
const todesktop = require("@todesktop/runtime");
|
||||||
|
const khojPackage = require('./package.json');
|
||||||
|
|
||||||
todesktop.init();
|
todesktop.init();
|
||||||
|
|
||||||
@@ -390,11 +391,12 @@ app.whenReady().then(() => {
|
|||||||
|
|
||||||
app.setAboutPanelOptions({
|
app.setAboutPanelOptions({
|
||||||
applicationName: "Khoj",
|
applicationName: "Khoj",
|
||||||
applicationVersion: "0.0.1",
|
applicationVersion: khojPackage.version,
|
||||||
version: "0.0.1",
|
version: khojPackage.version,
|
||||||
authors: "Khoj Team",
|
authors: "Saba Imran, Debanjum Singh Solanky and contributors",
|
||||||
website: "https://khoj.dev",
|
website: "https://khoj.dev",
|
||||||
iconPath: path.join(__dirname, 'assets', 'khoj.png')
|
copyright: "GPL v3",
|
||||||
|
iconPath: path.join(__dirname, 'assets', 'icons', 'favicon-128x128.png')
|
||||||
});
|
});
|
||||||
|
|
||||||
app.on('ready', async() => {
|
app.on('ready', async() => {
|
||||||
@@ -418,6 +420,43 @@ app.on('window-all-closed', () => {
|
|||||||
if (process.platform !== 'darwin') app.quit()
|
if (process.platform !== 'darwin') app.quit()
|
||||||
})
|
})
|
||||||
|
|
||||||
|
/*
|
||||||
|
** About Page
|
||||||
|
*/
|
||||||
|
|
||||||
|
let aboutWindow;
|
||||||
|
|
||||||
|
function openAboutWindow() {
|
||||||
|
if (aboutWindow) { aboutWindow.focus(); return; }
|
||||||
|
|
||||||
|
aboutWindow = new BrowserWindow({
|
||||||
|
width: 400,
|
||||||
|
height: 400,
|
||||||
|
titleBarStyle: 'hidden',
|
||||||
|
show: false,
|
||||||
|
webPreferences: {
|
||||||
|
preload: path.join(__dirname, 'preload.js'),
|
||||||
|
nodeIntegration: true,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
aboutWindow.loadFile('about.html');
|
||||||
|
|
||||||
|
// Pass OS, Khoj version to About page
|
||||||
|
aboutWindow.webContents.on('did-finish-load', () => {
|
||||||
|
aboutWindow.webContents.send('appInfo', { version: khojPackage.version, platform: process.platform });
|
||||||
|
});
|
||||||
|
|
||||||
|
// Open links in external browser
|
||||||
|
aboutWindow.webContents.setWindowOpenHandler(({ url }) => {
|
||||||
|
shell.openExternal(url);
|
||||||
|
return { action: 'deny' };
|
||||||
|
});
|
||||||
|
|
||||||
|
aboutWindow.once('ready-to-show', () => { aboutWindow.show(); });
|
||||||
|
aboutWindow.on('closed', () => { aboutWindow = null; });
|
||||||
|
}
|
||||||
|
|
||||||
/*
|
/*
|
||||||
** System Tray Icon
|
** System Tray Icon
|
||||||
*/
|
*/
|
||||||
@@ -441,6 +480,7 @@ app.whenReady().then(() => {
|
|||||||
{ label: 'Search', type: 'normal', click: () => { openWindow('search.html') }},
|
{ label: 'Search', type: 'normal', click: () => { openWindow('search.html') }},
|
||||||
{ label: 'Configure', type: 'normal', click: () => { openWindow('config.html') }},
|
{ label: 'Configure', type: 'normal', click: () => { openWindow('config.html') }},
|
||||||
{ type: 'separator' },
|
{ type: 'separator' },
|
||||||
|
{ label: 'About Khoj', type: 'normal', click: () => { openAboutWindow(); } },
|
||||||
{ label: 'Quit', type: 'normal', click: () => { app.quit() } }
|
{ label: 'Quit', type: 'normal', click: () => { app.quit() } }
|
||||||
])
|
])
|
||||||
|
|
||||||
|
|||||||
@@ -52,3 +52,7 @@ contextBridge.exposeInMainWorld('tokenAPI', {
|
|||||||
setToken: (token) => ipcRenderer.invoke('setToken', token),
|
setToken: (token) => ipcRenderer.invoke('setToken', token),
|
||||||
getToken: () => ipcRenderer.invoke('getToken')
|
getToken: () => ipcRenderer.invoke('getToken')
|
||||||
})
|
})
|
||||||
|
|
||||||
|
contextBridge.exposeInMainWorld('appInfoAPI', {
|
||||||
|
getInfo: (callback) => ipcRenderer.on('appInfo', callback)
|
||||||
|
})
|
||||||
|
|||||||
@@ -12,3 +12,15 @@ I am ✨Khoj✨, your open-source, personal AI copilot.
|
|||||||
See my source code at https://github.com/khoj-ai/khoj
|
See my source code at https://github.com/khoj-ai/khoj
|
||||||
Read my operating manual at https://docs.khoj.dev
|
Read my operating manual at https://docs.khoj.dev
|
||||||
`);
|
`);
|
||||||
|
|
||||||
|
|
||||||
|
window.appInfoAPI.getInfo((_, info) => {
|
||||||
|
let khojVersionElement = document.getElementById("about-page-version");
|
||||||
|
if (khojVersionElement) {
|
||||||
|
khojVersionElement.innerHTML = `<code>${info.version}</code>`;
|
||||||
|
}
|
||||||
|
let khojTitleElement = document.getElementById("about-page-title");
|
||||||
|
if (khojTitleElement) {
|
||||||
|
khojTitleElement.innerHTML = '<b>Khoj for ' + (info.platform === 'win32' ? 'Windows' : info.platform === 'darwin' ? 'macOS' : 'Linux') + '</b>';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user