Page 1 of 2

Gadget scrolling down

Posted: Mon Feb 05, 2018 9:51 pm
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?

Re: Gadget scrolling down

Posted: Fri Feb 09, 2018 7:43 am
by Stefan
Is there really no way to scroll down to the end of a text in a editorgadget or webgadget?

Re: Gadget scrolling down

Posted: Fri Feb 09, 2018 2:46 pm
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

Re: Gadget scrolling down

Posted: Fri Feb 09, 2018 3:45 pm
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.

Re: Gadget scrolling down

Posted: Fri Feb 09, 2018 10:15 pm
by Stefan
No idea why, but it works perfect!
Thanks you very much! :D

Re: Gadget scrolling down

Posted: Mon Feb 12, 2018 9:57 am
by Dirk Geppert
Interesting. Thanks Falsam, I can use it too.

Re: Gadget scrolling down

Posted: Mon Feb 12, 2018 11:25 am
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?

Re: Gadget scrolling down

Posted: Mon Feb 12, 2018 11:48 am
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

Re: Gadget scrolling down

Posted: Tue Feb 13, 2018 9:38 am
by Dirk Geppert
Works! :D Thx Peter

Re: Gadget scrolling down

Posted: Mon Dec 09, 2019 6:31 pm
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