Tuesday, July 22, 2014

new pythonjs syntax

PythonJS is being extended with optional static typing and new syntax. The translator pre-processes input source code and transforms it into an intermediate form that can be parsed by Python's ast module. This simplifies adding new syntax to PythonJS, see this commit that implements Exception Expressions.

a = d[ 'somekey' ] except KeyError: 'mydefault'

inline anonymous functions

I am now researching new syntax that can be added to PythonJS. After looking at RapydScript, I see that inline anonymous functions are a must have, and recently implemented them in PythonJS. Inline functions can be used in function calls as a named keyword argument, or in a dict literal. This solves the problem that Lambda functions can only be a single statement, which is often not that useful.

 callback1=def (x,y,z):
  x += y
  return x - z,
 callback2= def (x, y):
  return x * y

b = {
 'cb1' : def (x):
  return x,
 'cb2' : def (y):
  return y


switch a==b:
  case True:
  case False:

Go channels and select

def send_data( A:chan int, B:chan int, X:int, Y:int):
 while True:
  print('sending data..')
  A <- X
  B <- Y

def select_loop(A:chan int, B:chan int, W:chan int) -> int:
 print('starting select loop')
 y = 0
 while True:
  print('select loop:',y)
   case x = <- A:
    y += x
    W <- y
   case x = <- B:
    y += x
    W <- y
 print('end select loop', y)
 return y

def main():
 a = go.channel(int)
 b = go.channel(int)
 w = go.channel(int)

  select_loop(a,b, w)

  send_data(a,b, 5, 10)

 z = 0
 while z < 100:
  z = <- w
  print('main loop', z)

 print('end test')

Thursday, July 17, 2014

WebGL CSS3D Hybrid part2

Despite WebGL having been around since 2011, you probably do not run into many websites with 3D. And when you do, its likely a fullscreen game or demo, not a typical website. Traditional web technologies do not mix well with WebGL. Libraries like Voodoo.js try to bridge this gap by allowing you to insert 3D objects inside a normal webpage. Voodoo.js graphics are not anti-aliased when rendering with WebGL, the contrast with the rest of the smooth text and graphics on a webpage then becomes very harsh and downright ugly.

Threepy is an experimental library built on THREE.js that allows some HTML and CSS to be mixed together with WebGL rendering and post-processing FX. The library wraps many standard HTML element types with special hacks like: callbacks, catching events, and rendering to proxy clones. Not every combination of HTML and CSS is compatible with this method. The video below tests the basic UI elements: checkboxes, text input, select drop down lists, number input, color selector, tab menus, slider controls, images and videos. Works with GoogleChrome and NodeWebkit.

Monday, July 7, 2014

WebGL CSS3D Hybrid

Jerome Etienne has an interesting post where he combines CSS3D and WebGL, see his post here. However, his method is not compatible with Three.js post-processing shaders that is required to blur and perform other 2D effects on the 3D rendering.

The videos below show integration of WebGL and CSS3D with post-processing in THREE.js. The main hack do to this requires double rendering the DOM in two CSS3D layers. The first layer is rendered under the WebGL layer, and is a clone of the top CSS layer. The top CSS layer is rendered transparent over the WebGL layer and catches keyboard and mouse events. The WebGL layer is rendered with alpha blending. See the source code here.

dnd, iframes, video, collada

Update july10th, testing new hacks to integrate: iframes, html5 video, and collada 3D files by drag and drop. Starting new module dddom.py with simple API for creating 3D widgets mixing WebGL and CSS3D.