README.textile in world-flags-0.1.2 vs README.textile in world-flags-0.1.3
- old
+ new
@@ -8,12 +8,29 @@
*/
*= require_self
*= require_tree .
*= require flags/flags32
+ *= require flags/flags32_semi
*/
+There is also support for semi-transparent flags. This can be used to fade certain flags while having the selected flag (or hovered over flag) in full brightness.
+
+Simply add or remove the "semi" class for the flag to adjust the brightness level (fx for selection/mouse over).
+
+$("li.flag['data-cc'=dk).addClass('semi');
+
+$("li.flag['data-cc'=dk).removeClass('semi');
+
+*/
+ *= require_self
+ *= require_tree .
+ *= require flags/flags32
+ *= require flags/flags32
+*/
+
+
h2. Alternative config
Note that the ruby examples uses HAML syntax
In the head of your view or layout file:
@@ -32,42 +49,72 @@
Flags will be rendered in HTML as:
<pre>
<ul class="f32">
- <li class="flag ar">Argentina</li>
- <li class="flag au">Australia</li>
- <li class="flag at">Austria</li>
+ <li class="flag ar" data-cc="ar" data-country="Argentina">Argentina</li>
+ <li class="flag gb" data-cc="gb" data-country="England">England</li>
...
</ul>
</pre>
The countries corresponding to the codes can be found at "http://en.wikipedia.org/wiki/ISO_3166-1_alpha-2":http://en.wikipedia.org/wiki/ISO_3166-1_alpha-2
h2. Use
+WorldFlags supports flag sizes in 16, 32 and 64 pixels (size).
+
You can also use built in helper methods:
= flag_list 16 do
- = flags :ar => 'Argentina', :en => 'England'
+ = flags :ar => 'Argentina', :gb => 'England'
Alternatively
= flags_list 32 do
- = flag(:ar, 'Argentina') + flag(:en, 'England')
+ = flag(:ar, 'Argentina') + flag(:gb, 'England')
For use with tooltips (see example below):
= flags_list 32 do
- = flags_title(:ar => 'Argentina', :br => 'Brazil') + flag_title(:en, 'England')
+ = flags_title(:ar => 'Argentina', :br => 'Brazil') + flag_title(:gb, 'England')
The flag_title will render the following list item:
-<li class="flag ar" title="Argentina"> </li>
+<li class="flag ar" lang="ar" title="Argentina"> </li>
The is needed in order for the background (flag icon) to have something to be displayed against.
+h2. Get client country code (browser and geo)
+
+A small helper module is provided that can be inserted into a Controller or wherever you see fit
+
+* ip_country_code
+* browser_locale
+
+class MainController < ApplicationController
+ def home
+ @json = Property.all.to_gmaps4rails
+ @country_code = WorldFlags::Geo.ip_country_code
+ end
+end
+
+Alternatively you can include the modules directly into the controller:
+
+class MainController < ApplicationController
+ include WorldFlags::Geo
+ include WorldFlags::Browser
+
+ def home
+ @json = Property.all.to_gmaps4rails
+ @country_code = ip_country_code
+ @locale = browser_locale
+ end
+end
+
+For convenience you can also include WorldFlags::All to include all these modules
+
h2. Nice effects
CSS config:
ul.f32 {
@@ -75,13 +122,14 @@
padding: 0;
margin-left: 0;
li.flag {
float:left;
- padding-bottom: 10px;
- padding-right: 32px;
- cursor: pointer;
+ padding-bottom: 6px;
+ padding-right: 26px;
+ margin-right: 8px;
+ background-position: center;
}
}
#languages {
float: right;
@@ -112,17 +160,14 @@
Layout file:
%body
.main
- = link_to "Sign un", new_user_session_path
+ = link_to "Sign in", new_user_session_path
= link_to "Sign up", new_user_registration_path
#languages
- %ul.f32
- %li.flag.ar{:title => 'Argentina'}
-
- %li.flag.en{:title => 'England'}
-
+ = flags_list 64 do
+ = flags_title :ar => 'Argentina', :gb => 'England'
%p.clear
= yield