node-addon/examples/point-mesh.js

   1  var window= {
   2            x:0,
   3            y:0,
   4            width:1920,
   5            height: 1080,
   6            transparent: false,
   7            name:'line-mesh-app'
   8  };
   9
  10  var viewMode={
  11        'stereoscopic-mode':'mono', // stereo-horizontal, stereo-vertical, stereo-interlaced,
  12        'stereo-base': 65 // Distance in millimeters between left/right cameras typically between (50-70mm)
  13  };
  14
  15  var options= {
  16     'window': window,
  17     'view-mode': viewMode,
  18  }
  19
  20 var imageDir = "./images/";
  21
  22
  23 try {
  24   // target
  25   var dali = require('dali')( options );
  26 }
  27 catch(err) {
  28   // desktop
  29   var dali = require('../build/Release/dali')( options );
  30 }
  31
  32 var daliApp = {};
  33
  34 daliApp.createMeshActor = function() {
  35
  36       // Create shader
  37       var vertShader =
  38                "attribute mediump vec2    aPosition;\
  39                 attribute highp   float   aHue;\
  40                 varying   mediump vec2    vTexCoord;\
  41                 uniform   mediump mat4    uMvpMatrix;\
  42                 uniform   mediump vec3    uSize;\
  43                 uniform   mediump float   uPointSize;\
  44                 uniform   lowp    vec4    uFadeColor;\
  45                 varying   mediump vec3    vVertexColor;\
  46                 varying   mediump float   vHue;\
  47                 vec3 hsv2rgb(vec3 c)\
  48                 {\
  49                   vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);\
  50                   vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\
  51                   return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);\
  52                 }\
  53                 void main()\
  54                 {\
  55                   mediump vec4 vertexPosition = vec4(aPosition, 0.0, 1.0);\
  56                   vertexPosition.xyz *= (uSize-uPointSize);\
  57                   vertexPosition = uMvpMatrix * vertexPosition;\
  58                   vVertexColor = hsv2rgb( vec3( aHue, 0.7, 1.0 ) );\
  59                   vHue = aHue;\
  60                   gl_PointSize = uPointSize;\
  61                   gl_Position = vertexPosition;\
  62                 }";
  63
  64       var fragShader =
  65                "varying mediump vec3  vVertexColor;\
  66                 varying mediump float vHue;\
  67                 uniform lowp  vec4    uColor;\
  68                 uniform sampler2D     sTexture1;\
  69                 uniform sampler2D     sTexture2;\
  70                 uniform lowp vec4     uFadeColor;\
  71                 void main()\
  72                 {\
  73                   mediump vec4 texCol1 = texture2D(sTexture1, gl_PointCoord);\
  74                   mediump vec4 texCol2 = texture2D(sTexture2, gl_PointCoord);\
  75                   gl_FragColor = vec4(vVertexColor, 1.0) * ((texCol1*vHue) + (texCol2*(1.0-vHue)));\
  76                 }";
  77
  78       var shaderOptions = {
  79               vertexShader : vertShader,
  80               fragmentShader: fragShader
  81           };
  82
  83       var shader = new dali.Shader(shaderOptions);
  84
  85       var image = new dali.ResourceImage( {url: imageDir + "image-1.jpg"} );
  86       var textureSet = new dali.TextureSet;
  87       textureSet.setImage(0, image);
  88
  89       // Create vertex buffer
  90       var polyhedraVertexFormat ={ "aPosition" : dali.PROPERTY_VECTOR2,
  91                                      "aHue"      : dali.PROPERTY_FLOAT    };
  92
  93       var numSides = 20;
  94       var angle = 0;
  95       var sectorAngle = 2.0 * Math.PI / numSides;
  96
  97       var polyhedraVertexData = [];
  98       for(i=0; i<numSides; ++i)
  99       {
 100         var positionX = Math.sin(angle) * 0.5;
 101         var positionY = Math.cos(angle) * 0.5;
 102         var hue = angle / ( 2.0 * Math.PI);
 103
 104         polyhedraVertexData[i*3+0] = positionX;
 105         polyhedraVertexData[i*3+1] = positionY;
 106         polyhedraVertexData[i*3+2] = hue;
 107
 108         angle += sectorAngle;
 109       }
 110
 111       var polyhedraVertexDataArray = new Float32Array(polyhedraVertexData.length);
 112       polyhedraVertexDataArray.set(polyhedraVertexData, 0);
 113       var polyhedraVertices = new dali.PropertyBuffer(polyhedraVertexFormat);
 114       polyhedraVertices.setData(polyhedraVertexDataArray, numSides);
 115
 116       // Create geometry
 117       var geometry = new dali.Geometry();
 118       geometry.addVertexBuffer( polyhedraVertices );
 119       geometry.setType( dali.GEOMETRY_POINTS );
 120
 121       var renderer = new dali.Renderer(geometry, shader);
 122       renderer.setTextures(textureSet);
 123       renderer.registerAnimatableProperty("uFadeColor", [1.0, 0.0, 1.0, 1.0]); // Green
 124       renderer.registerAnimatableProperty("uPointSize", 80.0);
 125       renderer.depthIndex = 0;
 126
 127       // Create mesh actor
 128       var meshActor = new dali.Actor();
 129       meshActor.addRenderer( renderer );
 130       meshActor.size = [400, 400, 0];
 131       meshActor.parentOrigin = dali.CENTER;
 132       meshActor.anchorPoint = dali.CENTER;
 133       meshActor.registerAnimatableProperty("uFadeColor", [0.0, 1.0, 0.0, 1.0]); // Magenta
 134
 135       dali.stage.add( meshActor );
 136
 137       // Animate the mesh actor
 138       var animation = new dali.Animation(5);
 139       var animOptions = { alpha:dali.ALPHA_FUNCTION_LINEAR, delay:0, duration:5};
 140       var rotation = new dali.Rotation(360,0,0,1);
 141       animation.animateBy( meshActor, "orientation", rotation, animOptions );
 142       animation.setLooping(true);
 143       animation.play();
 144 }
 145
 146 function startup()
 147 {
 148   daliApp.init();
 149 }
 150
 151 daliApp.init = function()
 152 {
 153   daliApp.createMeshActor();
 154 }
 155
 156
 157 startup();
 158