BBjAppLayout.bbj

rem package BBjAppLayout
rem /**
rem  * This file is part of the BBjAppLayout plugin.
rem  * (c) Basis Europe <eu@basis.cloud>
rem  *
rem  * For the full copyright and license information, please view the LICENSE
rem  * file that was distributed with this source code.
rem  */
use com.google.gson.JsonParser
use com.google.gson.JsonObject
use java.util.UUID
rem /**
rem  * An event which is fired when the drawer is opened or closed.
rem  *
rem  * @author Hyyan Abo Fakher
rem  */
interface public BBjAppLayoutEvent
  rem /**
  rem  * Checks if the drawer is opened.
  rem  */

  method public BBjNumber isDrawerOpened()
  rem /**
  rem  * Gets the layout instance.
  rem  *
  rem  * @return BBjAppLayoutEvent
  rem  */

  method public BBjAppLayout getLayout()
  rem /**
  rem  * Alias for `BBjAppLayoutEvent.getLayout()`
  rem  *
  rem  * @return BBjAppLayoutEvent
  rem  */

  method public BBjAppLayout getControl()

interfaceend
rem /**
rem  * BBjAppLayout is a BBj API class that provides a simple way to create a layout for a BBj application.
rem  *
rem  * The layout is responsive and it provides a header, a footer , a drawer, and content area.
rem  * The header and footer are fixed and the drawer slides in and out of the viewport
rem  * and the content is scrollable.
rem  *
rem  * @author Hyyan Abo Fakher
rem  */
class public BBjAppLayout
  rem /**
  rem  * A constant to use to place the drawer at the left side of the layout.
  rem  */
  field public static BBjNumber DRAWER_PLACEMENT_LEFT = 2
  rem /**
  rem  * A constant to use to place the drawer at the right side of the layout.
  rem  */
  field public static BBjNumber DRAWER_PLACEMENT_RIGHT = 4
  rem /**
  rem  * A constant to hide the drawer of the layout.
  rem  */
  field public static BBjNumber DRAWER_PLACEMENT_HIDDEN = 8
  rem /**
  rem  * A constant which defines that the shadow should be hidden.
  rem  */
  field public static BBjNumber SHADOW_HIDDEN = 16
  rem /**
  rem  * A constant which defines that the shadow should be shown on scroll.
  rem  */
  field public static BBjNumber SHADOW_SCROLL = 32
  rem /**
  rem  * A constant which defines that the shadow should always be visible.
  rem  */
  field public static BBjNumber SHADOW_ALWAYS = 64
  rem /**
  rem  * A constant to use for the drawer opened event.
  rem  */
  field public static BBjNumber ON_DRAWER_OPENED = 128
  rem /**
  rem  * A constant to use for the drawer closed event.
  rem  */
  field public static BBjNumber ON_DRAWER_CLOSED = 256
  rem /**
  rem  * A constant to use for the drawer toggled event.
  rem  */
  field public static BBjNumber ON_DRAWER_TOGGLED = 512
  rem /**
  rem  * The layout drawer placement.
  rem  *
  rem  * @see BBjAppLayout.DRAWER_PLACEMENT_LEFT
  rem  * @see BBjAppLayout.DRAWER_PLACEMENT_RIGHT
  rem  * @see BBjAppLayout.DRAWER_PLACEMENT_HIDDEN
  rem  */
  field public BBjNumber DrawerPlacement! = BBjAppLayout.DRAWER_PLACEMENT_LEFT
  rem /**
  rem  * The drawer width.  If the drawer width is set in CSS using the `--dwc-app-layout-drawer-width`
  rem  * custom property, this property will be ignored.
  rem  */
  field public BBjString DrawerWidth! = "16em"
  rem /**
  rem  * When true, the drawer will pop over the header, footer and the content area.
  rem  */
  field public BBjNumber DrawerPopover! = 0
  rem /**
  rem  * When true and the `drawerPopover` is enabled, the drawer will have an overlay behind it when it is opened.
  rem  */
  field public BBjNumber DrawerOverlay! = 1
  rem /**
  rem  * A media query to control when the drawer will be switched to popover mode.
  rem  *
  rem  * Useful for small screens. By default the drawer popover mode will be enabled
  rem  * when the screen size is 800px or less.
  rem  */
  field public BBjString DrawerBreakpoint! = "(max-width: 800px)"
  rem /**
  rem  * TWhen set to scroll, the footer will have a shadow after revealing.
  rem  * When set to always, the shadow will always be visible, otherwise, it's hidden.
  rem  *
  rem  * @see BBjAppLayout.SHADOW_SCROLL
  rem  * @see BBjAppLayout.SHADOW_ALWAYS
  rem  * @see BBjAppLayout.SHADOW_HIDDEN
  rem  */
  field public BBjNumber HeaderShadow! = BBjAppLayout.SHADOW_SCROLL
  rem /**
  rem  * When true, the header will be fixed at the top and won't move when the user scrolls.
  rem  */
  field public BBjNumber HeaderFixed! = 1
  rem /**
  rem  * When true, the header position will be shifted to fit beside the opened drawer.
  rem  */
  field public BBjNumber HeaderOffscreen! = 1
  rem /**
  rem  * When true, the header will be revealed when the user scrolls up.
  rem  */
  field public BBjNumber HeaderReveal! = 0
  rem /**
  rem  * When set to scroll, the footer will have a shadow after revealing.
  rem  * When set to always, the shadow will always be visible, otherwise, it's hidden.
  rem  *
  rem  * @see BBjAppLayout.SHADOW_SCROLL
  rem  * @see BBjAppLayout.SHADOW_ALWAYS
  rem  * @see BBjAppLayout.SHADOW_HIDDEN
  rem  */
  field public BBjNumber FooterShadow! = BBjAppLayout.SHADOW_HIDDEN
  rem /**
  rem  * When true, the footer will be fixed at the top and won't move when the user scrolls.
  rem  */
  field public BBjNumber FooterFixed! = 0
  rem /**
  rem  * When true, the footer position will be shifted to fit beside the opened drawer.
  rem  */
  field public BBjNumber FooterOffscreen! = 1
  rem /**
  rem  * When true, the footer will be revealed when the user scrolls down.
  rem  */
  field public BBjNumber FooterReveal! = 0
  field private BBjControl Drawer!
  field private BBjControl Header!
  field private BBjControl Content!
  field private BBjControl Footer!
  field private BBjWebComponent WebComponent!
  field private BBjWindow Window!
  rem /**
  rem * Constructs a new BBjAppLayout.
  rem *
  rem * @param wnd! the window instance
  rem */
  method public BBjAppLayout(BBjWindow window!)
    #Window! = window!
    #WebComponent! = window!.addWebComponent("dwc-app-layout")
    #WebComponent!.setStyle("width","")
    #WebComponent!.setStyle("height","")
    #WebComponent!.setAttribute("fit-viewport", "")
    #WebComponent!.setTabTraversable(0)
    #WebComponent!.setFocusable(0)
    #WebComponent!.setCallback("dwc-drawer-opened", #this!, "handleClientEvents")
    #WebComponent!.setCallback("dwc-drawer-closed", #this!, "handleClientEvents")
  methodend
  rem /**
  rem  * Gets the components's id.
  rem  *
  rem  * @return BBjNumber
  rem  */
  method public BBjNumber getID()
    methodret #getWebComponent().getID()
  methodend
  rem /**
  rem  * Sets the drawer control.
  rem  *
  rem  * @param drawer! the drawer instance
  rem  */
  method public void setDrawer(BBjControl drawer!)
    #verifySlot(drawer!)
    #Drawer! = drawer!
    #getWebComponent().setSlot("drawer", #getDrawer())
  methodend
  rem /**
  rem  * Get the drawer control.
  rem  *
  rem  * IF the drawer is not set, the METHOD will create a new BBjChildWindow AND set it as drawer.
  rem  *
  rem  * @return BBjControl
  rem  */
  METHOD public BBjControl getDrawer()
    IF(#Drawer! = null())
      #setDrawer(#Window!.addChildWindow("", $00108800$, BBjAPI().getSysGui().getAvailableContext()))
    FI

    methodret #Drawer!
  METHODEND
  rem /**
  rem  * Opens the drawer.
  rem  */
  method public void openDrawer()
    #getWebComponent().putClientProperty("drawerOpened", "true")
  methodend
  rem /**
  rem  * Closes the drawer.
  rem  */
  method public void closeDrawer()
    #getWebComponent().putClientProperty("drawerOpened", "false")
  methodend
  rem /**
  rem  * Toggles the drawer.
  rem  */
  method public void toggleDrawer()
    isDrawerOpened! = #isDrawerOpened()

    if(isDrawerOpened! = 0)
      #closeDrawer()
    else
      #openDrawer()
    fi
  methodend
  rem /**
  rem  * Checks if the drawer is opened.
  rem  *
  rem  * @returns true if the drawer is opened, false otherwise
  rem  */
  method public BBjNumber isDrawerOpened()
    isDrawerOpened! = #getWebComponent().getClientProperty("drawerOpened")

    if(isDrawerOpened! = null())
      isDrawerOpened! = ""
    fi

    methodret num(iff(str(isDrawerOpened!) = "true", 1, 0))
  methodend
  rem /**
  rem  * Sets the drawer position.
  rem  *
  rem  * @param placement! the position of the drawer
  rem  *
  rem  * @see BBjAppLayout.DRAWER_PLACEMENT_LEFT
  rem  * @see BBjAppLayout.DRAWER_PLACEMENT_RIGHT
  rem  * @see BBjAppLayout.DRAWER_PLACEMENT_HIDDEN
  rem  */
  method public void setDrawerPlacement(BBjNumber placement!)
    DrawerPlacement! = placement!
    property! =  ""
    switch placement!
      case BBjAppLayout.DRAWER_PLACEMENT_LEFT
        property! = "left"
        break
      case BBjAppLayout.DRAWER_PLACEMENT_RIGHT
        property! = "right"
        break
      case BBjAppLayout.DRAWER_PLACEMENT_HIDDEN
        property! = "hidden"
        break
      case default
        property! = "left"
        break
    swend

    #getWebComponent().putClientProperty("drawerPlacement", property!)
  methodend
  rem /**
  rem  * Sets the drawer width.
  rem  *
  rem  * @param width! the width of the drawer
  rem  */
  method public void setDrawerWidth(BBjString width!)
    #DrawerWidth! = width!
    #getWebComponent().setStyle("--dwc-app-layout-drawer-width", width!)
  methodend
  rem /**
  rem  * Set the drawer width.
  rem  *
  rem  * If the drawer width set in CSS using the `--dwc-app-layout-drawer-width` custom property
  rem  * then this property will be ignored.
  rem  *
  rem  * @param width! the width of the drawer
  rem  */
  method public void setDrawerWidth(BBjNumber width!)
    #setDrawerWidth(str(width!) + "px")
  methodend
  rem /**
  rem  * When true, the drawer will pop over the header, footer and the content area.
  rem  *
  rem  * @param value! true to popover the drawer.
  rem  */
  method public void setDrawerPopover(BBjNumber value!)
    #DrawerPopover! = value!
    #getWebComponent().putClientProperty("drawerPopover", iff(value! = 0, "false", "true"))
  methodend
  rem /**
  rem  * When true and the `drawerPopover` is enabled, the drawer will have an overlay behind it when it is opened.
  rem  *
  rem  * @param value! true to enable the overlay.
  rem  */
  method public void setDrawerOverlay(BBjNumber value!)
    #DrawerOverlay! = value!
    #getWebComponent().putClientProperty("drawerOverlay", iff(value! = 0, "false", "true"))
  methodend
  rem /**
  rem  * A media query to control when the drawer will be switched to popover mode.
  rem  *
  rem  * Useful for small screens. By default the drawer popover mode will be enabled
  rem  * when the screen size is 800px or less.
  rem  *
  rem  * @param mediaQuery! The media query
  rem  */
  method public void setDrawerBreakpoint(BBjString mediaQuery!)
    #DrawerBreakpoint! = mediaQuery!
    #getWebComponent().putClientProperty("drawerBreakpoint", mediaQuery!)
  methodend
  rem /**
  rem * Sets the header control.
  rem *
  rem * @param header! the header instance
  rem * @throws 256 if the header is null or destroyed
  rem */
  method public void setHeader(BBjControl header!)
    #verifySlot(header!)
    #Header! = header!
    #getWebComponent().setSlot("header", #getHeader())
  methodend
  rem /**
  rem  * Get the header control.
  rem  *
  rem  * IF the header is not set, the METHOD will create a new BBjChildWindow AND set it as header.
  rem  *
  rem  * @return BBjControl
  rem  */
  method public BBjControl getHeader()
    if(#Header! = null())
      #setHeader(#Window!.addChildWindow("", $00108800$, BBjAPI().getSysGui().getAvailableContext()))
    fi

    methodret #Header!
  methodend
  rem /**
  rem  * Set the header shadow type.
  rem  *
  rem  * When `scroll` then the header will have a shadow after revealing.
  rem  * when `always` the shadow will always be visible, hidden otherwise.
  rem  *
  rem  * @param type! the shadow type
  rem  *
  rem  * @see BBjAppLayout.SHADOW_SCROLL
  rem  * @see BBjAppLayout.SHADOW_ALWAYS
  rem  * @see BBjAppLayout.SHADOW_HIDDEN
  rem  */
  method public void setHeaderShadow(BBjNumber shadowType!)
    #HeaderShadow! = shadowType!
    property! = ""
    switch shadowType!
      case BBjAppLayout.SHADOW_ALWAYS
        property! = "always"
        break
      case BBjAppLayout.SHADOW_SCROLL
        property! = "scroll"
        break
      case default
        property! = "none"
        break
    swend

    #getWebComponent().putClientProperty("headerShadow", property!)
  methodend
  rem /**
  rem  * Set the `header-fixed` attribute.
  rem  *
  rem  * When true, the header will be fixed at the top and won't move when the user scrolls.
  rem  *
  rem  * @param BBjNumber True to enable, false to disable.
  rem  */
  method public void setHeaderFixed(BBjNumber value!)
    #HeaderFixed! = value!
    #getWebComponent().putClientProperty("headerFixed", iff(value! = 0, "false", "true"))
  methodend
  rem /**
  rem  * When true, the header position will be shifted to fit beside the opened drawer.
  rem  *
  rem  * @param BBjNumber True to enable, false to disable.
  rem  */
  method public void setHeaderOffscreen(BBjNumber value!)
    #HeaderOffscreen! = value!
    #getWebComponent().putClientProperty("headerOffscreen", iff(value! = 0, "false", "true"))
  methodend
  rem /**
  rem  * When true, the header will be revealed when the user scrolls up.
  rem  *
  rem  * @param BBjNumber True to enable, false to disable.
  rem  */
  method public void setHeaderReveal(BBjNumber value!)
    #HeaderReveal! = value!
    #getWebComponent().putClientProperty("headerReveal", iff(value! = 0, "false", "true"))
  methodend
  rem /**
  rem * Sets the content control.
  rem *
  rem * @param content! the content instance
  rem * @throws 256 if the content is null or destroyed
  rem */
  method public void setContent(BBjControl content!)
    #verifySlot(content!)
    #Content! = content!
    #getWebComponent().setSlot(#getContent())
  methodend
  rem /**
  rem  * Get the content control.
  rem  *
  rem  * IF the content is not set, the METHOD will create a new BBjChildWindow AND set it as content.
  rem  *
  rem  * @return BBjControl
  rem  */
  method public BBjControl getContent()
    if(#Content! = null())
      #setContent(#Window!.addChildWindow("", $00108800$, BBjAPI().getSysGui().getAvailableContext()))
    fi

    methodret #Content!
  methodend
  rem /**
  rem * Sets the footer control.
  rem *
  rem * @param footer! the footer instance
  rem * @throws 256 if the footer is null or destroyed
  rem */
  method public void setFooter(BBjControl footer!)
    #verifySlot(footer!)
    #Footer! = footer!
    #getWebComponent().setSlot("footer", #getFooter())
  methodend
  rem /**
  rem  * Get the footer control.
  rem  *
  rem  * IF the footer is not set, the METHOD will create a new BBjChildWindow AND set it as footer.
  rem  *
  rem  * @return BBjControl
  rem  */
  method public BBjControl getFooter()
    if(#Footer! = null())
      #setFooter(#Window!.addChildWindow("", $00108800$, BBjAPI().getSysGui().getAvailableContext()))
    fi

    methodret #Footer!
  methodend
  rem /**
  rem  * Set the footer shadow type.
  rem  *
  rem  * When `scroll` then the footer will have a shadow after revealing.
  rem  * when `always` the shadow will always be visible, hidden otherwise.
  rem  *
  rem  * @param type! the shadow type
  rem  *
  rem  * @see BBjAppLayout.SHADOW_SCROLL
  rem  * @see BBjAppLayout.SHADOW_ALWAYS
  rem  * @see BBjAppLayout.SHADOW_HIDDEN
  rem  */
  method public void setFooterShadow(BBjNumber shadowType!)
    #FooterShadow! = shadowType!
    property! = ""
    switch shadowType!
      case BBjAppLayout.SHADOW_ALWAYS
        property! = "always"
        break
      case BBjAppLayout.SHADOW_SCROLL
        property! = "scroll"
        break
      case default
        property! = "none"
        break
    swend

    #getWebComponent().putClientProperty("footerShadow", property!)
  methodend
  rem /**
  rem  * When true, the footer will be fixed at the top and won't move when the user scrolls.
  rem  *
  rem  * @param BBjNumber True to enable, false to disable.
  rem  */
  method public void setFooterFixed(BBjNumber value!)
    #FooterFixed! = value!
    #getWebComponent().putClientProperty("footerFixed", iff(value! = 0, "false", "true"))
  methodend
  rem /**
  rem  * When true, the footer position will be shifted to fit beside the opened drawer.
  rem  *
  rem  * @param BBjNumber True to enable, false to disable.
  rem  */
  method public void setFooterOffscreen(BBjNumber value!)
    #FooterOffscreen! = value!
    #getWebComponent().putClientProperty("footerOffscreen", iff(value! = 0, "false", "true"))
  methodend
  rem /**
  rem  * When true, the footer will be revealed when the user scrolls down.
  rem  *
  rem  * @param BBjNumber True to enable, false to disable.
  rem  */
  method public void setFooterReveal(BBjNumber value!)
    #FooterReveal! = value!
    #getWebComponent().putClientProperty("footerReveal", iff(value! = 0, "false", "true"))
  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  * Set an event listener
  rem  *
  rem  * @param event! The event
  rem  * @param callback! The event callback
  rem  */
  method public void setCallback(BBjNumber event!, String callback!)
    BBjAPI().setCustomEventCallback(str(#this!) + str(event!), callback!)
  methodend
  rem /**
  rem  * Set an event listener
  rem  *
  rem  * @param event! The event
  rem  * @param callback! A class instance
  rem  * @param callback! The event method
  rem  */
  method public void setCallback(BBjNumber event!, CustomObject instance!, String method!)
    BBjAPI().setCustomEventCallback(str(#this!) + str(event!), instance!, method!)
  methodend
  rem /**
  rem  * Clear the event callback
  rem  *
  rem  * @param event! The event
  rem  */
  method public void clearCallback(BBjNumber event!)
    BBjAPI().clearCustomEventCallback(str(#this!) + str(event!))
  methodend
  rem /**
  rem  * Handle the client events.
  rem  *
  rem  * <b>IMPORTANT</b> This method is not meant to be part of the public API of the control
  rem  *
  rem  * @param ev! The Javascript event
  rem  *
  rem  * @ignore
  rem  */
  method public void handleClientEvents(BBjWebEvent ev!)
    type$ = ev!.getEventType()
    payload! = new BBjAppLayoutEventImpl(#this!, iff(type$ = "dwc-drawer-opened", 1, 0))
    switch type$
      case "dwc-drawer-opened"
        BBjAPI().postPriorityCustomEvent(str(#this!) + str(BBjAppLayout.ON_DRAWER_OPENED), payload!)
        break
      case "dwc-drawer-closed"
        BBjAPI().postPriorityCustomEvent(str(#this!) + str(BBjAppLayout.ON_DRAWER_CLOSED), payload!)
        break
      case default
        break
    swend

    BBjAPI().postPriorityCustomEvent(str(#this!) + str(BBjAppLayout.ON_DRAWER_TOGGLED), payload!)
  methodend
  rem /**
  rem  * Verify the passed slot is not null and not destroyed
  rem  *
  rem  * @param slot! The slot to verify
  rem  * @throws 256 if the slot is null or destroyed
  rem  */
  method private void verifySlot(BBjControl slot!)
    if(slot! = null())
      throw "The control cannot be null", 256
    fi

    if(slot!.isDestroyed())
      throw "The passed control is destroyed", 256
    fi
  methodend

classend
rem /**
rem  * An implementation of the BBjAppLayoutEvent.
rem  *
rem  * @author Hyyan Abo Fakher
rem  */
class private BBjAppLayoutEventImpl implements BBjAppLayoutEvent

  field protected BBjAppLayout Layout!
  field protected BBjNumber Opened!
  rem /** Disable the default constructor */
  method private BBjAppLayoutEventImpl()
  methodend
  rem /**
  rem  * Construct a new BBjAppLayoutEventImpl
  rem  *
  rem  * @param layout! The instance of the BBjAppLayout object
  rem  * @param opened! The drawer's opened state
  rem  * @param popover! The drawer's popover state
  rem  */
  method public BBjAppLayoutEventImpl(BBjAppLayout layout!, BBjNumber drawerOpened!)
    #Layout! = layout!
    #Opened! = drawerOpened!
  methodend
  rem /**
  rem  * {@inheritDoc}
  rem  */
  method public BBjNumber isDrawerOpened()
    methodret #Opened!
  methodend
  rem /**
  rem  * {@inheritDoc}
  rem  */
  method public BBjAppLayout getLayout()
    methodret #Layout!
  methodend
  rem /**
  rem  * {@inheritDoc}
  rem  */
  method public BBjAppLayout getControl()
    methodret #getLayout()
  methodend

classend