This commit is contained in:
Jan Kessler 2025-04-01 09:03:03 +02:00 committed by GitHub
commit e989940cdc
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
7 changed files with 56 additions and 15 deletions

View File

@ -18,6 +18,8 @@ from open_webui.env import (
DATA_DIR,
DATABASE_URL,
ENV,
FORCED_IMAGE_COMPRESSION_WIDTH,
FORCED_IMAGE_COMPRESSION_HEIGHT,
REDIS_URL,
REDIS_SENTINEL_HOSTS,
REDIS_SENTINEL_PORT,

View File

@ -460,3 +460,9 @@ OTEL_TRACES_SAMPLER = os.environ.get(
PIP_OPTIONS = os.getenv("PIP_OPTIONS", "").split()
PIP_PACKAGE_INDEX_OPTIONS = os.getenv("PIP_PACKAGE_INDEX_OPTIONS", "").split()
####################################
# FORCED IMAGE COMPRESSION
####################################
FORCED_IMAGE_COMPRESSION_WIDTH = os.environ.get("FORCED_IMAGE_COMPRESSION_WIDTH", "")
FORCED_IMAGE_COMPRESSION_HEIGHT = os.environ.get("FORCED_IMAGE_COMPRESSION_HEIGHT", "")

View File

@ -293,6 +293,8 @@ from open_webui.config import (
DEFAULT_LOCALE,
OAUTH_PROVIDERS,
WEBUI_URL,
FORCED_IMAGE_COMPRESSION_WIDTH,
FORCED_IMAGE_COMPRESSION_HEIGHT,
# Admin
ENABLE_ADMIN_CHAT_ACCESS,
ENABLE_ADMIN_EXPORT,
@ -1265,6 +1267,10 @@ async def get_app_config(request: Request):
"max_size": app.state.config.FILE_MAX_SIZE,
"max_count": app.state.config.FILE_MAX_COUNT,
},
"forced_image_compression_size": {
"width": FORCED_IMAGE_COMPRESSION_WIDTH,
"height": FORCED_IMAGE_COMPRESSION_HEIGHT,
},
"permissions": {**app.state.config.USER_PERMISSIONS},
"google_drive": {
"client_id": GOOGLE_DRIVE_CLIENT_ID.value,

View File

@ -6,6 +6,10 @@
const i18n = getContext('i18n');
const forcedImageCompressionWidth = $config?.forced_image_compression_size.width ?? null;
const forcedImageCompressionHeight = $config?.forced_image_compression_size.height ?? null;
const forcedImageCompression = Boolean(forcedImageCompressionWidth) || Boolean(forcedImageCompressionHeight);
import { config, mobile, settings, socket } from '$lib/stores';
import { blobToFile, compressImage } from '$lib/utils';
@ -111,7 +115,10 @@
reader.onload = async (event) => {
let imageUrl = event.target.result;
if ($settings?.imageCompression ?? false) {
if (forcedImageCompression) {
imageUrl = await compressImage(imageUrl, forcedImageCompressionWidth, forcedImageCompressionHeight);
}
else if ($settings?.imageCompression ?? false) {
const width = $settings?.imageCompressionSize?.width ?? null;
const height = $settings?.imageCompressionSize?.height ?? null;

View File

@ -50,6 +50,10 @@
const i18n = getContext('i18n');
const forcedImageCompressionWidth = $config?.forced_image_compression_size.width ?? null;
const forcedImageCompressionHeight = $config?.forced_image_compression_size.height ?? null;
const forcedImageCompression = Boolean(forcedImageCompressionWidth) || Boolean(forcedImageCompressionHeight);
export let transparentBackground = false;
export let onChange: Function = () => {};
@ -252,7 +256,10 @@
reader.onload = async (event) => {
let imageUrl = event.target.result;
if ($settings?.imageCompression ?? false) {
if (forcedImageCompression) {
imageUrl = await compressImage(imageUrl, forcedImageCompressionWidth, forcedImageCompressionHeight);
}
else if ($settings?.imageCompression ?? false) {
const width = $settings?.imageCompressionSize?.width ?? null;
const height = $settings?.imageCompressionSize?.height ?? null;

View File

@ -50,6 +50,9 @@
width: '',
height: ''
};
const forcedImageCompressionWidth = $config?.forced_image_compression_size.width ?? null;
const forcedImageCompressionHeight = $config?.forced_image_compression_size.height ?? null;
const forcedImageCompression = Boolean(forcedImageCompressionWidth) || Boolean(forcedImageCompressionHeight);
// Admin - Show Update Available Toast
let showUpdateToast = true;
@ -860,23 +863,29 @@
<div class=" py-0.5 flex w-full justify-between">
<div class=" self-center text-xs">{$i18n.t('Image Compression')}</div>
<button
class="p-1 px-3 text-xs flex rounded-sm transition"
on:click={() => {
toggleImageCompression();
}}
type="button"
>
{#if imageCompression === true}
{#if forcedImageCompression}
<div class="p-1 px-3 text-xs flex rounded-sm transition">
<span class="ml-2 self-center">{$i18n.t('On')}</span>
{:else}
<span class="ml-2 self-center">{$i18n.t('Off')}</span>
{/if}
</button>
</div>
{:else}
<button
class="p-1 px-3 text-xs flex rounded-sm transition"
on:click={() => {
toggleImageCompression();
}}
type="button"
>
{#if imageCompression || forcedImageCompression}
<span class="ml-2 self-center">{$i18n.t('On')}</span>
{:else}
<span class="ml-2 self-center">{$i18n.t('Off')}</span>
{/if}
</button>
{/if}
</div>
</div>
{#if imageCompression}
{#if imageCompression && !forcedImageCompression}
<div>
<div class=" py-0.5 flex w-full justify-between text-xs">
<div class=" self-center text-xs">{$i18n.t('Image Max Compression Size')}</div>

View File

@ -199,6 +199,10 @@ type Config = {
default_locale: string;
default_models: string;
default_prompt_suggestions: PromptSuggestion[];
forced_image_compression_size: {
width: number;
height: number;
};
features: {
auth: boolean;
auth_trusted_header: boolean;