mirror of
https://github.com/rustwasm/wasm-bindgen.git
synced 2024-12-12 11:11:12 +03:00
3efe51eb8b
This commit is a large-ish scale reorganization of our examples. The main goal here is to have a dedicated section of the guide for example, and all examples will be listed there. Each example's `README` is now just boilerplate pointing at the guide along with a blurb about how to run it. Some examples like `math` and `smorgasboard` have been deleted as they didn't really serve much purpose, and others like `closures` have been rewritten with `web-sys` instead of hand-bound bindings. Overall it's hoped that this puts us in a good and consistent state for our examples, with all of them being described in the guide, excerpts are in the guide, and they're all relatively idiomatically using `web-sys`.
75 lines
2.3 KiB
JavaScript
75 lines
2.3 KiB
JavaScript
/* eslint-disable no-unused-vars */
|
|
import { chars } from './chars-list.js';
|
|
let imp = import('./char.js');
|
|
let mod;
|
|
|
|
let counters = [];
|
|
imp.then(wasm => {
|
|
mod = wasm;
|
|
addCounter();
|
|
let b = document.getElementById('add-counter');
|
|
if (!b) throw new Error('Unable to find #add-counter');
|
|
b.addEventListener('click', ev => addCounter());
|
|
});
|
|
|
|
function addCounter() {
|
|
let ctr = mod.Counter.new(randomChar(), 0);
|
|
counters.push(ctr);
|
|
update();
|
|
}
|
|
|
|
function update() {
|
|
let container = document.getElementById('container');
|
|
if (!container) throw new Error('Unable to find #container in dom');
|
|
while (container.hasChildNodes()) {
|
|
if (container.lastChild.id == 'add-counter') break;
|
|
container.removeChild(container.lastChild);
|
|
}
|
|
for (var i = 0; i < counters.length; i++) {
|
|
let counter = counters[i];
|
|
container.appendChild(newCounter(counter.key(), counter.count(), ev => {
|
|
counter.increment();
|
|
update();
|
|
}));
|
|
}
|
|
}
|
|
|
|
function randomChar() {
|
|
console.log('randomChar');
|
|
let idx = Math.floor(Math.random() * (chars.length - 1));
|
|
console.log('index', idx);
|
|
let ret = chars.splice(idx, 1)[0];
|
|
console.log('char', ret);
|
|
return ret;
|
|
}
|
|
|
|
function newCounter(key, value, cb) {
|
|
let container = document.createElement('div');
|
|
container.setAttribute('class', 'counter');
|
|
let title = document.createElement('h1');
|
|
title.appendChild(document.createTextNode('Counter ' + key));
|
|
container.appendChild(title);
|
|
container.appendChild(newField('Count', value));
|
|
let plus = document.createElement('button');
|
|
plus.setAttribute('type', 'button');
|
|
plus.setAttribute('class', 'plus-button');
|
|
plus.appendChild(document.createTextNode('+'));
|
|
plus.addEventListener('click', cb);
|
|
container.appendChild(plus);
|
|
return container;
|
|
}
|
|
|
|
function newField(key, value) {
|
|
let ret = document.createElement('div');
|
|
ret.setAttribute('class', 'field');
|
|
let name = document.createElement('span');
|
|
name.setAttribute('class', 'name');
|
|
name.appendChild(document.createTextNode(key));
|
|
ret.appendChild(name);
|
|
let val = document.createElement('span');
|
|
val.setAttribute('class', 'value');
|
|
val.appendChild(document.createTextNode(value));
|
|
ret.appendChild(val);
|
|
return ret;
|
|
}
|