Tangere.Net Version 0.2

by Admin 30. January 2012 01:05

3 months since the last release - so development had been slower than planned as we've added two additional backend components:  


v0.2 provides now also a tile layout similar to Windows Phone as well as new RSS reader sample.



Tile layout

by Admin 29. January 2012 23:46

The new optional tile layout allows to create pages similar to Windows Phone or to the iOS Springboard/Home Screen:


The tile layout adjusts the size of the tiles to fit to the screen size. If required the tile layout manager automatically assigns tiles to multiple pages. Swiping right/left allows to switch through all tile pages (similar to iOS Home Screens).


by Admin 29. January 2012 03:36

The Translation component of the Internationalization (i18n) feature allows to translate all text constants of an App. 

Translations are stored as .po files in the gettext format on the server.

Text constants in .html templates are translated by applying the class i18n to a block e.g.



Anytime a template is loaded all blocks with the i18n class applied will automatically be translated. 


In the ViewModel text can be translated with the global T() function e.g.


alert(T("Hello {0}", $App.userProfile.username));


by Admin 29. January 2012 03:36

Globalization is part of the Tangere.Net Internationalization (i18n) module and based on JQuery Globalize.

Number Formatting

When formatting a number with format(), the main purpose is to convert the number into a human readable string using the culture's standard grouping and decimal rules. The rules between cultures can vary a lot. For example, in some cultures, the grouping of numbers is done unevenly. In the "te-IN" culture (Telugu in India), groups have 3 digits and then 2 digits. The number 1000000 (one million) is written as "10,00,000". Some cultures do not group numbers at all.

There are four main types of number formatting:

  • for number
  • for decimal digits
  • for percentage
  • for currency

Even within the same culture, the formatting rules can vary between these four types of numbers. For example, the expected number of decimal places may differ from the number format to the currency format. Each format token may also be followed by a number. The number determines how many decimal places to display for all the format types except decimal, for which it means the minimum number of digits to display, zero padding it if necessary. Also note that the way negative numbers are represented in each culture can vary, such as what the negative sign is, and whether the negative sign appears before or after the number. This is especially apparent with currency formatting, where many cultures use parentheses instead of a negative sign.

// just for example - will vary by culture
Globalize.format( 123.45, "n" ); // 123.45
Globalize.format( 123.45, "n0" ); // 123
Globalize.format( 123.45, "n1" ); // 123.5

Globalize.format( 123.45, "d" ); // 123
Globalize.format( 12, "d3" ); // 012

Globalize.format( 123.45, "c" ); // $123.45
Globalize.format( 123.45, "c0" ); // $123
Globalize.format( 123.45, "c1" ); // $123.5
Globalize.format( -123.45, "c" ); // ($123.45)

Globalize.format( 0.12345, "p" ); // 12.35 %
Globalize.format( 0.12345, "p0" ); // 12 %
Globalize.format( 0.12345, "p4" ); // 12.3450 %

Parsing with parseInt and parseFloat also accepts any of these formats.

Date Formatting

Date formatting varies wildly by culture, not just in the spelling of month and day names, and the date separator, but by the expected order of the various date components, whether to use a 12 or 24 hour clock, and how months and days are abbreviated. Many cultures even include "genitive" month names, which are different from the typical names and are used only in certain cases.

Also, each culture has a set of "standard" or "typical" formats. For example, in "en-US", when displaying a date in its fullest form, it looks like "Saturday, November 05, 1955". Note the non-abbreviated day and month name, the zero padded date, and four digit year. So, Globalize expects a certain set of "standard" formatting strings for dates in the "patterns" property of the "standard" calendar of each culture, that describe specific formats for the culture. The third column shows example values in the neutral English culture "en-US"; see the second table for the meaning tokens used in date formats.


f Long Date, Short Time dddd, MMMM dd, yyyy h:mm tt
F Long Date, Long Time dddd, MMMM dd, yyyy h:mm:ss tt
t Short Time h:mm tt
T Long Time h:mm:ss tt
d Short Date M/d/yyyy
D Long Date dddd, MMMM dd, yyyy
Y Month/Year MMMM, yyyy
M Month/Day yyyy MMMM

In addition to these standard formats, there is the "S" format. This is a sortable format that is identical in every culture: "yyyy'-'MM'-'dd'T'HH':'mm':'ss".

When more specific control is needed over the formatting, you may use any format you wish by specifying the following custom tokens:


d Day of month (no leading zero) 5
dd Day of month (leading zero) 05
ddd Day name (abbreviated) Sat
dddd Day name (full) Saturday
M Month of year (no leading zero) 9
MM Month of year (leading zero) 09
MMM Month name (abbreviated) Sept
MMMM Month name (full) September
yy Year (two digits) 55
yyyy Year (four digits) 1955
'literal' Literal Text 'of the clock'
\' Single Quote 'o'\''clock'
m Minutes (no leading zero) 9
mm Minutes (leading zero) 09
h Hours (12 hour time, no leading zero) 6
hh Hours (12 hour time, leading zero) 06
H Hours (24 hour time, no leading zero) 5 (5am) 15 (3pm)
HH Hours (24 hour time, leading zero) 05 (5am) 15 (3pm)
s Seconds (no leading zero) 9
ss Seconds (leading zero) 09
f Deciseconds 1
ff Centiseconds 11
fff Milliseconds 111
t AM/PM indicator (first letter) A or P
tt AM/PM indicator (full) AM or PM
z Timezone offset (hours only, no leading zero) -8
zz Timezone offset (hours only, leading zero) -08
zzz Timezone offset (full hours/minutes) -08:00
g or gg Era name A.D.

Internationalization (i18n)

by Admin 28. January 2012 15:44

All Tangere.Net Apps are now (v0.2+) prepared for international markets.

The Internationalization feature searches the preferred language/culture for the App in the following order:

  1. Preferred user language from the user profile
  2. An optional culture parameter (e.g. …&culture=de-DE) in the App Url
  3. Get the selected device language (from the HTTP_ACCEPT_LANGUAGE http header)


The language/culture information is used by two components: