world-flags 0.2.3 → 0.2.4
Sign up to get free protection for your applications and to get access to all the features.
- data/{README.textile → README.md} +90 -76
- data/VERSION +1 -1
- data/{config → app/config}/country_codes/iso-3166-2.en.json +0 -0
- data/lib/world-flags.rb +11 -2
- data/lib/world_flags/countries.rb +20 -16
- data/lib/world_flags/languages.rb +21 -17
- data/world-flags.gemspec +4 -4
- metadata +5 -5
@@ -1,13 +1,12 @@
|
|
1
|
-
|
1
|
+
# Country or language selection with Flag icons
|
2
2
|
|
3
|
-
|
3
|
+
This gem can be used with Rails 3. It includes css files for size 16 and 32 pixels and have all the worlds' flags. See http://spritegen.website-performance.org/
|
4
4
|
|
5
|
-
|
5
|
+
## Configuration
|
6
6
|
|
7
|
-
|
8
|
-
|
9
|
-
In you asset application.css manifest file:
|
7
|
+
In you asset `application.css` manifest file:
|
10
8
|
|
9
|
+
```css
|
11
10
|
*/
|
12
11
|
*= require_self
|
13
12
|
*= require_tree .
|
@@ -15,6 +14,7 @@ In you asset application.css manifest file:
|
|
15
14
|
*= require flags/flags32
|
16
15
|
*= require flags/flags32_semi
|
17
16
|
*/
|
17
|
+
```
|
18
18
|
|
19
19
|
The `flags/basic` stylesheet sets up a basic css for use with borders around the 32 and 64 pixel flag images (to mark selected language). Use this css as inspiration and customize by overriding styles as needed.
|
20
20
|
|
@@ -22,35 +22,43 @@ There is also support for semi-transparent flags. This can be used to fade certa
|
|
22
22
|
|
23
23
|
Simply add or remove the "semi" class for the flag to adjust the brightness level (fx for selection/mouse over).
|
24
24
|
|
25
|
+
```javascript
|
25
26
|
$("li.flag['data-cc'=dk).addClass('semi');
|
26
|
-
|
27
27
|
$("li.flag['data-cc'=dk).removeClass('semi');
|
28
|
+
```
|
28
29
|
|
30
|
+
```css
|
29
31
|
*/
|
30
32
|
*= require_self
|
31
33
|
*= require_tree .
|
32
34
|
*= require flags/flags32
|
33
35
|
*= require flags/flags62
|
34
36
|
*/
|
37
|
+
```
|
35
38
|
|
36
|
-
|
37
|
-
h2. Alternative config
|
39
|
+
## Alternative config
|
38
40
|
|
39
41
|
Note that the ruby examples uses HAML syntax
|
40
42
|
|
41
43
|
In the head of your view or layout file:
|
42
44
|
|
45
|
+
```haml
|
43
46
|
= stylesheet_link_tag 'flags16'
|
47
|
+
```
|
44
48
|
|
45
49
|
or using a helper
|
46
50
|
|
51
|
+
```haml
|
47
52
|
= use_flags(16)
|
53
|
+
```
|
48
54
|
|
49
55
|
Alternatively for the 32 width flags
|
50
56
|
|
57
|
+
```haml
|
51
58
|
= use_flags 32
|
59
|
+
```
|
52
60
|
|
53
|
-
|
61
|
+
## Configuring localization
|
54
62
|
|
55
63
|
You can setup WorldFlags to use a localization map for the labels of the flag icons
|
56
64
|
|
@@ -60,15 +68,41 @@ WorldFlags.countries = some_country_hash # fx loaded from a yaml file
|
|
60
68
|
Notice that it is a locale code pointing to a map of ISO_3166-1_alpha-2 codes
|
61
69
|
to labels for that locale.
|
62
70
|
|
71
|
+
```ruby
|
63
72
|
{
|
64
73
|
:en => {:gb => 'English', :dk => 'Danish'}
|
65
74
|
:da => {:gb => 'Engelsk', :dk => 'Dansk'}
|
66
75
|
}
|
76
|
+
```
|
77
|
+
|
78
|
+
An english translation file of country codes (in json format) can be found in app/config/country_codes.
|
79
|
+
|
80
|
+
```ruby
|
81
|
+
cc_file_en = File.join(Rails.root, 'app/config/country_codes/iso-3166-2.en.json')
|
82
|
+
country_codes_en = JSON.parse File.read(cc_file_en)
|
83
|
+
WorldFlags.languages = country_codes_en
|
84
|
+
```
|
85
|
+
|
86
|
+
Here an even better, more flexible approach that allows for multiple translations.
|
87
|
+
|
88
|
+
```
|
89
|
+
WorldFlags::Language.en = country_codes_en
|
90
|
+
```
|
67
91
|
|
68
|
-
|
92
|
+
If you use this approach, you must currently add a WorldFlags::Language class method for that locale (fx a method `#da`for danish) or fx use `attr_accessor :da`. For this approach, you must also set the active locales using `#active_locales`.
|
93
|
+
|
94
|
+
```
|
95
|
+
WorldFlags.active_locales = [:en, :da]
|
96
|
+
WorldFlags::Language.da = country_codes_da
|
97
|
+
```
|
98
|
+
|
99
|
+
Please feel free to suggest or improve this locale/translation infrastructure!
|
100
|
+
|
101
|
+
## Rendering
|
69
102
|
|
70
103
|
Flags will be rendered in HTML as:
|
71
104
|
|
105
|
+
```html
|
72
106
|
<pre>
|
73
107
|
<ul class="f32">
|
74
108
|
<li class="flag ar" data-cc="ar" data-country="Argentina">Argentina</li>
|
@@ -76,83 +110,108 @@ Flags will be rendered in HTML as:
|
|
76
110
|
...
|
77
111
|
</ul>
|
78
112
|
</pre>
|
113
|
+
```
|
79
114
|
|
80
115
|
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
|
81
116
|
|
82
|
-
|
117
|
+
## Use
|
83
118
|
|
84
119
|
WorldFlags supports flag sizes in 16, 32 and 64 pixels (size).
|
85
120
|
|
86
121
|
You can also use built in helper methods:
|
87
122
|
|
123
|
+
```haml
|
88
124
|
= flag_list 16 do
|
89
125
|
= flags [:ar, :gb], :selected => :gb
|
126
|
+
```
|
90
127
|
|
91
128
|
Alternatively
|
92
129
|
|
130
|
+
```haml
|
93
131
|
= flag_list 32 do
|
94
|
-
= flag(:ar)
|
132
|
+
= flag(:ar)
|
133
|
+
= flag(:gb, :selected => true)
|
134
|
+
```
|
95
135
|
|
96
136
|
Or using the #flag_code helper
|
97
137
|
|
138
|
+
```haml
|
98
139
|
= flag(:ar) + flag(:gb, :selected => flag_code(I18n.locale)
|
140
|
+
```
|
99
141
|
|
100
142
|
For use with tooltips or similar js plguins, it can be useful to set the <li> title attribute:
|
101
143
|
|
144
|
+
```haml
|
102
145
|
= flag_list 32 do
|
103
146
|
= flags [:ar, :br, :gb], :title => true
|
147
|
+
```
|
104
148
|
|
105
149
|
The flag_title will render the following list item:
|
106
150
|
|
151
|
+
```html
|
107
152
|
<li class="flag ar" lang="ar" title="Argentina"> </li>
|
153
|
+
```
|
108
154
|
|
109
155
|
Note: The ` is needed in order for the background (flag icon) to have something to be displayed against.
|
110
156
|
|
111
157
|
The :title and :content can also be set to a string which is then displayed
|
112
158
|
|
159
|
+
```haml
|
113
160
|
= flag :ar, :title => 'Argentina is the best', :content => 'Argh!'
|
161
|
+
```
|
114
162
|
|
115
163
|
To also get content rendered for the <li>
|
116
164
|
|
165
|
+
```haml
|
117
166
|
= flags [:ar, :br, :gb], :content => true
|
167
|
+
```
|
118
168
|
|
119
169
|
Note: There is also a #flag_selected? helper, which is (and/or can be) used to determine if the flag to be drawn should have the "selected" class set)
|
120
170
|
The auto-select feature is by default turned off, but can be turned on/off using:
|
121
171
|
|
172
|
+
```ruby
|
122
173
|
WorldFlags.auto_select = true # or WorldFlags.auto_select!
|
174
|
+
```
|
123
175
|
|
124
|
-
|
176
|
+
## Using localization
|
125
177
|
|
126
178
|
You can specify whether to look up labels for the flags for either language or country and for which locale to look up the labels (see Configuring localization)
|
127
179
|
|
128
180
|
Use danish (da) country labels
|
129
181
|
|
182
|
+
```haml
|
130
183
|
= flag_list 32 do
|
131
184
|
= flags [:ar, :br, :gb], :country => :da
|
185
|
+
```
|
132
186
|
|
133
187
|
Use danish (da) language labels
|
134
188
|
|
189
|
+
```haml
|
135
190
|
= flag_list 32 do
|
136
191
|
= flags [:ar, :br, :gb], :language => I18n.locale
|
192
|
+
```
|
137
193
|
|
138
194
|
Note: In the config folder there is now a json file with all the english ISO-3166-2 code translations ready for use. You can make similar locale files for other locales/languages.
|
139
195
|
|
140
|
-
|
196
|
+
h## Get client country code (browser and geo)
|
141
197
|
|
142
198
|
A small helper module is provided that can be inserted into a Controller or wherever you see fit
|
143
199
|
|
144
200
|
* ip_country_code
|
145
201
|
* browser_locale
|
146
202
|
|
203
|
+
```ruby
|
147
204
|
class MainController < ApplicationController
|
148
205
|
def home
|
149
206
|
@json = Property.all.to_gmaps4rails
|
150
207
|
@country_code = WorldFlags::Geo.ip_country_code
|
151
208
|
end
|
152
209
|
end
|
210
|
+
```
|
153
211
|
|
154
212
|
Alternatively you can include the modules directly into the controller:
|
155
213
|
|
214
|
+
```ruby
|
156
215
|
class MainController < ApplicationController
|
157
216
|
include WorldFlags::Geo
|
158
217
|
include WorldFlags::Browser
|
@@ -163,34 +222,42 @@ class MainController < ApplicationController
|
|
163
222
|
@locale = browser_locale
|
164
223
|
end
|
165
224
|
end
|
225
|
+
```
|
166
226
|
|
167
|
-
If you include the WorldFlags::Locale module, you can simply do:
|
227
|
+
If you include the `WorldFlags::Locale` module, you can simply do:
|
168
228
|
|
229
|
+
```ruby
|
169
230
|
before_filter :set_locale
|
231
|
+
```
|
170
232
|
|
171
|
-
And it should set the I18n.locale appropriately, trying params[locale], browser, ip address in succession, defaulting to I18n.default_locale
|
233
|
+
And it should set the I18n.locale appropriately, trying `params[locale], browser, ip address` in succession, defaulting to `I18n.default_locale`.
|
172
234
|
For each locale it will check if it is a vaild locale, using
|
173
|
-
WorldFlags::Locale#valid_locales
|
235
|
+
`WorldFlags::Locale#valid_locales`
|
174
236
|
|
175
|
-
For convenience you can also include WorldFlags::All to include all these modules.
|
237
|
+
For convenience you can also include `WorldFlags::All` to include all these modules.
|
176
238
|
|
177
239
|
Example:
|
178
240
|
|
241
|
+
```ruby
|
179
242
|
class MainController < ApplicationController
|
180
243
|
include WorldFlags::All
|
181
244
|
|
182
245
|
before_filter :set_locale
|
183
246
|
end
|
247
|
+
```
|
184
248
|
|
185
249
|
You must set up valid locales for use with WorldFlags in some initializer:
|
186
250
|
|
251
|
+
```ruby
|
187
252
|
# fx [:da, :en] or even ['da', 'en']
|
188
253
|
WorldFlags::Locale.locales = my_valid_locales_list
|
254
|
+
```
|
189
255
|
|
190
|
-
|
256
|
+
## Post flag selection
|
191
257
|
|
192
258
|
Here an example of setting up a flag click handler in order to call the server with the country/locale/language selection of the flag.
|
193
259
|
|
260
|
+
```javascript
|
194
261
|
$("li.flag").click(function() {
|
195
262
|
country = $(this).data('locale');
|
196
263
|
|
@@ -202,62 +269,9 @@ $("li.flag").click(function() {
|
|
202
269
|
console.log(data);
|
203
270
|
});
|
204
271
|
});
|
272
|
+
```
|
205
273
|
|
206
|
-
|
207
|
-
|
208
|
-
CSS config:
|
209
|
-
|
210
|
-
ul.f32 {
|
211
|
-
list-style-type: none;
|
212
|
-
padding: 0;
|
213
|
-
margin-left: 0;
|
214
|
-
|
215
|
-
li.flag {
|
216
|
-
float:left;
|
217
|
-
padding-bottom: 6px;
|
218
|
-
padding-right: 26px;
|
219
|
-
margin-right: 8px;
|
220
|
-
background-position: center;
|
221
|
-
}
|
222
|
-
}
|
223
|
-
|
224
|
-
#languages {
|
225
|
-
float: right;
|
226
|
-
}
|
227
|
-
|
228
|
-
p.clear {
|
229
|
-
clear:both;
|
230
|
-
}
|
231
|
-
|
232
|
-
.tooltip {
|
233
|
-
display:none;
|
234
|
-
background: white;
|
235
|
-
border: 1px solid black;
|
236
|
-
font-size:14px;
|
237
|
-
font-weight: bold;
|
238
|
-
text-align: center;
|
239
|
-
height:16px;
|
240
|
-
width:120px;
|
241
|
-
padding:10px;
|
242
|
-
color: black;
|
243
|
-
}
|
244
|
-
|
245
|
-
Tooltip script:
|
246
|
-
|
247
|
-
http://jquerytools.org/demos/tooltip/index.html
|
248
|
-
|
249
|
-
$("li.flag[title]").tooltip()
|
250
|
-
|
251
|
-
Layout file:
|
252
|
-
|
253
|
-
%body
|
254
|
-
.main
|
255
|
-
= link_to "Sign in", new_user_session_path
|
256
|
-
= link_to "Sign up", new_user_registration_path
|
274
|
+
## Enjoy
|
257
275
|
|
258
|
-
|
259
|
-
= flag_list 64 do
|
260
|
-
= flags [:ar, :gb], :selected => WorldFlags.flag_code(@locale)
|
261
|
-
%p.clear
|
262
|
-
= yield
|
276
|
+
Copyright (2012) Kristian Mandrup
|
263
277
|
|
data/VERSION
CHANGED
@@ -1 +1 @@
|
|
1
|
-
0.2.
|
1
|
+
0.2.4
|
File without changes
|
data/lib/world-flags.rb
CHANGED
@@ -42,7 +42,11 @@ module WorldFlags
|
|
42
42
|
flag_locale_map[code.to_sym] || code
|
43
43
|
end
|
44
44
|
|
45
|
-
|
45
|
+
attr_writer :locale_flag_map, :active_locales
|
46
|
+
|
47
|
+
def active_locales
|
48
|
+
@active_locales ||= [:en]
|
49
|
+
end
|
46
50
|
|
47
51
|
# translate locales to flag code: ISO_3166-1_alpha-2
|
48
52
|
def locale_flag_map
|
@@ -71,7 +75,12 @@ module WorldFlags
|
|
71
75
|
end
|
72
76
|
|
73
77
|
def languages
|
74
|
-
@languages ||=
|
78
|
+
@languages ||= begin
|
79
|
+
active_locales.inject({}) do |res, locale|
|
80
|
+
res[locale] = Languages.send(locale) if Languages.respond_to?(locale)
|
81
|
+
res
|
82
|
+
end
|
83
|
+
end
|
75
84
|
end
|
76
85
|
|
77
86
|
# Country helper macros
|
@@ -1,21 +1,25 @@
|
|
1
1
|
module WorldFlags
|
2
2
|
module Countries
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
3
|
+
class << self
|
4
|
+
attr_writer :en
|
5
|
+
|
6
|
+
def en
|
7
|
+
{
|
8
|
+
:ar => 'Argentina',
|
9
|
+
:br => 'Brazil',
|
10
|
+
:gb => 'Great Britain',
|
11
|
+
:us => 'United States',
|
12
|
+
:es => 'Spain',
|
13
|
+
:gr => 'Greece',
|
14
|
+
:it => 'Italy',
|
15
|
+
:nl => 'Netherlands',
|
16
|
+
:de => 'Germany',
|
17
|
+
:dk => 'Denmark',
|
18
|
+
:se => 'Sweden',
|
19
|
+
:no => 'Norway',
|
20
|
+
:fi => 'Finland'
|
21
|
+
}
|
22
|
+
end
|
19
23
|
end
|
20
24
|
end
|
21
25
|
end
|
@@ -1,22 +1,26 @@
|
|
1
1
|
module WorldFlags
|
2
2
|
module Languages
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
3
|
+
class << self
|
4
|
+
attr_writer :en
|
5
|
+
|
6
|
+
def en
|
7
|
+
@en ||= {
|
8
|
+
:ar => 'Argentinian Spanish',
|
9
|
+
:br => 'Brazilian Portuguese',
|
10
|
+
:po => 'Portuguese',
|
11
|
+
:gr => 'Greek',
|
12
|
+
:gb => 'British English',
|
13
|
+
:us => 'US English',
|
14
|
+
:es => 'Spanish',
|
15
|
+
:it => 'Italian',
|
16
|
+
:nl => 'Dutch',
|
17
|
+
:de => 'German',
|
18
|
+
:dk => 'Danish',
|
19
|
+
:se => 'Swedish',
|
20
|
+
:no => 'Norwegian',
|
21
|
+
:fi => 'Finnish'
|
22
|
+
}
|
23
|
+
end
|
20
24
|
end
|
21
25
|
end
|
22
26
|
end
|
data/world-flags.gemspec
CHANGED
@@ -5,7 +5,7 @@
|
|
5
5
|
|
6
6
|
Gem::Specification.new do |s|
|
7
7
|
s.name = "world-flags"
|
8
|
-
s.version = "0.2.
|
8
|
+
s.version = "0.2.4"
|
9
9
|
|
10
10
|
s.required_rubygems_version = Gem::Requirement.new(">= 0") if s.respond_to? :required_rubygems_version=
|
11
11
|
s.authors = ["Kristian Mandrup"]
|
@@ -14,7 +14,7 @@ Gem::Specification.new do |s|
|
|
14
14
|
s.email = "kmandrup@gmail.com"
|
15
15
|
s.extra_rdoc_files = [
|
16
16
|
"LICENSE.txt",
|
17
|
-
"README.
|
17
|
+
"README.md"
|
18
18
|
]
|
19
19
|
s.files = [
|
20
20
|
".document",
|
@@ -23,10 +23,10 @@ Gem::Specification.new do |s|
|
|
23
23
|
"Gemfile",
|
24
24
|
"Gemfile.lock",
|
25
25
|
"LICENSE.txt",
|
26
|
-
"README.
|
26
|
+
"README.md",
|
27
27
|
"Rakefile",
|
28
28
|
"VERSION",
|
29
|
-
"config/country_codes/iso-3166-2.en.json",
|
29
|
+
"app/config/country_codes/iso-3166-2.en.json",
|
30
30
|
"lib/world-flags.rb",
|
31
31
|
"lib/world_flags/countries.rb",
|
32
32
|
"lib/world_flags/languages.rb",
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: world-flags
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.2.
|
4
|
+
version: 0.2.4
|
5
5
|
prerelease:
|
6
6
|
platform: ruby
|
7
7
|
authors:
|
@@ -113,7 +113,7 @@ executables: []
|
|
113
113
|
extensions: []
|
114
114
|
extra_rdoc_files:
|
115
115
|
- LICENSE.txt
|
116
|
-
- README.
|
116
|
+
- README.md
|
117
117
|
files:
|
118
118
|
- .document
|
119
119
|
- .rspec
|
@@ -121,10 +121,10 @@ files:
|
|
121
121
|
- Gemfile
|
122
122
|
- Gemfile.lock
|
123
123
|
- LICENSE.txt
|
124
|
-
- README.
|
124
|
+
- README.md
|
125
125
|
- Rakefile
|
126
126
|
- VERSION
|
127
|
-
- config/country_codes/iso-3166-2.en.json
|
127
|
+
- app/config/country_codes/iso-3166-2.en.json
|
128
128
|
- lib/world-flags.rb
|
129
129
|
- lib/world_flags/countries.rb
|
130
130
|
- lib/world_flags/languages.rb
|
@@ -172,7 +172,7 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
172
172
|
version: '0'
|
173
173
|
segments:
|
174
174
|
- 0
|
175
|
-
hash:
|
175
|
+
hash: 4001890539095180022
|
176
176
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
177
177
|
none: false
|
178
178
|
requirements:
|