Localizing Nvu logo

Author: Sébastien Desvignes (bob@ophiuchus.org)

Date: 05 february 2005


Table of contents

Introduction

As you may already know, Nvu is based on the Mozilla Composer. This has two big advantages, first the localization process is more or less the same as Mozilla, second if Mozilla has been translated into your language, you can reuse a lot of strings and files from Mozilla and Firefox.

There are already many documents about the localization of Mozilla, you don't need to read all of them, but some of your questions may find an answer in them. Don't forget to check if there is an active community translating Mozilla into your language, they could help you.

What needs to be localized

The localizable resources in Mozilla based products are supposed to be all externalized into editable files, which can be categorized into three groups:

The main work

Some people involved in Mozilla products localization use a tool named Mozilla Translator. I don't use it myself, but you may find it good for this task. There is a good document that explain how to use the Mozilla Translator to localize Firefox. Most of this document should apply to Nvu, but it may be a little outdated.

Now, I will explain the manual way for working on the translation.

Initializing your locale

  1. Download an English version of Nvu
  2. In the chrome folder, get the en-US.jar and cascades.jar files. Extract both of them into an empty directory. Despite their extension, they are regular zip file and any zip archiver utility should be able to handle them. However you might need to change their extension to .zip before that.
  3. Remove the content/ folder, it is the non-localizable folder of the CSS editor.
  4. Rename the en-US/ folder to your locale code.
  5. Replace inside all the contents.rdf files "en-US" with your locale code.

You are now ready to start translating the resource files.

The different types of files

DTD files (*.dtd)
Text files UTF-8 encoded without BOM (some text editors call this UTF-8N).

A DTD file contains a list of entities which need to be localized. The entities defined here are then used inside the user interface XUL files. An entity declaration looks like this:

<!ENTITY openCmd.label "Open Web Location...">

Above, to the entity with name/key "openCmd.label", has been assigned the value "Open Web Location...". The entity value is what needs to be localized. Usually the entity name (e.g. "openCmd.label") is self-explanatory: this one is the label of the Open menu command. If this is not enough, the author of the file adds a comment for the localizer. Comments referring to a particular entity are placed right above the entity declaration as:

<!-- LOCALIZATION NOTE (entity_name): comments -->

For example,

8 <!-- LOCALIZATION NOTE  throbber.url: DONT_TRANSLATE -->
9 <!ENTITY throbber.url "http://www.mozilla.org">

Note that these documents are UTF-8 encoded. Hence, you'll either need a text editor able to save the file in UTF-8 once modified, or you will be required to convert it back to UTF-8 after. If you skip this passage, you won't be able to correctly show characters different from the conventional ASCII ones ( a-z, A-Z, 0-9, !"#$%&'()*+,-./ :;<=>?@ _` {|}~ ), like diacritics or eastern scripts.

Also remember you can't directly use the & < " % characters in your strings. Instead, substitute one of their predefined entities inside the string.

Property files (*.properties)
Text files escaped Unicode encoded.

As the name says, in these files a number of JavaScript properties (think about them as variables) are assigned with a string value. String resources in property files appear in the form:

property_name = Text Text Text

The string at the right side of the equal symbol is what needs to be localized. Again, localization notes and comments are often useful to explain what's the strings usage in the UI or a particular behavior the localizer should follow working on them:

25 #-----------------------------------------------------------
26 # LOCALIZATION NOTE InstallFile:...
27 #-----------------------------------------------------------
28 InstallFile=Installing: %s
29 ReplaceFile=Replacing: %s

As for the DTD files above, the same considerations apply to the files encoding. Nvu will expect these files escaped Unicode encoded.

Remember to avoid the direct usage of backslash, single or double quotes in your strings. Use one of their substitutes instead. Don't break these strings on multiple lines.

Many strings contain strange symbols like %s or $1%s. They will be substituted at runtime by relevant words. Place them in your strings as it makes sense in the whole sentence, typing them exactly as found originally.

RDF data source files, (*.rdf)
Text files UTF-8 encoded without BOM (some text editors call this UTF-8N), if not otherwise specified.

Updating your localization

When a new version of Nvu is released, you don't need to restart the work from nothing. With common tools, you can easily track the differences between two versions.

I you use Mozilla Translator, it should take care of most of this work for you. If you don't (like me), read the following guidelines.

  1. You need to have two folders, each one containing the en-US locale of a specific Nvu version. For example, I have a folder named nvu-0.70-us and another one named nvu-0.80-us. (See Initializing your locale, for instructions on how to extract locale informations in a folder).
  2. Run a diff program to find all the differences between the two versions. I use the GNU diff, it is a command line program available for many platform. For example, I used this command to find the differences between the versions 0.7 and 0.8:
    diff -r -U 8 -P nvu-0.70-us nvu-0.80-us
  3. Browse the output of your diff. Removed lines are marked with '-', and new lines are marked with '+'. If the -P option is used, lines in all-new files will be reported as well, which is useful!

Packaging your localization

Filling the jar

Put the localized locale folder into a zip file with no compression, and rename that file to [country-code].jar. Keep the same directory structure that was used in the en-US.jar (with one exception, you should have the cascades folder inside your jar file), it's very important! You can use any zip tool you want.

Langpack (*.xpi)

Now that the extension manager works (since the 0.7 version), you can package your localization as a langpack. It works the same way as extensions, and even if it is not the simplest solution for your users, it is easy to do, and it can be useful for some Linux distributor.

A xpi file is a zip file, like jar files. You need to follow this directory structure:

your-locale.xpi:
install.rdf
chrome/[country-code].jar
defaults/preferences/*.js (optional, see bellow)

The install.rdf file follow the same rules used for extensions. The Nvu application ID is {136c295a-4a5a-41cf-bf24-5cee526720d5}.

Here is an example of this file extracted from the French langpack:

<?xml version="1.0"?>

<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:em="http://www.mozilla.org/2004/em-rdf#">

<Description about="urn:mozilla:install-manifest">
<em:id>{5bf73a30-8317-404b-bb12-bb1d7aacb90d}</em:id>
<em:version>0.7</em:version>

<!-- Target Application this extension can install into,
with minimum and maximum supported versions. -->
<em:targetApplication>
<Description>
<em:id>{136c295a-4a5a-41cf-bf24-5cee526720d5}</em:id>
<em:minVersion>0.70</em:minVersion>
<em:maxVersion>1.0</em:maxVersion>
</Description>
</em:targetApplication>

<!-- Front End MetaData -->
<em:name>FrenchLocale</em:name>
<em:description>Traduction française de Nvu</em:description>
<em:creator>L'équipe Frenchmozilla</em:creator>
<em:contributor>Sébastien Desvignes</em:contributor>
<em:homepageURL>http://frenchmozilla.org/nvu/</em:homepageURL>

<!-- Packages, Skins and Locales that this extension registers -->
<em:file>
<Description about="urn:mozilla:extension:file:fr-FR.jar">
<em:locale>locale/fr-FR/cascades/</em:locale>
<em:locale>locale/communicator/</em:locale>
<em:locale>locale/communicator-platform/</em:locale>
<em:locale>locale/communicator-region/</em:locale>
<em:locale>locale/cookie/</em:locale>
<em:locale>locale/editor/</em:locale>
<em:locale>locale/editor-region/</em:locale>
<em:locale>locale/global/</em:locale>
<em:locale>locale/global-platform/</em:locale>
<em:locale>locale/global-region/</em:locale>
<em:locale>locale/help/</em:locale>
<em:locale>locale/mozapps/</em:locale>
<em:locale>locale/fr-FR/navigator/</em:locale>
<em:locale>locale/fr-FR/navigator-platform/</em:locale>
<em:locale>locale/fr-FR/navigator-region/</em:locale>
<em:locale>locale/necko/</em:locale>
<em:locale>locale/passwordmgr/</em:locale>
<em:locale>locale/pinger/</em:locale>
<em:locale>locale/pipnss/</em:locale>
<em:locale>locale/pippki/</em:locale>
<em:locale>locale/tipoftheday/</em:locale>
<em:locale>locale/wallet/</em:locale>
</Description>
</em:file>

</Description>
</RDF>

Don't forget to change the extension ID, or you may conflict with the French langpack. You can use this web application to generate a unique ID.

Important : keep em:maxVersion to 1.0! Do not change this to current version number, it is a bug of Nvu.

Nvu can change the locale of the interface (if more than one is provided) by changing the general.useragent.locale preference. To change this pref by installing the langpack, add a default setting JavaScript file to your package. You can use any file name, you just have to store it in defaults/preferences/. To set preferences, use the pref() function instead of user_pref().

Localized builds

Hopefully, you don't need to compile the code for each platform yourself. You can start from the English binary packages from Nvu.com, tweak some files, and repackage everything. The only difficulty may be the mac package, which use the disk image format. This format is not easily supported on each platform. The best way is to find a kind Mac User that can do that for you.

  1. Download and extract the build for the platform you want to localize.
  2. In the chrome folder, remove the en-US.jar, chromelist.txt, chrome.rdf files.
  3. Copy your [country-code].jar file to the chrome folder.
  4. Edit the installed-chrome.txt file. For each line with en-US.jar, replace all en-US with your locale code. Also replace the line locale,install,url,jar:resource:/chrome/cascades.jar!/locale/en-US/cascades/ with locale,install,url,jar:resource:/chrome/[country-code].jar!/locale/[country-code]/cascades/.
  5. Make an archive with the resulting files.

Windows installer

The Windows installer of the French localization is done with Inno Setup. It is a free of charge installer, and it is used by other Nvu localizers.

The easiest way to use it, is to start from a setup script file from another localization, and adapt it to your need. I'll give you my script, and I'll explain some option after that.

The first thing to do is preparing the files for the installation. Follow the same steps that you'll used for a zip package (see above), except that you don't need to compress the folder. In the following example, I use D:\bureau\Nvu.

Next, copy the following lines into a file named nvuSetup.iss for example. You can then open and edit it right into Inno Setup

; Script generated by the Inno Setup Script Wizard.
; SEE THE DOCUMENTATION FOR DETAILS ON CREATING INNO SETUP SCRIPT FILES!

[Setup]
AppName=Nvu
AppVerName=Nvu 0.80
OutputBaseFilename=nvu-0.80-win32-installer-fr
AppPublisherURL=http://www.nvu.com/
AppSupportURL=http://www.nvu.com/
AppUpdatesURL=http://www.nvu.com/
DefaultDirName={pf}\Nvu
DefaultGroupName=Nvu
AllowNoIcons=yes
LicenseFile=D:\bureau\Nvu\MPL-1.1.txt
Compression=lzma/ultra
SolidCompression=yes
SetupIconFile=D:\bureau\mozilla.ico
WizardImageFile=D:\bureau\mask.bmp
WizardImageStretch=no
WizardImageBackColor=clWhite
WizardSmallImageFile=D:\bureau\NVUlogo.bmp

[Languages]
Name: "fr"; MessagesFile: "compiler:Languages\French.isl"

[Tasks]
Name: "desktopicon"; Description: "{cm:CreateDesktopIcon}"; GroupDescription: "{cm:AdditionalIcons}"; Flags: unchecked
Name: "quicklaunchicon"; Description: "{cm:CreateQuickLaunchIcon}"; GroupDescription: "{cm:AdditionalIcons}"; Flags: unchecked

[Files]
Source: "D:\bureau\Nvu\Nvu.exe"; DestDir: "{app}"; Flags: ignoreversion
Source: "D:\bureau\Nvu\*"; DestDir: "{app}"; Flags: ignoreversion recursesubdirs
; NOTE: Don't use "Flags: ignoreversion" on any shared system files

[Icons]
Name: "{group}\Nvu"; Filename: "{app}\Nvu.exe";
Name: "{group}\{cm:UninstallProgram,Nvu}"; Filename: "{uninstallexe}"
Name: "{userdesktop}\Nvu"; Filename: "{app}\Nvu.exe"; Parameters: "c"; Tasks: desktopicon
Name: "{userappdata}\Microsoft\Internet Explorer\Quick Launch\Nvu"; Filename: "{app}\Nvu.exe"; Tasks: quicklaunchicon

[Run]
Filename: "{app}\Nvu.exe"; Description: "{cm:LaunchProgram,Nvu}"; Flags: nowait postinstall skipifsilent
AppVerName=Nvu 0.80
Change the version number according to the version you are currently distributing.
OutputBaseFilename=nvu-0.80-win32-installer-fr
The name of the installer file. Use the name you want, but it is a good idea to specify the version, the target platform, the locale, and the fact it is an installer.
LicenseFile=D:\bureau\Nvu\MPL-1.1.txt
Don't forget to replace D:\bureau\Nvu with the path to your Nvu folder.
SetupIconFile=D:\bureau\mozilla.ico
WizardImageFile=D:\bureau\mask.bmp
WizardImageStretch=no
WizardImageBackColor=clWhite
WizardSmallImageFile=D:\bureau\NVUlogo.bmp
Use this to provide Nvu's logos for the installer.
Name: "fr"; MessagesFile: "compiler:Languages\French.isl"
Use this to specify the language used during the installation process. compiler: refers to the Inno Setup Installation directory, and other languages are available with Inno Setup.
Source: "D:\bureau\Nvu\Nvu.exe"; DestDir: "{app}"; Flags: ignoreversion
Source: "D:\bureau\Nvu\*"; DestDir: "{app}"; Flags: ignoreversion recursesubdirs
    Don't forget to replace D:\bureau\Nvu with the path to your Nvu folder.