Рубрика «javascript» - 478

Идея

Решил написать пост о популярном нынче Canvas из HTML5 и о своем проекте dbCartajs, его использующем. Почему Canvas? Немного истории. Прежде для создания изображений, иллюстрирующих различные расчетные модели (например, вывод окружности по радиусу и центру в координатах, вывод многоугольника с количеством вершин N и площадью S, вывод окружности на сферу и т.д.), я и мои коллеги по работе в институте использовали различные элементы управления из разных сред разработки: PictureBox их VB6, QPainter и QCanvas из Qt, Canvas из Tk и, наконец, создание изображений по mapfile из MapServer. Позже после знакомства с возможностями HTML5 я решил перейти на использование Canvas и Web-разработку с JavaScript. Удобно — для отладки и разработки нужен лишь браузер. Собравшись с силами и вооружившись документацией от W3C, я переписал часть функционала компонентов, которые мы используем в работе, на JavaScript, оформив это в проект dbCartajs на GitHub. Код реализован в виде объекта dbCarta, чтобы использовать его как виджет на страницах без копирования частей исходного кода.
Читать полностью »

Здравствуйте. Признаюсь честно, я пишу тесты редко. Т.е хотел бы чаще, но все как-то не получается. Вроде и руководство в принципе не против даже, но все равно находятся задачи посрочнее и поважнее. Тем не менее на днях заглянув в redmine обнаружил что задач практически нет (точнее они были, но требовали сперва дождаться бэкэнда).
Что ж, самое время вспомнить про тесты (конечно нужно было раньше о них думать, но лучше поздно чем никогда).
Вообще я до этого уже пробовал писать тесты, в том числе и на бэкэнде, а конкретно django. Я еще тогда подумал что было бы здорово запускать тесты из консоли а не в окне браузера. Ну а поскольку с недавнего времени я активно слежу за развитием angular, то почему бы не посмотреть как это сделано у них. Тем более как-то краем глаза я зацепил момент, что там тесты как раз запускаются в консоли. Плюс к тому же с нуля разбираться в премудростях тестирования не хотелось и я решил взять какой нибудь готовый проект с тестами, посмотреть как оно сделано, и погонять собственно тесты на нем. Мой выбор пал на angular-ui, а точнее на один из его модулей ui-utils.

Скачиваем, заходим в корень видим папку test а в ней файл karma.conf.js
Да и в самом ридми написано, что тесты запускаются так karma start —browsers ….
Гуглим karmajs и находим то что нам нужно karma-runner.github.io/0.8/index.html
Утилита для тестирования. Итак что она может?

  • Запускать тесты из консоли
  • Автоматически прогонять все тесты при каждом сохранении!!!
  • Возможность писать тесты на множестве фреймворков, таких как jasmine, qunit и др.
  • Прогонять тесты сразу на нескольких браузерах. (в том числе виртуальных, например fantomjs).

В общем то мне этих возможностей уже оказалось достаточно, чтобы взяться за нее. Но там есть и другие, в которые я пока не вникал, например интеграция с jenkins
Читать полностью »

Всем доброго дня!

Проанализировав множество блогов, докладов, презентаций, посетив пару конференций и пообщавшись на них с веб-разработчиками разного профиля, я выделил для себя основные направления в области JavaScript-разработки, которые активно развиваются или только начинают развиваться (и, по моему мнению, им стоит уделить внимание в целях ознакомления). Цель статьи – осветить их, и дать пищу для размышлений, как именно полученные знания можно было бы применить на практике.

Читать полностью »

Однажды, в жаркий летний день, меня посетила идея скрестить шахматы с картами. Не в буквальном, конечно, смысле, а в том, что касается случайного характера карточных игр. Добавить немного этой случайности, непредсказуемости в шахматы. Зачем?

Всем известно, что шахматы символизируют собой военные сражения. Т.е. это своего рода симулятор военных действий, военная стратегия. С этой точки зрения у шахмат есть один существенный недостаток. Настоящие сражения происходят не на абстрактных черно-белых квадратах, а в реальных природных, климатических, экономических и др. условиях, которые могут оказывать большое влияние на ход конкретного сражения и даже на его результат. Очевидно то, что в реальных военных сражениях все эти факторы должны учитываться (и учитываются их участниками). Очевидно и то, что в классических шахматах все это отсутствует.

«Почему бы не восполнить этот пробел?» — подумал я и решил пойти по пути авторов over 9000 модификаций шахмат, создав свою собственную с блэкджеком и сауной.Читать полностью »

Справочный API 2ГИС разрабатывается уже 4 года. Появилось около 40 методов, которые возвращают достаточно крупные и иерархически сложные структуры в формате JSON и XML. Совсем недавно я решил поделиться накопленным опытом и выступить на конференции DevConf.
Одна из тем доклада вызвала наибольший интерес у участников — это использование JSON-Schema при тестировании формата выдачи API. В этой статье я расскажу, какие задачи решает этот подход, какие имеет ограничения, что вы получаете из коробки, а что идёт бонусом. Поехали!

Применение JSON Schema в тестировании и документировании API
Читать полностью »

Как известно, расширения для браузера Chrome работают каждое в своей песочнице. Для внедрения в веб-страницу существует механизм content script-ов, когда javascript код внедряется в страницу, и имеет доступ к DOM дереву. Этот механизм позволяет работать с контентом страницы, изменять внешний вид, запускать произвольный JS, обмениваться данными с фоновым процессом расширения.

Но одну вещь механизм content script не позволяет делать — получать доступ к javascript-окружению веб-страницы.

Читать полностью »

Добрый день уважаемые слушатели. Представляем новый выпуск подкаста RWpod. В этом выпуске:

image

Читать полностью »

JQuery плагин ipmask для ввода ip v4

Для админки возникла задача – сделать удобным ввод ip-адресов.
Существующие плагины не устраивали тем, что они либо не точно проверяли формат и позволяли вводить ip типа 264.734.443.332, или не умели сами ставить разделители, или при вводе октета большего чем 255 уменьшали до наименьшего, т.е. при вводе 665 вместо того, чтобы поставить разделитель точку после 66, т.е. сделать 66.5 уменьшали до 255, т.е. никакого удобства.

В итоге появилось желание сделать плагин, который бы позволял вводить только цифры, а разделители точки устанавливались бы сами на нужных местах, когда это возможно.

Читать полностью »

С Вашего позволения, пускай и немного в философской оболочке, я бы хотел продолжить тему «Почему мобильные веб приложение такие медленные?», которая уже засветилась на Хабре через другой пост: «HTML5 в мобильной разработке — что выбрать?».

Перевод поста «Your App Is Slow Because Our World Is Ending»

image
Как обычно, на этой неделе, исследуя Интернет, я наткнулся на взрывающий мозг пост, который возможно станет предвестником роковых событий. Я имею ввиду превосходную статью Дрю Кроуфорда «Почему мобильные веб приложение такие медленные?». Она объемная и очень содержательная, но с ней определенно стоит ознакомиться, если ваш уровень познаний находится на достаточно высоком уровне, чтобы проследить за идеей автора.

Если кратко, то его идея звучит приблизительно так: HTML5 приложения будут значительно уступать родным приложениям не только следующие год или два, но и в течение следующих 5-10 лет, вследствие существенных технических ограничений, присущих у мобильных платформ. У меня было пару замечаний к некоторыми из его аргументов, но он убедил меня, что две статьи, которые я написал два года назад, в которых я призываю IOS к сборке мусора и утверждают, что HTML5 будет править всем через несколько лет, возможно, должны быть пересмотрены в свете новых доказательств.
Читать полностью »

в 10:14, , рубрики: canvas, html5, javascript, метки: , ,

Не так давно, для одного проекта потребовалось написать карту, которая будет отвечать следующим требованиям:

  • Плавная прокрутка
  • Подгрузка областей карты

Мне пришлось потратить несколько дней на то, чтобы определиться в том, как лучше всего решить данную задачу.
В итоге я остановился на canvas.
Я потратил долгое время на поиски в интернете аналогичных решений, но к моему удивлению ничего подобного не нашлось.
В результате я решил написать все сам, с нуля.
К сожалению первая версия оказалась тормознутой слишком медленной, движения карты, в некоторых браузерах, были скачкообразными.

В новой версии я учел все ошибки, и в итоге мне удалось добиться того, что карта соответсвовала заявленным требования.
Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js