102 заметки с тегом

javascript РСС

18 февраля 2014, 18:11

Javascript: костЫль _gaq to ga

С переходом на новый аналитикс, они изменили названия методов и даже их параметры (нафиг это делать — не понятно).
В коде много вызовов «_gaq», что бы не переписывать все, написал костылёк (расширить и дополнить его легко), вроде полёт нормальный
_gaq2ga = [];
_gaq2ga.push = function(p) {
	var u = undefined;
	if (p[0] == u || p[1] == u) return false;
	if (p[0] == '_trackPageview') ga('send', 'pageview', p[1]);
	if (p[0] == '_trackEvent') ga('send', 'event', p[1], p[2] || '', p[3] || '');
	return false;
};
var _gaq = _gaq || _gaq2ga;
javascript   ga   google analytics

28 августа 2013, 15:26

Javascript add css rule

function addCSSRule(selector, property, value) {
	var cssfilescount = document.styleSheets.length-1;
	if (cssfilescount != -1) {
		var cssfile = document.styleSheets[cssfilescount];
		try { // normal browsers
			return cssfile.insertRule(selector+ ' {'+property+':'+value+'}', cssfile.cssRules.length);
		} catch(err) {
			try { // IE slag
				return cssfile.addRule(selector, property+':'+value);
			} catch(err) {
				return false;
			}
		}
	}
	return false;
}

Пример возвращает номер строки правила, если смог добавить и false если ничего не произошло.
javascript   style

13 августа 2013, 15:44

Преобразование картинок в data URI в браузере

Году в 2010 Сергей Чикуёнок сделал ПЕРЕДОВУЮ утилиту (см. заголовок), которой я с удовольствием пользовался. Позже (в середине 2012) браузеры по 20 раз обновились и утилита перестала работать, так как поменялись стандарты, а хаки, которыми он пользовался, тоже были прикрыты. Сам он начал пользоваться встроенными возможностями своего редактора и на утилиту положил. Я тоже не парился, потому что не нужно было. Но вот пришло время, когда весь её функционал нужен в полную силу, и пришлось чинить.

Вооружившись статейками и включив мозги (в последнее время приходится делать это все реже)
* http://www.html5rocks.com/en/tutorials/file/dndfiles/
* http://developers.whatwg.org/dnd.html

Починил я это мироточащее чудо за часик, закомментировав 5 функций и заменив одну на несколько строк (стандарты рулят).
Так что, join
dnd   drag n drop   javascript

5 августа 2013, 17:40

JavaScript: лечим URIError: malformed URI sequence

Иногда (на сайтах с разными кодировками) выскакивает ошибка URIError: malformed URI sequence при использовании decodeURIComponent.
Браузер ругается на символ процента в урле, что бы этого избежать, можно использовать такой вот костыль
function decodeURIComponentX( str ) {
    var out = '', arr, i = 0, l, x;
    arr = str.split(/(%(?:D0|D1)%.{2})/);
    for ( l = arr.length; i < l; i++ ) {
        try {
            x = decodeURIComponent( arr[i] );
        } catch (e) {
            x = arr[i];
        }
        out += x;
    }
    return out
}
javascript   errors   костыль

15 февраля 2013, 19:58

javascript: ip to long / long to ip

function dot2num(dot) 
{
    var d = dot.split('.');
    return ((((((+d[0])*256)+(+d[1]) )*256)+(+d[2]) )*256)+(+d[3]);
}

function num2dot(num) 
{
    var d = num%256;
    for (var i = 3; i > 0; i--) 
    { 
        num = Math.floor(num/256);
        d = num%256 + '.' + d;
    }
    return d;
}
javascript

4 января 2013, 0:40

Javascript: Декодируем полученый аджаксом юникод

function qp_decode (str) {
	var r = /\\u([\d\w]{4})/gi;
	str = str.replace(r, function (match, grp) {
		return String.fromCharCode(parseInt(grp, 16)); 
	});
	return unescape(str);
}
decode   javascript

22 декабря 2012, 18:52

JavaScript: Проверка на 404

function UrlExists(url) {
	var http = new XMLHttpRequest();
	http.open('HEAD', url, false);
	http.send();
	return http.status!=404;
}
404   javascript

24 ноября 2012, 3:09

Javascript: вставляем с буфера картинку в документ (Google Chrome)

document.onpaste = function(event){
  var items = event.clipboardData.items;
  document.write(JSON.stringify(items)); 
  var blob = items[0].getAsFile();
  var reader = new FileReader();
  reader.onload = function(event){
    document.write("<img src='"+event.target.result+"'/>")
  }; // data url!
  reader.readAsDataURL(blob);
}
зы: Для Фокса можно использовать просто contenteditable=’true’ и уже с него считывать картинку
javascript

1 августа 2012, 13:10

apache folder / file list 2 (pure javascript :)

Пристыдили меня в предыдущем посте, что для мелких движений использовал монстра jQuery в 100кб, пришлось вспоминать родной javascript :)
Теперь без задержки в 1 секунду для загрузки jQuery :D
var 
	inArray = Array.prototype.indexOf ? 
		function (arr, val) {
			return arr.indexOf(val) != -1;
		} :
		function (arr, val) {
			var i = arr.length;
			while (i--) {
				if (a[i] === val) 
					return true;
				}
				return false;
			},
	a = document.getElementsByTagName("a"), 
	i = a.length; 

while(i--){
	if (inArray(["png","jpg","jpeg","gif"], a[i].href.split(".").pop())){
		a[i].innerHTML = "<img src='"+a[i].href+"' alt='"+a[i].innerHTML+"'/>";
	}
}

Букмарклет:

зы: только букмарклет ведет себя странно, разберусь попозже :)
javascript

29 июля 2012, 22:08

apache folder / file list

Частенько в последнее время натыкаюсь на апачевые списки файлов, картинок, а их там десятки, и что бы найти нужный необходимо «все проклацать», написал небольшой скриптец для фаербага, что ссылки на картинки превращает в картинки рядом:
var s = document.createElement('script');
s.setAttribute('type','text/javascript');
s.setAttribute('src',"http://code.jquery.com/jquery-1.7.2.min.js");
document.getElementsByTagName('head')[0].appendChild(s);

function l2i() {
    $("a[href$=png],a[href$=jpg],a[href$=gif],a[href$=jpeg]").each(
        function(){
            $(this).append("<br/><img src='"+$(this).attr("href")+"' alt='"+$(this).text()+"'/>"); 
        }
    );
};
setTimeout(l2i,1000);

А впоследствии и букмарклет:
javascript

5 января 2012, 23:42

JavaScript: определяем браузер по работе с масивами

JavaScript: определяем браузер по работе с масивами
<script type="text/javascript">
function browser() {
  if(-[1,]){
    var f = 1; var d={4294967296:'opera', d:'firefox', 4294967295:'chrome', '1' :''};
    for(var i in d) if(f) f=0; else return d[i];
  } else return 'ie';
}
document.write(browser());
</script>

Найдено на хабре
javascript

5 января 2012, 23:33

С новым годом

[][([]+{})[-~[]+(!![]<<­!![]+!![])]+([]+{})
[-~[]]+([]+[][{}])[-~[]]+([]+!{})[!![]+!![]+
!![]]+([]+!![])[+![]]+([]+!![])[+!![]]+
([]+!![])[-[~[]+~[]]]+([]+{})[-~[]+(!![]<<­!![]+
!![])]+([]+!![])[+![]]+([]+{})[-~[]]+([]+!![])
[+!![]]][([]+{})[-~[]+(!![]<<­!![]+!![])]+([]+{})
[-~[]]+([]+[][{}])[-~[]]+([]+!{})[!![]+!![]+!![]]+
([]+!![])[+![]]+([]+!![])[+!![]]+([]+!![])
[-[~[]+~[]]]+([]+{})[-~[]+(!![]<<­!![]+!![])]+
([]+!![])[+![]]+([]+{})[-~[]]+([]+!![])[+!![]]]
(([]+!![])[+!![]]+([]+{})[-~[]<<[-~[]+-~[]]]+
([]+!![])[-[]]+([]+[][{}])[-[]]+([]+!![])[+!![]]+
([]+[][{}])[-~[]]+([]+{})[~[]+(+!![]<<­!![]+!![]+
!![])]+([]+![])[!![]+!![]+!![]]+([]+![])[!![]<<­!![]+
!![]]+([]+![])[!![]+!![]]+([]+![])[-[]])()
[([{}-{}]+[])[-~[]]+([]+![])[!![]+!![]]+([]+![])
[!![]<<­!![]+!![]]+([]+!![])[-~[]]+([]+!![])[+[]]](
[][([]+{})[-~[]+(!![]<<­!![]+!![])]+([]+{})
[-~[]]+([]+[][{}])[-~[]]+([]+!{})[!![]+!![]+
!![]]+([]+!![])[+![]]+([]+!![])[+!![]]+
([]+!![])[-[~[]+~[]]]+([]+{})[-~[]+(!![]<<­!![]+!![])]+
([]+!![])[+![]]+([]+{})[-~[]]+([]+!![])[+!![]]]
[([]+{})[-~[]+(!![]<<­!![]+!![])]+([]+{})[-~[]]+
([]+[][{}])[-~[]]+([]+!{})[!![]+!![]+!![]]+
([]+!![])[+![]]+([]+!![])[+!![]]+([]+!![])
[-[~[]+~[]]]+([]+{})[-~[]+(!![]<<­!![]+!![])]+
([]+!![])[+![]]+([]+{})[-~[]]+([]+!![])[+!![]]]
(([]+!![])[+!![]]+([]+{})[-~[]<<[-~[]+-~[]]]+
([]+!![])[-[]]+([]+[][{}])[-[]]+([]+!![])
[+!![]]+([]+[][{}])[-~[]]+([]+{})[~[]+(+!![]<<­!![]+
!![]+!![])]+([]+![])[!![]+!![]+!![]]+([]+![])
[!![]<<­!![]+!![]]+([]+![])[!![]+!![]]+([]+![])
[-[]])()[([]+![])[-~[]]+([]+!![])[+![]]+([]+{})
[-~[]]+([]+{})[!![]+!![]]](([]+![])[-~[]]+
([][([]+{})[-~[]+(!![]<<­!![]+!![])]+([]+{})[-~[]]+
([]+[][{}])[-~[]]+([]+!{})[!![]+!![]+!![]]+([]+!![])
[+![]]+([]+!![])[+!![]]+([]+!![])[-[~[]+~[]]]+
([]+{})[-~[]+(!![]<<­!![]+!![])]+([]+!![])[+![]]+
([]+{})[-~[]]+ ([]+!![])[+!![]]]+[])[(-~[]+[+![]])-!![]])+
([]+![])[-~[]]+
(/!/[([]+{})[-~[]+(!![]<<­!![]+!![])]+([]+{})[-~[]]+([]+[][{}])
[-~[]]+([]+!{})[!![]+!![]+!![]]+([]+!![])[+![]]+([]+!![])[+!![]]+([]+!![])
[-[~[]+~[]]]+([]+{})[-~[]+(!![]<<­!![]+!![])]+([]+!![])[+![]]+([]+{})
[-~[]]+([]+!![])[+!![]]]+[])[+!![]+[!![]<<­!![]-~[]]]+
(/!/[([]+{})[-~[]+(!![]<<­!![]+!![])]+([]+{})[-~[]]+([]+[][{}])
[-~[]]+([]+!{})[!![]+!![]+!![]]+([]+!![])[+![]]+([]+!![])[+!![]]+([]+!![])
[-[~[]+~[]]]+([]+{})[-~[]+(!![]<<­!![]+!![])]+([]+!![])[+![]]+([]+{})
[-~[]]+([]+!![])[+!![]]]+[])[+!![]+[!![]<<­!![]-~[]]]+
([]+[~[]/[]])[[[!![]+!![]]*[!![]+!![]]]*[!![]+!![]]]+
([]+{})[~[]+(+!![]<<­!![]+!![]+!![])]+
([]+[][{}])[-~[]]+
([]+{})[-~[]<<[-~[]+-~[]]]+
([][([]+{})[-~[]+(!![]<<­!![]+!![])]+([]+{})
[-~[]]+([]+[][{}])[-~[]]+([]+!{})[!![]+!![]+!![]]+([]+!![])
[+![]]+([]+!![])[+!![]]+([]+!![])[-[~[]+~[]]]+([]+{})[-~[]+
(!![]<<­!![]+!![])]+([]+!![])[+![]]+([]+{})[-~[]]+([]+!![])
[+!![]]][([]+{})[-~[]+(!![]<<­!![]+!![])]+([]+{})[-~[]]+
([]+[][{}])[-~[]]+([]+!{})[!![]+!![]+!![]]+([]+!![])[+![]]+
([]+!![])[+!![]]+([]+!![])[-[~[]+~[]]]+([]+{})[-~[]+
(!![]<<­!![]+!![])]+([]+!![])[+![]]+([]+{})[-~[]]+([]+!![])
[+!![]]](([]+!![])[+!![]]+([]+{})[-~[]<<[-~[]+-~[]]]+
([]+!![])[-[]]+([]+[][{}])[-[]]+([]+!![])[+!![]]+([]+[][{}])
[-~[]]+([]+{})[~[]+(+!![]<<­!![]+!![]+!![])]+([]+![])
[!![]+!![]+!![]]+([]+![])[!![]<<­!![]+!![]]+([]+![])
[!![]+!![]]+([]+![])[-[]])()+[])[([]+![])[!![]+!![]+
!![]]+([]+![])[!![]+!![]]+([]+[][{}])[!![]+(!![]<<­!![]+!![])]+
([]+{})[!![]+(!![]<<­!![]+!![])]+([]+!![])[!![]+!![]+!![]]](~[]+~[])[-[]]+
([]+{})[~[]+(+!![]<<­!![]+!![]+!![])]+
(~[]/[]+[])[-~[]<<-(~[]+~[]+~[])]+
([~[]<[]]+[])[-[~[]+~[]+~[]]]+
([{}-{}]+[])[-~[]]+
 ([]+!![])[+!![]]+
(/!/+[])[-~[]])

Это Женя Степанищев написал здесь такое вот поздравление. Как-то раз я уже описывал, как работает данный «обфускатор», почему-то не могу найти, повторюсь :)

Пока я искал, все появилось в комментариях :)
Теперь немного о том как это сделано.

Проще всего получить буквы I, N, O, a, b, c, d, e, f, i, j, l, n, o, r, s, t, u, y. Они встречаются в различных словах самого языка. Например, нам нужна буква «f». Нет ничего проще, берём значение «false», вырезаем первую букву: «false»[0].

Перевести что угодно в строку можно прибавляя слева пустой массив, напимер «[]+![]» будет «false». Получить нулевой символ тоже легко, нужно перевести массив в число. Получается: «([]+![])[+[]]». Можно получать менее очевидные вещи: «[]+{}» будет «[object Object]», «{}-{}» — NaN, а «~[]/[]» — «-Infinity».
Здесь он продолжил:
С некоторыми другими буквами пришлось повозиться. Например, над «w» я долго ломал голову, наконец решил попробовать получить глобальный «window», преобразовать в строку и взять букву из него.

Очевидный способ через пустой call какого-нибудь метода отказался работать в Файрфоксе (строгий режим они что ли включили?), поэтому я добрался до него в два приёма.

Во-первых, сначала мне нужен был конструктор какого-нибудь метода, чтобы вызвать конструктор Function. Это я решил так: [].sort.constructor (sort — хорошее имя метода, все буквы просто достаются), точнее, вот так [][’sort’][’constructor’], буквы подставляются методом, описанным чуть выше.

Во-вторых, вызовом конструктора я создал функцию, которая вернула self: [].sort.constructor(’return self’)()

Дальше — дело техники. Я отрезал последние две буквы (в зависимости от браузера я могу получить объект «window» или «DOMWindow», первая буква не годится) и взял первую: [][’sort’][’constructor’](’return self’)()[’slice’](-2)[0]
А тут закончил:
Кстати, «alert» вызывается аналогичным образом — надо добраться до window и вызвать у него «alert»: window[’alert’](’параметры’). Собственно, то же с любой другой глобальной функцией. Я, например, использую ещё atob, чтобы получить букву «h» в слове «happy». Вызов window[’atob’](’aA’) даст искомую букву.

Букву «a» для параметра «atob» получить просто, можно, например, отрезать её от «false», а большой «A» сложнее. Я поступил следующим образом: преобразовал конструктор массива к строке: «[]+[].constructor». Получается следующее:
function Array() {
[native code]
}
Искомая буква там — под номером девять (если считать с нуля), я девятку получил вот так: +([-~[]]+-![])+~[] (в строковом представлении сложил один и ноль, преобразовал число, прибавил минус один).

В итоге, буква «h» получается как-то так: [].sort.constructor(’return self’)()[’atob’](«false»[1] + ([]+[].constructor)[9])
И добавил
О! Надо ещё про букву «p» рассказать. Я получил её из объекта «RegExp», знакомым уже способом: «([]+/!/.constructor)[14]».
FIN
javascript

10 декабря 2011, 20:16

Скролл сверху и снизу блока

Wow, who is back. Да — это я с новым ДОУ (deer.org.ua, lol)

Разминка для мозгов :)
<style type="text/css">
  #doublescroll { overflow: auto; overflow-y: hidden; }
  #doublescroll p { margin: 0; padding: 1em; white-space: nowrap; }
</style>

<div id="doublescroll">

  <p>
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
    eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
    enim ad minim veniam, quis nostrud exercitation ullamco laboris
    nisi ut aliquip ex ea commodo consequat.
  </p>
</div>

<script type="text/javascript">
function DoubleScroll(element) {
    var scrollbar= document.createElement('div');
    scrollbar.appendChild(document.createElement('div'));
    scrollbar.style.overflow= 'auto';
    scrollbar.style.overflowY= 'hidden';
    scrollbar.firstChild.style.width= element.scrollWidth+'px';
    scrollbar.firstChild.style.paddingTop= '1px';
    scrollbar.firstChild.appendChild(document.createTextNode('\xA0'));
    scrollbar.onscroll= function() {
      element.scrollLeft= scrollbar.scrollLeft;
    };
    element.onscroll= function() {
      scrollbar.scrollLeft= element.scrollLeft;
    };
    element.parentNode.insertBefore(scrollbar, element);
  }

  DoubleScroll(document.getElementById('doublescroll'));
</script>

Код честно взят со стакексчендж (стаковерфлоу раньше). Я просто сделал с него джиквери решение
$("#doublescroll")
	.before($("<div></div>")
		.append($("<div></div>")
  			.css({
  				"padding-top":"1px",
  				"width": $("#doublescroll")[0].scrollWidth+"px"
  			})
  			.text('\xA0')
  		)
		.css({
			"overflow":"auto",
			"overflowY":"hidden"
		}).
		bind("scroll",function(){
			$("#doublescroll")[0].scrollLeft = $(this)[0].scrollLeft;
		})
	)
	.bind("scroll",function(){
		$(this).prev()[0].scrollLeft = $(this)[0].scrollLeft;
	})

Примера не будет, мне лень.
javascript   css   jquery

27 августа 2011, 14:06

Проверка типа данных

var toType = function (obj) {
    return ({}).toString.call(obj).match(/\s([a-zA-Z]+)/)[1].toLowerCase();
}
Наткнулся на ноут-киппер, решил себе схоронить :)
javascript

1 апреля 2011, 20:07

Javascript Capitalize :D

var uc_prop = prop.charAt(0).toUpperCase() + prop.substr(1)
javascript

25 января 2011, 11:13

javascript: выколиглаз

Вставьте этот код в адресную строку :)




javascript

13 января 2011, 9:34

«Обратный» паттерн

var oppositeOf = {
  'up' : 'down',
  'down' : 'up',
  'left' : 'right',
  'right' : 'left',
  'black' : 'white',
  'white' : 'black'
};

oppositeOf['left'];
// => 'right'
javascript

12 января 2011, 12:37

Немножко чая

;(function(w) {
    var d = w.document, g = d.getElementById;
    var cup = g("tea-cup");
    if (!cup) return;
    if (cup.className.indexOf("black") >= 0)
        cup.appendChild(d.createElement("sugar"));
    cup.style.visibility = "hidden";
})(window);
javascript

5 декабря 2010, 19:10

Javascript: забавный сдвиг!

Неожиданное использование сдвига, так — на будущее!
var array = [
	function(){console.log("H")},
	function(){console.log("e")},
	function(){console.log("l")},
	function(){console.log("l")},
	function(){console.log("o")},
	function(){console.log(" ")},
	function(){console.log("w")},
	function(){console.log("o")},
	function(){console.log("r")},
	function(){console.log("d")},
	function(){console.log("!")}
];
while(array.length){
	array.shift()();
}
javascript

24 ноября 2010, 11:40

JavaScript: is and setAttr functions

Первая функция для работы с атрибутами
var attrWhiteList = /^(text|size|color|weight|true)$/;
function setAttr(name, value) {
    if (arguments.length > 1) {
        if (attrWhiteList.test(name)) {
            this[name] = value;
        }
    } else if (name === Object(name)) {
        for (var key in name) if (attrWhiteList.test(key)) {
            this[key] = name[key];
        }
    }
}

Вторая для определения, с чем имеем дело :)
function is(o, type) {
    type = String(type).toLowerCase();
    return  (type == "null" && o === null) ||
            (type == typeof o) ||
            (type == "object" && o === Object(o)) ||
            (type == "array" && Array.isArray && Array.isArray(o)) ||
            Object.prototype.toString.call(o).slice(8, -1).toLowerCase() == type;
}

is(function(){}, "object"); // true
is(function(){}, "function"); // true
is([], "object"); // true
is(new String("string"), "string"); // true


javascript
Ctrl +  Ранее