@quicktvui/web-renderer 1.0.1 → 1.0.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quicktvui/web-renderer",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "description": "Web renderer for QuickTVUI - provides web browser rendering support",
   "author": "QuickTVUI Team",
   "license": "Apache-2.0",

package/src/index.js

@@ -243,4 +243,100 @@ export function startWebEngine(engine) {
   console.log('[Web Renderer] Engine started')
 }
 
+// Global engine instance for convenience functions
+let _webEngine = null
+
+/**
+ * Initialize the web renderer (convenience function)
+ * Creates and prepares the engine, applies patches
+ * This matches the initialization flow in main-web.js
+ */
+export function initWebRenderer() {
+  if (_webEngine) {
+    console.log('[Web Renderer] Engine already initialized')
+    return _webEngine
+  }
+
+  console.log('[Web Renderer] === Starting initialization ===')
+
+  // Step 0: Initialize async localStorage (must be first)
+  initAsyncLocalStorage()
+
+  // Step 0.1: Initialize auto proxy for development
+  initAutoProxy()
+
+  // Step 0.2: Register IJKPlayerComponent for web video
+  global.__WEB_COMPONENT__ = global.__WEB_COMPONENTS__ || {}
+  global.__WEB_COMPONENTS__['IJKPlayerComponent'] = IJKPlayerComponent
+
+  // Step 1: Setup SceneBuilder (must be done before main.ts loads)
+  setupSceneBuilder()
+
+  console.log('[Web Renderer] Component mappings:', Object.keys(quicktvuiComponents))
+
+  // Step 2: Create the web engine
+  _webEngine = createWebEngine()
+
+  // Step 3: Apply all patches BEFORE starting
+  applyAllPatches(_webEngine)
+
+  // Step 4: Initialize TV Focus Manager
+  const focusManager = new TVFocusManager()
+  global.__TV_FOCUS_MANAGER__ = focusManager
+  console.log('[Web Renderer] TVFocusManager initialized')
+
+  // Step 5: Inject global CSS to match Android layout behavior
+  const styleEl = document.createElement('style')
+  styleEl.id = 'web-platform-reset'
+  styleEl.textContent = `
+  /* Web-Android Layout Compatibility Reset */
+  
+  /* Disable flex cross-axis stretching (Android behavior) */
+  /* In Android, children don't auto-fill parent's cross dimension */
+  #app,
+  #app * {
+    align-items: flex-start;
+  }
+  
+  /* Elements with explicit style should override the reset */
+  [style*="align-items"] {
+    align-items: var(--align-items, center) !important;
+  }
+`
+  document.head.appendChild(styleEl)
+  console.log('[Web Renderer] Global CSS reset injected for Android-compatible layout')
+
+  console.log('[Web Renderer] Initialization complete')
+  return _webEngine
+}
+
+/**
+ * Start the web renderer (convenience function)
+ * Starts the previously initialized engine
+ */
+export function startWebRenderer() {
+  if (!_webEngine) {
+    console.log('[Web Renderer] No engine found, initializing...')
+    initWebRenderer()
+  }
+
+  console.log('[Web Renderer] Starting engine...')
+  startWebEngine(_webEngine)
+  return _webEngine
+}
+
+/**
+ * Get the current web engine instance
+ */
+export function getWebEngine() {
+  return _webEngine
+}
+
+/**
+ * Set the web engine instance
+ */
+export function setWebEngine(engine) {
+  _webEngine = engine
+}
+
 export { APP_NAME }