Архив рубрики: JavaScript

Цветной вывод в отладочную консоль браузера

Метод console.log достаточно популярен у пишущих на JavaScript — он позволяет выводить отладочную информацию, справляясь как со скалярными данными, так и с объектами.

Недавно выяснил, что иногда console.log ведёт себя подобно функции printf из си-подобных языков: первый свой аргумент воспринимает как описание формата, где ищет начинающиеся с процента последовательности, а выводимые по описанному формату данные начинаются со второго аргумента. Так, например,

console.log('%d', 77/64)

выведет целое число 1, а

console.log('%f', 77/64)

выдаст 1.203125, что получилось бы и без '%f'. При этом бо́льшая часть знакомых по Си или Перлу форматов вообще не работает — встретив такое, console.log посчитает первый аргумент обычной строкой, которую надо вывести — так

console.log('%x', 48879)

выведет %x 48879 вместо ожидаемого слова beef.

Но зато у console.log нашёлся формат %c, позволяющий применить к выводимому тексту стили, заданные вторым параметром — так можно раскрашивать вывод

Пример использования — codepen.io/jscottsmith/pen/VLzMLo

Простая drag’n’drop-передача файлов в перловое приложение на Mojolicious::Lite

Хочу упростить загрузку файлов пользователем на некоторые сайты, сделанные на Mojolicious::Lite — нужна обработка нескольких файлов за раз плюс поддержка drag and drop — это удобно, когда надо загрузить несколько файлов, которые в проводнике файловом менеджере либо просмотрщике картинок отображаются не рядом.

Естественно, ищу готовые примеры, чтоб не изобретать велосипед. Нашёл два:

  • Один из них красивый и работает (надо брать!), но примеры серверной части для него — не на перле. Понятно, что можно взять имеющиеся примеры (на пхп и питоне) и перевести их. Либо погуглить тщательнее.
  • Другой — маленький и простой, и даже конкретно под Mojolicious::Lite, но не работает, потому как был написан во времена, когда автор активно пилил Моджолишес, не обращая внимания на обратную совместимость — мне уже приходилось сталкиваться с необходимостью допиливания старых приложений, которые не взлетали на новом Моджо. Пара взмахов напильником — и оно заработало.

Pull request

Попутно выяснилось, что в клиентской части можно даже без jQuery обойтись — оно способно работать на голом JavaScript.

Четверть гигабайта

Чего только нет в редакторе Komodo Edit! По сравнению с могучей Komodo IDE нет отладчика, нет профилировщика, нет модульного тестирования, нет интерфейса к системам контроля версий… А весит всё равно дофига!

Komodo Edit

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

Statt zu schlafen

Учёт домашних доходов с расходами — сплошное расстройство. Теперь вот вместо того, чтоб спать, пытаюсь вспомнить, что же умею делать за деньги, потому что на одну зарплату прокормить семью вообще нереально.

Могу:

  • Программировать на Перле — как древние CGI-приложения и прочее легаси, так и современные, с использованием фреймворков Mojolicious, Dancer, Catalyst.
  • Программировать на PHP: в основном допиливать существующие приложения, а не писать с нуля что-то большое. Могу писать с нуля что-то мелкое с фреймворком Slim.
  • Настраивать CMS Drupal и WordPress, а также дорабатывать их темы оформления.
  • Настраивать и дорабатывать Open Journal Systems, включая реализацию многоязычности имён — делал это в OJS 2.4.2, 2.4.7.1, 2.4.8.1, думаю, и в Open Conference Systems смогу реализовать.
  • Кроссбраузерно верстать веб-страницы, применять адаптивный дизайн, грамотно использовать возможности HTML5 и CSS3.
  • Немножко программировать на Руби (в том числе, с использованием Ruby on Rails) — наверное, на юниорском уровне.
  • Немножко программировать на ЯваСкрипте — как голый JavaScript, так и с jQuery. Совсем чуть-чуть — nodejs, Angular, Vue.
  • Писать тесты на перле, пхп и руби.
  • Постоянно внушать коллегам необходимость использования багтрекера и системы контроля версий.
  • (хоть и не считаю это основными профессиональными навыками) фотографировать, петь, аккомпанировать на шестиструнной гитаре, преподавать, водить легковой автомобиль, быть Дедом Морозом, штурманом и инструктором по водному туризму, набирать ноты в MuseScore и LilyPond и тексты с формулами в TeX — медленно, но красиво.

1000 рублей

Хочу от 15 USD / 1 kRUB в час.


  1. Statt zu schlafen (нем.) — вместо того, чтобы спать
  2. Резюме — http://shoorick.ru/cv

Всюду яваскрипт

Что-то стало модно всё подряд писать на яваскрипте. Куда ни глянь — всюду JavaScript, даже за пределами веба. Генератор карт TileMill — на яваскрипте. Текстовые редаторы и IDE теперь тоже на нём же пишут. Потому-то современные редакторы, наверное и тормозят — у них ведь помимо редактора ещё целый браузер внутри! У Komodo Edit и Komodo IDE — Mozilla Firefox, у Атома и Visual Studio Code — Chromium.

ls ~/bin/komodo/lib/mozilla

Интерактивная карта Ильменки

На сайте Ильменского фестиваля теперь используется правильная карта — её можно двигать и масштабировать, включать отображение нужных маркеров и кликать по ним, чтоб получить подсказку.

Карта

Карта — OpenStreetMap, стиль отображения — свой собственный на основе OSM Bright, отрисованный с помощью TileMill, иконки — The Map Icons Collection. Библиотека для отображения — Leaflet c плагинами Leaflet-hash и Leaflet.fullscreen.

Схема с ёлками, если кому-то всё-таки нужна, спрятана под ссылкой, чуть ниже карты. Кроме того, при клике на кнопку с ромбами можно включить наложение этой схемы на карту.

Округление вместо сдвига

Интересный способ округления увидел сейчас в http://3site.eu/examples/snow/snow.js — для этого там используется сдвиг:

style.left = ((random() * offsetWidth) >> 0) + "px";

Проверил — так и есть:

5 / 2      == 2.5
5 / 2 >> 0 == 2

Но в чём смысл? Сэкономить буквы, отказавшись от Math.floor?