Tag Archives: html5
WinBox.js
Via r/programming today, this is great: WinBox.js.
HTML5 Tips
Today via r/programming: HTML5 Tips. I think my favourite was the meter tag… or maybe the spellcheck attribute… lots of good tips over there.
Native HTML5 Drag and Drop
Found an article on Native HTML5 Drag and Drop…
Set toolbar colour with HTML meta element theme-color
See here for example:
<meta name="theme-color" content="#123456">
HTML5 element list
There’s a good article about supported HTML5 elements here: HTML5 element list.
ISO Language Codes and ISO Country Codes for HTML5 lang attribute
The HTML5 lang attribute can be a composite of Language Code and Country Code.
See Table of Language Culture Names, Codes, and ISO Values for combinations.
The following table contains values for Language Culture Names, Display Names, Culture Codes, and ISO 639x Values that are used by Commerce Server.
Language Culture Name | Display Name | Culture Code | ISO 639x Value |
---|---|---|---|
af-ZA | Afrikaans – South Africa | 0x0436 | AFK |
sq-AL | Albanian – Albania | 0x041C | SQI |
ar-DZ | Arabic – Algeria | 0x1401 | ARG |
ar-BH | Arabic – Bahrain | 0x3C01 | ARH |
ar-EG | Arabic – Egypt | 0x0C01 | ARE |
ar-IQ | Arabic – Iraq | 0x0801 | ARI |
ar-JO | Arabic – Jordan | 0x2C01 | ARJ |
ar-KW | Arabic – Kuwait | 0x3401 | ARK |
ar-LB | Arabic – Lebanon | 0x3001 | ARB |
ar-LY | Arabic – Libya | 0x1001 | ARL |
ar-MA | Arabic – Morocco | 0x1801 | ARM |
ar-OM | Arabic – Oman | 0x2001 | ARO |
ar-QA | Arabic – Qatar | 0x4001 | ARQ |
ar-SA | Arabic – Saudi Arabia | 0x0401 | ARA |
ar-SY | Arabic – Syria | 0x2801 | ARS |
ar-TN | Arabic – Tunisia | 0x1C01 | ART |
ar-AE | Arabic – United Arab Emirates | 0x3801 | ARU |
ar-YE | Arabic – Yemen | 0x2401 | ARY |
hy-AM | Armenian – Armenia | 0x042B | |
Cy-az-AZ | Azeri (Cyrillic) – Azerbaijan | 0x082C | |
Lt-az-AZ | Azeri (Latin) – Azerbaijan | 0x042C | |
eu-ES | Basque – Basque | 0x042D | EUQ |
be-BY | Belarusian – Belarus | 0x0423 | BEL |
bg-BG | Bulgarian – Bulgaria | 0x0402 | BGR |
ca-ES | Catalan – Catalan | 0x0403 | CAT |
zh-CN | Chinese – China | 0x0804 | CHS |
zh-HK | Chinese – Hong Kong SAR | 0x0C04 | ZHH |
zh-MO | Chinese – Macau SAR | 0x1404 | |
zh-SG | Chinese – Singapore | 0x1004 | ZHI |
zh-TW | Chinese – Taiwan | 0x0404 | CHT |
zh-CHS | Chinese (Simplified) | 0x0004 | |
zh-CHT | Chinese (Traditional) | 0x7C04 | |
hr-HR | Croatian – Croatia | 0x041A | HRV |
cs-CZ | Czech – Czech Republic | 0x0405 | CSY |
da-DK | Danish – Denmark | 0x0406 | DAN |
div-MV | Dhivehi – Maldives | 0x0465 | |
nl-BE | Dutch – Belgium | 0x0813 | NLB |
nl-NL | Dutch – The Netherlands | 0x0413 | |
en-AU | English – Australia | 0x0C09 | ENA |
en-BZ | English – Belize | 0x2809 | ENL |
en-CA | English – Canada | 0x1009 | ENC |
en-CB | English – Caribbean | 0x2409 | |
en-IE | English – Ireland | 0x1809 | ENI |
en-JM | English – Jamaica | 0x2009 | ENJ |
en-NZ | English – New Zealand | 0x1409 | ENZ |
en-PH | English – Philippines | 0x3409 | |
en-ZA | English – South Africa | 0x1C09 | ENS |
en-TT | English – Trinidad and Tobago | 0x2C09 | ENT |
en-GB | English – United Kingdom | 0x0809 | ENG |
en-US | English – United States | 0x0409 | ENU |
en-ZW | English – Zimbabwe | 0x3009 | |
et-EE | Estonian – Estonia | 0x0425 | ETI |
fo-FO | Faroese – Faroe Islands | 0x0438 | FOS |
fa-IR | Farsi – Iran | 0x0429 | FAR |
fi-FI | Finnish – Finland | 0x040B | FIN |
fr-BE | French – Belgium | 0x080C | FRB |
fr-CA | French – Canada | 0x0C0C | FRC |
fr-FR | French – France | 0x040C | |
fr-LU | French – Luxembourg | 0x140C | FRL |
fr-MC | French – Monaco | 0x180C | |
fr-CH | French – Switzerland | 0x100C | FRS |
gl-ES | Galician – Galician | 0x0456 | |
ka-GE | Georgian – Georgia | 0x0437 | |
de-AT | German – Austria | 0x0C07 | DEA |
de-DE | German – Germany | 0x0407 | |
de-LI | German – Liechtenstein | 0x1407 | DEC |
de-LU | German – Luxembourg | 0x1007 | DEL |
de-CH | German – Switzerland | 0x0807 | DES |
el-GR | Greek – Greece | 0x0408 | ELL |
gu-IN | Gujarati – India | 0x0447 | |
he-IL | Hebrew – Israel | 0x040D | HEB |
hi-IN | Hindi – India | 0x0439 | HIN |
hu-HU | Hungarian – Hungary | 0x040E | HUN |
is-IS | Icelandic – Iceland | 0x040F | ISL |
id-ID | Indonesian – Indonesia | 0x0421 | |
it-IT | Italian – Italy | 0x0410 | |
it-CH | Italian – Switzerland | 0x0810 | ITS |
ja-JP | Japanese – Japan | 0x0411 | JPN |
kn-IN | Kannada – India | 0x044B | |
kk-KZ | Kazakh – Kazakhstan | 0x043F | |
kok-IN | Konkani – India | 0x0457 | |
ko-KR | Korean – Korea | 0x0412 | KOR |
ky-KZ | Kyrgyz – Kazakhstan | 0x0440 | |
lv-LV | Latvian – Latvia | 0x0426 | LVI |
lt-LT | Lithuanian – Lithuania | 0x0427 | LTH |
mk-MK | Macedonian (FYROM) | 0x042F | MKD |
ms-BN | Malay – Brunei | 0x083E | |
ms-MY | Malay – Malaysia | 0x043E | |
mr-IN | Marathi – India | 0x044E | |
mn-MN | Mongolian – Mongolia | 0x0450 | |
nb-NO | Norwegian (BokmÃ¥l) – Norway | 0x0414 | |
nn-NO | Norwegian (Nynorsk) – Norway | 0x0814 | |
pl-PL | Polish – Poland | 0x0415 | PLK |
pt-BR | Portuguese – Brazil | 0x0416 | PTB |
pt-PT | Portuguese – Portugal | 0x0816 | |
pa-IN | Punjabi – India | 0x0446 | |
ro-RO | Romanian – Romania | 0x0418 | ROM |
ru-RU | Russian – Russia | 0x0419 | RUS |
sa-IN | Sanskrit – India | 0x044F | |
Cy-sr-SP | Serbian (Cyrillic) – Serbia | 0x0C1A | |
Lt-sr-SP | Serbian (Latin) – Serbia | 0x081A | |
sk-SK | Slovak – Slovakia | 0x041B | SKY |
sl-SI | Slovenian – Slovenia | 0x0424 | SLV |
es-AR | Spanish – Argentina | 0x2C0A | ESS |
es-BO | Spanish – Bolivia | 0x400A | ESB |
es-CL | Spanish – Chile | 0x340A | ESL |
es-CO | Spanish – Colombia | 0x240A | ESO |
es-CR | Spanish – Costa Rica | 0x140A | ESC |
es-DO | Spanish – Dominican Republic | 0x1C0A | ESD |
es-EC | Spanish – Ecuador | 0x300A | ESF |
es-SV | Spanish – El Salvador | 0x440A | ESE |
es-GT | Spanish – Guatemala | 0x100A | ESG |
es-HN | Spanish – Honduras | 0x480A | ESH |
es-MX | Spanish – Mexico | 0x080A | ESM |
es-NI | Spanish – Nicaragua | 0x4C0A | ESI |
es-PA | Spanish – Panama | 0x180A | ESA |
es-PY | Spanish – Paraguay | 0x3C0A | ESZ |
es-PE | Spanish – Peru | 0x280A | ESR |
es-PR | Spanish – Puerto Rico | 0x500A | ES |
es-ES | Spanish – Spain | 0x0C0A | |
es-UY | Spanish – Uruguay | 0x380A | ESY |
es-VE | Spanish – Venezuela | 0x200A | ESV |
sw-KE | Swahili – Kenya | 0x0441 | |
sv-FI | Swedish – Finland | 0x081D | SVF |
sv-SE | Swedish – Sweden | 0x041D | |
syr-SY | Syriac – Syria | 0x045A | |
ta-IN | Tamil – India | 0x0449 | |
tt-RU | Tatar – Russia | 0x0444 | |
te-IN | Telugu – India | 0x044A | |
th-TH | Thai – Thailand | 0x041E | THA |
tr-TR | Turkish – Turkey | 0x041F | TRK |
uk-UA | Ukrainian – Ukraine | 0x0422 | UKR |
ur-PK | Urdu – Pakistan | 0x0420 | URD |
Cy-uz-UZ | Uzbek (Cyrillic) – Uzbekistan | 0x0843 | |
Lt-uz-UZ | Uzbek (Latin) – Uzbekistan | 0x0443 | |
vi-VN | Vietnamese – Vietnam | 0x042A | VIT |
HTML5 Elements and Attributes
Read all about HTML Elements and Attributes!
Embedded AngularJS partials, or: HTML5 !== XHTML
I just bumped heads with a really gnarly problem. In fact it’s a miracle that I stumbled upon the solution, it could have gone unseen for a long time!
The root of the problem was that I used XHTML syntax in a HTML5 document, and I didn’t get what I expected. I’m still getting used to HTML5 and my understanding was that HTML5 was a superset of HTML4 and XHTML with some extensions. As such I expected XHTML syntax to be supported by HTML5 — but, not so!
I was trying to refactor my AngularJS app to use partial views that were embedded in <script> tags with the type ‘text/ng-template’ and an associated ID.
On my way I found this article on StackOverflow which said:
make sure that the inline script tags are children of the element that has the ng-app=”myApp” attribute.
That was actually a problem I had to solve, I think, because I’d put the ng-app directive on the <html> element not the <body> element. But things still weren’t working and my code looked like this:
... <body ng-app="fflurry_app" ng-controller="MainCtrl"> <ul class="menu"> <li><a href="#/home">Home</a></li> </ul> <div ng-view /> <!-- partials: --> <script type="text/ng-template" id="home.html"> <h1>Welcome!</h1> </script> <script type="application/javascript"> 'use strict'; var fflurry_app = angular.module( 'fflurry_app', [] ). config( [ '$routeProvider', function( $routeProvider ) { $routeProvider.when( '/home', { templateUrl: 'home.html', controller: 'MainCtrl' } ); // ... }]); // ... </script> ... </body></html>
So… have you spotted the problem? It’s a tricky one… the problem is with the ‘<div ng-view />’ element. This is being parsed as an open <div> with no closing </div> in HTML5. In XHTML this would be an opened and closed element. In HTML5 it’s ignoring the ‘/>’ and just opening a <div>! Hah! So the <script> partials are children on this <div> and not of the ng-app container, so they’re not being found by Angular!
The solution is now trivial. Just make sure we open and close our ng-view <div> like this: <div ng-view></div>
.
HTML5 Boilerplate
I learned about the HTML5 Boilerplate library today. It’s a template for creating a HTML5 website.