HTMLFrame Scrolling Contents: How Do I Capture The Scrollbar Scrolling Events (eg. Drag: Start, Stop Co-Ordinates) ?

[andyhill]

I see no scrollbar events in the ExtEvents list of events, how do I create Scrollbar Events for HTMLFrame when ScrollBars are showing ?

I tried "move" but it never fires ?

[andyhill]

This is one of my many attempts but it fails, any sugestions ?

                                   s:= 'beforeInit=function beforeInit(sender, config)'+
                                         '{'+

                                         '  config:'+
                                         '  {'+
                                         '    refs:'+
                                         '    {'+
                                         '      list: ''...'';'+
                                         '    },'+
                                         '    control:'+
                                         '    {'+
                                         '      list:'+
                                         '      {'+
                                         '        initialize: ''onListInit'';'+
                                         '      }'+
                                         '    }'+
                                         '  },'+

                                         '  onListInit: function()'+
                                         '  {'+
                                         '    var scroller = this.getScrollable().getScroller();'+
                                         '    scroller.on(''scrollstart'', this.onNnListScrollStart, this);'+
                                         '    scroller.on(''scrollend'',   this.onNnListScrollEnd,   this);'+
                                         '  },'+

                                         '  onNnListScrollStart: function(scroller, x, y)'+
                                         '  {'+
                                         '    console.log(''START SCROLL'');'+
                                         '  },'+

                                         '  onNnListScrollEnd: function(scroller, x, y)'+
                                         '  {'+
                                         '    console.log(''scroll x:''+x);'+
                                         '    console.log(''scroll y:''+y);'+
                                         '    var bottom = scroller.maxPosition.y;'+
                                         '    var top    = scroller.minPosition.y;'+
                                         '    var isScrollUp   = scroller.dragDirection.y === -1;'+
                                         '    var isScrollDown = scroller.dragDirection.y === 1;'+
                                         '    if (bottom === y && isScrollDown)'+
                                         '    {'+
                                         '      console.log(''BOTTOM'');'+
                                         '    }'+
                                         '    if (top === y && isScrollUp)'+
                                         '    {'+
                                         '      console.log(''TOP'');'+
                                         '    }'+
                                         '    console.log(''END SCROLL'');'+
                                         '  }'+

                                         '}';

HTMLFrame.ClientEvents.UniEvents.Add(s);
 

[andyhill]

Please advise

[andyhill]

Sherzod, can you please advise when HTMLFrame (and URLFrame) will have scrollbar events ?

I want to capture DRAG-StartXY, DRAG-StopXY via ajax events - please advise - thanks - Andy

 

[Sherzod]

53 minutes ago, andyhill said:

Sherzod, can you please advise when HTMLFrame (and URLFrame) will have scrollbar events ?

Hello,

Once again I will try to figure it out... and try to create a test case.

[andyhill]

Any progress Sherzod

[andyhill]

Any progress ?

[Sherzod]

1 hour ago, andyhill said:

Any progress ?

Sorry for the late reply.

One possible approach, you can try...

1. UniHTMLFrame1.HTML := ...

2. UniHTMLFrame1.AutoScroll = True

3. UniHTMLFrame1.ClientEvents.ExtEvents -> 

function boxready(sender, width, height, eOpts)
{
    if (sender.getScrollable()) {
       sender.getScrollable().on('scrollend', function(cmp, x, y) {
           ajaxRequest(sender, 'scrollend', ['x='+x, 'y='+y])
       });
       sender.getScrollable().on('scrollstart', function(cmp, x, y) {
           ajaxRequest(sender, 'scrollstart', ['x='+x, 'y='+y])
       })
   }
}

4. 

procedure TMainForm.UniHTMLFrame1AjaxEvent(Sender: TComponent;
  EventName: string; Params: TUniStrings);
begin
  if EventName = 'scrollstart' then
    UniMemo1.Lines.Add('scrollstart: '+Params.Values['x'] + ', ' + Params.Values['y'])
  else if EventName = 'scrollend' then
    UniMemo1.Lines.Add('scrollend: '+Params.Values['x'] + ', ' + Params.Values['y'])
end;

 

[andyhill]

Thanks Sherzod, moving forward at last