• Простой загрузчик изображений в tinyMCE для веб приложении на MVC

      Развитие моего проекта потребовало «прикрутить» в редактор на основе tinyMCE возможность вставлять изображения, которые хранились бы непосредственно на сервере приложения, и что бы это было бесшовно для конечного пользователя. Погуглив совсем немого и найдя все полезное как всегда на stackoverflow.com и изучив все что есть на сегодняшний день по этой теме, я понял, что придется изобретать свой велосипед. Основные мои мотивы были следующие:
      Практически все «готовые» открытые реализации используют файловый принцип хранения, когда пользователь загружает сначала файл на сервер, в область хранения, а затем вставляет его в редактор. В итоге получается довольно сложный процесс, и кроме этого, сервер приложения рискует превратиться в файл помойку. Второй мотив — все решения были достаточно сложны и тяжелы. Например, некоторые из них использовали компоненты silverlight, другие тащили за собой кучу внешних зависимостей. В общем, моя цель: написать простой, легкий загрузчик изображений для tinyMCE который работает на MVC. (я думаю, что это будет справедливо для любого движка MVC а не только ASP.NET). В этой статье я расскажу, как просто написать свой загрузчик и плагин для tinyMCE.

      Читать дальше →
      • +6
      • 18.6k
      • 2
    • Gremlins.js — monkey testing библиотека для веб приложений

      • Translation
      • Tutorial
      NPM version

      Это первая из двух статей, рассказывающая о тестировании с помощью gremlins.js и grunt-gremlins. Первая статья — перевод официальной документации gremlins.js. Вторая — опыт внедрения gremlins.js в реальный проект при помощи grunt-gremlins.

      Gremlins.js это monkey testing библиотека написанная на JavaScript, для Node.js и браузеров. С ее помощью проверяется надежность веб-приложений под полчищем гремлинов.

      Kate: What are they, Billy?
      Billy Peltzer: They're gremlins, Kate, just like Mr. Futterman said.


      image
      Читать дальше →
    • nginx — строим свой letitbit

        Появилось желание сделать сервис подобный letitbit.net в отдельно взятой стране на окраине Европы.
        Требовалось:
        • позволять загружать/отдавать большие файлы;
        • не позволять перепубликовывать прямые ссылки на файлы;
        • ограничивать количество одновременно скачиваемых файлов.

        Для реализации выбрали NGINX в связке с PHP через fastcgi.
        В NGINX добавили:
        1. великолепный Nginx upload module, который позволяет избежать многократное копирование загруженного файла на пути NGINX-PHP. К тому же, при небольшой доработке, возможна загрузка сразу в нужную папку, что позволяет использовать простое переименование вместо копирования в PHP
        2. нужную заплатку к модулю secure_link, позволяющую делать безопасные ссылки действительными ограниченное время

        PHP взяли самый обычный и запустили через spawn-fcgi.
        Поставили сервачок, напихали туда штук 12 терабайтных дисков.
        Программист написал PHP код, а Марис Рускулис придумал следующий трюк с rewrite для NGINX, позволяющий избежать обращение к PHP при скачивании файла.
        В результате, конфигурация NGINX выглядела примерно так:
        http {
        limit_zone regular $zonekey 10m;
        limit_zone premium $zonekey 10m;
        server {
        root /www/oursiteishere;
        location / { try_files $uri @files; }
        location ~ \.php$ { try_files $uri @files; fastcgi_stuff_here; }
        location @files { rewrite ^(.*)$ /index.php?$1 last; }
        location /storage/ { root /storages/; internal; }
        # Location for regular users
        location ~ /download/.+/(.+)/0/.+/.*/(.+)$ {
        set $fname $2;
        set $username $1;
        set $zonekey "$binary_remote_addr $username";
        limit_conn regular 1;
        limit_rate '100k';
        secure_link_secret megasecret;
        secure_link_ttl on;
        if ($secure_link = "") { return 403; }
        add_header Content-Disposition "attachment; filename*=UTF-8''$fname";
        rewrite ^/download/([a-f0-9]+)/([\.~0-9a-zA-Z_]+)/([01])/([0-9]+)/(.+)/.+$ /storage/$4/$5 break;
        }
        # Location for premium users
        # Location for upload using upload module
        }
        }

        Замечательной вещью в данном конфиге является тот факт, что при скачивании файла по сгенерированной защищённой от подмены временной ссылке (проверку осуществляет secure_link) не вызывается PHP с последующим X-Accel-Redirect.
        Возможно, данное решение накладывает ограничение на присутствие логики перед непосредственной отдачей файла, но тем не менее, на мой взгляд, является довольно оригинальным трюком, позволяющим немного сэкономить на fastcgi.
      • Изоморфный JavaScript — будущее веб-приложений

        • Translation
        В компании Airbnb мы многому научились за последние несколько лет, создавая мощные веб-приложния. Мы погрузились в мир одностраничных приложений в 2011 г., делая мобильную версию нашего сайта, с тех пор, кроме прочего, мы запустили Wish Lists и новый поиск. Все это — большие JavaScript приложения, что означает то, что тонны кода запускаются в браузере, чтобы обеспечить современный интерактивный пользовательский опыт.

        Это обычный подход сегодня, когда такие библиотеки, как backbone.js, ember.js и angular.js помогают разработчикам создавать мощные JavaScript приложения. Мы поняли, однако, что такие приложения имеют несколько критических ограничений. Чтобы стало понятно, давайте предпримем небольшой тур по истории веб-приложений.

        Картинка из статьи для привлечения внимания

        Читать дальше →
      • wysiwyg своими руками

          Существует куча платных\бесплатных визуальных редакторов на любой вкус и цвет. Но что, если они работают не во всех браузерах, Вас не устраивает дизайн или функциональность, или просто душа лежит к написанию своего собственного? Ответ на вопрос, как это сделать —
          Читать дальше →
        • Подсветка текста в «TextArea»

            Эта статья покажет, как в современных браузерах можно сделать подсветку текста в поле редактирования (WYSIWYG).
            Пример можно посмотреть, в google.docs или на некоторых продвинутых форумах.

            Уверен, многим это будет интересно.

            Атрибут contentEditable и параметр designMode


            Именно contentEditable или designMode и делает для нас всю основную «грязную» работу.

            Если этот атрибут поставить в тег, то всё, что внутри тега, становится автоматически редактируемым.

            <html><head></head><body>
              <div contentEditable="true"><b>C</b>ontent<u>!!!</u></div>
            </body></html>
            работающий пример

            Этот атрибут не поддерживается сейчас некоторыми старыми браузерами (например, FireFox 2.0). Но есть более «глобальный» параметр страницы, который сейчас поддерживают все браузеры, который нам может помочь —
            designMode
          • Руководство по оформлению HTML/CSS кода от Google

            • Translation

            От переводчика


            С удовольствием ознакомился с этими рекомендациями и теперь предлагаю вам перевод.

            Введение


            Это руководство описывает правила для оформления и форматирования HTML и CSS кода. Его цель — повысить качество кода и облегчить совместную работу и поддержку инфраструктуры.

            Это относится к рабочим версиям файлов использующих HTML, CSS и GSS

            Разрешается использовать любые инструменты для минификации компиляции или обфускации кода, при условии, что общее качество кода будет сохранено.
            Читать дальше →
          • LESS: программируемый язык стилей

            Я не люблю CSS. Он простой и понятный. Это движущая сила Интернета, но он слишком ограниченный и им трудно управлять. Пришло время привести этот язык в порядок и сделать его более полезным, используя динамический CSS при помощи LESS.
            Объясню свою позицию на примере. Почему бы вместо использования #FF9F94 для получения темно-персикового цвета просто не хранить значение этого цвета в переменной для её последующего использования? Что бы перекрасить сайт достаточно будет изменить значение переменной всего в одном месте и всё.
            Другими словами: это будет очень изящно, если мы будем использовать немного программирования и логики в CSS, что бы сделать его более мощным инструментом. Хорошо, что это всё возможно с использованием LESS.
            Так что же такое LESS?
          • Учимся писать в информационном стиле

              По работе я пишу тексты: посты на хабр, email-рассылку, статьи в СМИ. Пишу уже пару лет, последние полгода не меньше двух текстов в неделю. Значительным шагом в развитии моего навыка письма было открытие для себя информационного стиля и советов Максима Ильяхова.

              Цель текста в информационном стиле — донести информацию до читателя. Информационный стиль: лаконичный, однозначный, точный и объективный. В информационных текстах нет лишних слов, эмоций, личного мнения. Они читаются легко и быстро.

              Максим вводит понятие стоп-слов. Стоп-слова не характерны для текстов в информационном стиле и если вы встретили его — задумайтесь и перефразируйте это место. Стоп-слова это «кстати», междометия, модальные глаголы, отглагольные существительные и другие, всего около 100.

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


              Читать дальше →
            • Инструменты прототипирования и создания wireframes

                Навеяно долгими поисками различных систем прототипирования и желанием поделиться этим опытом. В данном посте отсутсвуют сложные системы типа iRise или IBM Rational Rose, ввиду того что они являются не столько и далеко не только системами простого прототипирования, да и стоимость этих решений подходит предприятиям немалого маштаба. Этот пост о чем-то более земном.

                Читать дальше →
              • Самодельная эргономичная клавиатура CatBoard ][



                  CatBoard — это самодельная эргономичная компактная клавиатура с открытым исходным кодом, имеет множество нестандартных решений, таких как: нестандартная аппаратная раскладка со стандартными клавиатурными сочетаниями; быстрый автоповтор нажатой клавиши; Fn слой с клавишами управления курсором, цифровым блоком, функциональными клавишами; отдельные клавиши переключения раскладок; более удобное расположение Ctrl и Shift; отдельную кнопку AltTab; режим совместимости с Macintosh, позволяющий работать на нём точно так же, как и на PC; возможность прошивки без дополнительного оборудования; возможность устанавливать поверх ноутбучной клавиатуры. Благодаря открытому коду, с клавиатурой можно делать что угодно, новая прошивка заливается в считанные секунды, поэтому экспериментировать можно прямо на ходу.
                  Читать дальше →
                • Человеческий парсер на Selenium WD



                    Начало


                    И вот пришла моя очередь покупать автомобиль. Как это делают ребята с работы я видел. Заходят на сайт и следят за предложениями, ну кто постарше покупает газету и просматривает объявления. Все это однообразно и отвлекаться на сиденье, исследование и нажатие по ссылкам не хотелось. Хотелось просто что бы кто то делал это за меня, таких людей не нашлось. Значит надо было заставить делать все это компьютер.
                    Читать дальше →
                  • Как бороться с низкокачественными Android приложениями

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

                    Но каждый день выходят новые приложения с дизайном из iOS, темами из 2.3, не адаптированные для планшетов и с размытыми картинками на HD-экранах. И в этом виноват не Google, а разработчики. Кто-то не пытается спорить, когда заказчик присылает макеты от iOS версии, кто-то пытается, но сдается. Кто-то разрабатывает приложение ради опыта, откладывая «неважное» на потом, и так оно и остается. Стартапы делают приложения «за день», а потом лихорадочно фиксят баги, создавая снежный ком, который уже никто не перепишет с нуля. Крупные социальные сети, имея деньги и время, каким-то образом умудряются выпускать ужасные клиенты…
                    Читать дальше →
                  • Несколько полезных шаблонов для Android-разработки под eclipse

                      Вступление


                      Привет, коллеги.

                      Сегодня я хочу поделиться с вами несколькими полезными шаблончиками (templates) для IDE Eclipse, которые помогут вам ускорить некоторые рутинные операции при разработке под Android. Я пока что использую Eclipse для разработки, но, я уверен, что Idea позволит создавать совершенно аналогичные шаблоны.

                      Что такое шаблоны? Это заранее заготовленные кусочки кода, которые IDE может быстро подставлять для вас при нажатии на Ctrl+Space. Например, введите «syso» в eclipse, нажмите Ctrl+Space. Бац, у вас появился System.out.println(), или «fore» — у вас появится готовый шаблон для цикла for each. Более того, данные кусочки параметризированы, и IDE предложит вам ввести имена для нужных переменных.

                      Если вам это интересно, приступим.
                      Читать дальше →
                    • Ubuntu ui toolkit на Ubuntu Touch и Android



                        Хотелось бы рассказать об опыте запуска приложения написанного с использованием Ubuntu ui toolkit на платформах Ubuntu Touch и Android. Для теста я использовал приложение из прошлой статьи. Тулкит находиться в стадии разработки, для интересующихся текущим состоянием информация под катом.
                        Читать дальше →
                      • Как я не спал год или создание социального Android приложения

                        Доброго времени суток, уважаемые хабражители. Я работаю в большой IT компании Android-разработчиком.

                        Все началось примерно год назад. Тогда, я решил начать свой первый проект. Идея приложения пришла мне практически сразу. Ее первоначальная версия звучала примерно так — «Я хочу, чтобы каждый мог узнать независимое мнение людей всего мира, по интересующему вопросу».

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

                        В статье присутствуют цены на те или иные услуги сайтов с которыми мне удалось связаться.
                        Читать дальше →
                      • Основы верстки для нативных андроид приложений

                        В этом посте будут рассмотрены вопросы верстки при создании нативных приложений для android. Той верстки, которая описывается в xml файлах из директории res/layout/ Итак начнем:
                        Существует пять стандартных типов верстки:
                        • AbsoluteLayout
                        • FrameLayout
                        • LinearLayout
                        • RelativeLayout
                        • TableLayout

                        Дальше
                      • Простой каркас Android приложения


                        Самым сложным этапом в любом деле, пожалуй, является поиск точки старта. При создании приложений для android эту задачу приходится делить на несколько и определять, например, для каких версий android должно быть будущее приложение.
                        Не буду разводить демагогию и перейду к самой сути. Для создания, с Вашего позволения, стандартно-шаблонного приложения (левое слайдинг-меню, actionbar), которое будет одинаково смотреться как на android-2.2 так и на android-4 я предлагаю не изобретать велосипеды и использовать готовые решения actionbar-sherlock и sliding-menu.
                        В этой статье я нарочно опущу процесс установки среды разработки, но буду подразумевать, что разработка ведется в eclipse android sdk.
                        Читать дальше →
                      • Порождающие грамматики Хомского

                        • Tutorial

                        Небольшое предисловие


                        Этот текст является продолжением поста , в котором автор попытался как можно более просто и без сложных математических выкладок описать понятия формального языка и грамматики. На этот текст пришло достаточно много откликов и автор счел себя обязанным написать продолжение.

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

                        Читать дальше →
                      • Многопроцессовые демоны на PHP

                          Зачем может понадобиться писать демоны на PHP?
                          • Выполнение трудоемких фоновых задач;
                          • выполнение задач, которые длятся больше, чем время ожидания при HTTP-запросе (30 секунд);
                          • выполнение задач на более высоком уровне доступа, чем серверный процесс (читай — под рутом).

                          Читать дальше →