TextGadget () - enable Scrollbars

Just starting out? Need help? Post your questions and find answers here.
Dirk Geppert
Posts: 282
Joined: Fri Sep 22, 2017 7:02 am

TextGadget () - enable Scrollbars

Post by Dirk Geppert »

How to add the style = "overflow: auto" to the TextGadget()?

I like to use it for html preview. How can I add the style or is there a better suituable gadget?

Code: Select all

OpenWindow(0, 10, 10, 500, 90, "Html-Preview")
TextGadget(0, 10, 10, 480, 30, "<html><h3>it works</h3><p>Scrollbars would be nice</p><p>How to enable?</p></html>")
Ciao Dirk
User avatar
Peter
Posts: 1086
Joined: Mon Feb 24, 2014 10:17 pm
Location: 127.0.0.1:9080
Contact:

Re: TextGadget () - enable Scrollbars

Post by Peter »

Code: Select all

! $(spider_GadgetID([YourGadget]).div).parent().css("overflow", "auto");
Greetings ... Peter
Dirk Geppert
Posts: 282
Joined: Fri Sep 22, 2017 7:02 am

Re: TextGadget () - enable Scrollbars

Post by Dirk Geppert »

Thx, Peter.

How do I do it with constants or included inside an procedure?

Code: Select all

Enumeration 
  #TEXTGADGET
EndEnumeration

Procedure EnableScrollBars (GadgetID.i)
! $(spider_GadgetID(GadgetID).div).parent().css("overflow", "auto");  
EndProcedure

OpenWindow(0, 10, 10, 500, 90, "Html-Preview")
TextGadget(#TEXTGADGET, 10, 10, 480, 30, "<html><h3>it works</h3><p>Scrollbars would be nice</p><p>How to enable?</p></html>")

; works
! $(spider_GadgetID(0).div).parent().css("overflow", "auto");

; works not
! $(spider_GadgetID(#TEXTGADGET).div).parent().css("overflow", "auto");

; works not
EnableScrollBars(#TEXTGADGET)
User avatar
Peter
Posts: 1086
Joined: Mon Feb 24, 2014 10:17 pm
Location: 127.0.0.1:9080
Contact:

Re: TextGadget () - enable Scrollbars

Post by Peter »

Hello Dirk,
SB-Help wrote:Here are the naming rules to use when accessing SpiderBasic items: - JavaScript variable name is the same in lowercase with a 'v_' prefix.
this means: GadgetID -> v_gadgetid

Code: Select all

Procedure EnableScrollBars (GadgetID.i)
  ! $(spider_GadgetID(v_gadgetid).div).parent().css("overflow", "auto");  
EndProcedure
Greetings ... Peter
Dirk Geppert
Posts: 282
Joined: Fri Sep 22, 2017 7:02 am

Re: TextGadget () - enable Scrollbars

Post by Dirk Geppert »

Thx again Peter!

But, if the text gadget lays on a panel gadget, it unfortunately doesn't work.

Code: Select all

Enumeration
  #PANELGADGET
  #TEXTGADGET
EndEnumeration

Procedure EnableScrollBars (GadgetID.i)
  ! $(spider_GadgetID(v_gadgetid).div).parent().css("overflow", "auto"); 
EndProcedure

OpenWindow(0, 10, 10, 500, 120, "Html-Preview")
PanelGadget(#PANELGADGET, 10, 10, 470, 100)
AddGadgetItem(#PANELGADGET, -1, "Tab 1")
AddGadgetItem(#PANELGADGET, -1, "Tab 2")
TextGadget(#TEXTGADGET, 10, 10, 480, 30, "<html><h3>it works</h3><p>&nbsp;</p><p>Scrollbars would be nice</p><p>&nbsp;</p><p>How to enable?</p></html>")

EnableScrollBars(#TEXTGADGET)



Dirk Geppert
Posts: 282
Joined: Fri Sep 22, 2017 7:02 am

Re: TextGadget () - enable Scrollbars

Post by Dirk Geppert »

Or is there a better way or a better gadget to show a html - preview?
User avatar
Peter
Posts: 1086
Joined: Mon Feb 24, 2014 10:17 pm
Location: 127.0.0.1:9080
Contact:

Re: TextGadget () - enable Scrollbars

Post by Peter »

Dirk Geppert wrote:Or is there a better way or a better gadget to show a html - preview?
you can use a WebGadget.

Code: Select all

WebGadget(#WebGadget, 10, 10, 420, 30, "")
SetGadgetItemText(#WebGadget, #PB_Web_HtmlCode, "<html><h3>it works</h3><p>&nbsp;</p><p>Scrollbars would be nice</p><p>&nbsp;</p><p>How to enable?</p></html>")
Greetings ... Peter
Dirk Geppert
Posts: 282
Joined: Fri Sep 22, 2017 7:02 am

Re: TextGadget () - enable Scrollbars

Post by Dirk Geppert »

Thank you, Peter.

If you try to use SetGdagetItemText () to transfer html code to the WebGadget, this will only be incomplete. (Tested with FireFox 57.0 (64-Bit))

Can you please try the following?

Code: Select all

Enumeration
  #WebGadget
EndEnumeration

OpenWindow(0, 10, 10, 500, 120, "Html-Preview")
WebGadget(#WebGadget, 10, 10, 420, 100, "")
SetGadgetItemText(#WebGadget, #PB_Web_HtmlCode, ReplaceString("<html><p style='line-height: 0px; border-top: 1px solid #ffffff;'>Hallo</p></html>", "'", Chr(34)))
In this example, only the following is received:

Code: Select all

<html><p style="line-height: 0px; border-top: 1px solid
User avatar
Peter
Posts: 1086
Joined: Mon Feb 24, 2014 10:17 pm
Location: 127.0.0.1:9080
Contact:

Re: TextGadget () - enable Scrollbars

Post by Peter »

next try:

Code: Select all

EnableExplicit

Enumeration
  #Window
  #WebGadget
EndEnumeration

Procedure SetWebGadgetHtml(Gadget, Html.s)
  
  If GadgetType(Gadget)=#PB_GadgetType_Web
    ! var iframe = $(spider_GadgetID(v_gadget).div).find("iframe");
    ! iframe.contents().find("html").html(v_html);
    ! $(iframe).load(function(e) {
    !   iframe.contents().find("html").html(v_html);
    ! });
  EndIf

EndProcedure

OpenWindow(#Window, 10, 10, 500, 120, "Html-Preview")

WebGadget(#WebGadget, 10, 10, 420, 100, "")

SetWebGadgetHtml(#WebGadget, ~"<html><p style=\"line-height: 0px; border-top: 1px solid #ffffff;\">Hallo</p></html>")
(tested with Chrome & Ff)

Greetings ... Peter
Dirk Geppert
Posts: 282
Joined: Fri Sep 22, 2017 7:02 am

Re: TextGadget () - enable Scrollbars

Post by Dirk Geppert »

Great! That works - thank you Peter!
Post Reply