BBjPullToRefresh.bbj

USE java.util.UUID
REM /**
REM  * An event which is fired when the user asks to refresh data.
REM  *
REM  * @author Hyyan Abo Fakher
REM  */
CLASS public BBjPullToRefreshEvent

  FIELD private BBjPullToRefresh Component!
  REM /**
  REM  * Construct a new BBjPullToRefreshEvent.
  REM  *
  REM  * @param component! The instance of the BBjPullToRefreshEvent object
  REM  */
  METHOD public BBjPullToRefreshEvent(BBjPullToRefresh component!)
    #Component! = component!
  METHODEND
  REM /**
  REM  * Get the BBjPullToRefreshEvent instance.
  REM  *
  REM  * @return The widget instance
  REM  */
  METHOD public BBjPullToRefresh getWidget()
    METHODRET #Component!
  METHODEND
  REM /**
  REM  * Alias FOR `BBjPullToRefreshEvent.getWidget()`.
  REM  *
  REM  * @return The control instance
  REM  */
  METHOD public BBjPullToRefresh getControl()
    METHODRET #getWidget()
  METHODEND

CLASSEND
REM /**
REM  * BBjPullToRefresh is a widget which lets a user pull down ON a container using touch in order to refresh OR retrieve more data.
REM  *
REM  * Pull-to-refresh is widely used ON devices with a touch screen. You can USE the APIs shown here to implement pull-to-refresh in your app.
REM  *
REM  * @author Hyyan Abo Fakher
REM  */
CLASS public BBjPullToRefresh
  REM /**
  REM  * A constant which defines that the BBjPullToRefresh will be attached to the passed child window instance
  REM  */
  FIELD public static BBjNumber PREPEND_SELF = 2
  REM /**
  REM  * A constant which defines that the BBjPullToRefresh will be attached to the parent of the passed child window instance
  REM  */
  FIELD public static BBjNumber PREPEND_PARENT = 4
  REM /**
  REM  * A constant which refers to the toast `primary` theme.
  REM  */
  FIELD public static BBjNumber THEME_PRIMARY = 6
  REM /**
  REM  * A constant which refers to the toast `success` theme.
  REM  */
  FIELD public static BBjNumber THEME_SUCCESS = 16
  REM /**
  REM  * A constant which refers to the toast `warning` theme.
  REM  */
  FIELD public static BBjNumber THEME_WARNING = 32
  REM /**
  REM  * A constant which refers to the toast `danger` theme.
  REM  */
  FIELD public static BBjNumber THEME_DANGER = 64
  REM /**
  REM  * A constant which refers to the toast `info` theme.
  REM  */
  FIELD public static BBjNumber THEME_INFO = 128
  REM /**
  REM  * A constant which refers to the toast `gray` theme.
  REM  */
  FIELD public static BBjNumber THEME_GRAY = 256
  REM /**
  REM  * When true , THEN BBjPullToRefresh will be disabled, enabled otherwise REM
  REM  */
  FIELD public Boolean Enabled! = 1
  REM /**
  REM  * The arrow icon to USE when the `stage` is `pull` OR `release`.
  REM  */
  FIELD public BBjString IconArrow! = "dwc:arrow-down"
  REM /**
  REM  * The refresh icon to USE when the `stage` is `refresh`.
  REM  */
  FIELD public BBjString IconRefresh! = "dwc:animated-spinner"
  REM /**
  REM  * The minimum distance of the pull UNTIL the refresher will go into the RELEASE state.
  REM  */
  FIELD public BBjNumber Threshold! = 80
  REM /**
  REM  * The maximum distance of the pull.
  REM  */
  FIELD public BBjNumber ThresholdMax! = Integer.MAX_VALUE
  REM /**
  REM  * The BBjPullToRefresh's theme.
  REM  */
  FIELD public BBjNumber Theme! = BBjPullToRefresh.THEME_PRIMARY
  REM /**
  REM  * The initial instructions string.
  REM  */
  FIELD public BBjString TextPull! = "Pull down to refresh"
  REM /**
  REM  * The RELEASE instructions text
  REM  */
  FIELD public BBjString TextRelease! = "Release to refresh"
  REM /**
  REM  * The refresh instructions text
  REM  */
  FIELD public BBjString TextRefresh! = "Refreshing"
  FIELD private BBjWebComponent WebComponent!
  REM /**
  REM  * Construct a new BBjPullToRefresh component.
  REM  *
  REM  * @param wnd! The child window instance
  REM  * @param prepend! The prepend behavior. USE `BBjPullToRefresh.PREPEND_SELF` to attach the BBjPullToRefresh to the passed child window instance,
  REM  *                 `BBjPullToRefresh.PREPEND_PARENT` to attach the BBjPullToRefresh to the parent of the passed child window instance.
  REM  *
  REM  * @see BBjPullToRefresh.PREPEND_SELF
  REM  * @see BBjPullToRefresh.PREPEND_PARENT
  REM  */
  METHOD public BBjPullToRefresh(BBjChildWindow wnd!, BBjNumber prepend!)
    #WebComponent! = wnd!.addWebComponent("dwc-refresher")
    #WebComponent!.putClientProperty("__canvasId__", wnd!.getClientObjectID())
    #WebComponent!.setStyle("width","")
    #WebComponent!.setStyle("height","")
    #WebComponent!.setStyle("position","")
    #WebComponent!.setTabTraversable(0)
    #WebComponent!.setFocusable(0)
    handler! = new BBjPullToRefreshEventHandler(#this!)
    #WebComponent!.setCallback("dwc-refresh", handler!, "handleClientEvents")
    prependSelector! = "component.__canvas__.parentElement"

    IF(prepend! = BBjPullToRefresh.PREPEND_SELF)
      prependSelector! = "component.__canvas__"
    FI

    script! = "" +
:    "(async () => {" +
:    "  await customElements.whenDefined('dwc-refresher');" +
:    "  component.__canvas__ = objects.get(component.__canvasId__);" +
:    prependSelector! + ".prepend(component);" +
:    "  component.addEventListener('dwc-pull', ev => {"+
:    "    component.__canvas__.style.transform = `translate3d(0px, ${ev.detail}px, 0px)`;" +
:    "  });" +
:    "})()"
    #WebComponent!.executeAsyncScript(script!)
  METHODEND
  REM /**
  REM  * Construct a new BBjPullToRefresh component
  REM  *
  REM  * @param wnd! The child window instance
  REM  */
  METHOD public BBjPullToRefresh(BBjChildWindow wnd!)
    #this!(wnd!, iff(wnd!.isSimpleWindow(), BBjPullToRefresh.PREPEND_SELF, BBjPullToRefresh.PREPEND_PARENT))
  METHODEND
  REM /**
  REM  * Get the control's id.
  REM  *
  REM  * @return BBjNumber
  REM  */
  METHOD public BBjNumber getID()
    METHODRET #getWebComponent().getID()
  METHODEND
  REM /**
  REM  * ENABLE / DISABLE the widget.
  REM  *
  REM  * @param value! when true enabled , disabled otherwise
  REM  */
  METHOD public void setEnabled(Boolean value!)
    #Enabled! = value!
    #getWebComponent().putClientProperty("disabled", iff(!value!, BBjAPI.TRUE, BBjAPI.FALSE))
  METHODEND
  REM /**
  REM  * Set the arrow icon to USE when the `stage` is `pull` OR `release`.
  REM  *
  REM  * Icons can in any of the following formats:
  REM  *
  REM  * <ol>
  REM  *  <li> <b>URL</b>: (ex: /path/to/image.png)
  REM  *  <li> <b>Data URL</b>: (ex: data:image/jpeg;base64,/9j/4SDpRXhpZgAAT....)
  REM  *  <li> <b>ICON_NAME</b>: An icon to LOAD FROM the default BBj icons pool. (ex: `arrow`)
  REM  *  <li> <b>POOL_NAME:ICON_NAME</b>: An icon to LOAD FROM the passed pool. (ex: `feather:arrow`)
  REM  * </ol>
  REM  *
  REM  * @param icon! The icon STRING
  REM  */
  METHOD public void setIconArrow(BBjString icon!)
    #IconArrow! = icon!
    #getWebComponent().putClientProperty("iconArrow", icon!)
  METHODEND
  REM /**
  REM  * Set the refresh icon to USE when the `stage` is `refresh`.
  REM  *
  REM  * Icons can in any of the following formats:
  REM  *
  REM  * <ol>
  REM  *  <li> <b>URL</b>: (ex: /path/to/image.png)
  REM  *  <li> <b>Data URL</b>: (ex: data:image/jpeg;base64,/9j/4SDpRXhpZgAAT....)
  REM  *  <li> <b>ICON_NAME</b>: An icon to LOAD FROM the default BBj icons pool. (ex: `arrow`)
  REM  *  <li> <b>POOL_NAME:ICON_NAME</b>: An icon to LOAD FROM the passed pool. (ex: `feather:arrow`)
  REM  * </ol>
  REM  *
  REM  * @param icon! The icon STRING
  REM  */
  METHOD public void setIconRefresh(BBjString icon!)
    #IconRefresh! = icon!
    #getWebComponent().putClientProperty("iconRefresh", icon!)
  METHODEND
  REM /**
  REM  * Set the minimum distance of the pull UNTIL the refresher will go into the RELEASE state.
  REM  *
  REM  * @param value! The threshold
  REM  */
  METHOD public void setThreshold(BBjNumber value!)
    #Threshold! = value!
    #getWebComponent().putClientProperty("threshold", value!)
  METHODEND
  REM /**
  REM  * Set the maximum distance of the pull.
  REM  *
  REM  * @param value! The threshold
  REM  */
  METHOD public void setThresholdMax(BBjNumber value!)
    #ThresholdMax! = value!
    #getWebComponent().putClientProperty("thresholdMax", value!)
  METHODEND
  REM /**
  REM  * Set the widget theme.
  REM  *
  REM  * @param value! The theme constant
  REM  */
  METHOD public void setTheme(BBjNumber value!)
    property! = null()
    SWITCH value!
      CASE BBjPullToRefresh.THEME_PRIMARY
        property! = "primary"
      CASE BBjPullToRefresh.THEME_SUCCESS
        property! = "success"
      CASE BBjPullToRefresh.THEME_WARNING
        property! = "warning"
      CASE BBjPullToRefresh.THEME_DANGER
        property! = "danger"
      CASE BBjPullToRefresh.THEME_INFO
        property! = "info"
      CASE BBjPullToRefresh.THEME_GRAY
        property! = "gray"
      CASE default
        value! = BBjPullToRefresh.THEME_PRIMARY
        property! = "primary"
    SWEND

    #Theme! = value!
    #getWebComponent().putClientProperty("theme", property!)
  METHODEND
  REM /**
  REM  * Set the initial instructions string.
  REM  *
  REM  * @param value! The pull text
  REM  */
  METHOD public void setTextPull(BBjString value!)
    #TextPull! = value!
    #getWebComponent().putClientProperty("textPull", value!)
  METHODEND
  REM /**
  REM  * Set the RELEASE instructions text.
  REM  *
  REM  * @param value! The RELEASE text
  REM  */
  METHOD public void setTextRelease(BBjString value!)
    #TextRelease! = value!
    #getWebComponent().putClientProperty("textRelease", value!)
  METHODEND
  REM /**
  REM  * Set the refresh instructions text.
  REM  *
  REM  * @param value! The RELEASE text
  REM  */
  METHOD public void setTextRefresh(BBjString value!)
    #TextRefresh! = value!
    #getWebComponent().putClientProperty("textRefresh", value!)
  METHODEND
  REM /**
  REM  * Set a widget attribute.
  REM  *
  REM  * @param key! The attribute's name
  REM  * @param value! The attribute's value
  REM  */
  METHOD public void setAttribute(BBjString key!, BBjString value!)
    #getWebComponent().setAttribute(key!, value!)
  METHODEND
  REM /**
  REM  * Get a widget attribute.
  REM  *
  REM  * @param key! The attribute's name
  REM  */
  METHOD public BBjString getAttribute(BBjString key!)
    METHODRET #getWebComponent().getAttribute(key!)
  METHODEND
  REM /**
  REM  * Finish refreshing
  REM  *
  REM  * This METHOD must be called when the refresh is finished
  REM  */
  METHOD public void finish()
    #getWebComponent().executeAsyncScript("
:    (async () => {
:    await customElements.whenDefined('dwc-refresher');
:    await component.finish();
:    })();
:    ")
  METHODEND
  REM /**
  REM  * Set a refresh callback.
  REM  *
  REM  * The CALLBACK will be invoked every time the user asks to refresh data
  REM  *
  REM  * @param callback! The event CALLBACK
  REM  */
  METHOD public void onRefresh(String callback!)
    BBjAPI().setCustomEventCallback(str(#this!) + "dwc-refresher", callback!)
  METHODEND
  REM /**
  REM  * Set a refresh callback.
  REM  *
  REM  * The CALLBACK will be invoked every time the user asks to refresh data
  REM  *
  REM  * @param callback! A CLASS instance
  REM  * @param callback! The event METHOD
  REM  */
  METHOD public void onRefresh(CustomObject instance!, BBjString method!)
    BBjAPI().setCustomEventCallback(str(#this!) + "dwc-refresher", instance!, method!)
  METHODEND
  REM /**
  REM  * CLEAR the refresh callback.
  REM  */
  METHOD public void clearRefreshCallback()
    BBjAPI().clearCustomEventCallback(str(#this!) + "dwc-refresher")
  METHODEND

CLASSEND
REM /**
REM  * A CLASS which is used to handle the dwc-refresher client events.
REM  *
REM  * @author Hyyan Abo Fakher
REM  */
CLASS public BBjPullToRefreshEventHandler

  FIELD private BBjPullToRefresh Widget!

  METHOD public BBjPullToRefreshEventHandler(BBjPullToRefresh widget!)
    #Widget! = widget!
  METHODEND
  REM /**
  REM  * Handle the client events
  REM  *
  REM  * @param ev! The event
  REM  */
  METHOD public void handleClientEvents(BBjWebEvent ev!)
    type$ = ev!.getEventType()
    payload! = new BBjPullToRefreshEvent(#Widget!)

    IF(type$ = "dwc-refresh") THEN
      BBjAPI().postPriorityCustomEvent(str(#Widget!) + "dwc-refresher", payload!)
    FI
  METHODEND

CLASSEND