SetGadgetBorder() rückgängig machen

Hier könnt ihr alle Fragen zu SpiderBasic austauschen.
stevie1401
Beiträge: 659
Registriert: 19.10.2014 15:51
Kontaktdaten:

SetGadgetBorder() rückgängig machen

Beitrag von stevie1401 »

in der Procedure SetGadgetBorder() kann ich Gadgetumrandungen erstellen.
Kann ich das auch wieder rückgangig machen?

Code: Alles auswählen

Procedure SetGadgetBorder(gadget, position, width, color, type, radius)

  
  
  Protected styles.s
  Protected id.s
  Protected hexcolor.s
  Protected border_position.s
  Protected border_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);
  ! };
  
  ;Falls nicht existiert, dann eine ID im Hauptelement erstellen, um später per CSS besser darauf zugreifen zu können
  ! var GadgetElement = $(spider_GadgetID(v_gadget).div);
  ! if (GadgetElement.attr("id")) {
  !   v_id = GadgetElement.attr("id");
  ! } else {
  !   GadgetElement.attr("id", "SB_Gadget_" + v_gadget);
  !   v_id = GadgetElement.attr("id");
  ! };
  
  ;RGB in Hex konvertieren
  hexcolor = "#" + RSet(Hex(Red(color)), 2, "0") + RSet(Hex(Green(color)), 2, "0") + RSet(Hex(Blue(color)), 2, "0")
  
  Select position
    Case #SB_Gadget_Border_Position_All
      border_position = "border"
    Case #SB_Gadget_Border_Position_Top
      border_position = "border-top"
    Case #SB_Gadget_Border_Position_Right
      border_position = "border-right"
    Case #SB_Gadget_Border_Position_Bottom
      border_position = "border-bottom"
    Case #SB_Gadget_Border_Position_Left
      border_position = "border-left"
  EndSelect
  
  Select type
    Case #SB_Gadget_Border_Type_Dashed
      border_type = "Dashed"
    Case #SB_Gadget_Border_Type_Dotted
      border_type = "Dotted"
    Case #SB_Gadget_Border_Type_Double
      border_type = "Double"
    Case #SB_Gadget_Border_Type_Groove
      border_type = "Groove"
    Case #SB_Gadget_Border_Type_Inset
      border_type = "Inset"
    Case #SB_Gadget_Border_Type_Outset
      border_type = "Outset"
    Case #SB_Gadget_Border_Type_Ridge
      border_type = "Ridge"
    Case #SB_Gadget_Border_Type_Solid
      border_type = "Solid"
  EndSelect
  
  styles = "#" + id + " "
  
  ;Unterstützte Gadgets und deren Style-Erstellungen
  Select GadgetType(gadget)
    Case #PB_GadgetType_Button
      styles + ".dijitButtonNode"
    Case #PB_GadgetType_ButtonImage
      styles + ".dijitButtonNode"
    Case #PB_GadgetType_Calendar
      styles + ".dijitCalendar"
    Case #PB_GadgetType_Canvas
      styles + ""
    Case #PB_GadgetType_CheckBox
      styles + ""
    Case #PB_GadgetType_ComboBox
      styles + ".dijitComboBox"
    Case #PB_GadgetType_Container
      styles + ""
    Case #PB_GadgetType_Date
      styles + ".dijitTextBox"
    Case #PB_GadgetType_Editor
      styles + ".dijitTextBox"
    Case #PB_GadgetType_Frame
      styles + ".sbFrameBorder"
    Case #PB_GadgetType_HyperLink
      styles + ""
    Case #PB_GadgetType_Image
      styles + ""
    Case #PB_GadgetType_ListIcon
      styles + ".dgrid"
    Case #PB_GadgetType_ListView
      styles + ".dgrid"
    Case #PB_GadgetType_Option
      styles + ""
    Case #PB_GadgetType_Panel
      styles = ""
      styles + ".claro #" + id + " .dijitTabPaneWrapper, .claro #" + id + " .dijitTabContainerTop-tabs, .claro #" + id + " .dijitTabContainerBottom-tabs, .claro #" + id + " .dijitTabContainerLeft-tabs, .claro #" + id + " .dijitTabContainerRight-tabs { border-color: " + hexcolor + "; } .claro #" + id + " .dijitTab { border: 1px " + border_type + " " + hexcolor + "; } .claro #" + id + " .dijitTabChecked { border-color: " + hexcolor + "; border-bottom: 1px solid #ffffff; }"
      styles + ".flat #" + id + " .dijitTabContainerTop-tabs .dijitTabChecked { border-bottom: 1px solid #fff; } .flat  #" + id + " .dijitTabPaneWrapper, .flat  #" + id + " .dijitTab"
    Case #PB_GadgetType_ProgressBar
      styles + ".dijitProgressBar"
    Case #PB_GadgetType_ScrollArea
      styles + ""
    Case #PB_GadgetType_Spin
      styles + ".dijitSpinner"
      ProcedureReturn 0
    Case #PB_GadgetType_Splitter
      styles + ""
    Case #PB_GadgetType_String
      styles + ".dijitTextBox"
    Case #PB_GadgetType_Text
      styles + ""
    Case #PB_GadgetType_TrackBar
      styles + ""
    Case #PB_GadgetType_Tree
      styles + ""
    Case #PB_GadgetType_Web
      styles + ""
    Default
      ProcedureReturn 0
  EndSelect
  
  styles + " { " + border_position + ": " + width + "px " + border_type + " " + hexcolor + "; border-radius: " + radius + "px; overflow: hidden; }"
  
  ;Styles hinzufügen
  ! document.getElementById("SBCustomStyles").appendChild(document.createTextNode( v_styles ));
  
EndProcedure
Ich programmiere nur noch mit Linux.
Linux Mint 21.x
Benutzeravatar
Kiffi
Beiträge: 10621
Registriert: 08.09.2004 08:21
Wohnort: Amphibios 9

Re: SetGadgetBorder() rückgängig machen

Beitrag von Kiffi »

Code: Alles auswählen

Procedure RemoveGadgetBorder(gadget)
  
  ! var ele = Array.from(document.getElementById("SBCustomStyles").childNodes).find((node) => {return node.nodeValue.includes("#SB_Gadget_" + v_gadget)});
  ! if (ele) $(ele).remove();
  
EndProcedure
Hygge
stevie1401
Beiträge: 659
Registriert: 19.10.2014 15:51
Kontaktdaten:

Re: SetGadgetBorder() rückgängig machen

Beitrag von stevie1401 »

Mensch Kiffi, du bist echt ne große Hilfe! :allright:
Woher weisst du das alles nur?
Ich programmiere nur noch mit Linux.
Linux Mint 21.x
Benutzeravatar
RSBasic
Admin
Beiträge: 8022
Registriert: 05.10.2006 18:55
Wohnort: Gernsbach
Kontaktdaten:

Re: SetGadgetBorder() rückgängig machen

Beitrag von RSBasic »

Das weiß man automatisch, wenn man nicht nur SpiderBasic kann, sondern auch HTML, CSS und Javascript. Deshalb habe ich dir damals schon empfohlen, dass man sich auch mit Websprachen beschäftigt. Es hat nur Vorteile, wie man sieht. :)
Aus privaten Gründen habe ich leider nicht mehr so viel Zeit wie früher. Bitte habt Verständnis dafür.
Bild
Bild
Benutzeravatar
RSBasic
Admin
Beiträge: 8022
Registriert: 05.10.2006 18:55
Wohnort: Gernsbach
Kontaktdaten:

Re: SetGadgetBorder() rückgängig machen

Beitrag von RSBasic »

Vor zwei Monaten hat meine Schwester angefangen, HTML, CSS und Javascript zu lernen, nachdem sie zufällig auf Youtube ein Video "Eine WebApp programmieren" entdeckt hat.
Sie hatte davor nie Interesse gehabt und sie hat noch nie was programmiert, aber erst durch dieses Video ist sie auf den Geschmack zu gekommen und wollte es lernen. Ich habe meiner Schwester jeden Tag geholfen und ihr HTML, CSS und Javascript beigebracht.
Nach anderthalb Monate kennt sie sich mit HTML, CSS und Javascript gut aus und hat schon zwei WebApps (Einkaufsliste-/Bestell-App mit WhatsApp-Anbindung und Geburtstagsapp mit Benachrichtigung) inkl. responsive Webdesign erfolgreich entwickelt. Da bin ich richtig stolz aud sie, dass sie so nach kurzer Zeit geschafft hat, das alles zu lernen und zu verstehen.
Wenn du auch sowas lernen möchtest, kann ich dir auch helfen. Ansonsten gibt es im Internet genug Turorials und man braucht auch nicht Jahre, damit man es versteht. Wenn du HTML, CSS und Javascript verstehst, dann bist du in der Lage, dein SpiderBasic-Programm beliebig zu erweitern, egal ob SpiderBasic das nativ nicht kann, aber dank HTML, CSS und Javascript hast du viel mehr Möglichkeiten. :)
Siehe mein Thread "SpiderBasic Library - Liste neuer Funktionen". Da habe ich auch ohne Probleme vieles erweitern können.
Es lohnt sich auf jeden Fall, wenn man sich mit HTML, CSS und Javascript beschäftigt. :)
Aus privaten Gründen habe ich leider nicht mehr so viel Zeit wie früher. Bitte habt Verständnis dafür.
Bild
Bild
Antworten