sidebar: segcyer api stuff

let me cook
This commit is contained in:
end-4
2024-03-17 00:18:59 +07:00
parent 46642ba4b1
commit 9b69a38c74
9 changed files with 70 additions and 76 deletions
+5 -1
View File
@@ -1,3 +1,4 @@
const { GLib } = imports.gi;
import * as Utils from 'resource:///com/github/Aylur/ags/utils.js';
const { execAsync, exec } = Utils;
@@ -6,6 +7,9 @@ export const isDebianDistro = (distroID == 'linuxmint' || distroID == 'ubuntu' |
export const isArchDistro = (distroID == 'arch' || distroID == 'endeavouros' || distroID == 'cachyos');
export const hasFlatpak = !!exec(`bash -c 'command -v flatpak'`);
const LIGHTDARK_FILE_LOCATION = `${GLib.get_user_cache_dir()}/ags/user/colormode.txt`;
export let darkMode = !(Utils.readFile(LIGHTDARK_FILE_LOCATION).trim() == '-l');
export const getDistroIcon = () => {
// Arches
if(distroID == 'arch') return 'arch-symbolic';
@@ -40,4 +44,4 @@ export const getDistroName = () => {
if(distroID == 'raspbian') return 'Raspbian';
if(distroID == 'kali') return 'Kali Linux';
return 'Linux';
}
}
@@ -1,4 +1,4 @@
const { Gdk, GdkPixbuf, GLib, Gtk } = imports.gi;
const { GLib } = imports.gi;
import App from 'resource:///com/github/Aylur/ags/app.js';
import Widget from 'resource:///com/github/Aylur/ags/widget.js';
import * as Utils from 'resource:///com/github/Aylur/ags/utils.js';
@@ -9,10 +9,9 @@ const { Box, EventBox, Icon, Scrollable, Label, Button, Revealer } = Widget;
import { fileExists } from '../.miscutils/files.js';
import { AnimatedCircProg } from "../.commonwidgets/cairo_circularprogress.js";
import { showMusicControls } from '../../variables.js';
import { darkMode } from '../.miscutils/system.js';
const COMPILED_STYLE_DIR = `${GLib.get_user_cache_dir()}/ags/user/generated`
const LIGHTDARK_FILE_LOCATION = `${GLib.get_user_cache_dir()}/ags/user/colormode.txt`;
const lightDark = Utils.readFile(LIGHTDARK_FILE_LOCATION).trim();
const COVER_COLORSCHEME_SUFFIX = '_colorscheme.css';
var lastCoverPath = '';
@@ -181,7 +180,7 @@ const CoverArt = ({ player, ...rest }) => {
}
const coverPath = player.coverPath;
const stylePath = `${player.coverPath}${lightDark}${COVER_COLORSCHEME_SUFFIX}`;
const stylePath = `${player.coverPath}${darkMode ? '' : '-l'}${COVER_COLORSCHEME_SUFFIX}`;
if (player.coverPath == lastCoverPath) { // Since 'notify::cover-path' emits on cover download complete
Utils.timeout(200, () => {
// self.attribute.showImage(self, coverPath);
@@ -200,9 +199,9 @@ const CoverArt = ({ player, ...rest }) => {
// Generate colors
execAsync(['bash', '-c',
`${App.configDir}/scripts/color_generation/generate_colors_material.py --path '${coverPath}' > ${App.configDir}/scss/_musicmaterial.scss ${lightDark}`])
`${App.configDir}/scripts/color_generation/generate_colors_material.py --path '${coverPath}' > ${App.configDir}/scss/_musicmaterial.scss ${darkMode ? '' : '-l'}`])
.then(() => {
exec(`wal -i "${player.coverPath}" -n -t -s -e -q ${lightDark}`)
exec(`wal -i "${player.coverPath}" -n -t -s -e -q ${darkMode ? '' : '-l'}`)
exec(`cp ${GLib.get_user_cache_dir()}/wal/colors.scss ${App.configDir}/scss/_musicwal.scss`);
exec(`sass ${App.configDir}/scss/_music.scss ${stylePath}`);
Utils.timeout(200, () => {
@@ -283,19 +283,15 @@ export const ChatMessage = (message, modelName = 'Model') => {
const messageContentBox = MessageContent(message.content);
const thisMessage = Box({
className: 'sidebar-chat-message',
homogeneous: true,
children: [
Box({
className: `sidebar-chat-indicator ${message.role == 'user' ? 'sidebar-chat-indicator-user' : 'sidebar-chat-indicator-bot'}`,
}),
Box({
vertical: true,
hpack: 'fill',
hexpand: true,
children: [
Label({
hpack: 'fill',
hpack: 'start',
xalign: 0,
className: 'txt txt-bold sidebar-chat-name',
className: `txt txt-bold sidebar-chat-name sidebar-chat-name-${message.role == 'user' ? 'user' : 'bot'}`,
wrap: true,
useMarkup: true,
label: (message.role == 'user' ? USERNAME : modelName),
@@ -324,17 +320,13 @@ export const SystemMessage = (content, commandName, scrolledWindow) => {
const thisMessage = Box({
className: 'sidebar-chat-message',
children: [
Box({
className: `sidebar-chat-indicator sidebar-chat-indicator-System`,
}),
Box({
vertical: true,
hpack: 'fill',
hexpand: true,
children: [
Label({
xalign: 0,
className: 'txt txt-bold sidebar-chat-name',
hpack: 'start',
className: 'txt txt-bold sidebar-chat-name sidebar-chat-name-system',
wrap: true,
label: `System • ${commandName}`,
}),
+14 -20
View File
@@ -204,9 +204,6 @@ const BooruPage = (taglist) => {
overlays: [imageActions]
})
}
const colorIndicator = Box({
className: `sidebar-chat-indicator`,
});
const downloadState = Stack({
homogeneous: false,
transition: 'slide_up_down',
@@ -233,7 +230,7 @@ const BooruPage = (taglist) => {
hscroll: 'automatic',
child: Box({
hpack: 'fill',
className: 'sidebar-waifu-content spacing-h-5',
className: 'spacing-h-5',
children: [
...taglist.map((tag) => CommandButton(tag)),
Box({ hexpand: true }),
@@ -246,8 +243,7 @@ const BooruPage = (taglist) => {
const pageImageGrid = Grid({
// columnHomogeneous: true,
// rowHomogeneous: true,
className: 'sidebar-waifu-image',
// css: 'min-height: 90px;'
className: 'sidebar-booru-imagegrid',
});
const pageImageRevealer = Revealer({
transition: 'slide_down',
@@ -256,6 +252,7 @@ const BooruPage = (taglist) => {
child: pageImageGrid,
});
const thisPage = Box({
homogeneous: true,
className: 'sidebar-chat-message',
attribute: {
'imagePath': '',
@@ -289,20 +286,17 @@ const BooruPage = (taglist) => {
downloadIndicator.attribute.hide();
},
},
children: [
colorIndicator,
Box({
vertical: true,
className: 'spacing-v-5',
children: [
pageHeading,
Box({
vertical: true,
children: [pageImageRevealer],
})
]
})
],
children: [Box({
vertical: true,
className: 'spacing-v-5',
children: [
pageHeading,
Box({
vertical: true,
children: [pageImageRevealer],
})
]
})],
});
return thisPage;
}
+1 -1
View File
@@ -247,7 +247,7 @@ const GPTWelcome = () => Box({
});
export const chatContent = Box({
className: 'spacing-v-15',
className: 'spacing-v-5',
vertical: true,
setup: (self) => self
.hook(GPTService, (box, id) => {
+1 -1
View File
@@ -151,7 +151,7 @@ const geminiWelcome = Box({
});
export const chatContent = Box({
className: 'spacing-v-15',
className: 'spacing-v-5',
vertical: true,
setup: (self) => self
.hook(GeminiService, (box, id) => {
+3 -9
View File
@@ -11,6 +11,7 @@ import { MaterialIcon } from '../../.commonwidgets/materialicon.js';
import { MarginRevealer } from '../../.widgethacks/advancedrevealers.js';
import { setupCursorHover, setupCursorHoverInfo } from '../../.widgetutils/cursorhover.js';
import WaifuService from '../../../services/waifus.js';
import { darkMode } from '../../.miscutils/system.js';
async function getImageViewerApp(preferredApp) {
Utils.execAsync(['bash', '-c', `command -v ${preferredApp}`])
@@ -117,9 +118,6 @@ const WaifuImage = (taglist) => {
onClicked: action,
setup: setupCursorHover,
})
const colorIndicator = Box({
className: `sidebar-chat-indicator`,
});
const downloadState = Stack({
homogeneous: false,
transition: 'slide_up_down',
@@ -139,7 +137,7 @@ const WaifuImage = (taglist) => {
});
const blockHeading = Box({
hpack: 'fill',
className: 'sidebar-waifu-content spacing-h-5',
className: 'spacing-h-5',
children: [
...taglist.map((tag) => CommandButton(tag)),
Box({ hexpand: true }),
@@ -248,14 +246,10 @@ const WaifuImage = (taglist) => {
else Utils.execAsync(['bash', '-c', `wget -O '${thisBlock.attribute.imagePath}' '${url}'`])
.then(showImage)
.catch(print);
blockHeading.get_children().forEach((child) => {
child.setCss(`border-color: ${dominant_color};`);
})
colorIndicator.css = `background-color: ${dominant_color};`;
thisBlock.css = `background-color: mix(${darkMode ? 'black' : 'white'}, ${dominant_color}, 0.9);`;
},
},
children: [
colorIndicator,
Box({
vertical: true,
className: 'spacing-v-5',
+2 -2
View File
@@ -29,8 +29,8 @@
menu {
@include elevation-border-softer;
padding: 0.681rem;
background: $surfaceVariant;
color: $onSurfaceVariant;
background: $layer2;
color: $onLayer2;
border-radius: 1.159rem;
-gtk-outline-radius: 1.159rem;
+34 -23
View File
@@ -2,8 +2,6 @@ $sidebar_chat_textboxareaColor: mix($onSurfaceVariant, $surfaceVariant, 40%);
$textboxColor: mix($surface, $surfaceVariant, 80%);
$system: $secondary;
$onSystem: $onSecondary;
$chatgpt: $primary;
$onChatgpt: $onPrimary;
@mixin group-padding {
padding: 0.341rem;
@@ -596,32 +594,47 @@ $colorpicker_rounding: 0.341rem;
.sidebar-chat-message {
margin: 0.682rem;
@include normal-rounding;
@include group-padding;
background-color: $layer1;
}
.sidebar-chat-indicator {
@include element_decel;
@include full-rounding;
min-width: 0.136rem;
}
.sidebar-chat-indicator-waifu {
@include element_decel;
@include full-rounding;
min-width: 0.136rem;
background-color: $onBackground;
}
.sidebar-chat-indicator-user {
background-color: $onBackground;
}
.sidebar-chat-indicator-bot {
background-color: $chatgpt;
}
.sidebar-chat-indicator-System {
background-color: $system;
}
.sidebar-chat-name {
@include titlefont;
padding: 0.341rem;
margin-left: -0.136rem;
padding-left: 0.818rem;
@include small-rounding;
padding: 0.341rem 0.818rem;
margin: 0.341rem;
// margin-left: 0rem;
background-color: $layer2;
color: $onLayer2;
}
.sidebar-chat-name-user {
background-color: $layer2;
color: $onLayer2;
}
.sidebar-chat-name-bot {
background-color: $secondary;
color: $onSecondary;
}
.sidebar-chat-name-system {
background-color: $secondaryContainer;
color: $onSecondaryContainer;
}
.sidebar-chat-txtblock {
@@ -808,17 +821,11 @@ $colorpicker_rounding: 0.341rem;
padding-left: 0.818rem;
}
.sidebar-waifu-content {
margin-left: 0.682rem;
}
.sidebar-waifu-txt {
@include readingfont;
margin-left: 0.682rem;
}
.sidebar-waifu-image {
margin-left: 0.682rem;
@include normal-rounding;
background-size: cover;
background-repeat: no-repeat;
@@ -850,6 +857,10 @@ $waifu_image_overlay_transparency: 0.7;
background-color: rgba(60, 60, 60, $waifu_image_overlay_transparency);
}
.sidebar-booru-imagegrid {
@include normal-rounding;
}
.sidebar-booru-image {
@include small-rounding;
margin: 0.273rem;