mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-03-16 02:17:30 +00:00
Compare commits
8 Commits
implement-
...
feat/templ
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
46b9f1b2f9 | ||
|
|
cfdc5fd25a | ||
|
|
7c88d41a02 | ||
|
|
9ca705381c | ||
|
|
3b03ef3afa | ||
|
|
8002c471ea | ||
|
|
a8bbe8f301 | ||
|
|
048af23439 |
@@ -1,11 +1,37 @@
|
||||
<template>
|
||||
<img
|
||||
:src="isImageError ? DEFAULT_BANNER : imgSrc"
|
||||
:alt="nodePack.name + ' banner'"
|
||||
class="object-cover"
|
||||
:style="{ width: cssWidth, height: cssHeight }"
|
||||
@error="isImageError = true"
|
||||
/>
|
||||
<div :style="{ width: cssWidth, height: cssHeight }" class="overflow-hidden">
|
||||
<!-- default banner show -->
|
||||
<div v-if="showDefaultBanner" class="w-full h-full">
|
||||
<img
|
||||
:src="DEFAULT_BANNER"
|
||||
alt="default banner"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
<!-- banner_url or icon show -->
|
||||
<div v-else class="relative w-full h-full">
|
||||
<!-- blur background -->
|
||||
<div
|
||||
v-if="imgSrc"
|
||||
class="absolute inset-0 bg-cover bg-center bg-no-repeat opacity-30"
|
||||
:style="{
|
||||
backgroundImage: `url(${imgSrc})`,
|
||||
filter: 'blur(10px)'
|
||||
}"
|
||||
></div>
|
||||
<!-- image -->
|
||||
<img
|
||||
:src="isImageError ? DEFAULT_BANNER : imgSrc"
|
||||
:alt="nodePack.name + ' banner'"
|
||||
:class="
|
||||
isImageError
|
||||
? 'relative w-full h-full object-cover z-10'
|
||||
: 'relative w-full h-full object-contain z-10'
|
||||
"
|
||||
@error="isImageError = true"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
@@ -26,12 +52,9 @@ const {
|
||||
}>()
|
||||
|
||||
const isImageError = ref(false)
|
||||
const shouldShowFallback = computed(
|
||||
() => !nodePack.banner || nodePack.banner.trim() === '' || isImageError.value
|
||||
)
|
||||
const imgSrc = computed(() =>
|
||||
shouldShowFallback.value ? DEFAULT_BANNER : nodePack.banner
|
||||
)
|
||||
|
||||
const showDefaultBanner = computed(() => !nodePack.banner_url && !nodePack.icon)
|
||||
const imgSrc = computed(() => nodePack.banner_url || nodePack.icon)
|
||||
|
||||
const convertToCssValue = (value: string | number) =>
|
||||
typeof value === 'number' ? `${value}rem` : value
|
||||
|
||||
@@ -86,7 +86,6 @@ import { useSettingStore } from '@/stores/settingStore'
|
||||
import { useToastStore } from '@/stores/toastStore'
|
||||
import { useColorPaletteStore } from '@/stores/workspace/colorPaletteStore'
|
||||
import { useWorkspaceStore } from '@/stores/workspaceStore'
|
||||
import { getCurrentVersion } from '@/utils/versioning'
|
||||
|
||||
const emit = defineEmits<{
|
||||
ready: []
|
||||
@@ -301,13 +300,6 @@ onMounted(async () => {
|
||||
CORE_SETTINGS.forEach((setting) => {
|
||||
settingStore.addSetting(setting)
|
||||
})
|
||||
if (!settingStore.get('Comfy.InstalledVersion')) {
|
||||
const currentVersion =
|
||||
Object.keys(settingStore.settingValues).length > 0
|
||||
? '0.0.1'
|
||||
: getCurrentVersion()
|
||||
await settingStore.set('Comfy.InstalledVersion', currentVersion)
|
||||
}
|
||||
// @ts-expect-error fixme ts strict error
|
||||
await comfyApp.setup(canvasRef.value)
|
||||
canvasStore.canvas = comfyApp.canvas
|
||||
|
||||
@@ -35,10 +35,7 @@ export const CORE_SETTINGS: SettingParams[] = [
|
||||
name: 'Action on link release (No modifier)',
|
||||
type: 'combo',
|
||||
options: Object.values(LinkReleaseTriggerAction),
|
||||
defaultValue: LinkReleaseTriggerAction.CONTEXT_MENU,
|
||||
defaultsByInstallVersion: {
|
||||
'1.21.3': LinkReleaseTriggerAction.SEARCH_BOX
|
||||
}
|
||||
defaultValue: LinkReleaseTriggerAction.CONTEXT_MENU
|
||||
},
|
||||
{
|
||||
id: 'Comfy.LinkRelease.ActionShift',
|
||||
@@ -750,13 +747,6 @@ export const CORE_SETTINGS: SettingParams[] = [
|
||||
defaultValue: false,
|
||||
versionAdded: '1.8.7'
|
||||
},
|
||||
{
|
||||
id: 'Comfy.InstalledVersion',
|
||||
name: 'Installed version',
|
||||
type: 'hidden',
|
||||
defaultValue: null,
|
||||
versionAdded: '1.22.1'
|
||||
},
|
||||
{
|
||||
id: 'LiteGraph.ContextMenu.Scaling',
|
||||
name: 'Scale node combo widget menus (lists) when zoomed in',
|
||||
|
||||
@@ -709,10 +709,10 @@
|
||||
"Interrupt": "中断",
|
||||
"Load Default Workflow": "デフォルトワークフローを読み込む",
|
||||
"Manage group nodes": "グループノードを管理",
|
||||
"Move Selected Nodes Down": "選択したノードを下に移動",
|
||||
"Move Selected Nodes Left": "選択したノードを左に移動",
|
||||
"Move Selected Nodes Right": "選択したノードを右に移動",
|
||||
"Move Selected Nodes Up": "選択したノードを上に移動",
|
||||
"Move Selected Nodes Down": "選択したノードを下へ移動",
|
||||
"Move Selected Nodes Left": "選択したノードを左へ移動",
|
||||
"Move Selected Nodes Right": "選択したノードを右へ移動",
|
||||
"Move Selected Nodes Up": "選択したノードを上へ移動",
|
||||
"Mute/Unmute Selected Nodes": "選択したノードのミュート/ミュート解除",
|
||||
"New": "新規",
|
||||
"Next Opened Workflow": "次に開いたワークフロー",
|
||||
|
||||
@@ -45,7 +45,7 @@
|
||||
"label": "适应视图到选中节点"
|
||||
},
|
||||
"Comfy_Canvas_MoveSelectedNodes_Down": {
|
||||
"label": "下移所选节点"
|
||||
"label": "下移选中的节点"
|
||||
},
|
||||
"Comfy_Canvas_MoveSelectedNodes_Left": {
|
||||
"label": "向左移动选中节点"
|
||||
@@ -54,7 +54,7 @@
|
||||
"label": "向右移动选中节点"
|
||||
},
|
||||
"Comfy_Canvas_MoveSelectedNodes_Up": {
|
||||
"label": "上移所选节点"
|
||||
"label": "上移选中的节点"
|
||||
},
|
||||
"Comfy_Canvas_ResetView": {
|
||||
"label": "重置视图"
|
||||
|
||||
@@ -313,6 +313,7 @@ export const zSystemStats = z.object({
|
||||
python_version: z.string(),
|
||||
embedded_python: z.boolean(),
|
||||
comfyui_version: z.string(),
|
||||
workflows_templates_version: z.string(),
|
||||
pytorch_version: z.string(),
|
||||
argv: z.array(z.string()),
|
||||
ram_total: z.number(),
|
||||
@@ -448,7 +449,6 @@ const zSettings = z.object({
|
||||
'Comfy.Toast.DisableReconnectingToast': z.boolean(),
|
||||
'Comfy.Workflow.Persist': z.boolean(),
|
||||
'Comfy.TutorialCompleted': z.boolean(),
|
||||
'Comfy.InstalledVersion': z.string().nullable(),
|
||||
'Comfy.Node.AllowImageSizeDraw': z.boolean(),
|
||||
'Comfy-Desktop.AutoUpdate': z.boolean(),
|
||||
'Comfy-Desktop.SendStatistics': z.boolean(),
|
||||
@@ -472,7 +472,6 @@ const zSettings = z.object({
|
||||
'VHS.AdvancedPreviews': z.string(),
|
||||
/** Settings used for testing */
|
||||
'test.setting': z.any(),
|
||||
'test.versionedSetting': z.any(),
|
||||
'main.sub.setting.name': z.any(),
|
||||
'single.setting': z.any(),
|
||||
'LiteGraph.Node.DefaultPadding': z.boolean(),
|
||||
|
||||
@@ -11,8 +11,12 @@ export const useAboutPanelStore = defineStore('aboutPanel', () => {
|
||||
const frontendVersion = __COMFYUI_FRONTEND_VERSION__
|
||||
const extensionStore = useExtensionStore()
|
||||
const systemStatsStore = useSystemStatsStore()
|
||||
const coreVersion = computed(
|
||||
() => systemStatsStore?.systemStats?.system?.comfyui_version ?? ''
|
||||
|
||||
const system = computed(() => systemStatsStore?.systemStats?.system)
|
||||
|
||||
const coreVersion = computed(() => system.value?.comfyui_version ?? '')
|
||||
const workflowsTemplatesVersion = computed(
|
||||
() => system.value?.workflows_templates_version ?? ''
|
||||
)
|
||||
|
||||
const coreBadges = computed<AboutPageBadge[]>(() => [
|
||||
@@ -37,7 +41,12 @@ export const useAboutPanelStore = defineStore('aboutPanel', () => {
|
||||
url: 'https://www.comfy.org/discord',
|
||||
icon: 'pi pi-discord'
|
||||
},
|
||||
{ label: 'ComfyOrg', url: 'https://www.comfy.org/', icon: 'pi pi-globe' }
|
||||
{ label: 'ComfyOrg', url: 'https://www.comfy.org/', icon: 'pi pi-globe' },
|
||||
{
|
||||
label: `Workflows_Templates v${workflowsTemplatesVersion.value}`,
|
||||
url: 'https://github.com/Comfy-Org/workflow_templates',
|
||||
icon: 'pi pi-globe'
|
||||
}
|
||||
])
|
||||
|
||||
const allBadges = computed<AboutPageBadge[]>(() => [
|
||||
|
||||
@@ -7,7 +7,6 @@ import { api } from '@/scripts/api'
|
||||
import { app } from '@/scripts/app'
|
||||
import type { SettingParams } from '@/types/settingTypes'
|
||||
import type { TreeNode } from '@/types/treeExplorerTypes'
|
||||
import { compareVersions } from '@/utils/versioning'
|
||||
|
||||
export const getSettingInfo = (setting: SettingParams) => {
|
||||
const parts = setting.category || setting.id.split('.')
|
||||
@@ -84,29 +83,6 @@ export const useSettingStore = defineStore('setting', () => {
|
||||
*/
|
||||
function getDefaultValue<K extends keyof Settings>(key: K): Settings[K] {
|
||||
const param = settingsById.value[key]
|
||||
|
||||
// Check for versioned defaults based on installation version
|
||||
if (param?.defaultsByInstallVersion) {
|
||||
const installedVersion = get('Comfy.InstalledVersion')
|
||||
|
||||
if (installedVersion) {
|
||||
// Find the highest version that is <= installedVersion
|
||||
const sortedVersions = Object.keys(param.defaultsByInstallVersion).sort(
|
||||
(a, b) => compareVersions(a, b)
|
||||
)
|
||||
|
||||
for (const version of sortedVersions.reverse()) {
|
||||
if (compareVersions(installedVersion, version) >= 0) {
|
||||
const versionedDefault = param.defaultsByInstallVersion[version]
|
||||
return typeof versionedDefault === 'function'
|
||||
? versionedDefault()
|
||||
: versionedDefault
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Fall back to original defaultValue
|
||||
return typeof param?.defaultValue === 'function'
|
||||
? param.defaultValue()
|
||||
: param?.defaultValue
|
||||
|
||||
@@ -35,8 +35,6 @@ export interface Setting {
|
||||
export interface SettingParams extends FormItem {
|
||||
id: keyof Settings
|
||||
defaultValue: any | (() => any)
|
||||
// Optional versioned defaults based on installation version
|
||||
defaultsByInstallVersion?: Record<string, any | (() => any)>
|
||||
onChange?: (newValue: any, oldValue?: any) => void
|
||||
// By default category is id.split('.'). However, changing id to assign
|
||||
// new category has poor backward compatibility. Use this field to overwrite
|
||||
|
||||
@@ -1,37 +0,0 @@
|
||||
import { electronAPI, isElectron } from '@/utils/envUtil'
|
||||
|
||||
/**
|
||||
* Compare two semantic version strings.
|
||||
* @param a - First version string
|
||||
* @param b - Second version string
|
||||
* @returns 0 if equal, 1 if a > b, -1 if a < b
|
||||
*/
|
||||
export function compareVersions(a: string, b: string): number {
|
||||
const parseVersion = (version: string) => {
|
||||
return version.split('.').map((v) => parseInt(v, 10) || 0)
|
||||
}
|
||||
|
||||
const versionA = parseVersion(a)
|
||||
const versionB = parseVersion(b)
|
||||
|
||||
for (let i = 0; i < Math.max(versionA.length, versionB.length); i++) {
|
||||
const numA = versionA[i] || 0
|
||||
const numB = versionB[i] || 0
|
||||
|
||||
if (numA > numB) return 1
|
||||
if (numA < numB) return -1
|
||||
}
|
||||
|
||||
return 0
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the current ComfyUI version for version tracking
|
||||
*/
|
||||
export function getCurrentVersion(): string {
|
||||
if (isElectron()) {
|
||||
return electronAPI().getComfyUIVersion()
|
||||
}
|
||||
// For web version, fallback to frontend version
|
||||
return __COMFYUI_FRONTEND_VERSION__
|
||||
}
|
||||
@@ -122,26 +122,6 @@ describe('useSettingStore', () => {
|
||||
expect(store.get('test.setting')).toBe('default')
|
||||
})
|
||||
|
||||
it('should use versioned default based on installation version', () => {
|
||||
// Set up an installed version
|
||||
store.settingValues['Comfy.InstalledVersion'] = '1.25.0'
|
||||
|
||||
const setting: SettingParams = {
|
||||
id: 'test.versionedSetting',
|
||||
name: 'test.versionedSetting',
|
||||
type: 'text',
|
||||
defaultValue: 'original',
|
||||
defaultsByInstallVersion: {
|
||||
'1.20.0': 'version_1_20',
|
||||
'1.24.0': 'version_1_24'
|
||||
}
|
||||
}
|
||||
store.addSetting(setting)
|
||||
|
||||
// Should use the highest version <= installed version
|
||||
expect(store.get('test.versionedSetting')).toBe('version_1_24')
|
||||
})
|
||||
|
||||
it('should set value and trigger onChange', async () => {
|
||||
const onChangeMock = vi.fn()
|
||||
const dispatchChangeMock = vi.mocked(app.ui.settings.dispatchChange)
|
||||
|
||||
Reference in New Issue
Block a user