Martin Ström
my-domain.se

Pluxemburg.com

Pluxemburg.com is the website for Swedish technotronica band Pluxus and the record label Pluxemburg they run together with Jonas Sevenius and us (Martin Strm and Peter Strm).

Pluxemburg has since its launch in 2000 gone from a small independent label with only one artist “Pluxus” to bigger with several artists (and grammy awards!) and then back to again being a quite small label. The 2009 version of Pluxemburg focuses mainly on Pluxus and Pluxus related projects.

A small record label needs to not only work on the websites of their artists and the label itself, but also constantly make sure that the info on the many online forums and communities are up to date and accurate. There needs to be Facebook and Myspace pages, last.fm events, discogs.com entries and so on. Updating these websites as soon as something happens (gigs, releases, parties, videos, etc) is time consuming and unfortunatley often ends up in a copy paste manner (spamming) rather than using the different forums for their different purposes.

When thinking about these conditions in connection to building a new Pluxemburg website, we realized that instead of constantly keeping the Pluxemburg and Pluxus websites updated, we should make a website that mirrors the contents of each community and instead spend our time keeping these communities updated. The information for each part of the new Pluxemburg.com is therefor spread out on the community where it “belongs” the best. The discography is mirrored from Discogs, the events from Last.fm, videos from YouTube, information from Wikipedia, links from Delicious and sounds from SoundCloud. We use the popular tumblelog Tumblr for the newsfeed, adding not only a tool for keeping our website updated but a small community in itself too. All colors used on Pluxemburg.com are based on the “corporate” colors of each community, making also the design a mirror of each community. There is even a Twitter-feed that mirrors everything that goes on on Pluxemburg.com, somehow making the site into a complete loop.

Technically, every day a pretty straight-forward Ruby script will automatically run on our server to update the information from all sources and then sends it (together with a security token to make sure the data isn’t messed with) to a PHP script at pluxemburg.com. The PHP script then processes (cleans and validates) the data and stores it in a file as serialized PHP, which is used by the index page to present the information.

www.pluxemburg.com


Copy Paste Character

Two weeks ago we (me and Konst & Teknik) launched copypastecharacter.com—a site to make it dead easy to copy those special characters which otherwise can be hard to find. We just pushed an update and I realized I hadn’t mentioned it here.

The character you click will automatically get copied into your clipboard, thanks to the flash technique mentioned here. However, I wrote my own JavaScript class to handle the clipboard and the buffer of clicked characters since you can hold down ‹alt› to copy multiple characters at once.

Here’s the source for the copy buffer class in case anyone’s interested:


Clean up your Spotlight search results

Spotlight

By default, Spotlight will index all your mail Mail.app messages and attachments, even those in your Trash and Spam folders. To exclude these folders from the Spotlight results you can add the folders to the “Privacy” section of the “Spotlight” pane in “System Preferences”.

I’m using IMAP on Gmail so your path may be a little different if you’re on another setup. The paths I choose to exclude are

~/Library/Mail/IMAP-user@imap.gmail.com/[Gmail]/Trash.imapmbox
~/Library/Mail/IMAP-user@imap.gmail.com/[Gmail]/Spam.imapmbox
~/Library/Mail/IMAP-user@imap.gmail.com/[Gmail]/All Mail.imapmbox/Attachments

You might not want to use the last one if you tend to keep attachments in the mail message but I usually save the important ones to a real folder.


My Terminal Setup for Rails Development

I’m quite happy with my Terminal.app setup right now for the Rails projects I’m working on and wanted to share the bits and pieces I use.

First, I found a SIMB plugin for Terminal that’ll show the tab’s title in the tab instead of the running process. I use the plugin with a simple title helper in my .bash_profile to set the title simply.

function title () {
  unset PROMPT_COMMAND # more on this later
  echo -ne "\e]0;$1\a"
}

# Usage:
# title 'my title'

Second, I use a technique I saw on how to automatically set the title to display the current working directory as title, but since I use the plugin and helper function above, I could simplify the PROMPT_COMMAND a bit:

function set_window_and_tab_title {
  local title="$1"
  [[ -z "$title" ]] && title="root"
  echo -ne "\e]0;${title}\a"
}

PROMPT_COMMAND='set_window_and_tab_title "${PWD##*/}"'

That’s why I unset PROMPT_COMMAND in my title function, so it won’t auto update when I choose to set it manually using the title function.

The last piece is an updated version of my old Rails Term-script for iTerm which has been updated (and improved) for the Terminal in Mac OS X Leopard instead of iTerm.

It will open the tabs I usually use when doing Rails development and set the title of each tab using the above mentioned functions. You need to enter you projects root directory and the projects you want to have easy access to. I’ve added some comments to the AS code to help you out.

Download a zipped version of the AppleScript. Just drag the script to the Script Editor (/Applications/Utilities) to edit it.

All source code for these scripts can also be viewed on Pastie. Let me know if you have any improvements.


./script/server with automatic port finder

This is the script I’m using when I start my local Rails development server. It will automatically detect the next available port starting at the default port 3000 so I can have multiple servers running without remembering what ports that are already busy.

#!/usr/bin/env ruby

DEFAULT_PORT = 3000

puts (`ps aux | grep [r]uby | grep script/server`.split("\n").map { |l|
  server = l.split(/\s+/)[11..-1]
  (port = server.index('-p')) ? server[port.next].to_i : DEFAULT_PORT
}.max || DEFAULT_PORT - 1).next

I aliased it to ss in .bash_profile like this:

alias ss='./script/server -p `~/bin/available_rails_port`'

(Btw, Happy 2008! I haven’t updated this site for a while)


Modernize Rails (or: get rid of Verdana)

Verdano

Tired of see the the soooo 1999-ish font “Verdana” every time you get a local error page in Rails?
Now you don’t have to. With this plugin the error pages will use Arial or Helvetica instead—finally!

To install:
./script/plugin install http://burnfield.com/svn/martin/rails/plugins/verdano

or as svn:external:

./script/plugin install -x http://burnfield.com/svn/martin/rails/plugins/verdano

I’ve moved to git so the new instructions are:

git clone git://github.com/haraldmartin/verdano.git

or just braid it

Happy new year!


Multi-dimensional array sorter

The other day when working on some small updates on konst-teknik.se I wanted to sort the projects in a multi dimensional way, and take the other factors than the first into account. JavaScript’s Array#sort only supports one dimensional sorting so I wrapped my own sorter.

The results turned up pretty good (at least compared to the first test), or perhaps I just like recursing functions.



var sortOrder = {
  'cat-no': ['cat-no', 'name', 'type', 'year'],
  'name':   ['name',   'type', 'year', 'cat_no'],
  'year':   ['year',   'name', 'type', 'cat_no'],
  'type':   ['type',   'name', 'year', 'cat_no']
};

function sort(order) {
  var ordering = sortOrder[order], length = ordering.length;
  $$('#projects > li').sort(function(left, right) {
    left = Project.find(left), right = Project.find(right);
    return (function(index) {
      var a = left.getSortValue(ordering[index]),
          b = right.getSortValue(ordering[index]);
      return a < b ? -1 : a > b ? 1 :
        index < length ? arguments.callee(++index) : 0;
    })(0);
  }).each(function(project) {
    project.parentNode.appendChild(project);
  });
}


iCal & iPhone syncing in Leopard

Looks like I’m not the only one having problems with my iCal to/from iPhone syncing.

After trying almost every possible solution I found in various forums and google, I finally came up with a fix that works for me. Like many others, I suspected the subscribed calendars were the problem and the iPhone synced fine after removing the subscriptions (including the built-in Birthdays calendar). But I have some subscribed calendars I want to have in iCal and found out that the cannot live in a group. I used to have a calendar group (File → New Calendar Group) for my “noisy” calendars so I could hide them easy with just one click. Looks like iCal/iPhone/Sync/OSX/whatever doesn’t like this and syncing stops working when using the group.

Doesn’t work:

picture-2.png

Works:

picture-1.png


Mac OS X 10.5.1 and Multi-Safari

Seems like Multi-Safari (at least 2.0.4) broke when upgrading to Mac OS X 10.5.1. I get this error:

“You cannot use the application ‘Safari 2.0.4′ with this version of Mac OS X.”

Luckily, I’ve found a workaround. Just launch Safari from the command line (Terminal.app that is) and it should work for you:

/Applications/Safari\ 2.0.4.app/Contents/MacOS/Safari &


Ajax.CachedRequest

Recently I wanted to cache the results (responseText) from a lot of Ajax.Requests since the returning data would not change and made the roundtrip to the server unnecessary. Maybe there are others out there interested so here’s the code. It’s not very well tested except the project where it is in use so there might be some bugs or tweaks needed.


Ajax.CachedRequest = Class.create(Ajax.Request, {
  initialize: function($super, url, options) {
    options = options || {};
    var onSuccess = options.onSuccess || Prototype.K;
    if (!Ajax.CachedRequest.cache[url] || options.reload) {
      options.onSuccess = function(transport) {
        Ajax.CachedRequest.cache[url] = transport.responseText;
        onSuccess(transport);
      }
      $super(url, options);
    } else {
      eval(Ajax.CachedRequest.cache[url]);
      this.dispatch.defer();
      [onSuccess, options.onComplete].each(function(m) { m && m() });
    }
  },

  dispatch: function() {
    Ajax.Responders.dispatch('onComplete', null);
  }
});

Ajax.CachedRequest.cache = {};

Of course this assumes you’re using the brand new Prototype 1.6


OmniFocus to iPhone bookmark exporter

Since the iPhone lacks the possibility to export tasks from iCal I made hack/script to export all tasks from OmniFocus to a Safari bookmark and therefore be syncable with Safari.

Read more in the OmniGroup forums and/or download the latest version here.

Update: On request, here are some screenshots of how the todo list looks like:

of-2.png


Burnfield Dark WordPress Theme issue

I get a lot of questions on how to make the thumbails show up on theme behind this site. So I’ve updated the page with some instructions to help you all.

I’ve started on the 2.0 version on the theme that will (along other features) make thumbnails easier to manage.

Read more


Prototype & Script.aculo.us SVN checkins RSS feed

Thanks to Yahoo Pipes I created two RSS feeds for the Ruby on Rails checkins (changesets). One containing only the Rails-spinoffs checkins (that is Prototype and Script.aculo.us right now) and another without the spinoffs. This way I can follow the JavaScript-related changes as they happen but watch the Ruby-stuff every now and then.


AppleScript to open iTerm tabs for Rails development

Update: This script is ported (and improved) to work with OSX Leopards’ Terminal.app.

I never really liked iTerm because of slow redrawing, ugly text anti aliasing and not reflowing text when resizing the window.

After reading some interviews on a Rails site today and saw that a lot of people are using iTerm i wanted to give one more try (because I’d really like a tabbed terminal).

It has improved a lot the latest months and seems really usable now. To make Rails development easier, I hacked together a small AppleScript what will ask you for the path to the Rails directory you want to use and then open four new tabs with Server/Mongrel, Console, Autotest and the directory itself. I thought it could be useful for others as well so here you go:

Save as an .app and run from Quicksilver:


global rails_dir

tell application "iTerm"
    activate
    set rails_dir to the text returned of (display dialog ¬
        "Please Enter the Path to Your Rails Directory" default answer ¬
        "~/Projects/" as text)

    if (count of terminal) = 0 then make new terminal

    my open_tab("Server", "&& ./script/server")
    my open_tab("Console", "&& ./script/console")
    my open_tab("Autotest", "&& autotest")
    my open_tab("Rails Directory", "")
end tell

on open_tab(title, command)
    tell application "iTerm" to tell first terminal
        launch session "Default"
        tell last session
            write text "cd " & rails_dir & command
            set name to title
        end tell
    end tell
end run_command

What's new in Prototype svn?

Just after posting this I saw that sam tagged the 1.5.1 release in svn so I guess this means that 1.5.1 is final. Great work!

There has been a lot of action the past days in the Prototype SVN; the release of 1.5.1 RC4, the new DOM and Position branches and a lot of other work. Since I watch most of the tickets and changesets I thought I write something about what’s (might be) in the future for Prototype.

DOM branch

I was happy to see a patch I’ve been working on (#7476) to get included some days ago. It will define a new Element#writeAttribute method which will work together as the already existing #readAttribute to work around many issues browsers having with the native set/getAttribute methods (as always mostly in IE) but also to make chaining work:

$('my_image').writeAttribute('src', 'new-image.png').show();

The method will also accept a hash for the attributes to let you set multiple attributes at once:

$('my_image').writeAttribute({src: 'new-image.png', custom_attr: 'foo'}).show();

The patch will also make the Element object into a constructor for very easy and fast element creation (i.e. document.createElement wrapper):

var header = new Element('h1');

The constructor will also accept an optional attributes hash for the attributes (as seen above in the #writeAttribute method):

var header = new Element('h1', {id: 'myHeader'});

Of course chaining will work so for a simple image switcher with preloading you could do this:

<!-- html -->
<img src="thumbnail.jpg" id="thumbnail" hires="big.jpg">

// javascript
$('thumbnail').observe('click', function(event) {
    var thumb = Event.element(event),
      preloader = new Element('img', {src: thumb.readAttribute('hires')});
    preloader.observe('load', function(event) {
        thumb.writeAttribute('src', preloader.readAttribute('src'));
    });
});

Event Branch

I haven’t followed the event branch very closely but from the code and messages on the ML I’ve seen there should be new functionality for better garbage collection (to prevent memory leaks) and for e.g. easier removal of observers from elements.

Where you before had to manually collect all an element’s event listeners to be able to remove them later:

var listener1 = function(event) {...}.bindAsEventListener();
var listener2 = function(event) {...}.bindAsEventListener();

// start listening
$('myElement').observe('click', listener1);
$('myElement').observe('click', listener2);

// stop listening
$('myElement').stopObserving('click', listener1);
$('myElement').stopObserving('click', listener2);

you will now be able to remove all event listener for a specfic event:

$('myElement').stopObserving('click'); // or Event.stopObserving('myElement', 'click');

Other

Some other new additions worth mentioning are:

But to not make this post too long you’ll have to read about it on your own (check the source and/or the changesets manually).

Please notice that all these are subject to change since it’s under development right now and might never get into any future release of Prototype.


Konst & Teknik site finally launched

After five months we finally launched the new site for Konst & Teknik last night. It is my first Ruby on Rails-project and even though it might look pretty simple it has a lot of advanced things going on both server- and client wise. I plan to write more about the development of the site shortly.


One animated background image for multiple elements in Safari

I’ve found out that Safari can’t handle the same animated gif as background for multiple elements, it will just animate one of them at the same time. On a project I’m currently working on my I use the following trick to make all requests to the background image (in this case indicator_black.gif) unique.

[...]
var text = transport.responseText;
if (Browser.WebKit) {
    text = text.gsub('indicator_black.gif', function(match) {
        return match + '?' + new Date().valueOf() +
          Math.round(Math.random() * 5000);
    });
}
[...]

Note that it uses Prototype JavaScript framework and you should too.

Update:

This is fixed in WebKit nightly (and therefore Safari 3 but I haven’t tested yet).

Rails' time extensions ported to JavaScript

I’ve ported Rails’ Numeric Time extensions to JavaScript since I needed to do some date calculations for a project I’m working on. Now one should be able to calculate dates in JS like this:

(5).seconds() // => 5000
(2).weeks() + (2).hours() + (15).seconds() // => 1216815000
(1).week().fromNow().toDate() // => Fri Sep 22 2006 19:16:32 GMT+0200 (CEST)
var date = new Date(2000, 11, 18, 18, 15, 23);
(2).years().since(date).toDate() // => Thu Dec 19 2002 06:15:23 GMT+0100 (CET)

Thought it could be useful for others as well. You’ll need the latest prototype library, unit tests are included.

Download a zip with both .js file and unit tests or just the .js-file.


TextMate Prototype & Scriptaculous Bundle

This the first version of a TextMate bundle for Prototype and script.aculo.us JavaScript libraries. The language grammar is based on from Justin Palmers Prototype Bundle but the other commands/snippets are all new. Please let me know if you have any comments and/or improvements.

Download here

Update 2006-07-16

The bundle is now added to TextMates official svn repository.

Prototypish Style Sheet Switcher

This is a Prototypish rewrite of Paul Sowdens Style Sheet Switcher. The original version has a lot of global functions so I put everything into a class instead and made the code a bit more elegant. It should work as the normal one except for some methods have been renamed.

A cookie library is included as well since the switcher needs to read and create cookies to save the users preferred style sheet.

Update

I fixed a bug for pages without any alternate style sheets and updated the script to version 0.2.

Download


AutoPair functionality using Cocoa KeyBindings

I’ve been using the application “AutoPairs” since it was mentioned on 43folders some time ago. Yesterday (via the Macromates TextMate blog) I found an article on the Cocoa Text System and realised I could recreate AutoPairs’ functionality by just using native Cococa Keybindings found in OSX.

Add these lines to your ~/Library/KeyBindings/DefaultKeyBinding.dict (create the file if it isn’t already there) and the commands will be available in every application started afterwords.

/* Recreate Auto pairs functionality */
"\\\"" = ( "insertText:", "\"\"", "moveBackward:" );
"("    = ( "insertText:", "()", "moveBackward:" );
"~("   = ( "insertText:", "{}", "moveBackward:" );
"~8"   = ( "insertText:", "[]", "moveBackward:" );
"<"    = ( "insertText:", "<>", "moveBackward:" );

When you type e.g ⇧2 for a double quote (as in swedish keyboard layout), it’ll automatically insert the ending quote as well and place the cursor between them. This will also work for “([{<”. Remember the shortcuts are for a swedish keymap so you might want to change that.

A real time saver when writing outside an editor without this functionality built-in (like TextMate).

Update 2006-08-07 Simplfied the commands based on Jacob Rus’ comment.

Autonamed dump/temp folder

To keep my desktop nice and clean I have a folder called “Dump” where I put temporary stuff like apps I want to try, PDF:s to read later that day or files I’m currently working with. But sometimes I forget to look inside that folder to find out what’s there so I wrote this Folder Action to let the folders name reflect the number of containing files/folders. (I know I could just enabled “Show item info” from Finders “View Options” but I don’t want to see all info for my hard drives and iPod)

autonamed-dump-folder.png

Just create a folder on your desktop, name it something like “Dump (temp)” and attach this Folder Action to it (Folder Actions need to be located in ~/Library/Scripts/Folder Actions).

-- Set item count as folder name.scpt
on adding folder items to this_folder
    my update_name(this_folder)
end adding folder items to

on removing folder items from this_folder
    my update_name(this_folder)
end removing folder items from

on update_name(this_folder)
    set this_name to POSIX path of this_folder
    set sh_script to do shell script "P=\"" & (POSIX path of (path to me) as string) & "\";echo ${P/%.scpt/.sh}"
    set new_name to do shell script "\"" & sh_script & "\" \"" & this_name & "\""
    tell application "Finder" to set name of this_folder to new_name
end update_name

The script needs a shell script to work (since I don’t like working with AppleScript that much). It should be named exacly as the AppleScript but with an .sh extension instead of .scpt and put in the same directory. Remember to make it executable (chmod +x "Set item count as folder name.sh").

#!/usr/bin/env bash
# Set item count as folder name.sh

# Since the folder has a custom icon and therefore a `Icon?` file I
# decrease the item count by 1. Bad solution but works for now.
NUM_ITEMS=`bc <<< "$(ls "$1" | wc -l) - 1"`
if [[ $NUM_ITEMS == 0 ]]; then
    ITEMS="empty"
elif [[ $NUM_ITEMS == 1 ]]; then
    ITEMS="$NUM_ITEMS item"
else
    ITEMS="$NUM_ITEMS items"
fi
BASE=`ruby -e "puts %x(basename \"$1\").match(/(.+) \(/)"[1]`
echo "$BASE ($ITEMS)"

I first renamed the folder from the shell script but then Finder would visually move the folder one step down or left on the desktop for every update. Instead I just let the shell script generatr the new name and pass it back to the AppleScript that will rename the file as I want.


Easy FeedBurner redirect

This is a trick I’m using at this site that I picked up somewhere on the FeedBurner Forums. I wanted to have my RSS-feed from this site to go via FeedBurner to get stats etc, but I don’t want to communicate the http://feeds.feedburner.com/xxxx URL public since it might change in the future. So instead, in my .htaccess, I have these lines that will redirect all visitors except FeedBurner itself (otherwise it wouldn’t have any chance to read and parse my feed) to my FeedBurner URL.

RewriteEngine On
RewriteBase /martin/

# FeedBurner
RewriteCond %{HTTP_USER_AGENT} !FeedBurner
RewriteRule ^feed/?([_0-9a-z-]+)?/?$ http://feeds.feedburner.com/haraldmartin [R,L]

Colhour WordPress plugin

Colhour Plugin This is a plugin for WordPress. The Plugin makes it easy to have elements on your site in colors generated by the Colhour system. Basically it will let you input CSS rules from a option page in the WordPress Admin, and when the site is viewed later it will have the colors replaced by an ever updating Colhour-color.

There are a couple of input fields on the options page; one for each “length” of the spectrum (for it to start over again). I.e., if you want a div element with the id “header” to get its background colorized from Colhour and its Colhour cycle starting over every day (after 24 hours), you just enter the CSS rules in the “day” input field. The actual color-value should be replaced with `%colhour%´ so the plugin can insert the current color in its place. 

colhour-plugin2.png

I suggest not having any other CSS rules in the Colhour admin than the ones dealing with the colors you want replaced. I.e., strip out the fonts, border sizes etc and keep all that in your .css file where they belong (and can be cached).

Bad:

#myDiv {
    font: 1.1em Courier; 
    padding: 2em;
    background: #DDD url(my-background.png) no-repeat top left;
    border: 2px dotted %colhour%;
}

Good: 

#myDiv {border-color: %colhour%;}

Download here, put it in your wp-themes/plugins/colhour.php (note the .php extension) folder and activate it as usual in WordPress admin » Plugins. The options can be found under Options » Colhour.

Update May 4, 2006 I’ve updated the plugin with some minor tweaks and UI enhancement. Also, this site is now using the plugin to style the links.

WordPress theme released

This theme behind this site is now available for download. Read more…


« Older EntriesNewer Entries » CSS is in progress