CSimpleTable Demo

main.opa

import stdlib.core.web.resource
import stdlib.core
import stdlib.components.simpletable
import stdlib.widgets.core

type row = {red:int}
         / {blue:string}
         / {other:string}

type a = {A} / {B} / {C}

type state = {Init}

row_to_string(row : row) : string =  //this will be dom uniq id's -> no space nor special char
  match row with
  | {red=i} ->
  | {blue=s} -> "blue{s}"
  | {other=s} -> "other{s}"
  end


//transform a value into list of xhtml : each element will be a differant column
cell_widgets(row : row, _table : CSimpleTable.t(a, state, row)) =
  tmp = {
    html= id, _ -> match row with
                     | {red=_}
                     | {blue=_}
                     | {other=_} -> [<>first cell</>,<>second cell</>]
    set_value = id, v -> void} : CSimpleTable.Cell.widget(a)
  (tmp,WStyler.empty,false)

//ordering functions
row_order1(r1 : row, r2 : row) = match (r1,r2) with
  | ({red=_},{blue=_}) -> {lt}
  | ({red=_},_) -> {gt}
  | (_,_) -> {neq}
  end

row_order2(r1 : row, r2 : row) = match (r1,r2) with
  | ({red=_},{blue=_}) -> {lt}
  | ({red=_},_) -> {gt}
  | (_,_) -> {neq}
  end

//configuration of the simpletable
default_config = CSimpleTable.default_config(row_to_string,cell_widgets)
config = {default_config with
  headers = [{title="column 1" sort=some(row_order1) filter=none : option(CSimpleTable.header_filter(row))},
             {title="column 2" sort=some(row_order2) filter=none : option(CSimpleTable.header_filter(row))}
	    ]}

//how to fetch value (content) from a row. none if no value associated to row
fetch_value(row : row) = match row with
  | {red=i} -> some({A})
  | {blue=s} -> some({B})
  | {other=s} -> some({C})
  end


callbacks = CSimpleTable.default_callbacks(fetch_value)


//initial rows
rows = [ {red=3}, {other="orange"}]
//initial values
els = [] //empty, fetch_value will be called to get the value of initial rows

display = CSimpleTable.default_display(20) //we wanna show 10 lines

id="simpletable_id"

//you should have a dom element with the right id inside the dom
// the table will install itself in this dom element

onready() =
    table = CSimpleTable.create(config,id, callbacks, rows, els, display)
    Dom.transform([#{id} <- CSimpleTable.generate_page(table, "CSimpleTable")])

main() : xhtml =
    <h1>CSimpleTable Demo</h1>
    <p>This is a quick demo of CSimpleTable</p>
    <div id=#{id} onready={_->onready()}></div>
    


server = Server.one_page_server("CSimpleTable", main)