SpiderBasic Library - Liste neuer Funktionen

Beitrag von **RSBasic** » 19.10.2018 08:57

Erledigt

dige · Beitrag von **dige** » 19.10.2018 10:33

@RSBasic:

vielen, vielen Dank!!!

Beitrag von **RSBasic** » 20.10.2018 09:37

In SpiderBasic existiert zwar BindGadgetEvent() und EventType() für Gadgets, aber 1. nur für wenige Gadgets (z.B. gibt es kein Rechtsklick-Event für Button) und 2. nur wenige Events. Warum? Es ist egal, ob es ein ButtonGadget oder ImageGadget ist. Außerdem gibt es viel mehr Events. Ich habe diese Funktion erweitert. Es gibt jetzt 12 neue Events (Touch-Events, Mouseover, ...) und 11 Events wurden für alle Gadgets freigeschaltet. Die vollständige Liste der Events findet man unter NewMap "Events".

Gadget > (Alle Gadgets) > Mehr Events für BindGadgetEvent() und EventType():

Code: Alles auswählen

EnableExplicit

#PB_EventType_Scroll = #PB_EventType_FirstCustomValue + 1
#PB_EventType_Select = #PB_EventType_FirstCustomValue + 2
#PB_EventType_Copy = #PB_EventType_FirstCustomValue + 3
#PB_EventType_Cut = #PB_EventType_FirstCustomValue + 4
#PB_EventType_Paste = #PB_EventType_FirstCustomValue + 5
#PB_EventType_Drag = #PB_EventType_FirstCustomValue + 6
#PB_EventType_DragEnd = #PB_EventType_FirstCustomValue + 7
#PB_EventType_Drop = #PB_EventType_FirstCustomValue + 8
#PB_EventType_TouchStart = #PB_EventType_FirstCustomValue + 9
#PB_EventType_TouchEnd = #PB_EventType_FirstCustomValue + 10
#PB_EventType_TouchCancel = #PB_EventType_FirstCustomValue + 11
#PB_EventType_TouchMove = #PB_EventType_FirstCustomValue + 12

Procedure BindGadgetEventEx(gadget, callback, eventtype)
  Protected id.s
  Protected NewMap Events.s()
  Protected eventvalue
  Protected eventname.s
  
  If GadgetType(gadget) = #PB_GadgetType_Canvas
    BindGadgetEvent(gadget, callback, eventtype)
  Else
    Events(Str(#PB_EventType_LeftClick)) = "click"
    Events(Str(#PB_EventType_RightClick)) = "contextmenu"
    Events(Str(#PB_EventType_LeftDoubleClick)) = "dblclick"
    Events(Str(#PB_EventType_Focus)) = "focusin"
    Events(Str(#PB_EventType_LostFocus)) = "focusout"
    Events(Str(#PB_EventType_Change)) = "change"
    Events(Str(#PB_EventType_MouseEnter)) = "mouseenter"
    Events(Str(#PB_EventType_MouseLeave)) = "mouseleave"
    Events(Str(#PB_EventType_MouseMove)) = "mousemove"
    Events(Str(#PB_EventType_Scroll)) = "scroll"
    Events(Str(#PB_EventType_KeyDown)) = "keydown"
    Events(Str(#PB_EventType_KeyUp)) = "keyup"
    Events(Str(#PB_EventType_Select)) = "select"
    Events(Str(#PB_EventType_Copy)) = "copy"
    Events(Str(#PB_EventType_Cut)) = "cut"
    Events(Str(#PB_EventType_Paste)) = "paste"
    Events(Str(#PB_EventType_Drag)) = "drag"
    Events(Str(#PB_EventType_DragEnd)) = "dragend"
    Events(Str(#PB_EventType_Drop)) = "drop"
    Events(Str(#PB_EventType_TouchStart)) = "touchstart"
    Events(Str(#PB_EventType_TouchEnd)) = "touchend"
    Events(Str(#PB_EventType_TouchCancel)) = "touchcancel"
    Events(Str(#PB_EventType_TouchMove)) = "touchmove"
    
    ! var GadgetElement = spider_GadgetID(v_gadget).div;
    
    If eventtype = #PB_All
      ! function ParameterPasser(gadget, eventvalue) {
      !   return function() {
      !     spider.event.eventObject = gadget;
      !     spider.event.eventType = eventvalue;
      !     v_callback();
      !   }
      ! }
      ForEach Events()
        eventvalue = Val(MapKey(Events()))
        eventname = Events()
        ! GadgetElement.addEventListener(v_eventname, ParameterPasser(v_gadget, v_eventvalue));
      Next
    Else
      eventname = Events(Str(eventtype))
      ! GadgetElement.addEventListener(v_eventname, function() {
      !   spider.event.eventObject = v_gadget;
      !   spider.event.eventType = v_eventtype;
      !   v_callback();
      ! });
    EndIf
  EndIf
  
EndProcedure

Macro BindGadgetEvent(gadget, callback, eventtype = #PB_All)
  BindGadgetEventEx(gadget, callback, eventtype)
EndMacro

;================================================== Beispielcode ==================================================

Procedure Handler()
  Select EventType()
    Case #PB_EventType_LeftClick
      Debug "Gadget: " + Str(EventGadget())
      Debug "#PB_EventType_LeftClick"
    Case #PB_EventType_RightClick
      Debug "Gadget: " + Str(EventGadget())
      Debug "#PB_EventType_RightClick"
    Case #PB_EventType_Focus
      Debug "Gadget: " + Str(EventGadget())
      Debug "#PB_EventType_Focus"
    Case #PB_EventType_LostFocus
      Debug "Gadget: " + Str(EventGadget())
      Debug "#PB_EventType_LostFocus"
    Case #PB_EventType_KeyDown
      Debug "Gadget: " + Str(EventGadget())
      Debug "#PB_EventType_KeyDown"
    Case #PB_EventType_KeyUp
      Debug "Gadget: " + Str(EventGadget())
      Debug "#PB_EventType_KeyUp"
    Case #PB_EventType_Copy
      Debug "Gadget: " + Str(EventGadget())
      Debug "#PB_EventType_Copy"
    ;...
  EndSelect
  
EndProcedure

CreateImage(1, 100, 100, 24, RGB(0, 0, 255))

If OpenWindow(0, 0, 0, 500, 400, "Window", #PB_Window_ScreenCentered)
  ImageGadget(1, 10, 10, 100, 100, ImageID(1), 0)
  ButtonGadget(2, 10, 120, 100, 20, "Button", 0)
  StringGadget(3, 120, 10, 200, 20, "")
  StringGadget(4, 120, 40, 200, 20, "")
  
  BindGadgetEvent(1, @Handler(), #PB_EventType_RightClick)
  BindGadgetEvent(2, @Handler())
  BindGadgetEvent(3, @Handler())
  BindGadgetEvent(4, @Handler())
  
EndIf

¯\_(ツ)_/¯ · Beitrag von **¯\_(ツ)_/¯** » 20.10.2018 09:59

Einfach nur klasse.

Danke

Beitrag von **Kiffi** » 22.10.2018 10:32

RSBasic hat geschrieben:In SpiderBasic existiert zwar BindGadgetEvent() und EventType() für Gadgets, aber [...]

Habe mal sowas ähnliches gemacht: https://github.com/spiderbytes/GadgetEventEx

Beitrag von **RSBasic** » 22.10.2018 10:41

Achso, das habe ich nicht gewusst. Ich habe deinen Code als 2. Variante in mein Inhaltsverzeichnis hinzugefügt.

Beitrag von **RSBasic** » 22.10.2018 11:31

Man kann ein FullScreen-Fenster mit dem Flag #PB_Window_Background erstellen und z.B. eine Höhe von 2000 Pixel festlegen.
Leider kann man trotzdem nicht scrollen. Das liegt daran, dass das DIV-Element auf "overflow:hidden" festgelegt ist. Um scrollen zu können (auch sinnvol für mobile Geräte), muss man nachträglich auf "overflow: auto" festlegen.

Hier ein Bugfix:

Code: Alles auswählen

EnableExplicit

Procedure OpenWindowEx(window, y, x, innerwidth, innerheight, Title.s, Flags, ParentID)
  Protected ReturnValue
  
  ReturnValue = OpenWindow(window, y, x, innerwidth, innerheight, Title, Flags, ParentID)
  
  If Flags & #PB_Window_Background
    ! spider_WindowID(v_window).contentFrame.style.overflow = "auto";
    If innerwidth > 0
      ! spider_WindowID(v_window).content.style.width = v_innerwidth + "px";
    EndIf
    If innerheight > 0
      ! spider_WindowID(v_window).content.style.height = v_innerheight + "px";
    EndIf
  EndIf
  
  ProcedureReturn ReturnValue
EndProcedure

Macro OpenWindow(Window, y, x, InnerWidth, InnerHeight, Title, Flags = 0, ParentID = 0)
  OpenWindowEx(Window, y, x, InnerWidth, InnerHeight, Title, Flags, ParentID)
EndMacro

;================================================== Beispielcode ==================================================

Define a

If OpenWindow(0, 0, 0, 0, 2000, "Window", #PB_Window_Background)
  For a=1 To 50
    ButtonGadget(a, 50, a*50, 100, 20, "Button " + Str(a), 0)
  Next
  
EndIf

Beitrag von **Kiffi** » 22.10.2018 11:43

RSBasic hat geschrieben:Achso, das habe ich nicht gewusst.

kein Thema! Wollt's nur erwähnen. Was es für SB so alles gibt, ist sowieso nicht klar ersichtlich (auch weil die Suchfunktion des SB-Forums verbesserungswürdig ist).

RSBasic hat geschrieben:Ich habe deinen Code als 2. Variante in mein Inhaltsverzeichnis hinzugefügt.

Danke! By the way: Very good job!

Beitrag von **RSBasic** » 22.10.2018 13:01

Wenn man kein #PB_Window_Background benutzt, dann hat man keine Möglichkeit, den Seiten-Titel zu ändern. Jetzt ist es möglich:

Code: Alles auswählen

EnableExplicit

Procedure SetSiteTitle(title.s)
  ! document.title = v_title;
EndProcedure

;================================================== Beispielcode ==================================================

If OpenWindow(0, 0, 0, 500, 400, "Window", #PB_Window_ScreenCentered)
  
  SetSiteTitle("My own cool title :-)")
  
EndIf

Beitrag von **RSBasic** » 22.10.2018 13:01

Wenn man nachträglich den Hintergrund der Seite ändern möchte, ist es jetzt möglich:

Code: Alles auswählen

EnableExplicit

#PB_Site_Background_X_Left = #PB_EventType_FirstCustomValue + 1
#PB_Site_Background_X_Center = #PB_EventType_FirstCustomValue + 2
#PB_Site_Background_X_Right = #PB_EventType_FirstCustomValue + 3
#PB_Site_Background_Y_Top = #PB_EventType_FirstCustomValue + 4
#PB_Site_Background_Y_Center = #PB_EventType_FirstCustomValue + 5
#PB_Site_Background_Y_Bottom = #PB_EventType_FirstCustomValue + 6
#PB_Site_Background_Width_Auto$ = "auto"
#PB_Site_Background_Width_Cover$ = "cover"
#PB_Site_Background_Width_Contain$ = "contain"
#PB_Site_Background_Height_Auto$ = "auto"
#PB_Site_Background_Height_Cover$ = "cover"
#PB_Site_Background_Height_Contain$ = "contain"
#PB_Site_Background_Color_Transparent = #PB_EventType_FirstCustomValue + 7
#PB_Site_Background_Repeat_No = #PB_EventType_FirstCustomValue + 8
#PB_Site_Background_Repeat_Yes = #PB_EventType_FirstCustomValue + 9
#PB_Site_Background_Repeat_OnlyX = #PB_EventType_FirstCustomValue + 10
#PB_Site_Background_Repeat_OnlyY = #PB_EventType_FirstCustomValue + 11

Procedure SetSiteBackground(x, y, width.s, height.s, color, image.s, repeat_type, isfixed)
  Protected styles.s
  Protected position_x.s
  Protected position_y.s
  Protected position_size.s
  Protected background_color.s
  Protected background_repeat.s
  Protected position_type.s
  
  ;Falls nicht existiert, dann <style type="text/css" id="SBCustomStyles"></style> im Head erstellen, ohne Inline-Styles verwenden zu müssen
  ! if (!document.getElementById('SBCustomStyles')) {
  !   var StyleElement = document.createElement('style');
  !   StyleElement.type = 'text/css';
  !   StyleElement.id = 'SBCustomStyles';
  !   var HeadElement = document.getElementsByTagName('head')[0];
  !   HeadElement.appendChild(StyleElement);
  ! }
  
  Select x
    Case #PB_Site_Background_X_Left
      position_x = "left"
    Case #PB_Site_Background_X_Center
      position_x = "center"
    Case #PB_Site_Background_X_Right
      position_x = "right"
    Default
      position_x = Str(x) + "px"
  EndSelect
  Select y
    Case #PB_Site_Background_Y_Top
      position_y = "top"
    Case #PB_Site_Background_Y_Center
      position_y = "center"
    Case #PB_Site_Background_Y_Bottom
      position_y = "bottom"
    Default
      position_y = Str(y) + "px"
  EndSelect
  If width = #PB_Site_Background_Width_Auto$ Or height = #PB_Site_Background_Height_Auto$
    position_size = "auto"
  ElseIf width = #PB_Site_Background_Width_Cover$ Or height = #PB_Site_Background_Height_Cover$
    position_size = "cover"
  ElseIf width = #PB_Site_Background_Width_Contain$ Or height = #PB_Site_Background_Height_Contain$
    position_size = "contain"
  Else
    If FindString(width, "%") > 0
      position_size = width + " "
    Else
      position_size = width + "px "
    EndIf
    If FindString(height, "%") > 0
      position_size + height + " "
    Else
      position_size + height + "px"
    EndIf
  EndIf
  If color = #PB_Site_Background_Color_Transparent
    background_color = "transparent"
  Else
    background_color = "#" + RSet(Hex(Red(color)), 2, "0") + RSet(Hex(Green(color)), 2, "0") + RSet(Hex(Blue(color)), 2, "0")
  EndIf
  Select repeat_type
    Case #PB_Site_Background_Repeat_No
      background_repeat = "no-repeat"
    Case #PB_Site_Background_Repeat_Yes
      background_repeat = "repeat"
    Case #PB_Site_Background_Repeat_OnlyX
      background_repeat = "repeat-x"
    Case #PB_Site_Background_Repeat_OnlyY
      background_repeat = "repeat-y"
  EndSelect
  If isfixed
    position_type = "fixed"
  Else
    position_type = "scroll"
  EndIf
  If image = ""
    styles = "html { background: none; background-color: " + background_color + ";}"
  Else
    styles = "html { background: url('" + image + "') " + background_repeat + " " + position_type + " " + position_x + " " + position_y + " " + background_color + "; background-size: " + position_size + "; }"
  EndIf
  
  ;Styles hinzufügen
  ! document.getElementById("SBCustomStyles").appendChild(document.createTextNode( v_styles ));
  
EndProcedure

;================================================== Beispielcode ==================================================

If OpenWindow(0, 0, 0, 500, 400, "Window", #PB_Window_ScreenCentered)
  
  ;SetSiteBackground(0, 0, "", "", RGB(0, 0, 255), "", 0, 0)
  ;SetSiteBackground(0, 0, #PB_Site_Background_Width_Auto$, #PB_Site_Background_Height_Auto$, 0, "https://www.rsbasic.de/wp-content/themes/inove_/img/bg.jpg", #PB_Site_Background_Repeat_OnlyX, 0)
  SetSiteBackground(0, 0, #PB_Site_Background_Width_Auto$, #PB_Site_Background_Height_Auto$, RGB(234, 236, 244), "https://www.purebasic.fr/german/styles/subsilverPlus/imageset/PureBoardLogo.png", #PB_Site_Background_Repeat_Yes, 0)
  ;SetSiteBackground(#PB_Site_Background_X_Right, #PB_Site_Background_Y_Bottom, #PB_Site_Background_Width_Auto$, #PB_Site_Background_Height_Auto$, RGB(234, 236, 244), "https://www.purebasic.fr/german/styles/subsilverPlus/imageset/PureBoardLogo.png", #PB_Site_Background_Repeat_No, 0)

EndIf

PureBoard

SpiderBasic Library - Liste neuer Funktionen

Re: SpiderBasic Library - Liste neuer Funktionen

Re: SpiderBasic Library - Liste neuer Funktionen

Re: SpiderBasic Library - Liste neuer Funktionen

Re: SpiderBasic Library - Liste neuer Funktionen

Re: SpiderBasic Library - Liste neuer Funktionen

Re: SpiderBasic Library - Liste neuer Funktionen

Re: SpiderBasic Library - Liste neuer Funktionen

Re: SpiderBasic Library - Liste neuer Funktionen

Re: SpiderBasic Library - Liste neuer Funktionen

Re: SpiderBasic Library - Liste neuer Funktionen