dreemgl/examples/usingtoolkit.js

DreemGL is an open-source multi-screen prototyping framework for mediated environments, with a visual editor and shader styling for webGL and DALi runtimes written in JavaScript. As a toolkit for gpu-accelerated multiscreen development, DreemGL includes

define.class("$server/composition",function(require,$ui$,icon,button,checkbox,label,view,screen,cadgrid,$widgets$,toolkit){
  this.render=function(){
    return [
      screen(
        {flexdirection:"row"},
        cadgrid({
            name:"grid",
            overflow:"scroll",
            bgcolor:vec4(0.08853328227996826,0.11556218564510345,0.16508188843727112,1),
            gridsize:8,
            majorevery:5,
            majorline:vec4(0.34117648005485535,0.34117648005485535,0.34117648005485535,1),
            minorline:vec4(0.17135260999202728,0.17135260999202728,0.17135260999202728,1),
            alignitems:'center',
            alignself:'stretch',
            flexdirection:'column',
            justifycontent:'center',
            toolmove:false,
            toolrect:false
          },
          view({height:436,width:207,pickalpha:-1,bgcolor:'white',position:"absolute",x:106,y:102})
        ),
        toolkit({
          name:"toolkit",
          position:"absolute",
          onvisible:function(ev,v,o){
            var rem=o.find("reminder")
            if(rem){
              rem.opacity=v?0:1.0
            }
          },
          x:679.0001220703125,
          y:55.00000762939453,
          width:300,
          height:672,
          visible:true
        })
      )
    ]
  }
});