Visual JS -Add TextBox
Textbox is also label .
by Nikola Lukic
HTML
<script src="https://maximumroulette.com/visual-js/manifest/manifest_jsfiddle.js"></script>
<script src="https://maximumroulette.com/visual-js/lib/build.js"></script>
<body style="margin:0;padding:0;border:none;background-color:black;">
<div id="UPLOAD_BOX" style="display:block" >
</div>
<div id="experiment" style="display:block" >
<video id="webcam" autoplay width="640" height="480" style="display:none;position:absolute;left:0;top:0;"></video>
<canvas id="canvas-blended" width="640" height="480" style="position:absolute;left:0;top:0;display:none;"></canvas>
<canvas id="canvas-render" width="640" height="480" style="position:absolute;left:0;top:0;display:none;"></canvas>
</div>
<canvas tabindex='1' width="1" height="1" id="HELLO_WORLD"></canvas>
<div style="display:block;">
<!--audio controls id="audio_ambient" >
<source src="http://radio.nessradio.net:8000/nessradio.mp3" type="audio/mpeg">
<source src="http://radio.nessradio.net:8000/nessradio.ogg" type="audio/ogg">
</audio-->
</div>
</body>
JavaScript
// visual js 0.7 comes with one lib build .
// You can make build with windows GUI visual js tools (makeBuild.exe)
// will be posted as soon as i commit
// Basic example , add new game_object add image with absolute path
// nice ofr distribution system of image res loading
// In this example program is in the edit mode but only for make look
// you cant use rigth contex menu at this page
// See https://bitbucket.org/nikola_l/visual-js
// This is first you will need :
// make surface draws and update functions
SYS.DOM.CREATE_SURFACE( "SURF" , "HELLO_WORLD" , 100 , 99.4 , "DIAMETRIC" );
//One program have a one engine , engine runs modules
//One modul have a gameobjects , use more modules for composition
HELLO_WORLD.ENGINE.CREATE_MODUL("STARTER");
// if you setup in manifest
// IMAGE_LOADER_PREFIX : false , you can put full url
// if you setup true , path have prefix /res/animations/
RESOURCE.Tiles = {source : [ "https://maximumroulette.com/framework/res/animations/Tiles/boxCrate.png" ]};
RESOURCE.Lock = {source : [ "https://maximumroulette.com/framework/res/animations/Tiles/lockBlue.png" ]};
// value 1 is speed !!
HELLO_WORLD.ENGINE.MODULES.ACCESS_MODULE("STARTER").NEW_OBJECT("IamNewObject" , 12 , 25 , 35 , 15 , 1 );
HELLO_WORLD.ENGINE.MODULES.ACCESS_MODULE("STARTER").NEW_OBJECT("IamNewObject2" ,57 , 25 , 35 , 15 , 1 );
HELLO_WORLD.ENGINE.MODULES.ACCESS_MODULE("STARTER").NEW_OBJECT("Time" , 10 ,60 , 85 , 15 , 1 );
HELLO_WORLD.ENGINE.MODULES.ACCESS_MODULE("STARTER").GAME_OBJECTS.ACCESS("IamNewObject").CREATE_TEXTBOX("edit me" , 10 , "black" , "lime") ;
HELLO_WORLD.ENGINE.MODULES.ACCESS_MODULE("STARTER").GAME_OBJECTS.ACCESS("IamNewObject2").CREATE_TEXTBOX("no edit" , 10 , "black" , "lime") ;
HELLO_WORLD.ENGINE.MODULES.ACCESS_MODULE("STARTER").GAME_OBJECTS.ACCESS("Time").CREATE_TEXTBOX("0" , 10 , "black" , "lime") ;
// NO EDIT
IamNewObject2.TEXTBOX.EDIT = false;
IamNewObject2.TEXTBOX.border_on_focus_width_line = 10;
Time.DRAG...