How to find out the currently focused DOM element with JavaScript

This works in all relevant browsers:

document.activeElement

You can use this in your Selenium steps, for example, to assert that a form field is or is not focused.

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 = ...

Cronjobs: "Craken" is dead, long live "Whenever"

Our old solution for cronjobs, the "craken" plugin, is no longer maintained and does not work on Rails 3.2+.

We will instead use the whenever gem.

"Whenever" works just like "craken", by putting your rake tasks into the server's cron table. Everything seems to work just like we need it.

Installation for new projects

  1. Add "whenever" to your Gemfile:

     group :deploy do
       gem 'whenever', require: false
     end
    
  2. Add it to your config/deploy.rb:
    ...

Debugging Apache's mod_rewrite

Debugging .htaccess is hell, and RewriteRules in particular if they are not working as expected. But fear not! RewriteLog will help you out. \
Add this to your vhost's configuration:

RewriteLog "/tmp/rewrite.log"
RewriteLogLevel 9

After that, restart your Apache httpd and tail the above logfile.

When you are done and all is well: remember to remove those entries again, or set the log level to 0, to switch off rewrite logging.

5 APIs that will transform the Web in 2013

Over the next year, there are a number of technologies coming down the pipeline that have the potential to radically transform how we use and develop for the Web.

Firefox makes an OPTIONS request you don't expect

If some AJAX functionality does not work, but you see Firefox making an OPTIONS request, the reasons is most likely this:

You're accidently trying to talk to a different domain (or switching from http to https), and Firefox tries to find out if that is okay, according to the "Cross-Origin Resource Sharing" standard.

CSS that lets your alarm bells ring

Harry Roberts, a youngster from the UK, wrote a comprehensive article telling you how to smell CSS rot early.

Examples:

  • Undoing styles
  • Magic numbers
  • Qualified selectors
  • Dangerous selectors
  • Reactive !important

… and more.

Hack: Detect DOM node insertions using plain CSS

David Walsh from Mozilla shows how to fire 'DOM changed' events from CSS. No need for JS to observe DOM mutation events or check the DOM manually – simply put: no deprecated API, no retarding loops.

With the CSS in place you add a listener for your custom 'DOM changed' event and that's it!

navy gem: Hide empty navigation bars

navy 0.5.1+ gives empty navigation containers a CSS class .navy-empty which you can hide via

.navy-navigation
  &.navy-empty
    display: none

Convert Syck to Psych YAML format

Hopefully you are using Psych for everything, but if you have legacy Syck YAML files lying around you could be in for some pain because they are not necessarily compatible. In my case, I had a bunch of i18n translation files emitted with Syck which uses an incompatible escape code structure instead of plain utf-8, thereby rendering the files unreadable by both Psych and humans alike. My solution was a little script utilizing the fact that the engine can be swapped dynamically.

New makandra cards feature: Repeating cards

Cards can now be flagged as "Repeating".

Every Wednesday, some of these cards will be moved back to the top of the deck.

This is intended for important cards that you want your team to occasionally repeat, so they aren't lost in the depths of your deck.

For your own deck, you can set the number of cards to repeat in your Deck Admin.

SearchableTrait is now a gem: Dusen

For two years we've been using SearchableTrait which gives models the ability to process Googlesque queries like this:

Contact.search('a mix of words "and phrases" and qualified:fields')

This trait used to be a huge blob of code without tests and documentation, so I made a gem out of it. Check out https://github.com/makandra/dusen for code, tests, and a huge README.

You should use the Dusen gem and delete SearchableTrait in all future projects.

Note that the syntax to define query proc...

How to fix: Unable to read files from a VirtualBox shared host folder

When you want to copy/move from a shared folder (on Windows guests, for example) and it fails with absurd error messages (lots of text or an error about the target being read-only), you are probably running on Guest Additions that no longer match your VirtualBox version.

Fix: install the latest VirtualBox Guest Additions in your guest machine.

Note that you need to make sure you are using the correct ISO.

How to fix: VirtualBox Guest Additions setup is out of date

When you are trying to install/update VirtualBox Guest Additions on your guest machine but the setup is for a different/older version (for example 4.0.4 tools for a 4.1.x VirtualBox installation), try this:

sudo apt-get install virtualbox-guest-additions-iso

For some reason, this is no dependency to VirtualBox itself -- and if you have an old ISO lying around, VirtualBox will just pick that one, regardless of its version.

Oh joy.

Xfce: Classic panel layout in the style of Gnome 2 or Windows XP

Xfce gives you a million options to configure your panels. Together with Xfce's sometimes arcane configuration UI, this can be a huge time waster and super-annoying if you need to get work done the same day.

This card describes how to setup a classic panel layout as you might be used to from Gnome 2 or Windows (see screenshot below). You can use this to quickly get productive in Xfce, and as a starting point for further customization.

  • [One task bar on the bottom of each monitor](https://makandracards.com/makandra/...

Xfce: Configure global keyboard shotcuts

Global keyboard shortcuts can be configured in two separate panels in the Xfce Settings manager:

  • Shortcuts related to managing windows (e.g. "Show Desktop" or "Switch to Workspace 2") are unter Window Manager / Keyboard
  • Shortcuts to launch applications (e.g. Meta+T for Terminator) are under Keyboard / Application Shortcuts

When Nautilus/Thunar file manager sorts case-sensitively

When your file manager sorts file case-sensitively after a distribution upgrade, you probably need to reconfigure your locale settings as described here.

Switch from Compiz to Xfce's native window manager

If you tried out Compiz on top of Xfce and found it to be a world of pain like me, you can get to Xfce's native window manager by saying:

xfwm4 --replace

Ubuntu: Fix missing sound after a version upgrade

If you can now longer hear or record sounds after upgrading Ubuntu, you probably need to re-tell Ubuntu which devices to use for playback/recording.

Fix sound output

  • Open the PulseAudio Volume Control (pavucontrol). If you don't have that application, install it with sudo apt-get install pavucontrol.
  • Start playback of an MP3 so you can see when changes take effect.
  • Under "Output devices" use the "Mute" buttons to figure our which output device is the correct one. When you found it, also set it as the fallback dev...

Xfce: Separate task bars for each monitor

So you have multiple screens under Xfce and want to have one task bar on each screen, only showing applications on that screen. Here you go:

  • Create one panel for each monitor. Panels can be created from the panel preferences of another panel (yeah...).
  • Unlock each panel by going to Right click / Panel / Panel preferences... and uncheck "Lock panel". You now see a grip that you can use to drag one panel to the bottom of each monitor.
  • Again go into the panel preferences, and under Items add a single item "Window buttons". In the ite...

Xfce: Configure multiple monitors

If you don't want to mess around with arcane incantations inside xorg.conf, you can use the graphical arandr tool:

sudo apt-get install arandr
arandr

If all your monitors are stacked in the same space, the space is not wide enough and you can't really move them, you need to switch to a proprietary driver. If it works with the open source driver for you, do not bother using another one.

For ATI cards:

  • install fglrx and fglrx-amdcccle
  • reboot
  • run the ATI configuration tool (amdcccle; if the binary is unavailable ...

Xfce: Take a screenshot with the "Print" key

  • Go to Settings Manager / Keyboard / Application Shortcuts
  • Add a shortcut for the Print key that calls xfce4-screenshooter -f

This may be configured for you by default.

Rails 2: Calling instance_eval on a scope will trigger a database query

In Rails 2, when calling instance_eval or instance_exec on a scope, the scope will fetch its records from the database.

This has been fixed in Rails 3+.

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