Gadget scrolling down

Just starting out? Need help? Post your questions and find answers here.
Stefan
Posts: 160
Joined: Mon Feb 05, 2018 9:44 pm

Gadget scrolling down

Post by Stefan »

I'm looking for a way for a ListIconGadget or webgadget or any other gadget where text can go to automatically scroll all the way down.
I need that for a chatbox.
Unfortunately, I can not find anything in the Spiederbasic forum.
Is that possible with Javascript?
Does somebody has any idea?
Stefan
Posts: 160
Joined: Mon Feb 05, 2018 9:44 pm

Re: Gadget scrolling down

Post by Stefan »

Is there really no way to scroll down to the end of a text in a editorgadget or webgadget?
falsam
Posts: 280
Joined: Mon May 05, 2014 9:49 pm
Location: France
Contact:

Re: Gadget scrolling down

Post by falsam »

Hello Stefan. I offer you this solution with a bit of JavaScript.

Code: Select all

EnableExplicit

Enumeration 
  #mf
  #mfHistory
  #mfMessage
  #mfSend
EndEnumeration

Global w, h, Selector, cr.s = "<br>"

Declare onSendMessage()
Declare onResize()

;Window (Full Screen)
OpenWindow(#mf, 0, 0, 0, 0, "", #PB_Window_Background)
w = WindowWidth(#mf)
h = WindowHeight(#mf)

;User history
TextGadget(#mfHistory, 0, 20, w, h - 100, "Welcome. Type your message and press enter (<em>or button Send</em>)")
SetGadgetColor(#mfHistory, #PB_Gadget_BackColor, RGB(192, 192, 192))

;Insert vertical/horizontal scrollbar 
Selector = GadgetID(#mfHistory)
!$(v_selector.div).css("overflow", "scroll") 

;User message
StringGadget(#mfMessage, 0, h - 70, w-100, 24, "Your message", #PB_String_PlaceHolder)
ButtonGadget(#mfSend, w - 95, h - 70, 80, 24, "Send")
AddKeyboardShortcut(#mf, #PB_Shortcut_Return, #mfSend)

;Triggers
BindEvent(#PB_Event_Menu, @onSendMessage(), #mf, #mfSend)
BindGadgetEvent(#mfSend, @onSendMessage())
BindEvent(#PB_Event_SizeDesktop, @onResize())

Procedure onSendMessage()
  Protected Buffer.s
  Protected UserMessage.s = GetGadgetText(#mfMessage)
  
  If UserMessage
     Buffer = GetGadgetText(#mfHistory) + cr + UserMessage  
     SetGadgetText(#mfHistory, Buffer)  
     SetGadgetText(#mfMessage, "")
     
     ;Scroll vertical (Time out : 500
    !$(v_selector.div).animate({scrollTop: $(v_selector.div).prop("scrollHeight")}, 500);
  EndIf
EndProcedure

Procedure onResize()
  Protected w = DesktopWidth(0)
  Protected h = DesktopHeight(0)
  
  ResizeGadget(#mfHistory, #PB_Ignore, #PB_Ignore, w , h - 100)
  ResizeGadget(#mfMessage, #PB_Ignore, h - 70, w - 100, #PB_Ignore)
  ResizeGadget(#mfSend, w - 95, h - 70, #PB_Ignore, #PB_Ignore)
EndProcedure

➽ Windows 11 - JDK 1.8 - SB 2.40 - Android 13
http://falsam.com

Sorry for my poor english
falsam
Posts: 280
Joined: Mon May 05, 2014 9:49 pm
Location: France
Contact:

Re: Gadget scrolling down

Post by falsam »

I created an APK with this code and tested it with a smartphone on Android. It works.

Image

The application not being signed you are obliged to leave the debugger enabled.

you may not display the debug window in the application with theCloseDebugOutput() command at the beginning of the code.

➽ Windows 11 - JDK 1.8 - SB 2.40 - Android 13
http://falsam.com

Sorry for my poor english
Stefan
Posts: 160
Joined: Mon Feb 05, 2018 9:44 pm

Re: Gadget scrolling down

Post by Stefan »

No idea why, but it works perfect!
Thanks you very much! :D
Dirk Geppert
Posts: 282
Joined: Fri Sep 22, 2017 7:02 am

Re: Gadget scrolling down

Post by Dirk Geppert »

Interesting. Thanks Falsam, I can use it too.
Dirk Geppert
Posts: 282
Joined: Fri Sep 22, 2017 7:02 am

Re: Gadget scrolling down

Post by Dirk Geppert »

@Falsam: I use the EditorGadget () to display some text. Unfortunately, SetGadgetText () always scrolls to the bottom of the text.
Is there also a possibility to scroll on top?
User avatar
Peter
Posts: 1086
Joined: Mon Feb 24, 2014 10:17 pm
Location: 127.0.0.1:9080
Contact:

Re: Gadget scrolling down

Post by Peter »

@Dirk:

Code: Select all

EnableExplicit

Enumeration 
  #myWindow
  #cmdScrollDown
  #cmdScrollUp
  #myEditorGadget
EndEnumeration

Procedure EditorScrollDown()
  
  Protected Selector = GadgetID(#myEditorGadget)
  ! $(v_selector.gadget.textbox).animate( { scrollTop: $(v_selector.gadget.textbox).prop("scrollHeight")}, 500); // with animation
  ! // v_selector.gadget.textbox.scrollTop = v_selector.gadget.textbox.scrollHeight; // without animation
  
EndProcedure

Procedure EditorScrollUp()
  
  Protected Selector = GadgetID(#myEditorGadget)
  ! $(v_selector.gadget.textbox).animate( { scrollTop: 0}, 500); // with animation
  ! // v_selector.gadget.textbox.scrollTop = 0; // without animation
  
EndProcedure


OpenWindow(#myWindow, #PB_Ignore, #PB_Ignore, 500, 500, "", #PB_Window_ScreenCentered)

ButtonGadget(#cmdScrollDown, 10, 10, 220, 30, "Scroll down")
ButtonGadget(#cmdScrollUp, 240, 10, 220, 30, "Scroll up")

EditorGadget(#myEditorGadget, 10, 50, 480, 440)

Define Counter
Define Lines.s

For Counter = 0 To 99
  Lines + "Line " + Str(Counter+1) + #CRLF$
Next

SetGadgetText(#myEditorGadget, Lines)

BindGadgetEvent(#cmdScrollDown, @EditorScrollDown())
BindGadgetEvent(#cmdScrollUp, @EditorScrollUp())
Greetings ... Peter
Dirk Geppert
Posts: 282
Joined: Fri Sep 22, 2017 7:02 am

Re: Gadget scrolling down

Post by Dirk Geppert »

Works! :D Thx Peter
KianV
Posts: 21
Joined: Sun Nov 17, 2019 11:38 am

Re: Gadget scrolling down

Post by KianV »

I have used the above code to throw together a text adventure engine, which is heavily based on the Graphic Adventure Creator.
My first endeavour was the pack-in example game 'King's Ransom', which can be found at: http://www.glassfractal.com/adventure/KingsRansom.html .
After that, I attempted to convert a game written with GAC, for which I chose 'Manic Badger', by Psychaedelic Hedgehog Software, simply because it had very few conditions. This may be found at: http://www.glassfractal.com/adventure/ManicBadger.html . According to the author, this was the worst thing that he ever wrote, purely to fulfill a contract, so don't be too harsh.
As a follow-up, I translated 'Saga Of A Mad Barbarian', by the same author, which was a much more well-formed game.
http://www.glassfractal.com/adventure/SOAMB.html.
The engine itself contains everything that was originally in the GAC, with the addition of adjectives and adaptive text (of which there is the tiniest bit in my version of 'King's Ransom'), although, at the moment, the 'SAVE' feature does not appear to work on iPads. I don't know if this is anything to do with Opera, or the settings on my other half's machine, but hopefully I will find out why soon.
The text in the .js file is encrypted to avoid casual code browsers, but I doubt that it would withstand any serious attempts at decoding.
At the moment it is a series of tools written in SpiderBasic, which I will (hopefully) eventually turn into a single application.
The next objective is to actually to write something original with it.
My thanks to Andy Remic for permission to resurrect his work from the dim and distant past.

Edit 17/11/20 - The engine is now finished and I have added a more complete game. The Open Door was released for the Spectrum by Tartan Software and I've messed about with it a bit to test out the more advanced features of the engine.
It can be found at http://www.glassfractal.com/adventure/TheOpenDoor.html
Last edited by KianV on Tue Nov 17, 2020 5:26 pm, edited 1 time in total.
Post Reply