Skip to content

Instantly share code, notes, and snippets.

View Integralist's full-sized avatar
🎯
Making an impact

Mark McDonnell Integralist

🎯
Making an impact
777 followers · 12 following
View GitHub Profile
@Integralist
Integralist / server-sent-event.php
Created September 1, 2011 13:12
Example PHP code for setting up server-sent events
<?php
header("Content-Type: text/event-stream");
while(true) {
echo "Event: server-time\n";
$time = time();
echo "data: $time\n";
echo "\n";
flush();
sleep(3);
}
@Integralist
Integralist / css-props-accept-url.js
Created September 1, 2011 14:36
A script that displays any CSS properties that support URL as value /via @LeaVerou
var s = document.body.style;
for (var i in s) {
s[i] = "url('foo')";
if(s[i]) {
console.log(i);
s[i] = ''
}
}
@Integralist
Integralist / Access-Original-Value.js
Created September 1, 2011 14:53
Access original value of property that has been over-written /via @jdalton and modified by @dperini
(function() {
var hasKey = {}.hasOwnProperty;
Object.prototype.hasOwnProperty = 1;
delete Object.prototype.hasOwnProperty;
var iframe = document.createElement('iframe');
document.documentElement.appendChild(iframe);
Object.prototype.hasOwnProperty = window.frames[0].Object.prototype.hasOwnProperty;
document.documentElement.removeChild(iframe);
@Integralist
Integralist / Grid.css
Created September 13, 2011 08:56
Better CSS Grid System
/*
* Algorithm taken from:
* http://csswizardry.com/2011/08/building-better-grid-systems/
*/
.row {
width: (number of columns * width of one column) + (number of columns * width of one gutter) px;
margin-left: -width of one gutter px;
overflow: hidden;
clear: both;
@Integralist
Integralist / template.js
Created September 18, 2011 15:45
@madrobby's 140 bytes template engine
function template(string, data, prop) {
for (prop in data) {
string = string.replace(new RegExp('{' + prop + '}', 'g'), data[prop]);
}
return string;
}
/*
String templating engine:
@Integralist
Integralist / createElement.js
Created September 28, 2011 07:44
Create Elements using memoization technique (modified to @GarrettS' points)
/**
* The following method creates a new element or returns a copy of an element already created by this script.
*
* @param tagname { String } element to be created/copied
* @return { Element/Node } the newly created element
*/
createElement: (function(){
// Memorize previous elements created
var cache = {};
@Integralist
Integralist / app.build.js
Created October 3, 2011 11:12
RequireJs Build Script
/*
* http://requirejs.org/docs/optimization.html
*
* Use NodeJs to execute the r.js optimization script on this build script
* node r.js -o app.build.js
*
* See: https://github.com/jrburke/r.js/blob/master/build/example.build.js for an example build script
*
* If you specify just the name (with no includes/excludes) then all modules are combined into the "main" file.
* You can include/exclude specific modules though if needed
@Integralist
Integralist / flow.js
Created October 14, 2011 08:00
An example of http://flowjs.com/ cross-browser API
window.onload = function() {
var foo = document.getElementById("abc");
var ZOMG = function(e) {
alert("zomg");
e.preventDefault();
};
foo.addEventListener("click", ZOMG, false);
@Integralist
Integralist / viewport.txt
Created October 21, 2011 08:28
Analyze the viewport size with JavaScript
It’s possible to analyze the viewport size in JavaScript but it’s a little messy:
- Most browsers support `window.innerWidth` and `window.innerHeight`.
- But IE6, 7, 8 and 9 in quirks mode require `document.body.clientWidth` and `document.body.clientHeight`.
- All the main browsers support `document.documentElement.clientWidth` and `document.documentElement.clientHeight` but it’s inconsistent.
Either the window or document dimensions will be returned depending on the browser and mode.
@Integralist
Integralist / index.html
Created October 21, 2011 09:03
jQuery Ajax Test (using Deferred/Promises)
<!doctype html>
<html>
<head>
<title>jQuery Ajax Test</title>
<style type="text/css">
#test {
background-color:pink;
display:none;
padding:10px;
text-align:center;