Tag Archives: javascript

Grunt: система сборки для фронтенд-разработчиков

http://gruntjs.com/ Ставится как пакет к node, через npm. Конфиги пишутся на javascript.

Точки останова (breakpoints) в Google Chrome с примерами

Очень удобное и понятное описание: https://developers.google.com/chrome-developer-tools/docs/scripts-breakpoints. Особенно понравилось: Задание останова на изменение DOM внутри выбранного элемента — https://developers.google.com/chrome-developer-tools/docs/scripts-breakpoints#dom, Остановки на ajax-ах — https://developers.google.com/chrome-developer-tools/docs/scripts-breakpoints#xhr, Остановки на обработчиках событий (клики, движения мыши и т.п.) — https://developers.google.com/chrome-developer-tools/docs/scripts-breakpoints#listeners

Navigation Timing: черновик нового стандарта от W3C

Появляется новый параметр — windows.performance, у которого есть два свойства: timing и navigation. Подробнее можно почитать на сайте w3c — http://www.w3.org/TR/navigation-timing/. В Google Chrome добавили ещё и метод now(), который возвращает количество миллисекунд с performance.timing.navigationStart (число типа float) — http://updates.html5rocks.com/2012/08/When-milliseconds-are-not-enough-performance-now.

Сравнение 12 javascript MVC-фреймворков

The Top 10 Javascript MVC Frameworks Reviewed Лучшим признан Ember.js. Надо поковырять) UPD: поковырял. В принципе, более стройная архитектура, чем у того же backbone, у которого часть логики контроллера во вью. Но из коробки нет router и не так просто с pushState, так что не стал использовать серьёзно. Возможно, через полгода-год этот фреймворк будет интереснее.

FireBug console.table

В FireBug1.6 появился новый способ вывода — console.table

Пример jquery-ui виджета

Виджет добавляет инпуту кнопки, упрощающие генерацию маски, и строку для показа сгенерированного по маске значения. Виджет выложен исключительно для примера. Использовать напрямую нельзя (только с моего письменного разрешения). К сожалению так, прошу извинить.

Отдача json из Django view

from django.http import HttpResponse
import simplejson as json
...
def my_view( request ):
   jsonDict = { "status": "success", "message": "everything's fine" }
   return HttpResponse( json.dumps( jsonDict ), mimetype="application/json" )

from django.http import HttpResponse

import simplejson as json

...

def my_view( request ):

jsonDict = { "status": "success", "message": "everything's fine" }

return HttpResponse( json.dumps( jsonDict ), mimetype="application/json" )

Подробнее о simplejson — в документации

Динамическое добавление/удаление полей форм в Django

Задача стояла следующая: есть список сущностей (к примеру, упражнений), каждая из которых в форме выводится в виде нескольких полей ввода (к примеру, сеты и название упражнения), хочется иметь возможность яваскриптом добавлять/удалять упражнения, менять их положение. Для этого были использованы формсеты (django.forms.formsets) и jquery на клиенте. В теории всё так: в шаблон передаём формы из формсета …

Выборка DOM-элементов по селекторам

Постоянно забываю запись всех атрибут селекторов для jquery. Памятка с примерами использования: 1. Элемент с атрибутом [A] Выбирает все элементы с атрибутом. Пример:

$( "checkbox[checked]" )

1	$( "checkbox[checked]" )

Выбрать все чекбоксы с атрибутом «checked». 2. Элемент с атрибутом A, равным B [A=B] Пример:

$( "input[name='my-name']" )

1	$( "input[name='my-name']" )

Выбрать все инпуты с атрибутом «name», равным «my-name». 3. Элемент с атрибутом A, не равным …

	arraysAreEqual: function( Arr1, Arr2 )
	{
		var equal = ( Arr1.length == Arr2.length );
		if ( equal )
		{
			$.each( Arr1, function ( key, val ) {
				if ( $.inArray( val, Arr2 ) == -1 )
				{
					equal = false;
					return false;
				}
			} );
		}
		return equal;
	},

arraysAreEqual: function( Arr1, Arr2 )

{

var equal = ( Arr1.length == Arr2.length );

if ( equal )

{

$.each( Arr1, function ( key, val ) {

if ( $.inArray( val, Arr2 ) == -1 )

{

equal = false;

return false;

}

} );

}

return equal;