Seite 1 von 1

Anwendungsbeispiele für das PB.Ex WebGadget

Verfasst: 01.05.2019 14:42
von Kiffi
Hallo,

RSBasic hat uns freundlicherweise mit einem neuen Gadget beglückt, mit dem wir nun
in der Lage sind, moderne Webseiten-Technologien auch mit PureBasic nutzen zu können:

Das PB.Ex WebGadget (viewtopic.php?f=11&t=31422)

Dieser Thread kann genutzt werden, um Beispiele zu präsentieren, die zeigen, wie man das
neue Gadget nutzen kann.

Grüße ... Peter

Re: Anwendungsbeispiele für das PB.Ex WebGadget

Verfasst: 01.05.2019 14:43
von Kiffi
Monaco-Editor:

Hier mal eine kleine Demo, die den Monaco-Editor (https://microsoft.github.io/monaco-editor/index.html) aufruft.

Bild

Richtig tolles Stück Software. Endlich kann ich den Editor mal mit PB benutzen :D

Code: Alles auswählen

EnableExplicit

Define PBEx_WebGadget

CompilerIf #PB_Compiler_Processor = #PB_Processor_x86
  PBEx_WebGadget = OpenLibrary(#PB_Any, "PB.Ex_WebGadget_x86.dll")
CompilerElseIf #PB_Compiler_Processor = #PB_Processor_x64
  PBEx_WebGadget = OpenLibrary(#PB_Any, "PB.Ex_WebGadget_x64.dll")
CompilerEndIf

If PBEx_WebGadget
  Prototype WebGadgetEx(ID, X, Y, Width, Height, URL.p-Unicode, ParentWindowID, ErrorOutput)
  Global WebGadgetEx.WebGadgetEx = GetFunction(PBEx_WebGadget, "WebGadgetEx")
  Prototype SetWebGadgetExText(ID, URL.p-Unicode, ErrorOutput)
  Global SetWebGadgetExText.SetWebGadgetExText = GetFunction(PBEx_WebGadget, "SetWebGadgetExText")
  Prototype GetWebGadgetExText(ID, Output, ErrorOutput)
  Global GetWebGadgetExText.GetWebGadgetExText = GetFunction(PBEx_WebGadget, "GetWebGadgetExText")
  Prototype SetWebGadgetExState(ID, State, ErrorOutput)
  Global SetWebGadgetExState.SetWebGadgetExState = GetFunction(PBEx_WebGadget, "SetWebGadgetExState")
  Prototype SetWebGadgetExItemText(ID, Entry, Text.p-Unicode, ErrorOutput)
  Global SetWebGadgetExItemText.SetWebGadgetExItemText = GetFunction(PBEx_WebGadget, "SetWebGadgetExItemText")
  Prototype GetWebGadgetExItemText(ID, Entry, Output, ErrorOutput)
  Global GetWebGadgetExItemText.GetWebGadgetExItemText = GetFunction(PBEx_WebGadget, "GetWebGadgetExItemText")
  Prototype FreeWebGadgetEx(ID, ErrorOutput)
  Global FreeWebGadgetEx.FreeWebGadgetEx = GetFunction(PBEx_WebGadget, "FreeWebGadgetEx")
  Prototype IsWebGadgetEx(ID, ErrorOutput)
  Global IsWebGadgetEx.IsWebGadgetEx = GetFunction(PBEx_WebGadget, "IsWebGadgetEx")
  Prototype WebGadgetExWidth(ID, ErrorOutput)
  Global WebGadgetExWidth.WebGadgetExWidth = GetFunction(PBEx_WebGadget, "WebGadgetExWidth")
  Prototype WebGadgetExHeight(ID, ErrorOutput)
  Global WebGadgetExHeight.WebGadgetExHeight = GetFunction(PBEx_WebGadget, "WebGadgetExHeight")
  Prototype WebGadgetExX(ID, ErrorOutput)
  Global WebGadgetExX.WebGadgetExX = GetFunction(PBEx_WebGadget, "WebGadgetExX")
  Prototype WebGadgetExY(ID, ErrorOutput)
  Global WebGadgetExY.WebGadgetExY = GetFunction(PBEx_WebGadget, "WebGadgetExY")
  Prototype WebGadgetExID(ID, ErrorOutput)
  Global WebGadgetExID.WebGadgetExID = GetFunction(PBEx_WebGadget, "WebGadgetExID")
  Prototype HideWebGadgetEx(ID, State, ErrorOutput)
  Global HideWebGadgetEx.HideWebGadgetEx = GetFunction(PBEx_WebGadget, "HideWebGadgetEx")
  Prototype ResizeWebGadgetEx(ID, X, Y, Width, Height, ErrorOutput)
  Global ResizeWebGadgetEx.ResizeWebGadgetEx = GetFunction(PBEx_WebGadget, "ResizeWebGadgetEx")
  Prototype HideWebGadgetExDevTools(ID, State, ErrorOutput)
  Global HideWebGadgetExDevTools.HideWebGadgetExDevTools = GetFunction(PBEx_WebGadget, "HideWebGadgetExDevTools")
  Prototype ExecuteWebGadgetExJavaScript(ID, Code.p-Unicode, Output, ErrorOutput)
  Global ExecuteWebGadgetExJavaScript.ExecuteWebGadgetExJavaScript = GetFunction(PBEx_WebGadget, "ExecuteWebGadgetExJavaScript")
  Prototype BindWebGadgetExJavaScript(ID, PBProcedureName.p-Unicode, PBProcedureHandle, PID, ErrorOutput)
  Global BindWebGadgetExJavaScript.BindWebGadgetExJavaScript = GetFunction(PBEx_WebGadget, "BindWebGadgetExJavaScript")
  Prototype GetWebGadgetExAttribute(ID, Attribute, ErrorOutput)
  Global GetWebGadgetExAttribute.GetWebGadgetExAttribute = GetFunction(PBEx_WebGadget, "GetWebGadgetExAttribute")
  
EndIf

Enumeration
  #Window
  #PleaseWait
  #WebGadgetEx
  #ButtonGadget
  #Toolbar
  #Toolbar_New
  #Toolbar_Open
  #Toolbar_Save
  #Toolbar_DevConsole
EndEnumeration

Procedure.s LoadFile()
  
  Protected FileContent.s = ""
  Protected FileName.s = OpenFileRequester("Load file", "", "", 0)
  Protected FF
  
  If FileName
    FF = ReadFile(#PB_Any, FileName)
    If FF
      FileContent = ReadString(FF, #PB_File_IgnoreEOL)
      CloseFile(FF)
    EndIf
  EndIf
  
  ProcedureReturn FileContent
  
EndProcedure

Procedure SaveFile(FileContent.s)
  
  Protected FileName.s = SaveFileRequester("Save file", "", "", 0)
  Protected FF
  
  If FileName
    FF = CreateFile(#PB_Any, FileName)
    If FF
      WriteString(FF, FileContent)
      CloseFile(FF)
    EndIf
  EndIf
  
EndProcedure

Procedure.s DummyCode()
  
  Protected ReturnValue.s
  
  ReturnValue = "class Greeter {" + #CRLF$ +
                "  constructor(public greeting: string) { }" + #CRLF$ +
                "  greet() {" + #CRLF$ +
                "    return '<h1>' + this.greeting + '</h1>';" + #CRLF$ +
                "    }" + #CRLF$ +
                "};" + #CRLF$ +
                "" + #CRLF$ +
                "function Main() {" + #CRLF$ +
                "" + #CRLF$ +
                "  var greeter = new Greeter('Hello, world!');" + #CRLF$ +
                "  document.body.innerHTML = greeter.greet();" + #CRLF$ +
                ""  + #CRLF$ +
                "}" + #CRLF$ +
                "" + #CRLF$ +
                "Main();"  + #CRLF$
  
  ProcedureReturn ReturnValue  
  
EndProcedure


Define Output$ = Space(1000000)
Define ErrorOutput$ = ""
Define WWE
Define FileContent.s

OpenWindow(#Window, #PB_Ignore, #PB_Ignore, 1000, 800, "PB & Monaco", #PB_Window_SystemMenu | #PB_Window_ScreenCentered | #PB_Window_SizeGadget)

CreateToolBar(#Toolbar, WindowID(#Window))
ToolBarStandardButton(#Toolbar_New, #PB_ToolBarIcon_New)
ToolBarToolTip(#Toolbar, #Toolbar_New, "New")
ToolBarStandardButton(#Toolbar_Open, #PB_ToolBarIcon_Open)
ToolBarToolTip(#Toolbar, #Toolbar_Open, "Open...")
ToolBarStandardButton(#Toolbar_Save, #PB_ToolBarIcon_Save)
ToolBarToolTip(#Toolbar, #Toolbar_Save, "Save..")

ToolBarSeparator()

ToolBarStandardButton(#Toolbar_DevConsole, #PB_ToolBarIcon_Properties)
ToolBarToolTip(#Toolbar, #Toolbar_DevConsole, "Dev-Console..")

TextGadget(#PleaseWait, (WindowWidth(#Window) - 100) / 2, (WindowHeight(#Window) - 30) / 2, 100, 30, "Please wait...", #PB_Text_Center)

WebGadgetEx(#WebGadgetEx, 0, ToolBarHeight(#Toolbar), WindowWidth(#Window), WindowHeight(#Window) - ToolBarHeight(#Toolbar), "http://monaco.tuebben.de/pb", WindowID(#Window), @ErrorOutput$)

HideWebGadgetEx(#WebGadgetEx, #True, @ErrorOutput$)

Define Busy

While GetWebGadgetExAttribute(#WebGadgetEx, #PB_Web_Busy, @ErrorOutput$)
  WaitWindowEvent(100)
Wend

HideWebGadgetEx(#WebGadgetEx, #False, @ErrorOutput$)

ExecuteWebGadgetExJavaScript(#WebGadgetEx, ~"setValue(\"" + URLEncoder(DummyCode()) + ~"\");", @Output$, @ErrorOutput$)

Repeat
  
  WWE = WaitWindowEvent()
  
  Select WWE
      
    Case #PB_Event_SizeWindow
      
      Select EventWindow()
          
        Case #Window
          ResizeWebGadgetEx(#WebGadgetEx, 0, ToolBarHeight(#Toolbar), WindowWidth(#Window), WindowHeight(#Window) - ToolBarHeight(#Toolbar), @ErrorOutput$)
          
      EndSelect
      
    Case #PB_Event_Menu
      
      Select EventMenu()
          
        Case #Toolbar_New
          
          ExecuteWebGadgetExJavaScript(#WebGadgetEx, ~"setValue(\"\");", @Output$, @ErrorOutput$)
          
        Case #Toolbar_Open
          
          FileContent = LoadFile()
          If FileContent
            ExecuteWebGadgetExJavaScript(#WebGadgetEx, ~"setValue(\"" + URLEncoder(FileContent) + ~"\");", @Output$, @ErrorOutput$)
          EndIf
          
        Case #Toolbar_Save
          
          ExecuteWebGadgetExJavaScript(#WebGadgetEx, "getValue();", @Output$, @ErrorOutput$)
          SaveFile(Output$)
          
        Case #Toolbar_DevConsole
          
          HideWebGadgetExDevTools(#WebGadgetEx, #False, @ErrorOutput$)
          
      EndSelect
      
    Case #PB_Event_Gadget
      
      Select EventGadget()
      EndSelect
      
  EndSelect
  
Until WWE = #PB_Event_CloseWindow

CloseLibrary(PBEx_WebGadget)

Re: Anwendungsbeispiele für das PB.Ex WebGadget

Verfasst: 01.05.2019 14:43
von Kiffi
Canvas Gauges:

Das nachfolgende einfache Beispiel zeigt, wie man ein JS-Gauge nutzen kann.

Es basiert auf der JS-Library Canvas Gauges (https://canvas-gauges.com/)

Bild

Code: Alles auswählen

EnableExplicit

Define PBEx_WebGadget

CompilerIf #PB_Compiler_Processor = #PB_Processor_x86
  PBEx_WebGadget = OpenLibrary(#PB_Any, "PB.Ex_WebGadget_x86.dll")
CompilerElseIf #PB_Compiler_Processor = #PB_Processor_x64
  PBEx_WebGadget = OpenLibrary(#PB_Any, "PB.Ex_WebGadget_x64.dll")
CompilerEndIf

If PBEx_WebGadget
  Prototype WebGadgetEx(ID, X, Y, Width, Height, URL.p-Unicode, ParentWindowID, ErrorOutput)
  Global WebGadgetEx.WebGadgetEx = GetFunction(PBEx_WebGadget, "WebGadgetEx")
  Prototype SetWebGadgetExText(ID, URL.p-Unicode, ErrorOutput)
  Global SetWebGadgetExText.SetWebGadgetExText = GetFunction(PBEx_WebGadget, "SetWebGadgetExText")
  Prototype GetWebGadgetExText(ID, Output, ErrorOutput)
  Global GetWebGadgetExText.GetWebGadgetExText = GetFunction(PBEx_WebGadget, "GetWebGadgetExText")
  Prototype SetWebGadgetExState(ID, State, ErrorOutput)
  Global SetWebGadgetExState.SetWebGadgetExState = GetFunction(PBEx_WebGadget, "SetWebGadgetExState")
  Prototype SetWebGadgetExItemText(ID, Entry, Text.p-Unicode, ErrorOutput)
  Global SetWebGadgetExItemText.SetWebGadgetExItemText = GetFunction(PBEx_WebGadget, "SetWebGadgetExItemText")
  Prototype GetWebGadgetExItemText(ID, Entry, Output, ErrorOutput)
  Global GetWebGadgetExItemText.GetWebGadgetExItemText = GetFunction(PBEx_WebGadget, "GetWebGadgetExItemText")
  Prototype FreeWebGadgetEx(ID, ErrorOutput)
  Global FreeWebGadgetEx.FreeWebGadgetEx = GetFunction(PBEx_WebGadget, "FreeWebGadgetEx")
  Prototype IsWebGadgetEx(ID, ErrorOutput)
  Global IsWebGadgetEx.IsWebGadgetEx = GetFunction(PBEx_WebGadget, "IsWebGadgetEx")
  Prototype WebGadgetExWidth(ID, ErrorOutput)
  Global WebGadgetExWidth.WebGadgetExWidth = GetFunction(PBEx_WebGadget, "WebGadgetExWidth")
  Prototype WebGadgetExHeight(ID, ErrorOutput)
  Global WebGadgetExHeight.WebGadgetExHeight = GetFunction(PBEx_WebGadget, "WebGadgetExHeight")
  Prototype WebGadgetExX(ID, ErrorOutput)
  Global WebGadgetExX.WebGadgetExX = GetFunction(PBEx_WebGadget, "WebGadgetExX")
  Prototype WebGadgetExY(ID, ErrorOutput)
  Global WebGadgetExY.WebGadgetExY = GetFunction(PBEx_WebGadget, "WebGadgetExY")
  Prototype WebGadgetExID(ID, ErrorOutput)
  Global WebGadgetExID.WebGadgetExID = GetFunction(PBEx_WebGadget, "WebGadgetExID")
  Prototype HideWebGadgetEx(ID, State, ErrorOutput)
  Global HideWebGadgetEx.HideWebGadgetEx = GetFunction(PBEx_WebGadget, "HideWebGadgetEx")
  Prototype ResizeWebGadgetEx(ID, X, Y, Width, Height, ErrorOutput)
  Global ResizeWebGadgetEx.ResizeWebGadgetEx = GetFunction(PBEx_WebGadget, "ResizeWebGadgetEx")
  Prototype HideWebGadgetExDevTools(ID, State, ErrorOutput)
  Global HideWebGadgetExDevTools.HideWebGadgetExDevTools = GetFunction(PBEx_WebGadget, "HideWebGadgetExDevTools")
  Prototype ExecuteWebGadgetExJavaScript(ID, Code.p-Unicode, Output, ErrorOutput)
  Global ExecuteWebGadgetExJavaScript.ExecuteWebGadgetExJavaScript = GetFunction(PBEx_WebGadget, "ExecuteWebGadgetExJavaScript")
  Prototype BindWebGadgetExJavaScript(ID, PBProcedureName.p-Unicode, PBProcedureHandle, PID, ErrorOutput)
  Global BindWebGadgetExJavaScript.BindWebGadgetExJavaScript = GetFunction(PBEx_WebGadget, "BindWebGadgetExJavaScript")
  Prototype GetWebGadgetExAttribute(ID, Attribute, ErrorOutput)
  Global GetWebGadgetExAttribute.GetWebGadgetExAttribute = GetFunction(PBEx_WebGadget, "GetWebGadgetExAttribute")
  
EndIf

Enumeration
  #Window
  #PleaseWait
  #WebGadgetEx
  #Timer
EndEnumeration

Define Output$ = Space(1000000)
Define ErrorOutput$ = ""
Define WWE

OpenWindow(#Window, #PB_Ignore, #PB_Ignore, 300, 300, "PB & Gauge", #PB_Window_SystemMenu | #PB_Window_ScreenCentered | #PB_Window_SizeGadget)

TextGadget(#PleaseWait, (WindowWidth(#Window) - 100) / 2, (WindowHeight(#Window) - 30) / 2, 100, 30, "Please wait...", #PB_Text_Center)

WebGadgetEx(#WebGadgetEx, 0, 0, WindowWidth(#Window), WindowHeight(#Window), GetCurrentDirectory() + "gauge.html", WindowID(#Window), @ErrorOutput$)

HideWebGadgetEx(#WebGadgetEx, #True, @ErrorOutput$)

While GetWebGadgetExAttribute(#WebGadgetEx, #PB_Web_Busy, @ErrorOutput$)
  WaitWindowEvent(100)
Wend

HideWebGadgetEx(#WebGadgetEx, #False, @ErrorOutput$)

AddWindowTimer(#Window, #Timer, 1000)

Repeat
  
  WWE = WaitWindowEvent()
  
  Select WWE
      
    Case #PB_Event_SizeWindow
      
      Select EventWindow()
          
        Case #Window
          ResizeWebGadgetEx(#WebGadgetEx, 0, 0, WindowWidth(#Window), WindowHeight(#Window), @ErrorOutput$)
          
      EndSelect
      
    Case #PB_Event_Timer
      
      Define Value = Random(100, 10)
      
      ExecuteWebGadgetExJavaScript(#WebGadgetEx, "setValue(" + Str(Value) + ");", 0, @ErrorOutput$)
      
  EndSelect
  
Until WWE = #PB_Event_CloseWindow

CloseLibrary(PBEx_WebGadget)
Hier das zugehörige gauge.html:

Code: Alles auswählen

<html>
	<head>
		<script src="https://cdn.rawgit.com/Mikhus/canvas-gauges/gh-pages/download/2.1.5/all/gauge.min.js"></script>
	</head>
	<body>
	
		<canvas id="gauge"></canvas>

		<script>

			var gauge = new RadialGauge({
					renderTo: 'gauge'
			}).draw();

			function setValue(Value) {
				gauge.value = Value;
			}

		</script>
	</body>
</html>