📜 ⬆️ ⬇️

Select a country flag by code.

I read the topic and decided to implement it on js (yass) + css.
Working example

Screenshot


image

Code


window.onload = function () {
var links = _( 'a.word' );
for ( var i = 0; i < links.length; i++) {
links[i].onclick = clickOnWord;
}
_( '#get' ).onclick = function () {
if (_( '#word_1' ).value.length > 0) {
var pos_1 = word_array.indexOf(_( '#word_1' ).value) * 15;
pos_1 = pos_1 * 1.0645;
} else {
var pos_1 = 0;
}
if (_( '#word_2' ).value.length > 0) {
var pos_2 = word_array.indexOf(_( '#word_2' ).value) * 15;
} else {
var pos_2 = 0;
}
_( '#flag' ).style.backgroundPosition = '-' + (pos_1) + 'px ' + '-'
+ (pos_2) + 'px' ;
}
_( '#reset' ).onclick = function () {
_( '#word_1' ).value = '' ;
_( '#word_2' ).value = '' ;
_( '#flag' ).style.backgroundPosition = '0px 0px' ;
}
}
function clickOnWord() {
var word_1 = _( '#word_1' );
var word_2 = _( '#word_2' );
if (word_1.value.length > 0 && word_2.value.length > 0) {
word_1.value = '' ;
word_2.value = '' ;
}
if (word_1.value.length > 0) {
word_2.value = this .innerHTML;
} else {
word_1.value = this .innerHTML;
}
return false ;
}


* This source code was highlighted with Source Code Highlighter .


var word_array = new Array(26);
word_array[0] = '_' ;
word_array[1] = 'a' ;
word_array[2] = 'b' ;
word_array[3] = 'c' ;
word_array[4] = 'd' ;
word_array[5] = 'e' ;
word_array[6] = 'f' ;
word_array[7] = 'g' ;
word_array[8] = 'h' ;
word_array[9] = 'i' ;
word_array[10] = 'j' ;
word_array[11] = 'k' ;
word_array[12] = 'l' ;
word_array[13] = 'm' ;
word_array[14] = 'n' ;
word_array[15] = 'o' ;
word_array[16] = 'p' ;
word_array[17] = 'q' ;
word_array[18] = 'r' ;
word_array[19] = 's' ;
word_array[20] = 't' ;
word_array[21] = 'u' ;
word_array[22] = 'v' ;
word_array[23] = 'w' ;
word_array[24] = 'x' ;
word_array[25] = 'y' ;
word_array[26] = 'z' ;


* This source code was highlighted with Source Code Highlighter .

')
PS those who paid attention to the code should also note that this is not a working code , this method does not make sense to use on sites.

The code was written live, not optimized and generally stupid.
But everyone considers it his duty to show in the comments how cool he is in js.

Source: https://habr.com/ru/post/47370/


All Articles