Category Archive: Javascript

Парсинг DN (Distinguished Names)

В ЭЦП данные о её владельце и изготовителе хранятся в виде Distinguished Names (DN). Например:
CN=БЛОГОВ БЛОГ,SURNAME=БЛОГОВ,SERIALNUMBER=IIN123456789012,C=KZ,L=АСТАНА,S=АСТАНА,G=БЛОГОВИЧ,O=ТОО \"Рога\, копыта 24\\7\",OU=BIN000111222333
Атрибуты отделяются между собой запятыми, каждый атрибут представляет из себя ключ и значение, разделенные символом равно (=). Так же некоторые символы экранируются, например: \" \, Предлагаю следующую функцию, которая принимает строку в формате DN и возвращается объект с соответствующими полями и значениями (я использовал angular'овский цикл, но можно заменить на обычный).
function parseDN(value){
    var parts = value
        .replace(/\\,/g,'')
        .replace(/,/g,'')
        .replace(//g,',')
        .replace(/\\\\/g,'')
        .replace(/\\/g,'')
        .replace(//g,'\\')
        .split('');
    var map = {};
    angular.forEach(parts, function(part){
        var split = part.split('=');
        map[split[0]] = split[1];
    });
    return map;
}
Пример использования:
    var map = parseDN("YOUR_DN_STRING");
    console.log(map.CN);
    console.log(map.SERIALNUMBER);
    console.log(map.O);

Биржевая диаграмма на Flot

Как-то мне дали задание:
Сделать рандомно растущий график используя любые инструменты. 
Образцом была следующая gif-ка: graph Просмотрев несколько инструментов для рисования графиков, остановился на Flot. Flot - JavaScript библиотека для jQuery для рисования графиков. Скачать Flot с примерами можно с официального сайта http://www.flotcharts.org. Стоит отметить наличие хороших примеров использования Flot для построения различных графиков и диаграмм. За вечерок смог реализовать на Flot задание. В статике это выглядит так: stock_chart В динамике это выглядит так: http://kesh.kz/stock_chart/. Кстати, мне так и не ответили справился ли я с заданием. Не пропадать же потраченному времени зря, поэтому выкладываю весь пример целиком, может кому пригодится: Скачать 🙂

Перемешивание букв в словах

Не имеет значения в каком порядке расположены буквы в слове ...
По рзелульаттам илссеовадний одонго анлигйсокго унвиертисета, не иеемт занчнеия, в кокам пряокде рсапожолены бкувы в солве. Галвоне, чотбы преавя и пслоендяя бквуы блыи на мсете. Осатьлыне бкувы мгоут селдовтаь в плоонм бсепордяке, все рвано ткест чтаитсея без побрелм. Пичрионй эгото ялвятеся то, что мы не чиатем кдаужю бкуву по отдльенотси, а все солво цликеом:))
Сегодня я приведу примеры реализации таких перемешиваний букв в словах. Первая реализация будет на языке Java, а вторая реализаций будет на JavaScript. Реализация на Java Цель: создать метод turn, который принимает строку, а возвращает строку со словами, в которых перемешаны все буквы, кроме первой и последней. Например, turn("По результатам исследований") вернет следующий текст: "По рзлуаьаттем иаслсеодинвй" Необходимо подключить следующие пакеты для работы с регулярными выражениями:
import java.util.regex.Matcher;
import java.util.regex.Pattern;
Самое главное - регулярное выражение. \p{L} - означает unicode символ {4,} - задает количество от 4 до бесконечности
//регулярное выражение поиска unicode-последовательности из более 3-х символов
static final Pattern p = Pattern.compile("\\p{L}{4,}");
Реализация функции turn:
//функция принимает строку в обычном виде,
//а возвращает в перемешанном
static String turn(String str){
	//разбор строки
	Matcher m = p.matcher(str);
	//обработанные данные будем добавлять в переменную sb
	StringBuilder sb = new StringBuilder();
	//перебираем все фрагменты, которые нужно перемешать
	while(m.find()){
		//создаем массив из номеров позиций букв в массиве,
		//которые нужно перемешать
		int size = m.end() - m.start() - 2;
		int[] a = new int[size];
		int ndx = 0;
		for(int j = m.start() + 1;j < m.end() - 1;j++){
			a[ndx++] = j;
		}		
		//просто копируем все символы, которые не нужно перемешивать
		for(int i=sb.length();i<=m.start();i++){
			sb.append(str.substring(i, i+1));
		}
		//перемешиванием массив
		mix(a);
		
		//добавляем в переменную sb перемешанные буквы
		for(int el : a){
			sb.append(str.substring(el, el + 1));
		}
	}	
	//добавляем последние символы, которые перемешивать не нужно
	for(int i=sb.length();i

Ниже приведена функция перемешивания массива:
//функция перемешивания массива
static void mix(int[] arr){
	for(int i=0;i

Реализация на JavaScript
Из-за особенностей JavaScript реализация будет немного отличаться.
JavaScript поддерживает регулярные выражения, но не поддерживаются класс unicode-символов, а нам нужен класс символов \p{L}.
Для решения этой проблемы будем использовать плагин XRegExp.
Скачаем плагин с официального сайта http://xregexp.com/plugins/ или отсюда

Подключаем плагин к странице:

Регулярное выражение создается с помощью функции XRegExp, в которую первым параметром передаем шаблон регулярного выражения(описание шаблона см.выше), а вторым параметром флаг g, означающий поиск всех совпадений.
var exp = XRegExp('\\p{L}{4,}','g');
В реализации функции turn есть несколько ньюансов: 1) Вместо ресурсозатратной операции конкатенации(склеивания) строк мы будет добавлять символы в массив с помощью метода push. В конце мы сольем все элементы массива с помощью функции join, которая параметром принимает разделитель между элементами, а в нашем случае это пустая строка. 2) В JavaScript при использовании такого синтаксиса: for(el in arr), в переменную el кладется не элемент массива, а ключ. Чтобы получить элемент нужно получить его из массива по ключу: arr[el].
//функция принимает строку в обычном виде,
//а возвращает в перемешанном
function turn(text){
	//обработанные данные будем добавлять в массив res
	var res = [];	
	//перебираем все фрагменты, которые нужно перемешать
	while(match = exp.exec(text)){	
		//создаем массив из номеров позиций букв в массиве,
		//которые нужно перемешать
		var first = match.index + 1;
		var last = match.index + match.toString().length - 2;
		var arr = [];
		for(i=first;i<=last;i++){
			arr.push(i);
		}
		
		fix(arr);//перемешиванием массив
		
		//просто копируем все символы, которые не нужно перемешивать
		for(i=res.length;i<=match.index;i++){
			res.push(text.substring(i,i+1));
		}
		
		//добавляем перемешанные символы
		for(el in arr){
			var ndx = arr[el];
			res.push(text.substring(ndx,ndx+1));
		}	
	}
	//добавляем последние символы, которые не нужно перемешивать
	for(i=res.length;i

Код перемешивания элементов массива:
//функция перемешивания массива
function fix(arr){
	for(i=0;i

Готовую реализацию можно увидеть на странице: Перемешивание букв в словах (Пример)            

Кодирование символов казахского языка в Web

 
СимволКод в HTMLКод в JavaScript
Ә   ә&#1240;   &#1241;\u04D8   \u04D9
Ұ   ұ&#1200;   &#1201;\u04B0   \u04B1
І   і&#1030;   &#1110;\u0406   \u0456
Ң   ң&#1186;   &#1187;\u04A2   \u04A3
Ғ   ғ&#1170;   &#1171;\u0492   \u0493
Ү   ү&#1198;   &#1199;\u04AE   \u04AF
Қ   қ&#1178;   &#1179;\u049A   \u049B
Ө   ө&#1256;   &#1257;\u04E8   \u04E9
Һ   һ&#1210;   &#1211;\u04BA   \u04BB

Программный клик на ссылке в браузере Opera

Долгое время в проекте, над которым я работал, авторизация в браузере Opera проходила как-то не так. Суть проблемы была в том, что в браузере Opera 12.10, когда я в текстовое поле вводил пароль и нажимал Enter, авторизация не происходила (по нажатию Enter должна была нажаться ссылка OK). Хотя в других браузерах все работало прекрасно: Firefox 17.0.1, IE 9 и Chrome 24. Вот упрощенный пример:


ОК
Сам скрипт:

Долго искал решение. Оказалось в Opera нужно предотвращать стандарстное действие клавиши Enter, т.к. она перебивала клик на ссылке! Это делается методом preventDefault объекта event.