Working2

README.md

@@ -64,8 +64,16 @@ Height=600
 | `X` | X position offset in pixels | 0 | No |
 | `Y` | Y position offset in pixels | 0 | No |
 | `Hidden` | Hide the WebView on load (0 = visible, 1 = hidden) | 0 | No |
+| `DynamicVariables` | Enable dynamic variable updates (0 or 1) | 0 | No |
+
+**Notes**: 
+- Transparent background is always enabled by default. Developer tools (F12) are always available.
+- When `DynamicVariables=1`, the plugin intelligently handles updates:
+  - **URL changes**: Navigates to the new URL without recreating the WebView
+  - **Dimension/Position changes** (`W`, `H`, `X`, `Y`): Applied instantly without flickering
+  - **Visibility changes** (`Hidden`): Applied instantly
+  - The WebView is only created once on first load, preventing flickering issues
 
-**Note**: Transparent background is always enabled by default. Developer tools (F12) are always available.
 
 ### Bang Commands
 
@@ -77,13 +85,7 @@ Execute commands from your skin using `[!CommandMeasure MeasureName "Command"]`:
 | `Reload` | Reload the current page | `[!CommandMeasure MeasureWebView "Reload"]` |
 | `GoBack` | Navigate to the previous page in history | `[!CommandMeasure MeasureWebView "GoBack"]` |
 | `GoForward` | Navigate to the next page in history | `[!CommandMeasure MeasureWebView "GoForward"]` |
-| `Show` | Make the WebView visible | `[!CommandMeasure MeasureWebView "Show"]` |
-| `Hide` | Hide the WebView | `[!CommandMeasure MeasureWebView "Hide"]` |
 | `ExecuteScript <script>` | Execute JavaScript code in the WebView | `[!CommandMeasure MeasureWebView "ExecuteScript alert('Hello')"]` |
-| `SetW <width>` | Set the width of the WebView in pixels | `[!CommandMeasure MeasureWebView "SetW 1024"]` |
-| `SetH <height>` | Set the height of the WebView in pixels | `[!CommandMeasure MeasureWebView "SetH 768"]` |
-| `SetX <x>` | Set the X position offset in pixels | `[!CommandMeasure MeasureWebView "SetX 100"]` |
-| `SetY <y>` | Set the Y position offset in pixels | `[!CommandMeasure MeasureWebView "SetY 50"]` |
 | `OpenDevTools` | Open the browser developer tools (F12) | `[!CommandMeasure MeasureWebView "OpenDevTools"]` |
 
 ## 🔌 JavaScript API

Resources/Skins/WebView2/BangCommand/BangCommand.ini

@@ -10,24 +10,33 @@ Information=Demonstrates controlling WebView2 via !CommandMeasure bangs.
 Version=1.0
 License=Creative Commons Attribution-Non-Commercial-Share Alike 3.0
 
+[Variables]
+WebURL=https://nstechbytes.pages.dev/
+WebW=600
+WebH=350
+WebX=300
+WebY=25
+Hidden=0
 ; ========================================
 ; Measure
 ; ========================================
 [MeasureWebView]
 Measure=Plugin
 Plugin=WebView2
-URL=https://nstechbytes.pages.dev/
-W=600
-H=350
-X=300
-Y=25
+URL=#WebURL#
+W=#WebW#
+H=#WebH#
+X=#WebX#
+Y=#WebY#
+Hidden=#Hidden#
+DynamicVariables=1
 
 ; ========================================
 ; Background
 ; ========================================
 [MeterBackground]
 Meter=Shape
-Shape=Rectangle 0,0,950,400 | FillColor 0,0,0,1 | StrokeWidth 0
+Shape=Rectangle 0,0,950,420,12 | FillColor 0,0,0,200 | StrokeWidth 0
 
 [Title]
 Meter=String
@@ -36,7 +45,7 @@ FontSize=16
 FontColor=255,255,255,255
 AntiAlias=1
 X=25
-Y=5
+Y=10
 
 [StyleButtonText]
 FontColor=255,255,255,255
@@ -48,22 +57,38 @@ StringAlign=CenterCenter
 SolidColor=0,200,255,150
 
 ; ========================================
-; Navigate to URL
+; Navigate to URL (Dynamic Variables)
 ; ========================================
-[TxtNavigate]
+[TxtNavigateGoogle]
 Meter=String
 MeterStyle=StyleButtonText
-Text=Navigate to https://example.com
+Text=Navigate to Google (via Variable)
 X=150
 Y=58
+LeftMouseUpAction=[!SetVariable WebURL "https://www.google.com"][!UpdateMeasure MeasureWebView][!Redraw]
+
+[TxtNavigateGitHub]
+Meter=String
+MeterStyle=StyleButtonText
+Text=Navigate to GitHub (via Variable)
+X=150
+Y=88
+LeftMouseUpAction=[!SetVariable WebURL "https://github.com"][!UpdateMeasure MeasureWebView][!Redraw]
+
+[TxtNavigateExample]
+Meter=String
+MeterStyle=StyleButtonText
+Text=Navigate to Example (via Bang)
+X=150
+Y=118
 LeftMouseUpAction=[!CommandMeasure MeasureWebView "Navigate https://example.com"]
 
 [TxtReload]
 Meter=String
 MeterStyle=StyleButtonText
 Text=Reload
 X=150
-Y=88
+Y=148
 LeftMouseUpAction=[!CommandMeasure MeasureWebView "Reload"]
 
 [TxtGoBack]
@@ -73,7 +98,7 @@ Text=Go Back
 W=122
 H=24
 X=86
-Y=118
+Y=178
 LeftMouseUpAction=[!CommandMeasure MeasureWebView "GoBack"]
 
 [TxtGoForward]
@@ -83,7 +108,7 @@ Text=Go Forward
 W=125
 H=24
 X=212
-Y=118
+Y=178
 LeftMouseUpAction=[!CommandMeasure MeasureWebView "GoForward"]
 
 [TxtShow]
@@ -93,8 +118,8 @@ Text=Show
 W=122
 H=24
 X=86
-Y=148
-LeftMouseUpAction=[!CommandMeasure MeasureWebView "Show"]
+Y=208
+LeftMouseUpAction=[!SetVariable Hidden 0][!UpdateMeasure MeasureWebView][!Redraw]
 
 [TxtHide]
 Meter=String
@@ -103,53 +128,56 @@ Text=Hide
 W=125
 H=24
 X=212
-Y=148
-LeftMouseUpAction=[!CommandMeasure MeasureWebView "Hide"]
+Y=208
+LeftMouseUpAction=[!SetVariable Hidden 1][!UpdateMeasure MeasureWebView][!Redraw]
 
 [TxtExecuteScript]
 Meter=String
 MeterStyle=StyleButtonText
 Text=Execute Script
 X=150
-Y=178
+Y=238
 LeftMouseUpAction=[!CommandMeasure MeasureWebView "ExecuteScript alert('Hello!')"]
 
 [TxtOpenDevTools]
 Meter=String
 MeterStyle=StyleButtonText
 Text=Open DevTools
 X=150
-Y=208
+Y=268
 LeftMouseUpAction=[!CommandMeasure MeasureWebView "OpenDevTools"]
 
 [TxtSetWidth]
 Meter=String
 MeterStyle=StyleButtonText
-Text=Set Width: 500
+Text=Set Width: 500 (via Variable)
 X=150
-Y=238
-LeftMouseUpAction=[!CommandMeasure MeasureWebView "SetW 500"]
+Y=298
+LeftMouseUpAction=[!SetVariable WebW 500][!UpdateMeasure MeasureWebView][!Redraw]
 
 [TxtSetHeight]
 Meter=String
 MeterStyle=StyleButtonText
-Text=Set Height: 400
+Text=Set Height: 400 (via Variable)
 X=150
-Y=268
-LeftMouseUpAction=[!CommandMeasure MeasureWebView "SetH 400"]
+Y=328
+LeftMouseUpAction=[!SetVariable WebH 400][!UpdateMeasure MeasureWebView][!Redraw]
 
 [TxtSetX]
 Meter=String
 MeterStyle=StyleButtonText
-Text=Set X: 100
+Text=Set X: 100 (via Variable)
 X=150
-Y=298
-LeftMouseUpAction=[!CommandMeasure MeasureWebView "SetX 100"]
+Y=358
+LeftMouseUpAction=[!SetVariable WebX 100][!UpdateMeasure MeasureWebView][!Redraw]
 
 [TxtSetY]
 Meter=String
 MeterStyle=StyleButtonText
-Text=Set Y: 50
+Text=Set Y: 50 (via Variable)
 X=150
-Y=328
-LeftMouseUpAction=[!CommandMeasure MeasureWebView "SetY 50"]
+Y=388
+LeftMouseUpAction=[!SetVariable WebY 50][!UpdateMeasure MeasureWebView][!Redraw]
+
+
+

Resources/skin_definition.json

@@ -1,6 +1,6 @@
 {
     "skinDir":  ".\\Resources\\Skins",
-    "version":  "0.0.3",
+    "version":  "0.0.4",
     "minimumVersion":  "4.5",
     "author":  "nstechbytes",
     "variableFiles":  "",
@@ -14,8 +14,8 @@
                 ],
     "name":  "WebView2",
     "loadType":  "Skin",
-    "load":  "WebView2\\Main.ini",
+    "load":  "WebView2\\Clock\\Clock.ini",
     "headerImage":  ".\\Resources\\banner.bmp",
     "configPrefix":  "WebView2",
-    "output":  ".\\dist\\WebView2_v0.0.3_Alpha.rmskin"
+    "output":  ".\\dist\\WebView2_v0.0.4_Alpha4.rmskin"
 }