Jordan Santell jsantell

Styling native elements

Native HTML controls are a challenge to style. You can style any element in the web platform that uses Shadow DOM with a pseudo element ::pseudo-element or the /deep/ path selector.

video::webkit-media-controls-timeline {
  background-color: lime;
}

video /deep/ input[type=range] {

Securely erase an external disk using `dd` on OSX

Plug in your SD card, HDD, or other block device and then use the following command to see which /dev/diskN node it's located on:

diskutil list

Unmount the disk where â€œNâ€� is the number of the disk taken from the above command:

Encoding Video

Installing

Install FFmpeg with homebrew. You'll need to install it with a couple flags for webm and the AAC audio codec.

brew install ffmpeg --with-libvpx --with-libvorbis --with-fdk-aac --with-opus

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

Projects for WebARonARKit and WebARonARCore

New Projects

Leave a comment to add a project you've created or found!

	export CC="clang"
	export CXX="clang++"
	export CFLAGS="-fcolor-diagnostics"
	export CXXFLAGS="-fcolor-diagnostics"

	mk_add_options MOZ_OBJDIR=@TOPSRCDIR@/obj-firefox-release-b2g-desktop

	mk_add_options AUTOCONF=autoconf213

	ac_add_options --enable-application=b2g

	<script>
	function lalaj() {
	var out = document.querySelector("pre");
	var a = new OfflineAudioContext(1, 44100, 44100);
	var b = a.createBuffer(1, 44100, 44100);
	var g = a.createGain();
	var bb = b.getChannelData(0);
	for (var i = 0; i < bb.length; i++) {
	bb[i] = 1.0;
	}

	/**
	* Provide a 24 bit int implementation for DataViews. Note this
	* causes two reads/writes per call, meaning it's going to be
	* around half as fast as the native implementations.
	*/
	DataView.prototype.getUint24 = function(pos) {
	return (this.getUint16(pos) << 8) + this.getUint8(pos+2);
	}

	DataView.prototype.setUint24 = function(pos, val) {

	// gcc test.c `pkg-config --cflags --libs gtk+-3.0 gdk-3.0` -lX11 && ./a.out

	#include <X11/Xlib.h>
	#include <unistd.h>
	#include <stdio.h>

	#include <gtk/gtk.h>
	#include <gdk/gdkx.h>

	static void my_gtk_realize(GtkWidget* widget, gpointer user)

	// Upgrade NOTE: replaced 'mul(UNITY_MATRIX_MVP,)' with 'UnityObjectToClipPos()'



	Shader "Custom/fakeRefract" {

	Properties {


	}