Skip to content

Instantly share code, notes, and snippets.

View rctneil's full-sized avatar
🎢
Needing to ride roller coasters!

Neil Tonge rctneil

🎢
Needing to ride roller coasters!
View GitHub Profile
@bluefuton
bluefuton / to_sentence.php
Created November 22, 2010 17:39
Simple implementation of Rails' .to_sentence for PHP
<?php
class ArrayExtensions
{
public function to_sentence($array)
{
$count = count($array);
switch ($count)
{
case 0:
@innotekservices
innotekservices / jquery.spin.js
Created October 16, 2011 02:39
jQuery Plugin for Spin.js
/*
You can now create a spinner using any of the variants below:
$("#el").spin(); // Produces default Spinner using the text color of #el.
$("#el").spin("small"); // Produces a 'small' Spinner using the text color of #el.
$("#el").spin("large", "white"); // Produces a 'large' Spinner in white (or any valid CSS color).
$("#el").spin({ ... }); // Produces a Spinner using your custom settings.
$("#el").spin(false); // Kills the spinner.
@fnichol
fnichol / README.md
Created February 26, 2012 01:23
A Common .ruby-version File For Ruby Projects

A Common .ruby-version File For Ruby Projects

Background

I've been using this technique in most of my Ruby projects lately where Ruby versions are required:

  • Create .rbenv-version containing the target Ruby using a definition name defined in ruby-build (example below). These strings are a proper subset of RVM Ruby string names so far...
  • Create .rvmrc (with rvm --create --rvmrc "1.9.3@myapp") and edit the environment_id= line to fetch the Ruby version from .rbenv-version (example below).

Today I learned about another Ruby manager, rbfu, where the author is using a similar technique with .rbfu-version.

@anthonyshort
anthonyshort / _media-queries.scss
Created March 13, 2012 10:37
Media Queries in Sass
// Media Queries in Sass 3.2
//
// These mixins make media queries a breeze with Sass.
// The media queries from mobile up until desktop all
// trigger at different points along the way
//
// And important point to remember is that and width
// over the portrait width is considered to be part of the
// landscape width. This allows us to capture widths of devices
// that might not fit the dimensions exactly. This means the break
@thulstrup
thulstrup / compass-retina-sprites.scss
Created March 20, 2012 19:18
Using Compass to generate normal and retina sprite maps
$sprites: sprite-map("sprites/*.png");
$sprites-retina: sprite-map("sprites-retina/*.png");
@mixin sprite-background($name) {
background-image: sprite-url($sprites);
background-position: sprite-position($sprites, $name);
background-repeat: no-repeat;
display: block;
height: image-height(sprite-file($sprites, $name));
width: image-width(sprite-file($sprites, $name));
@brianmcallister
brianmcallister / maintain-ratio.scss
Last active December 9, 2022 20:18
Sass mixin for a responsive box that maintains an aspect ratio.
// Maintain ratio mixin. Great for responsive grids, or videos.
// https://gist.github.com/brianmcallister/2932463
//
// $ratio - Ratio the element needs to maintain.
//
// Examples
//
// // A 16:9 ratio would look like this:
// .element {
// @include maintain-ratio(16 9);
@javan
javan / screenshot.js
Created June 19, 2012 21:40
Create a screenshot of any URL using phantomjs (headless webkit)
//
// Example usage: phantomjs screenshot.js http://yahoo.com /tmp/yahoo.png
//
var system = require('system');
var url = system.args[1];
var filename = system.args[2];
var page = new WebPage();
page.open(url, function (status) {
/*
* a small mixin for easy use of rem with px as fallback
* usage: @include x-rem(font-size, 14px)
* usage: @include x-rem(marign, 0 12px 2 1.2)
* usage: @include x-rem(padding, 1.5 24px)
*
* thanks to Eric Meyer for https://github.com/ericam/susy
* and Hans Christian Reinl for http://drublic.de/blog/rem-fallback-sass-less/
*/
@mixin x-rem($property, $values) {
@mikeatlas
mikeatlas / clear_dev_logs_in_rails.rb
Last active February 28, 2021 14:39
automatically clear rails development logs on startup if they're too big
# config/initializers/clear_logs.rb
# This snippet simply clears your logs when they are too large.
# Every time you start the rails environment it checks log sizes
# and clears the logs for you if necessary.
if Rails.env.development?
MAX_LOG_SIZE = 10.megabytes
logs = File.join(Rails.root, 'log', '*.log')
@Integralist
Integralist / Description.md
Last active April 25, 2020 16:20
This is how BBC News currently implements it's Image Enhancer for responsive images. Note: this is a completely rebuilt version of the code so the BBC's original source code doesn't actually look anything like the below example.

The BBC has a server-side image service which provides developers with multiple sized versions of any image they request. It works in a similar fashion to http://placehold.it/ but it also handles the image ratios returned (where as placehold.it doesn't).

The original BBC News process (and my re-working of the script) follows roughly these steps...

  • Create new instance of ImageEnhancer
  • Change any divs within the page (which have a class of delayed-image-load) into a transparent GIF using a Base64 encoded string.
    • We set the width & height HTML attributes of the image to the required size
    • We know what size the image needs to be because each div has custom data-attr set server-side to the size of the image
    • We then set a class of image-replace onto each newly created transparent image
  • We use a 250ms setTimeout to unblock the UI thread and which calls a function resizeImages which enhances the image-replace images so their source is now set to a URL whe