import gradio as gr
from shared.utils.plugins import WAN2GPPlugin
import os
import json
import traceback
from wgp import quit_application
import requests
COMMUNITY_PLUGINS_URL = "https://github.com/deepbeepmeep/Wan2GP/raw/refs/heads/main/plugins.json"
class PluginManagerUIPlugin(WAN2GPPlugin):
def __init__(self):
super().__init__()
self.name = "Plugin Manager UI"
self.version = "1.8.0"
self.description = "A built-in UI for managing, installing, and updating Wan2GP plugins"
def setup_ui(self):
self.request_global("app")
self.request_global("server_config")
self.request_global("server_config_filename")
self.request_component("main")
self.request_component("main_tabs")
self.add_tab(
tab_id="plugin_manager_tab",
label="Plugins",
component_constructor=self.create_plugin_manager_ui,
position=5
)
def _get_js_script_html(self):
# ... (JavaScript code remains unchanged) ...
js_code = """
() => {
function updateGradioInput(elem_id, value) {
const gradio_app = document.querySelector('gradio-app') || document;
const input = gradio_app.querySelector(`#${elem_id} textarea`);
if (input) {
input.value = value;
input.dispatchEvent(new Event('input', { bubbles: true }));
return true;
}
return false;
}
function makeSortable() {
const userPluginList = document.querySelector('#user-plugin-list');
if (!userPluginList) return;
let draggedItem = null;
userPluginList.addEventListener('dragstart', e => {
draggedItem = e.target.closest('.plugin-item');
if (!draggedItem) return;
setTimeout(() => {
if (draggedItem) draggedItem.style.opacity = '0.5';
}, 0);
});
userPluginList.addEventListener('dragend', e => {
setTimeout(() => {
if (draggedItem) {
draggedItem.style.opacity = '1';
draggedItem = null;
}
}, 0);
});
userPluginList.addEventListener('dragover', e => {
e.preventDefault();
const afterElement = getDragAfterElement(userPluginList, e.clientY);
if (draggedItem) {
if (afterElement == null) {
userPluginList.appendChild(draggedItem);
} else {
userPluginList.insertBefore(draggedItem, afterElement);
}
}
});
function getDragAfterElement(container, y) {
const draggableElements = [...container.querySelectorAll('.plugin-item:not(.dragging)')];
return draggableElements.reduce((closest, child) => {
const box = child.getBoundingClientRect();
const offset = y - box.top - box.height / 2;
if (offset < 0 && offset > closest.offset) {
return { offset: offset, element: child };
} else {
return closest;
}
}, { offset: Number.NEGATIVE_INFINITY }).element;
}
}
setTimeout(makeSortable, 500);
window.handlePluginAction = function(button, action) {
const pluginItem = button.closest('.plugin-item');
const pluginId = pluginItem.dataset.pluginId;
const payload = JSON.stringify({ action: action, plugin_id: pluginId });
updateGradioInput('plugin_action_input', payload);
};
window.handleStoreInstall = function(button, url) {
const payload = JSON.stringify({ action: 'install_from_store', url: url });
updateGradioInput('plugin_action_input', payload);
};
window.handleSave = function(restart) {
const user_container = document.querySelector('#user-plugin-list');
if (!user_container) return;
const user_plugins = user_container.querySelectorAll('.plugin-item');
const enabledUserPlugins = Array.from(user_plugins)
.filter(item => item.querySelector('.plugin-enable-checkbox').checked)
.map(item => item.dataset.pluginId);
const payload = JSON.stringify({ restart: restart, enabled_plugins: enabledUserPlugins });
updateGradioInput('save_action_input', payload);
};
}
"""
return f"{js_code}"
def _build_community_plugins_html(self):
try:
installed_plugin_ids = {p['id'] for p in self.app.plugin_manager.get_plugins_info()}
response = requests.get(COMMUNITY_PLUGINS_URL, timeout=10)
response.raise_for_status()
plugins = response.json()
community_plugins = [
p for p in plugins
if p.get('url', '').split('/')[-1].replace('.git', '') not in installed_plugin_ids
]
except requests.exceptions.RequestException as e:
gr.Warning(f"Could not fetch community plugins list: {e}")
return "
Failed to load community plugins.
"
except json.JSONDecodeError:
gr.Warning("Failed to parse the community plugins list. The file may be malformed.")
return "
Error reading community plugins list.
"
if not community_plugins:
return "
All available community plugins are already installed.
"
items_html = ""
for plugin in community_plugins:
name = plugin.get('name')
author = plugin.get('author')
version = plugin.get('version', 'N/A')
description = plugin.get('description')
url = plugin.get('url')
if not all([name, author, description, url]):
continue
safe_url = url.replace("'", "\\'")
items_html += f"""
{name}version {version} by {author}
{description}
"""
return f"
{items_html}
"
def _build_plugins_html(self):
plugins_info = self.app.plugin_manager.get_plugins_info()
enabled_user_plugins = self.server_config.get("enabled_plugins", [])
all_user_plugins_info = [p for p in plugins_info if not p.get('system')]
css = """
"""
if not all_user_plugins_info:
user_html = "
No user-installed plugins found.
"
else:
user_plugins_map = {p['id']: p for p in all_user_plugins_info}
user_plugins = []
for plugin_id in enabled_user_plugins:
if plugin_id in user_plugins_map:
user_plugins.append(user_plugins_map.pop(plugin_id))
user_plugins.extend(sorted(user_plugins_map.values(), key=lambda p: p['name']))
user_items_html = ""
for plugin in user_plugins:
plugin_id = plugin['id']
checked = "checked" if plugin_id in enabled_user_plugins else ""
user_items_html += f"""