Gist Tests

Remember gist’s with self closing tags cannot be mixed with ones with content, thus any time there is [gist …/], I actually have [gist …]]…[[/gist] in this document.

Compatibility testing with JetPack

Via

1. oEmbed

https://gist.github.com/padolsey/527683
// ----------------------------------------------------------
// A short snippet for detecting versions of IE in JavaScript
// without resorting to user-agent sniffing
// ----------------------------------------------------------
// If you're not in IE (or IE version is less than 5) then:
// ie === undefined
// If you're in IE (>=5) then you can determine which version:
// ie === 7; // IE7
// Thus, to detect IE:
// if (ie) {}
// And to detect the version:
// ie === 6 // IE6
// ie > 7 // IE8, IE9 ...
// ie < 9 // Anything less than IE9
// ----------------------------------------------------------
// UPDATE: Now using Live NodeList idea from @jdalton
var ie = (function(){
var undef,
v = 3,
div = document.createElement('div'),
all = div.getElementsByTagName('i');
while (
div.innerHTML = '<!--[if gt IE ' + (++v) + ']><i></i><![endif]-->',
all[0]
);
return v > 4 ? v : undef;
}());
view raw gistfile1.js hosted with ❤ by GitHub

2. Full URL in shortcode

[gist https://gist.github.com/pstuifzand/0b5a4a10a417d03ad107 /]
<?php
include_once('app/Mage.php');
Mage::app('default');
function makeWalker($collection, $modelName) {
///echo $collection->getSelect(). "\n";
return array($collection->getSelect()->query(), $modelName);
}
function fetch($walker, $model = null) {
$row = $walker[0]->fetch();
if (!$row) return false;
if (!$model) {
$model = Mage::getModel($walker[1]);
}
$model->setData($row);
return $model;
}
$start = memory_get_usage();
$time_start = microtime(true);
for ($i = 0; $i < 500; ++$i) {
$collection = Mage::getModel('catalog/product')->setStoreId(1)->getCollection()
->addAttributeToSelect('*');
$iterator = makeWalker($collection, 'catalog/product');
$product = null;
while ($product = fetch($iterator, $product)) {
# echo $product->getName() . "\n";
# echo $product->getPrice() . "\n";
}
}
$end = memory_get_usage();
$diff = $end - $start;
echo "$start\n";
echo "$end\n";
echo "$diff\n";
$time_end = microtime(true);
$time_diff = $time_end - $time_start;
echo "$time_diff seconds\n";
view raw fetch.php hosted with ❤ by GitHub
<?php
include_once('app/Mage.php');
Mage::app('default');
$start = memory_get_usage();
$time_start = microtime(true);
for ($i = 0; $i < 500; ++$i) {
$collection = Mage::getModel('catalog/product')->setStoreId(1)->getCollection()
->addAttributeToSelect('*');
foreach ($collection as $product) {
# echo $product->getName() . "\n";
# echo $product->getPrice() . "\n";
}
}
$end = memory_get_usage();
$diff = $end - $start;
echo "$start\n";
echo "$end\n";
echo "$diff\n";
$time_end = microtime(true);
$time_diff = $time_end - $time_start;
echo "$time_diff seconds\n";
view raw foreach.php hosted with ❤ by GitHub

3. Shortcode with just the ID

[gist]12f4429c853d46ba33f9[/gist]
( function( $ ) {
$.fn.helloWorld = function( options ) {
// Establish our default settings
var settings = $.extend( {
text : 'Hello, World!',
color : null,
fontStyle : null,
complete : null
}, options );
return this.each( function() {
$( this ).text( settings.text );
if ( settings.color ) {
$( this ).css( 'color', settings.color );
}
if ( settings.fontStyle ) {
$( this ).css( 'font-style', settings.fontStyle );
}
if ( $.isFunction( settings.complete ) ) {
settings.complete.call( this );
}
} );
}
} ( jQuery ) );
view raw jquery-plugin.js hosted with ❤ by GitHub

4/5. single file

[gist https://gist.github.com/tychay/9d4dfd6c1808ed836ee1 file="0_reuse_code.js" /]
// Use Gists to store code you would like to remember later on
console.log(window); // log the "window" object to the console
view raw 0_reuse_code.js hosted with ❤ by GitHub

GistPress style

OEMBED

single file:

https://gist.github.com/tychay/9d4dfd6c1808ed836ee1#file-2_keyboard_shortcuts-md

Create documentation for your projects. Like so:

Most popular keyboard shortcuts within GistBox

  • Up/Down - Previous/Next Gist
  • Ctrl+e - Edit a selected Gist
  • Ctrl+s - Save Gist

Save Gists from anywhere with Clipper

GistBox Clipper is the companion extension to GistBox, the most beautiful way to organize code snippets. It allows a user to create a GitHub Gist from any page on the web.

Download from the Chrome Web Store

view raw 2_keyboard_shortcuts.md hosted with ❤ by GitHub

Shortcode

[gist id="9b1307f153f4abe352a4" /]
<?php
/**
* Abbreviated image widget class.
*/
class Blazer_Six_Widget_Image extends WP_Widget {
/**
* Setup widget options.
*
* Allows child classes to override the defaults.
*
* @see WP_Widget::construct()
*/
function __construct( $id_base = false, $name = false, $widget_options = array(), $control_options = array() ) {
$id_base = ( $id_base ) ? $id_base : 'blazersix-widget-image';
$name = ( $name ) ? $name : __( 'Image', 'blazersix-widget-image-i18n' );
$widget_options = wp_parse_args( $widget_options, array(
'classname' => 'widget_image',
'description' => __( 'An image from the media library', 'blazersix-widget-image-i18n' )
) );
$control_options = wp_parse_args( $control_options, array( 'width' => 300 ) );
parent::__construct( $id_base, $name, $widget_options, $control_options );
}
/**
* Default widget front end display method.
*/
function widget( $args, $instance ) {
// Return cached widget if it exists.
// Filter and sanitize instance data
$content = $this->render( $args, $instance );
// Cache the generated content.
}
/**
* Generate the widget output.
*/
function render( $args, $instance ) {
// Generate content.
return $content;
}
}
view raw class-blazersix-image-widget.php hosted with ❤ by GitHub
<?php
/**
* Abbreviated slide widget class extending image widget.
*/
class Slide_Widget extends Blazer_Six_Widget_Image {
/**
* Setup widget options.
*/
function __construct() {
$widget_options = wp_parse_args( $widget_options, array(
'classname' => 'widget_slide',
'description' => 'Add a slide to the homepage slider'
) );
parent::__construct( 'slide', 'Slide', $widget_options );
}
/**
* Generate the widget output.
*/
function render( $args, $instance ) {
// Generate content.
return $content;
}
}
view raw class-slide-widget.php hosted with ❤ by GitHub
jQuery(function($) {
mediaControl = {
// Initializes a new media manager or returns an existing frame.
// @see wp.media.featuredImage.frame()
frame: function() {
if ( this._frame )
return this._frame;
this._frame = wp.media({
title: 'Frame Title',
library: {
type: 'image'
},
button: {
text: 'Button Text'
},
multiple: false
});
this._frame.on( 'open', this.updateFrame ).state('library').on( 'select', this.select );
return this._frame;
},
select: function() {
// Do something when the "update" button is clicked after a selection is made.
},
updateFrame: function() {
// Do something when the media frame is opened.
},
init: function() {
$('#wpbody').on('click', '.blazersix-media-control-choose', function(e) {
e.preventDefault();
mediaControl.frame().open();
});
}
};
mediaControl.init();
});
view raw media-control-frame.js hosted with ❤ by GitHub
<p class="blazersix-media-control"
data-title="Choose an Image for the Widget"
data-update-text="Update Image"
data-target=".image-id"
data-select-multiple="false">
<?php echo wp_get_attachment_image( $image_id, 'medium', false ); ?>
<input type="hidden" name="image_id" id="image_id" value="<?php echo $image_id; ?>" class="image-id blazersix-media-control-target">
<a href="#" class="button blazersix-media-control-choose">Choose an Image</a>
</p>
view raw media-control-snippet.php hosted with ❤ by GitHub
<?php
class WP_Widget {
function __construct( $id_base = false, $name, $widget_options = array(), $control_options = array() ) {
// ...
}
}
view raw wp-widget-snippet.php hosted with ❤ by GitHub

only one file:

[gist id="9b1307f153f4abe352a4" file="media-control-snippet.php" /]
<p class="blazersix-media-control"
data-title="Choose an Image for the Widget"
data-update-text="Update Image"
data-target=".image-id"
data-select-multiple="false">
<?php echo wp_get_attachment_image( $image_id, 'medium', false ); ?>
<input type="hidden" name="image_id" id="image_id" value="<?php echo $image_id; ?>" class="image-id blazersix-media-control-target">
<a href="#" class="button blazersix-media-control-choose">Choose an Image</a>
</p>
view raw media-control-snippet.php hosted with ❤ by GitHub

specific lines:

[gist id="9b1307f153f4abe352a4" file="media-control-snippet.php" lines="2-5" /]
<p class="blazersix-media-control"
data-title="Choose an Image for the Widget"
data-update-text="Update Image"
data-target=".image-id"
data-select-multiple="false">
<?php echo wp_get_attachment_image( $image_id, 'medium', false ); ?>
<input type="hidden" name="image_id" id="image_id" value="<?php echo $image_id; ?>" class="image-id blazersix-media-control-target">
<a href="#" class="button blazersix-media-control-choose">Choose an Image</a>
</p>
view raw media-control-snippet.php hosted with ❤ by GitHub

highlight lines:

[gist id="9b1307f153f4abe352a4" file="media-control-snippet.php" highlight="7" /]
<p class="blazersix-media-control"
data-title="Choose an Image for the Widget"
data-update-text="Update Image"
data-target=".image-id"
data-select-multiple="false">
<?php echo wp_get_attachment_image( $image_id, 'medium', false ); ?>
<input type="hidden" name="image_id" id="image_id" value="<?php echo $image_id; ?>" class="image-id blazersix-media-control-target">
<a href="#" class="button blazersix-media-control-choose">Choose an Image</a>
</p>
view raw media-control-snippet.php hosted with ❤ by GitHub

oEmbed Gist style

OEMBED

link to specific revision:

https://gist.github.com/padolsey/527683/eea6004e74dfd42a63cc3b46e1412a3c8d5bb680
// ----------------------------------------------------------
// A short snippet for detecting versions of IE in JavaScript
// without resorting to user-agent sniffing
// ----------------------------------------------------------
// If you're not in IE (or IE version is less than 5) then:
// ie === undefined
// If you're in IE (>=5) then you can determine which version:
// ie === 7; // IE7
// Thus, to detect IE:
// if (ie) {}
// And to detect the version:
// ie === 6 // IE6
// ie > 7 // IE8, IE9 ...
// ie < 9 // Anything less than IE9
// ----------------------------------------------------------
// UPDATE: Now using Live NodeList idea from @jdalton
// and conditional compilation early exit from Scott Jehl
var ie = (function(){
if (/*@cc_on!@*/true) return undef;
var undef,
v = 4,
div = document.createElement('div'),
all = div.getElementsByTagName('i');
while (
div.innerHTML = '<!--[if gt IE ' + (++v) + ']><i></i><![endif]-->',
all[0]
);
return v;
}());
view raw gistfile1.js hosted with ❤ by GitHub

link to specific file of specific revision:

https://gist.github.com/mbostock/2647924/8dc705bbf0b566d253aa717540c68690d0e7cc09#file-index-html
<!DOCTYPE html>
<meta charset="utf-8">
<title>Canvas Swarm</title>
<style>
canvas {
position: absolute;
top: 0;
}
</style>
<div id="fps">FPS: <span>?</span></div>
<script src="http://d3js.org/d3.v2.min.js?2.9.1"></script>
<script>
var data = d3.range(500).map(function() {
return {xloc: 0, yloc: 0, xvel: 0, yvel: 0};
});
var width = 960,
height = 500,
angle = 2 * Math.PI;
var x = d3.scale.linear()
.domain([-5, 5])
.range([0, width]);
var y = d3.scale.linear()
.domain([-5, 5])
.range([0, height]);
var time0 = Date.now(),
time1;
var fps = d3.select("#fps span");
var canvas = d3.select("body").append("canvas")
.attr("width", width)
.attr("height", height);
var context = canvas.node().getContext("2d");
context.fillStyle = "steelblue";
context.strokeStyle = "#666";
context.strokeWidth = 1.5;
d3.timer(function() {
context.clearRect(0, 0, width, height);
data.forEach(function(d) {
d.xloc += d.xvel;
d.yloc += d.yvel;
d.xvel += 0.04 * (Math.random() - .5) - 0.05 * d.xvel - 0.0005 * d.xloc;
d.yvel += 0.04 * (Math.random() - .5) - 0.05 * d.yvel - 0.0005 * d.yloc;
context.beginPath();
context.arc(x(d.xloc), y(d.yloc), Math.min(1 + 1000 * Math.abs(d.xvel * d.yvel), 10), 0, angle);
context.fill();
context.stroke();
});
time1 = Date.now();
fps.text(Math.round(1000 / (time1 - time0)));
time0 = time1;
});
</script>
view raw index.html hosted with ❤ by GitHub

My style

[gist url="https://gist.github.com/tychay/9d4dfd6c1808ed836ee1" file="0_reuse_code.js"]
…
[/gist]
// Use Gists to store code you would like to remember later on
console.log(window); // log the "window" object to the console
view raw 0_reuse_code.js hosted with ❤ by GitHub

Broken codes

[gist There goes the neighorhood /]
[gist There goes the neighborhood]

(note: there is an undocumented issue with WP's shortcode processor in this case)

[gist]should do nothing also[/gist]
[gist]should do nothing also[/gist]

One thought on “Gist Tests”

  1. Pingback: FYWP #257-262: wpautop and shortcodes/oEmbed do not play nice at all | The Woodwork

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.