Skip to content

Instantly share code, notes, and snippets.

@AVGP
AVGP / index.html
Created November 6, 2017 12:50
Hosting Data3D in Aframe
<!doctype html>
<html>
<head>
<script src="https://aframe.io/releases/0.7.0/aframe.min.js"></script>
<script src="https://dist.3d.io/3dio-js/1.x.x/3dio.min.js"></script>
</head>
<body>
<a-scene>
<a-entity position="0 0 -2" io3d-data3d="url:untitled.gz.data3d.buffer"></a-entity>
</a-scene>
@AVGP
AVGP / wat.js
Created September 6, 2017 22:17
ffmpeg.js converting webm from a media recorder into mp4
var ffmpeg = require('ffmpeg.js/ffmpeg-mp4.js')
document.querySelector('button').addEventListener('click', (evt) => {
document.querySelector('[camera]').setAttribute('animation', {
property: 'rotation',
to: '0 360 0',
dur: 10000,
easing: 'linear'
})
@AVGP
AVGP / index.html
Last active August 1, 2017 11:33
Three.js demo during workshop
<!doctype html>
<html>
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/86/three.min.js"></script>
<script src="https://cdn.rawgit.com/mrdoob/three.js/r86/examples/js/loaders/GLTF2Loader.js"></script>
<script>
var renderer = new THREE.WebGLRenderer()
renderer.setSize(500, 500)
renderer.setClearColor(0)
<script>
class MyThing extends HTMLElement {
constructor() { super() }
connectedCallback() {
this.textContent += 'World'
}
}
</script>
<my-thing>Hello</my-thing>
@AVGP
AVGP / append-to-dom.html
Last active February 14, 2017 14:57
Measuring speed of operations that append to DOM
<!doctype html>
<html>
<body>
<div id="target"></div>
<template>
<ul>
<li><a>Item #0</a></li>
<li><a>Item #1</a></li>
<li><a>Item #2</a></li>
<li><a>Item #3</a></li>
<!doctype html>
<html>
<body>
<button is="plastic-button">Click Me!</button>
<script>
class PlasticButton extends HTMLButtonElement {
constructor() {
super()
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
</head>
<body>
<template id="weather-info">
<style>
:host {
<!doctype html>
<html>
<body>
<template id="name-tag">
<style>
div.container {
background: red;
padding: 0.5em;
border-radius: 1em;
width: 300px;
DEFAULT="[0m" #"[37;40m"
PINK="[35m"
GREEN="[32m"
ORANGE="[33m"
scm_branch() {
HG_BRANCH=`hg branch 2> /dev/null`
GIT_BRANCH=`git rev-parse --abbrev-ref HEAD 2> /dev/null`
if [ -n "$HG_BRANCH" ]; then