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

Доброго времени суток, читатели.

На днях решил проверить свои знания в JavaScript и написать аудиоплеер. Как по мне, результат получился хорошим, и я решил поделиться им с вами. Скажу сразу что это было сложновато с моими начальными знаниями js и jQuery. Перейдём сразу к делу.

Для начала создадим страницу, где будет сам плеер.

1. Добавим в массив названия всех файлов, которые лежат в папке music

<?php 
$files = glob('music/*');
?>

2. Подключим к нашей странице jQuery и jQuery UI (для слайдера), а так же я подключил bootstrap иконки, чтобы не мучиться и не искать подходящие иконки по всему интернету.
Читать полностью »

В ASP.NET MVC метаданные — атрибуты, описывающие поля модели, используются как при генерации разметки (вывод названия поля, его заполнителя и т.д.), так и при валидации данных (вывод правил валидации). Условно можно выделить 2 вида валидации:

  • клиентская валидация
  • серверная валидация

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

в чем собственно проблема ?

При использовании классического подхода к генерации разметки все работает автоматически, но что если мы используем ajax и формируем html разметку динамически на клиенте? В этом случае автоматически ничего не добавится в разметку. Можно конечно же все необходимое добавить вручную и казалось бы проблема исчерпана, но здесь встает проблема дублирования кода, так как одни и те же данные приходится описывать дважды — на сервере и на клиенте, что в свою очередь влечет другие проблемы. В ряде случаев динамическая разметка очень удобна, но здесь встает вопрос о выводе метаданных модели и валидации данных на стороне клиента. Об этом речь пойдет далее.

Итак, необходимо реализовать автоматический вывод метаданных модели MVC на клиентскую сторону и ненавязчивую валидацию.
Читать полностью »

AngularJs. Отложенная загрузка модулейAngularJs – великолепный фреймворк для разработки web-приложений. Разработка бизнес-логики приложения полностью отделена от сопутствующей суеты вокруг DOM. Angular модульный – это замечательно, но так же является источником проблемы. Количество модулей быстро растёт. И если директивы ещё можно упаковывать в отдельные пакеты типа angular-ui, то с контроллёрами бизнес-логики всё сложнее. Всё становится ещё хуже, когда требования безопасности в принципе запрещают загрузку на клиента контроллёров с бизнес-логикой, которые недоступны текущему пользователю. При развитой ролевой системе доступа к приложению масштаб проблемы становится очевиден.
Читать полностью »

В современной разработке ваш код сильно отличается от кода на «боевом» сервере (production) после компиляции, минификации, объединения и разных оптимизаций. Тут-то и вступают в игру карты кода (source maps), показывая точное соответствие элементов готового рабочего кода проекта и вашего кода разработки. В этом вводном уроке мы возьмём простой проект и запустим его с помощью различных компиляторов JavaScript с целью посмотреть работу карт кода в браузере.
Читать полностью »

Все привет.

Была у меня недавно такая задачка. Мне надо было сделать небольшое веб-приложение, которое должно было помочь работе врача. Use-Casе‘ов там не много, посмотреть кто сегодня записан на прием, возможность посмотреть историю болезни, занести новые данные и создать нового пациента. Делов то…

Времени у меня было много, спешить некуда. Сначала подумал спрограмить по быстрому на GWT + SmartGWT, но подумалось мне, что пора бы что нибудь новое посмотреть. К тому же были явные намеки, что появятся мелкие заказы подобного рода, для библиотек там всяких и мелких фирмочек. Хотелось нечто простое с одной стороны, но в тоже время достаточно мощное.
Читать полностью »

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

К сожалению, во втором случае обычного времени показа титров бывает недостаточно. Удлинить его можно во многих программах (например, в SubtitleEdit) — но иногда это удлинение ограничено разумными пределами, да и запускать для такого простого действия полноценный редактор не всегда удобно.

Поэтому я попробовал написать простые скрипты только под эту нужду и выбрал два принципа удлинения времени.Читать полностью »

Введение.

Продолжая тему веб-разработки мобильных сайтов и приложений под мобильные устройства нельзя не затронуть такую тему как Фреймворки для манипуляции DOM и отправкой асинхронных запросов.
Стандартом на десктопе уже давно стал jQuery, но он никуда не годится для разработки под мобильную платформу. Давайте посмотрим, как jQuery дружит с мобильными устройствами.

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

Наш отдел владеет десятком внешних и внутренних сайтов, возраст некоторых почти 10 лет. Будем описывать задачи, которые возникают в процессе поддержки и развития таких ресурсов, пути решения, и рассказывать про новые фишки. Например, как не поделиться ссылкой на новогоднюю гирлянду в начале мая ;)

Конечно, одна из основных задач — это помогать пользователям заполнять наши волшебные кредитные анкеты c Железным человеком, но бывают и вполне земные задачи.
Читать полностью »

Как часто Вы используете конструкции вида «5 минут назад», «Полчаса назад» на вашем сайте? А что если пользователь открыл вкладку и забыл про нее на пару часов? «5 минут назад» явно теряет свою актуальность.
Именно для того чтобы исправить это досадное недоразумение служит uptodate.js

image

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

Начиная работать в IntelliJ IDEA, обнаружил отсутствие удобной комбинации клавиш, которой пользуюсь в Eclipse — Ctrl+Alt+Up. По этой комбинации выделенный блок текста или строка, копируется вверх с перемещением курсора в начало скопированного блока.
В Idea есть действие по умолчанию на Ctrl+D, которое копирует блок вниз (Ctrl+Alt+Down в Eclipse), но невозможно добавить аналогичное действие вверх. После гугления, был задан вопрос в Q&A, оставшийся без ответа. Заведён issue на jetbrains. Все эти действия не дали ответа, поэтому решено было написать небольшой плагин для Idea.
Читать полностью »


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