Skip to content

Instantly share code, notes, and snippets.

View owenroberts's full-sized avatar

Owen Roberts owenroberts

View GitHub Profile
@owenroberts
owenroberts / cool.js
Last active March 7, 2024 15:43
Some helpers for various projects
/* some helpers */
Array.prototype.insert = function(index, item) {
this.splice(index, 0, item);
};
Number.prototype.clamp = function(min, max) {
return max > min ?
Math.min(Math.max(this, min), max) :
Math.min(Math.max(this, max), min);
};
@owenroberts
owenroberts / script.js
Created November 13, 2015 03:00
HTML5 Video Example JavaScript
var subtitles = ["Hello!", "I'm a cat!", "Goodbye!"];
var currentSubtitle = 0;
var subtitleInterval = 10;
var $subtitles = $('#subtitles');
var backgroundColors = ["blue", "red", "pink"];
var currentBackground = 0;
var backgroundInterval = 3;
var $body = $('body');
@owenroberts
owenroberts / index.html
Created November 13, 2015 02:59
HTML5 Video Example HTML
<!doctype html>
<html>
<head>
<title>HTML5 Video Example</title>
<meta charset="utf-8" />
<link href="style.css" type="text/css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
</head>
<body>
@owenroberts
owenroberts / style.css
Created November 11, 2015 03:53
YouTube API Example CSS
body {
font-family:Helvetica, sans-serif;
line-height: 1.45;
}
#subtitles {
font-size:22px;
padding:.25em;
margin:.25em 0;
}
@owenroberts
owenroberts / script.js
Last active November 11, 2015 03:52
YouTube API Example JavaScript
var tag = document.createElement('script');
tag.src = "http://www.youtube.com/iframe_api";
var firstTagScript = document.getElementsByTagName('script')[0];
firstTagScript.parentNode.insertBefore(tag, firstTagScript);
var subtitles = ["Hello!", "I'm a cat!", "Goodbye!"];
var currentSubtitle = 0;
var subtitleInterval = 10;
var $subtitles = $('#subtitles');
@owenroberts
owenroberts / index.html
Last active November 11, 2015 03:42
YouTube API Example HTML
<!doctype html>
<html>
<head>
<title>HTML5 Video Example</title>
<meta charset="utf-8" />
<link href="style.css" type="text/css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
</head>
<body>
@owenroberts
owenroberts / audio.js
Last active January 7, 2022 04:11
HTML5 Audio Example JavaScript
var player = document.querySelector('audio');
var playBtn = document.querySelector('#play-btn');
var progress = document.querySelector('#progress');
var progressTotal = document.querySelector('#progress-bar').offsetWidth;
var volume = document.querySelector('#volume');
var speed = document.querySelector('#speed');
playBtn.addEventListener('click', function() {
if ( player.paused ) {
player.play();
@owenroberts
owenroberts / style.css
Created November 9, 2015 09:22
HTML5 Audio Example CSS
body {
font-family:monospace;
margin:0;
line-height:1.45;
}
* {
box-sizing:border-box;
}
@owenroberts
owenroberts / index.html
Last active October 19, 2016 04:32
HTML5 Audio Example HTML
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<link href="style.css" rel="stylesheet" type="text/css" />
<title>HTML5 Audio Player</title>
</head>
<body>
<div id="container">
<h1>Audio Player</h1>
@owenroberts
owenroberts / style.css
Created September 3, 2015 07:19
Basic CSS page.
body {
background-color: lightblue;
font-family: Helvetica, Arial, sans-serif;
font-size: 18px;
}
h1 { color: #ffddff; }
p { color: white; }