node-addon/mesh-morph.js

   1  var window= {
   2            x:0,
   3            y:0,
   4            width:1920,
   5            height: 1080,
   6            transparent: false,
   7            name:'mesh-morph-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 dali = require('./build/Release/dali')( options );
  21
  22 var daliApp = {};
  23
  24 daliApp.createMeshActor = function() {
  25
  26       // Create shader
  27       var vertShader =
  28                   "attribute mediump vec2    aInitPos;\
  29                 attribute mediump vec2    aFinalPos;\
  30                 attribute mediump vec3    aColor;\
  31                 uniform   mediump mat4    uMvpMatrix;\
  32                 uniform   mediump vec3    uSize;\
  33                 uniform   mediump float   uDelta;\
  34                 uniform   lowp    vec4    uColor;\
  35                 varying   lowp    vec4    vColor;\
  36                 void main()\
  37                 {\
  38                   mediump vec4 vertexPosition = vec4(mix(aInitPos, aFinalPos, uDelta), 0.0, 1.0);\
  39                   vertexPosition.xyz *= uSize;\
  40                   vertexPosition = uMvpMatrix * vertexPosition;\
  41                   gl_Position = vertexPosition;\
  42                   vColor = vec4(aColor, 0.) * uColor;\
  43                 }";
  44
  45       var fragShader =
  46                "varying lowp vec4 vColor;\
  47                 void main()\
  48                 {\
  49                   gl_FragColor = vColor;\
  50                 }";
  51
  52       var shaderOptions = {
  53               vertexShader : vertShader,
  54               fragmentShader : fragShader
  55           };
  56
  57       var shader = new dali.Shader(shaderOptions);
  58
  59       var material = new dali.Material( shader );
  60
  61       // Create vertex buffer for initial positions
  62       var initialPositionVertexFormat = { "aInitPos" : dali.PROPERTY_VECTOR2 };
  63
  64       var initialPositionVertexData = [
  65                                        // yellow
  66                                        -0.50, -0.50,
  67                                          0.0,   0.0,
  68                                        -0.50,  0.50,
  69
  70                                        // green
  71                                        -0.50, -0.50,
  72                                         0.50, -0.50,
  73                                          0.0,   0.0,
  74
  75                                        // blue
  76                                         0.50, -0.50,
  77                                         0.50,   0.0,
  78                                         0.25, -0.25,
  79
  80                                        // red
  81                                         0.25, -0.25,
  82                                         0.50,   0.0,
  83                                         0.25,  0.25,
  84                                         0.25,  0.25,
  85                                          0.0,   0.0,
  86                                         0.25, -0.25,
  87
  88                                        // cyan
  89                                          0.0,   0.0,
  90                                         0.25,  0.25,
  91                                        -0.25,  0.25,
  92
  93                                        // magenta
  94                                        -0.25,  0.25,
  95                                         0.25,  0.25,
  96                                          0.0,  0.50,
  97                                          0.0,  0.50,
  98                                        -0.50,  0.50,
  99                                        -0.25,  0.25,
 100
 101                                         // orange
 102                                         0.50,   0.0,
 103                                         0.50,  0.50,
 104                                          0.0,  0.50
 105                                       ];
 106
 107       var initialPositionVertexDataArray = new Float32Array(initialPositionVertexData.length);
 108       initialPositionVertexDataArray.set(initialPositionVertexData, 0);
 109       var initialPositionVertices = new dali.PropertyBuffer(initialPositionVertexFormat, 27);
 110       initialPositionVertices.setData(initialPositionVertexDataArray);
 111
 112       // Create vertex buffer for final positions
 113       var finalPositionVertexFormat = { "aFinalPos" : dali.PROPERTY_VECTOR2 };
 114
 115       var bigSide = 0.707106781;
 116       var side = bigSide * 0.5;
 117
 118       var finalPositionVertexData = [
 119                                      // yellow
 120                                                side,                        0.25, // pA
 121                                                side,              0.25 + bigSide, // pB
 122                                      side - bigSide,              0.25 + bigSide, // pC
 123
 124                                      // green
 125                                         side - 0.50,                       -0.25, // pD
 126                                                side,                        0.25, // pA
 127                                         side - 0.50,                        0.75, // pE
 128
 129                                      // blue
 130                                         side - 0.50,                       -0.75, // pJ
 131                                         side - 0.50,                       -0.25, // pD
 132                                         side - 0.75,                       -0.50, // pI
 133
 134                                      // red
 135                                         side - 0.75,                       -0.50, // pI
 136                                         side - 0.50,                       -0.25, // pD
 137                                         side - 0.75,                         0.0, // pG
 138                                         side - 0.75,                         0.0, // pG
 139                                          side - 1.0,                       -0.25, // pH
 140                                         side - 0.75,                       -0.50, // pI
 141
 142                                      // cyan
 143                                         side - 0.75,                       -0.50, // pI
 144                                          side - 1.0,                       -0.25, // pH
 145                                          side - 1.0,                       -0.75, // pK
 146
 147                                      // magenta
 148                                                side,       0.25 + bigSide - side, // pL
 149                                          side * 2.0, 0.25 + bigSide - side * 2.0, // pM
 150                                          side * 2.0,       0.25 + bigSide - side, // pN
 151                                          side * 2.0,       0.25 + bigSide - side, // pN
 152                                                side,              0.25 + bigSide, // pB
 153                                                side,       0.25 + bigSide - side, // pL
 154
 155                                      // orange
 156                                         side - 0.50,                       -0.25, // pD
 157                                         side - 0.50,             -0.25 + bigSide, // pF2
 158                                              - 0.50,                -0.25 + side  // pF
 159                                     ];
 160
 161       var finalPositionVertexDataArray = new Float32Array(finalPositionVertexData.length);
 162       finalPositionVertexDataArray.set(finalPositionVertexData, 0);
 163       var finalPositionVertices = new dali.PropertyBuffer(finalPositionVertexFormat, 27);
 164       finalPositionVertices.setData(finalPositionVertexDataArray);
 165
 166       // Create vertex buffer for color
 167       var colorVertexFormat = { "aColor" : dali.PROPERTY_VECTOR3 };
 168
 169       var colorVertexData = [
 170                              // yellow
 171                              1.0, 1.0, 0.0,
 172                              1.0, 1.0, 0.0,
 173                              1.0, 1.0, 0.0,
 174
 175                              // green
 176                              0.0, 1.0, 0.0,
 177                              0.0, 1.0, 0.0,
 178                              0.0, 1.0, 0.0,
 179
 180                              // blue
 181                              0.0, 0.0, 1.0,
 182                              0.0, 0.0, 1.0,
 183                              0.0, 0.0, 1.0,
 184
 185                              // red
 186                              1.0, 0.0, 0.0,
 187                              1.0, 0.0, 0.0,
 188                              1.0, 0.0, 0.0,
 189                              1.0, 0.0, 0.0,
 190                              1.0, 0.0, 0.0,
 191                              1.0, 0.0, 0.0,
 192
 193                              // cyan
 194                              0.0, 1.0, 1.0,
 195                              0.0, 1.0, 1.0,
 196                              0.0, 1.0, 1.0,
 197
 198                              // magenta
 199                              1.0, 0.0, 1.0,
 200                              1.0, 0.0, 1.0,
 201                              1.0, 0.0, 1.0,
 202                              1.0, 0.0, 1.0,
 203                              1.0, 0.0, 1.0,
 204                              1.0, 0.0, 1.0,
 205
 206                              // orange
 207                              1.0, 0.5, 0.0,
 208                              1.0, 0.5, 0.0,
 209                              1.0, 0.5, 0.0
 210                             ];
 211
 212       var colorVertexDataArray = new Float32Array(colorVertexData.length);
 213       colorVertexDataArray.set(colorVertexData, 0);
 214       var colorVertices = new dali.PropertyBuffer(colorVertexFormat, 27);
 215       colorVertices.setData(colorVertexDataArray);
 216
 217       // Create geometry
 218       var geometry = new dali.Geometry();
 219       geometry.addVertexBuffer( initialPositionVertices );
 220       geometry.addVertexBuffer( finalPositionVertices );
 221       geometry.addVertexBuffer( colorVertices );
 222
 223       var renderer = new dali.Renderer(geometry, material);
 224       renderer.depthIndex = 0;
 225
 226       // Create mesh actor
 227       var meshActor = new dali.Actor();
 228       meshActor.addRenderer( renderer );
 229       meshActor.size = [400, 400, 0];
 230       meshActor.parentOrigin = dali.CENTER;
 231       meshActor.anchorPoint = dali.CENTER;
 232       meshActor.registerAnimatableProperty("uDelta", 0.0);
 233
 234       dali.stage.add( meshActor );
 235
 236       // Animate the mesh actor
 237       var animation = new dali.Animation(5);
 238
 239       var animOptions = { alpha:"sin", delay:0, duration:5};
 240
 241       animation.animateTo( meshActor, "uDelta", 1.0, animOptions );
 242       animation.setLooping(true);
 243       animation.play();
 244 }
 245
 246 function startup()
 247 {
 248   daliApp.init();
 249 }
 250
 251 daliApp.init = function()
 252 {
 253   daliApp.createMeshActor();
 254 }
 255
 256
 257 startup();
 258