openmole / scaladget

Scala lib for generating javascript widgets

scaladget

Scaladget provides a scala facades of some famous javascript libraries. It relies on the scala-js project. Among them:

• Bootstrap-native.js
• Sortable.js
• Ace Editor
• Bootstrap-slider
• Lunr

Usage

Just add this to your dependencies:

  libraryDependencies += "org.openmole.scaladget" %%% "bootstrapnative" % scaladgetVersion
  libraryDependencies += "org.openmole.scaladget" %%% "ace" % scaladgetVersion
  libraryDependencies += "org.openmole.scaladget" %%% "bootstrapslider" % scaladgetVersion
  libraryDependencies += "org.openmole.scaladget" %%% "lunr" % scaladgetVersion

Current version : see release tags section

All the facades are intensively used in the OpenMOLE project.

Bootstrap-native library

Demo

The boostrap-native facade (based on https://thednp.github.io/bootstrap.native/) renders transparent the use of buttons, forms, modals, tables, collapsers, selectors etc...

Imports:

import scaladget.bootstrapnative.bsn._

Here is an example of bootstrap modal dialog creation in full scala:

    import scalatags.JsDom.tags
    
    // Create the Modal dialog
    val modalDialog: ModalDialog =
      ModalDialog(
        onopen = ()=> println("OPEN"),
        onclose = ()=> println("CLOSE")
      )

    // Append header, body, footer elements
    modalDialog header div("Header")
    modalDialog footer buttonGroup()(
      ModalDialog.closeButton(modalDialog, btn_info, "OK"),
      ModalDialog.closeButton(modalDialog, btn_default, "Cancel")
    )

    // Build the dialog and the modal dialog
    tags.span(
      modalDialog.dialog,
      button("Modal !", onclick := {() => modalDialog.show}, btn_primary, marginLeft := 5),
      tags.span(glyph_settings, paddingLeft := 5, pointer, onclick := {()=> modalDialog.show})

And here an example for a dynamic collapser:

buttonIcon("Trigger !", btn_primary).expandOnclick(panel("My text in detail")(width := 400))

Find more examples on the: API Demo Here is an example of scaladget intensive use in the OpenMOLE project

Bootstrap-slider library

See rendering in the API Demo

SVG rendering

A SVG API for rendering typed path in SVG is provided. it is compatible with scalatags. See a simple example here

An example using the scaladget SVG tool and reactive library Laminar can be found in this demo. It reproduces this D3 flowchart.