carlopi/README.md

## README.md

      
    Raw
  

              README.md
            
          
    Compile from scratch
/opt/cheerp/bin/clang++ randomBits.c -o randomBits.js -cheerp-pretty-code -O3 -target cheerp-wasm
wat -> wasm
wat2wasm randomBits.wat -o randomBits.wasm
serve
http-serve
Inspired by:
https://www.jamesfmackenzie.com/2019/12/01/webassembly-graphics-with-sdl/

  
## index.html
<!doctype html>
<html lang="en-us">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Cheerp random bits example</title>
  </head>
  <body>
    <script src="randomBits.js"></script>

  </body>
</html>

## randomBits.c
#include <cheerp/clientlib.h>
#include <cheerp/client.h>

[[cheerp::genericjs]]
client::HTMLCanvasElement* canvas;
[[cheerp::genericjs]]
client::CanvasRenderingContext2D* ctx;

[[cheerp::genericjs]]
void putData(const char* dataPtr)
{
        client::Uint8Array* array8 = cheerp::MakeTypedArray<client::Uint8Array>(dataPtr, 512*512*4);
        client::Uint8ClampedArray* array8clamp = new client::Uint8ClampedArray(array8);
        client::ImageData* imageData = new client::ImageData(array8clamp, 512, 512);
        ctx->putImageData(imageData, 0, 0);
}

[[cheerp::jsexport]]
void drawRandomPixels()
{
        char data[512 * 512 * 4];

        for (int i=0; i<512 * 512 * 4; i++)
        {
                char randomByte = rand() % 255;
                data[i] = randomByte;
        }


        for (int i=3; i<512 * 512*4; i+=4)
                data[i] = 255;

        putData(data);
}

[[cheerp::genericjs]]
int main()
{
        canvas = (client::HTMLCanvasElement*) client::document.createElement("canvas");
        canvas->set_width(512);
        canvas->set_height(512);

        client::document.get_body()->appendChild(canvas);

        ctx = canvas->getContext<client::CanvasRenderingContext2D*>(new client::String("2d"));

        drawRandomPixels();
}

## randomBits.js
"use strict";
/*Compiled using Cheerp (R) by Leaning Technologies Ltd*/
var __imul=Math.imul;
var __fround=Math.fround;
var oSlot=0;var nullArray=[null];var nullObj={d:nullArray,o:0};
function fetchBuffer(p){
        return new Promise((y,n)=>y(fetch(p)))
        .then(r=>r.arrayBuffer())
        .catch(e=>new Promise((y,n)=>{
                require('fs').
                readFile(require('path').
                join(__dirname, p),
                (e,d)=>{if(e)n(e);else y(d);})
        })
        .catch(e=>new Promise((y,n)=>y(read(p,'binary'))))
        )
}
function __Z7putDataPKc(LdataPtr,MdataPtr){
        var tmp0=0,Lcall$pi=-0.,LretConstructor3=null;
        tmp0=MdataPtr;
        LretConstructor3=LdataPtr;
        LretConstructor3=LretConstructor3;
        Lcall$pi=+LretConstructor3.BYTES_PER_ELEMENT;
        LretConstructor3=new ImageData(new Uint8ClampedArray(new Uint8Array(LretConstructor3.buffer,(+(__imul(tmp0,~~Lcall$pi)>>>0)),1048576)),512,512);
        _ctx.putImageData(LretConstructor3,0,0);
}
function _main(){
        var Lcall=null,LretConstructor=null;
        LretConstructor=_cheerpCreate_ZN6client6StringC2EPKc(HEAP8,1048584>>0);
        Lcall=document.createElement(LretConstructor);
        Lcall.width=512;
        Lcall.height=512;
        document.body.appendChild(Lcall);
        LretConstructor=_cheerpCreate_ZN6client6StringC2EPKc(HEAP8,1048592>>0);
        _ctx=Lcall.getContext(LretConstructor);
        __Z16drawRandomPixelsv();
        return 0|0;
}
function _cheerpCreate_ZN6client6StringC2EPKc(Larg0,Marg0){
        var LretConstructor$pi=null,Lgeptoindexphi=0,LcheerpPtrAlloca$p07$pi=null;
        LretConstructor$pi=String();
        Lgeptoindexphi=0;
        while(1){
                LcheerpPtrAlloca$p07$pi=String.fromCharCode(Larg0[Marg0+Lgeptoindexphi|0]<<24>>24);
                LretConstructor$pi=LretConstructor$pi.concat(LcheerpPtrAlloca$p07$pi);
                Lgeptoindexphi=Lgeptoindexphi+1|0;
                if((Larg0[Marg0+Lgeptoindexphi|0]&255)!==0)continue;
                break;
        }
        return String(LretConstructor$pi);
}
function ___wrapper___Z7putDataPKc(Larg0){
        __Z7putDataPKc(HEAP8,Larg0>>0);
}
var _ctx=null;
var _impure_data$p1$pinit=0;
var HEAP8=null,__asm=null,__heap=null;function __dummy(){throw new Error('this should be unreachable');};
var __Z16drawRandomPixelsv=null;
var drawRandomPixels=__dummy;
__dummy.promise=
fetchBuffer('randomBits.wasm').then(tmp0=>
WebAssembly.instantiate(tmp0,
{i:{
                ___wrapper___Z7putDataPKc:___wrapper___Z7putDataPKc,
        }})
).then(tmp0=>{
        __asm=tmp0.instance.exports;
        __heap=__asm.memory.buffer;
        assignHeaps(__heap);
        __Z16drawRandomPixelsv=__asm.__Z16drawRandomPixelsv;
        drawRandomPixels=__Z16drawRandomPixelsv;
        drawRandomPixels.promise=
        Promise.resolve();
        _main();
});
function assignHeaps(tmp0){
        HEAP8=new Uint8Array(tmp0);
}

## randomBits.wat
(module
  (type (;0;) (func (param i32)))
  (type (;1;) (func))
  (import "i" "___wrapper___Z7putDataPKc" (func (;0;) (type 0)))
  (func $__wasm_nullptr (type 1)
    unreachable)
  (func $_Z16drawRandomPixelsv (type 1)
    (local i32 i32 i32 i32 i64)
    global.get 0
    local.tee 0
    i32.const -1048576
    i32.add
    local.tee 2
    global.set 0
    local.get 2
    local.tee 2
    local.tee 1
    global.get 2
    if (result i64)  ;; label = @1
      global.get 1
    else
      i32.const 1
      global.set 2
      i64.const 1
    end
    global.get 3
    i64.mul
    i64.const 1
    i64.add
    local.tee 4
    i64.const 32
    i64.shr_u
    i32.wrap_i64
    i32.const 2147483647
    i32.and
    i32.const 255
    i32.rem_u
    i32.store8
    i32.const 1
    local.set 3
    loop  ;; label = @1
      local.get 3
      local.get 2
      i32.add
      local.get 4
      global.get 3
      i64.mul
      i64.const 1
      i64.add
      local.tee 4
      i64.const 32
      i64.shr_u
      i32.wrap_i64
      i32.const 2147483647
      i32.and
      i32.const 255
      i32.rem_u
      i32.store8
      local.get 3
      i32.const 1
      i32.add
      local.tee 3
      i32.const 1048576
      i32.ne
      br_if 0 (;@1;)
    end
    local.get 4
    global.set 1
    i32.const 3
    local.set 3
    loop  ;; label = @1
      local.get 3
      local.get 2
      i32.add
      i32.const 255
      i32.store8
      local.get 3
      i32.const 1048572
      i32.lt_u
      if  ;; label = @2
        local.get 3
        i32.const 4
        i32.add
        local.set 3
        br 1 (;@1;)
      end
    end
    local.get 1
    call 0
    local.get 0
    global.set 0)
  (table (;0;) 1 1 funcref)
  (memory (;0;) 17 128)
  (global (;0;) (mut i32) (i32.const 1048576))
  (global (;1;) (mut i64) (i64.const 0))
  (global (;2;) (mut i32) (i32.const 0))
  (global (;3;) i64 (i64.const 6364136223846793005))
  (export "memory" (memory 0))
  (export "__Z16drawRandomPixelsv" (func $_Z16drawRandomPixelsv))
  (elem (;0;) (i32.const 0) func $__wasm_nullptr)
  (data (;0;) (i32.const 1048584) "canvas\00\002d"))
	<!doctype html>
	<html lang="en-us">
	<head>
	<meta charset="utf-8">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>Cheerp random bits example</title>
	</head>
	<body>
	<script src="randomBits.js"></script>

	</body>
	</html>
	#include <cheerp/clientlib.h>
	#include <cheerp/client.h>

	[[cheerp::genericjs]]
	client::HTMLCanvasElement* canvas;
	[[cheerp::genericjs]]
	client::CanvasRenderingContext2D* ctx;

	[[cheerp::genericjs]]
	void putData(const char* dataPtr)
	{
	client::Uint8Array* array8 = cheerp::MakeTypedArray<client::Uint8Array>(dataPtr, 5125124);
	client::Uint8ClampedArray* array8clamp = new client::Uint8ClampedArray(array8);
	client::ImageData* imageData = new client::ImageData(array8clamp, 512, 512);
	ctx->putImageData(imageData, 0, 0);
	}

	[[cheerp::jsexport]]
	void drawRandomPixels()
	{
	char data[512 * 512 * 4];

	for (int i=0; i<512 * 512 * 4; i++)
	{
	char randomByte = rand() % 255;
	data[i] = randomByte;
	}


	for (int i=3; i<512 * 512*4; i+=4)
	data[i] = 255;

	putData(data);
	}

	[[cheerp::genericjs]]
	int main()
	{
	canvas = (client::HTMLCanvasElement*) client::document.createElement("canvas");
	canvas->set_width(512);
	canvas->set_height(512);

	client::document.get_body()->appendChild(canvas);

	ctx = canvas->getContext<client::CanvasRenderingContext2D*>(new client::String("2d"));

	drawRandomPixels();
	}
	"use strict";
	/Compiled using Cheerp (R) by Leaning Technologies Ltd/
	var __imul=Math.imul;
	var __fround=Math.fround;
	var oSlot=0;var nullArray=[null];var nullObj={d:nullArray,o:0};
	function fetchBuffer(p){
	return new Promise((y,n)=>y(fetch(p)))
	.then(r=>r.arrayBuffer())
	.catch(e=>new Promise((y,n)=>{
	require('fs').
	readFile(require('path').
	join(__dirname, p),
	(e,d)=>{if(e)n(e);else y(d);})
	})
	.catch(e=>new Promise((y,n)=>y(read(p,'binary'))))
	)
	}
	function __Z7putDataPKc(LdataPtr,MdataPtr){
	var tmp0=0,Lcall$pi=-0.,LretConstructor3=null;
	tmp0=MdataPtr;
	LretConstructor3=LdataPtr;
	LretConstructor3=LretConstructor3;
	Lcall$pi=+LretConstructor3.BYTES_PER_ELEMENT;
	LretConstructor3=new ImageData(new Uint8ClampedArray(new Uint8Array(LretConstructor3.buffer,(+(__imul(tmp0,~~Lcall$pi)>>>0)),1048576)),512,512);
	_ctx.putImageData(LretConstructor3,0,0);
	}
	function _main(){
	var Lcall=null,LretConstructor=null;
	LretConstructor=_cheerpCreate_ZN6client6StringC2EPKc(HEAP8,1048584>>0);
	Lcall=document.createElement(LretConstructor);
	Lcall.width=512;
	Lcall.height=512;
	document.body.appendChild(Lcall);
	LretConstructor=_cheerpCreate_ZN6client6StringC2EPKc(HEAP8,1048592>>0);
	_ctx=Lcall.getContext(LretConstructor);
	__Z16drawRandomPixelsv();
	return 0\|0;
	}
	function _cheerpCreate_ZN6client6StringC2EPKc(Larg0,Marg0){
	var LretConstructor$pi=null,Lgeptoindexphi=0,LcheerpPtrAlloca$p07$pi=null;
	LretConstructor$pi=String();
	Lgeptoindexphi=0;
	while(1){
	LcheerpPtrAlloca$p07$pi=String.fromCharCode(Larg0[Marg0+Lgeptoindexphi\|0]<<24>>24);
	LretConstructor$pi=LretConstructor$pi.concat(LcheerpPtrAlloca$p07$pi);
	Lgeptoindexphi=Lgeptoindexphi+1\|0;
	if((Larg0[Marg0+Lgeptoindexphi\|0]&255)!==0)continue;
	break;
	}
	return String(LretConstructor$pi);
	}
	function ___wrapper___Z7putDataPKc(Larg0){
	__Z7putDataPKc(HEAP8,Larg0>>0);
	}
	var _ctx=null;
	var _impure_data$p1$pinit=0;
	var HEAP8=null,__asm=null,__heap=null;function __dummy(){throw new Error('this should be unreachable');};
	var __Z16drawRandomPixelsv=null;
	var drawRandomPixels=__dummy;
	__dummy.promise=
	fetchBuffer('randomBits.wasm').then(tmp0=>
	WebAssembly.instantiate(tmp0,
	{i:{
	___wrapper___Z7putDataPKc:___wrapper___Z7putDataPKc,
	}})
	).then(tmp0=>{
	__asm=tmp0.instance.exports;
	__heap=__asm.memory.buffer;
	assignHeaps(__heap);
	__Z16drawRandomPixelsv=__asm.__Z16drawRandomPixelsv;
	drawRandomPixels=__Z16drawRandomPixelsv;
	drawRandomPixels.promise=
	Promise.resolve();
	_main();
	});
	function assignHeaps(tmp0){
	HEAP8=new Uint8Array(tmp0);
	}
	(module
	(type (;0;) (func (param i32)))
	(type (;1;) (func))
	(import "i" "___wrapper___Z7putDataPKc" (func (;0;) (type 0)))
	(func $__wasm_nullptr (type 1)
	unreachable)
	(func $_Z16drawRandomPixelsv (type 1)
	(local i32 i32 i32 i32 i64)
	global.get 0
	local.tee 0
	i32.const -1048576
	i32.add
	local.tee 2
	global.set 0
	local.get 2
	local.tee 2
	local.tee 1
	global.get 2
	if (result i64) ;; label = @1
	global.get 1
	else
	i32.const 1
	global.set 2
	i64.const 1
	end
	global.get 3
	i64.mul
	i64.const 1
	i64.add
	local.tee 4
	i64.const 32
	i64.shr_u
	i32.wrap_i64
	i32.const 2147483647
	i32.and
	i32.const 255
	i32.rem_u
	i32.store8
	i32.const 1
	local.set 3
	loop ;; label = @1
	local.get 3
	local.get 2
	i32.add
	local.get 4
	global.get 3
	i64.mul
	i64.const 1
	i64.add
	local.tee 4
	i64.const 32
	i64.shr_u
	i32.wrap_i64
	i32.const 2147483647
	i32.and
	i32.const 255
	i32.rem_u
	i32.store8
	local.get 3
	i32.const 1
	i32.add
	local.tee 3
	i32.const 1048576
	i32.ne
	br_if 0 (;@1;)
	end
	local.get 4
	global.set 1
	i32.const 3
	local.set 3
	loop ;; label = @1
	local.get 3
	local.get 2
	i32.add
	i32.const 255
	i32.store8
	local.get 3
	i32.const 1048572
	i32.lt_u
	if ;; label = @2
	local.get 3
	i32.const 4
	i32.add
	local.set 3
	br 1 (;@1;)
	end
	end
	local.get 1
	call 0
	local.get 0
	global.set 0)
	(table (;0;) 1 1 funcref)
	(memory (;0;) 17 128)
	(global (;0;) (mut i32) (i32.const 1048576))
	(global (;1;) (mut i64) (i64.const 0))
	(global (;2;) (mut i32) (i32.const 0))
	(global (;3;) i64 (i64.const 6364136223846793005))
	(export "memory" (memory 0))
	(export "__Z16drawRandomPixelsv" (func $_Z16drawRandomPixelsv))
	(elem (;0;) (i32.const 0) func $__wasm_nullptr)
	(data (;0;) (i32.const 1048584) "canvas\00\002d"))