fíam

(rhymes with liam)

  • Adding a simple WYSIWYM Markdown editor to your models

    March 9, 2009 at 10:01:54 CET

    I'm a Markdown fan. Period. Since I first discovered it some years ago, I've been using it for storing all my "output-to-HTML" texts.

    Blango, the blog engine I wrote for this site, uses Markdown for post contents. As I've said, I really like Markdown, but typing (and sometimes escaping) all those *[]() gets boring from time to time. I've been looking for something like a WYSIWYG editor for some time, but none of the available choices seemed good enough for me. However, I recently stumbled upon WMD.

    So, what's WMD and why should I care?

    In the author's own words:

    So WMD is something new: a Wysiwym Markdown editor.

    Wysiwym stands for What You See Is What You Mean. WMD produces clean semantic HTML, leaving presentation details like fonts and colors up to style sheets. But you're not left in the dark about cosmetics; as you type, WMD's live preview shows you exactly what your text will look like after the current styles have been applied.

    Markdown is a simple markup language that's as easy to read and write as plain-text email. WMD uses Markdown as an input format, converting it into HTML behind the scenes. You can also mix raw HTML with Markdown, so the full expressiveness of HTML is always there if you need it.

    Plus, WMD is comprised of Javascript and image files, doesn't need server support, doesn't depend on any Javascript Framework and it's just a small rectangle over the textarea. Id est, it doesn't get in my way.

    Downloading the required files

    WMD was a hosted service until recently and is currently provided as a set of Javascript obfuscated files. The author is working on a new release, but this is all we got for now. Anyway, good enough.

    You can get the last version (1.0.1 as the time of this writing) from project's downloads page. Just open the zipfile and copy the wmd directory to your MEDIA_ROOT.

    If you're storing your posts as Markdown and doing the conversion to HTML (as you should be doing), you need to take one extra step. Open wmd/wmd.js and change line 4 to read:

    Attacklab.wmd_defaults={version:1,output:"Markdown",lineLength:40,delayLoad:false};
    

    WMD will preprocess the Markdown and send HTML to the server otherwise.

    Adding WMD support to your models

    By default, WMD will attach an editor to every textarea. So, all we need to do is tell the admin interface to include wmd/wmd.js when adding or editing our models. This can be done by using the inner class Media in your ModelAdmin subclass. For example:

    class EntryAdmin(admin.ModelAdmin):
        class Media:
            js = ( 'js/wmd/wmd.js', )
    

    And you're ready to go. Now your models will have a small rectangle featuring the WMD over every textarea. WMD

  • Keeping your Localizable.strings in UTF-8

    March 9, 2009 at 09:25:30 CET

    Since the iPhone SDK 2.2, Localizable.strings files are required to be in UTF-16 encoding or they will be ignored while running in the device otherwise. This seemed very inconvenient for us, for multiple reasons:

    • git and svn don't play well with UTF-16. The files were treated as binaries and we couldn't do merges on them
    • Our SCM and bug tracking tools didn't play well with UTF-16. Everytime we referenced a patch against UTF-16 files, it showed up as garbage while reviewing the changes on the web front end
    • Our translations teams prefer UTF-8

    We could have properly configured git and svn for every developer, bugged our external SCM and bug tracking solution vendor to add support for UTF-16 and told our translation teams to STFU. However, this seemed like a lot of work for just a bunch of text files. Instead, I chose keeping them in UTF-8 and translating them to UTF-16 while building the project.

    Creating the necessary files

    First, you need to rename your Locable.strings to Localizable.strings.in. The easier way of doing this is right-clicking on Localizable.strings from your Xcode project and selecting the Rename option in the popup menu. Then, for every Localizable.strings.in file in your project, touch (as in typing touch filename from the terminal) a new Localizable.strings and add all of them to your project. You don't need to add this new Localizable.string files to your SCM, but you need to add them to your Xcode project, it won't copy them to the final bundle otherwise. Keep in mind that these files don't need to be present for building your project, since we'are going to generate them in the first build phase. After this step, your resources should look like this:

    Localizable.strings

    Adding a build phase

    Now we need to tell Xcode to translate our files from UTF-8 to UTF-16. We're using a "Run Script" build phase and we need to create it before any other ones:

    Build Phases

    Finally, select "Get Info" to get to the phase properties and paste the following as the script contents:

    # Adjust ${PROJECT_DIR}"/Languages to suit your needs
    for LocalizableStringsIn in $(find "${PROJECT_DIR}"/Languages -name "Localizable.strings.in" -print)
    do
        LocalizableStrings="${LocalizableStringsIn/Localizable.strings.in/Localizable.strings}"
        iconv -f UTF-8 -t UTF-16BE < "${LocalizableStringsIn}" > "${LocalizableStrings}"
    done
    

    A final note

    We extract our translations and merge them a custom script, but if you're using genstrings, you should keep in mind that it generates UTF-16 files, so you'll need to pipe its output trough iconv to do the opposite conversion when generating your Localizable.strings.in files.