Whitelist Carrierwave attributes correctly

Say you have a User with a Carrierwave attribute #avatar:

class User < ActiveRecord::Base
  mount_uploader :avatar, AvatarUploader
end

When whitelisting the avatar field in the controller, you might do this:

params[:user].permit(:avatar)

But you probably want this:

params[:user].permit(:avatar, :avatar_cache, :remove_avatar)

In this example:

  • :avatar_cache allows a newly upload image to persist through form roundtrips in the case of validation errors (something that isn't possibl...

Don't use PDFKit v0.5.4 – it breaks on dead urls

When I upgraded from 0.5.4 PDFKit deadlocked or crashed when an ApplicationController::RouteError occured. If this error happens only because of a broken image link you probably still wan't the page to render and get a PDF with a "missing image placeholder" instead.

I don't know yet in which version (0.5.2, 0.5.3 or 0.5.4) the bug was built in. At the moment I'm doing fine with 0.5.1 and I didn't evaluate any other versions yet.

I will update this card as soon as I know further information (State 4th Nov. 2013).

Fix „command failed: /usr/bin/wkhtmltopdf ...“ using PDFKit middleware

Ubuntu 12.04 LTS x64, Ruby 1.8.7, Rails 2.13, PDFKit 0.5.4, Phusion Passenger Apache 2

I ran into this, when I started using passenger to deal with the Single Thread Issue which caused my webrick to deadlock when an ActionController::RoutingError (No route matches "...") occurred.

These steps brought me a little further

(1) assert dependencies are installed

 sudo aptitude install openssl build-essential xorg libssl-dev

(2) only for 64bits OS Run one by one the follo...

Texture Mixin for Sass

Awesome Sass plugin to experiment with Subtle Patterns based textures. It automatically removes the base color from the pattern, leaving a semi-transparent texture that you can tint in any color you want. It also has switches to invert the pattern.

@include texture(green, 34, 0); // color, texture-number, 0=inverted or 1=normal

If you have ever done this manually you know how much pain this can safe you. Check it out!

Carrierwave – Recreate versions

A snippet of the carrierwave documentation

You might come to a situation where you want to retroactively change a version or add a new one. You can use the recreate_versions! method to recreate the versions from the base file. This uses a naive approach which will re-upload and process the specified version or all versions, if none is passed as an argument.

Call recreate_versions! on a mounted uploader.

A common usecase

User.all.each { |user| user.avatar.r...

Building Custom Text Strikethroughs with CSS

Did you know you can color your line-throughs or underline, or make them wavy like spell-checkers do?

redshift

For all late night coders:

The program "redshift" changes your monitors' white balance according to your position on the planet and your local time. This is supposed to put less strain on your eyeballs than staring at a "daylight white" screen all day and night.
The program is in the Ubuntu repositories, so a simple "sudo apt-get install gtk-redshift" transfers it onto your hard drive.

I find the effect rather pleasing and so I have set the following alias on my computer:

alias rdshft='gtk-redshift -l 48.3714407:10.8982552 -t 6500:4200 &'...

exception_notification 3.0.0+ lets you send errors as HTML e-mails

Exception notifications contain a lot of information: Backtraces, HTTP headers, etc. exception_notification tries its best to format this wall of information using ASCII art, but you can also make it send those notification as simple HTML e-mails that have some simple formatting for clarity, but no images etc. To do so, activate this option:

:email_format => :html

Those HTML notifications are still delivered with a text-only version, so if you are using a console cli...

Sprites with Compass

Using CSS sprites for background images is a technique for optimizing page load time by combining smaller images into a larger image sprite.

There are ongoing arguments on how useful this still is, as modern browsers become more comfortable to load images in parallel. However, many major websites still use them, for example amazon, [facebook](...

Common mistakes when storing file uploads with Rails

1. Saving files to a directory that is not shared between deploys or servers

If you save your uploads to a made up directory like "RAILS_ROOT/uploads", this directory goes away after every deploy (since every release gets a new). Also this directory is not shared between multiple application servers, so your uploads are randomly saved to one local filesystem or another. Fixing this afterwards is a lot of fun.

Only two folders are, by default, shared between our application servers and deployments: "RAILS_ROOT/storage" and `"RAILS...

Clean up application servers when deploying

Our development process makes us deploy very often. As the number of releases grows, junk clogs up the hard drive of our application servers:

  • Old release code
  • Old tmp folders with compiled view templates etc.
  • Precompiled assets (Javascripts, images...) that no longer exist. When using the asset pipeline, Capistrano will symlink the public/assets directory to shared/assets. This is cool since we can still serve previous assets after a new release, in the window where browser caches might still have references to old assets. But i...

Firefox >= 23 will block mixed content when using SSL

Non-SSL contents on SSL pages are blocked by default

Bug 834836 – Turn on pref to block mixed active content

Firefox 18 introduced preferences to block loading contents from non-SSL (http) sites on SSL (https) pages. One of those preferences, security.mixed_content.block_active_content is now enabled by default in order to enhance user security. That means insecure scripts, stylesheets, plug-in contents, inline frames, Web fonts and WebSockets are blocked on secure pages, and a notification is displayed instead. It will not block...

Tips And Tricks For Print Style Sheets

Smashing Magazine lists some handy tricks for print style sheets, all with CSS:

Capturing signatures on a touch device

If you need to capture signatures on an IPad or similar device, you can use Thomas J Bradley's excellent Signature Pad plugin for jQuery.

To implement, just follow the steps on the Github page.

The form

If you have a model Signature with name: string, signature: text, you can use it with regular rails form like this:

- form_for @signature, :html => { :class => 'signature_form' } do |form|
  %dl
    %dt
      = form...

Regex: Be careful when trying to match the start and/or end of a text

Ruby has two different ways to match the start and the end of a text:

  • ^ (Start of line) and $ (End of line)
  • \A (Start of string) and \z (End of string)

Most often you want to use \A and \z.

Here is a short example in which we want to validate the content type of a file attachment. Normally we would not expect content_type_1 to be a valid content type with the used regular expression image\/(jpeg|png). But as ^ and $ will match lines, it matches both content_type_1 and content_type_2. Using \A and \z will wo...

How to test your website for different versions of Internet Explorer or Edge

Virtualization

Microsoft provides virtual machines for different Internet Explorer versions.

The images are available for various virtualization solutions, including VirtualBox.

BrowserStack

For a monthly fee browserstack.com provides access to various versions of Windows and Internet Explorer through your web browser. It's pretty convenient.

By installing a Chrome addon you can ...

daylerees/colour-schemes · GitHub

Awesome color schemes for RubyMine, Sublime Text 2 and other editors.

To install the themes into your Rubymine, copy intellij-themes/*.xml from the repository to your local ~/.RubyMine40/config/colors. Then restart RubyMine.

Enjoy!

randym/axlsx · GitHub

Axlsx is an incredible gem to generate "Office Open XML" spreadsheet files (XLSX). Does not break on large spreadsheets and supports a ton of features like graphs.

API looks mature and existing code is easy to migrate when coming from the spreadsheet gem.
The documentation of some methods is a bit out of date, but you'll find your way around the gem's code.

No support for reading files, however. :( If you want to open XLSX spreadsheets (for example to confirm your output in tests), you can use [roo](h...

lorempixel - placeholder images for every case

Generate dummy images for a given dimension and topic.

Responsive & Touch-Friendly Audio Player | Codrops

A jQuery audio player plugin that is responsive and touch-friendly. The UI is css-only, no images used.

jquery-timing - a jQuery plugin you should know about

jquery-timing is a very useful jquery plugin that helps to remove lots of nested anonymous functions. It's API provides you some methods that help you to write readable and understandable method chains. See yourself:

Example

// before
$('.some').show().children().doThat();
window.setTimeout(function(){
  $('some').children().doSomething().hide(function() {
    window.setTimeout(function() {
      otherStuffToDo();
    }, 1000);
  });
}, 500);

// after
$('.some').s...

Render Sass stylesheets dynamically

If - for whatever reason - you have to render stylesheets dynamically, the following snippet might be of help. It emulates what "sprockets" would to when precompiling your assets, and give your stylesheets access to all the regular bells and whistles (like asset_path, proper @imports etc):

class DynamicStylesheetsController < ApplicationController

    def show
      logical_path = RELATIVE_PATH_TO_YOUR_TEMPLATE
      path = File.join(Rails.root, logical_path)
      template = Sass::Rails::SassTemplate.new(path)
      environment = ...

How to find out a pixel's transparency with Gimp

If you have a PNG and want to know a pixel's alpha channel value, you can use Gimp:

  • Use the color picker tool
  • Hold the Shift key while clicking the pixel

A window will appear, containing color information, including the alpha channel.

Gimp color information

imgAreaSelect - image selection/cropping jQuery plugin

imgAreaSelect is a jQuery plugin for selecting a rectangular area of an image. It allows web developers to easily implement image cropping functionality, as well as other user interface features, such as photo notes (like those on Flickr).