[Виджет] RangeSlider

Разработка дополнительных модулей, подключение различных приложений.

Модератор: immortal

Аватара пользователя
nick7zmail
Сообщения: 7573
Зарегистрирован: Пн окт 28, 2013 8:14 am
Откуда: Екатеринбург
Благодарил (а): 121 раз
Поблагодарили: 2010 раз

[Виджет] RangeSlider

Сообщение nick7zmail » Пт апр 08, 2016 7:19 pm

Как я уже говорил в МД используется библиотека JQueryMobile, но не все её фичи представлены в стандартной комплектации МД. Как раз в этом видео я показывал пример рэнжслайдера. Недавно мне он понадобился...но воткнув его код в html-блок, секунд через 10 после загрузки меню он почему-то распадался на 2 разных слайдера. Попробовал закинуть в модуль - всё норм стало. Вдруг кому пригодится моё решение.

Получается что-то типа этого:
скрин.jpg
скрин.jpg (5.73 КБ) 7591 просмотр
Гораздо удобнее и нагляднее двух элементов "плюс-минус".

Модуль на гитхабе
Скачиваете zip-чик, распаковываете в htdocs, заходите в модули, ищите widget_rangeslider, тыкаете на него, и нажимаете install module...собственно всё, модуль установлен. Строка вызова длинноватая получилась...

Код: Выделить всё

[#module name="widget_rangeslider" obj="ThisComputer" prp1="prp1" prp2="prp2" step=".1" val="SLD" min="5.3" max="10.2"#]   
Параметры, думаю, все понятны. ThisComputer-объект, prp1, prp2 - свойства объекта, step - шаг регулирования, val - надпись, min, max - минимальное и максимальное значение.

В функционале не на 100% уверен, но вроде работает. Проверено с целыми и с дробными числами. С внешним видом чуть позже разберусь, если получится. А то он как то разъехался немного, по сравнению с демкой.

В маркете он врят ли появится...но, думаю, Сергей включит его в список стандартных элементов меню со временем.
За это сообщение автора nick7zmail поблагодарил:
Logrus (Вс сен 15, 2019 2:44 pm)
Рейтинг: 1.16%
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
:arrow: Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Аватара пользователя
sergejey
Site Admin
Сообщения: 4284
Зарегистрирован: Пн сен 05, 2011 6:48 pm
Откуда: Минск, Беларусь
Благодарил (а): 75 раз
Поблагодарили: 1559 раз
Контактная информация:

Re: Виджет RangeSlider для меню

Сообщение sergejey » Пн апр 11, 2016 11:02 am

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

Сергей Джейгало, разработчик MajorDoMo
Идеи, ошибки -- за предложениями по исправлению и развитию слежу только здесь!
Профиль Connect -- информация, сотрудничество, услуги
Аватара пользователя
nick7zmail
Сообщения: 7573
Зарегистрирован: Пн окт 28, 2013 8:14 am
Откуда: Екатеринбург
Благодарил (а): 121 раз
Поблагодарили: 2010 раз

Re: Виджет RangeSlider для меню

Сообщение nick7zmail » Пн апр 11, 2016 3:14 pm

sergejey писал(а):Спасибо, на самом деле имеет смысл включить его в список стандартных элементов. В ближайшее время разберусь с модулем и перенесу в стандартные.
Да там разбираться то особо на надо. По факту это 2 обычных слайдера. Движком jquery они в один соединяются. То есть просто 2 привязанных свойства будет, а остальные настройки как у обычного слайдера. Я его ещё на скорую руку сляпал...без таймаутов и т.п. То есть если медленно тащить его по всем значениям - он засирает канал ajax-запросами. В системе же в случае с обычными слайдерами - вроде ожидается конец перемещения, потом только формируется запрос. Это явно правильнее)) Хотел потом дописать этот таймаут, но если в системе появится, думаю до этого даже не дойдет).
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
:arrow: Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Аватара пользователя
sergejey
Site Admin
Сообщения: 4284
Зарегистрирован: Пн сен 05, 2011 6:48 pm
Откуда: Минск, Беларусь
Благодарил (а): 75 раз
Поблагодарили: 1559 раз
Контактная информация:

Re: Виджет RangeSlider для меню

Сообщение sergejey » Пн апр 11, 2016 5:07 pm

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

Сергей Джейгало, разработчик MajorDoMo
Идеи, ошибки -- за предложениями по исправлению и развитию слежу только здесь!
Профиль Connect -- информация, сотрудничество, услуги
Аватара пользователя
slgeo
Сообщения: 551
Зарегистрирован: Чт фев 05, 2015 2:35 pm
Откуда: РнД
Благодарил (а): 139 раз
Поблагодарили: 74 раза

Re: Виджет RangeSlider для меню

Сообщение slgeo » Вт апр 12, 2016 1:48 am

А расскажите, в каких случаях он применим?
Raspberry Pi2 Model B + NRF24L01 (MySensors) + 1-Wire + Esp8266 (WiFi-IoT)
CONNECT
Аватара пользователя
nick7zmail
Сообщения: 7573
Зарегистрирован: Пн окт 28, 2013 8:14 am
Откуда: Екатеринбург
Благодарил (а): 121 раз
Поблагодарили: 2010 раз

Re: Виджет RangeSlider для меню

Сообщение nick7zmail » Вт апр 12, 2016 5:18 am

slgeo писал(а):А расскажите, в каких случаях он применим?
К примеру когда нужно выставить диапазон температур на какое либо действие. Очень наглядно.
Диапазон любых других датчиков - шум, освещение и т.п.
Видел на форуме пользовались 2мя элементами "плюс минус" один для максимальной, второй для минимальной. Во первых тыкать запаришься, если диапазоны большие особенно, а шаг - 0,1, во-вторых логику можно сломать, если максимальную выставишь меньше минимальной. Слайдер такого не даст.

Отправлено с моего Xperia Z через Tapatalk
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
:arrow: Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Аватара пользователя
nick7zmail
Сообщения: 7573
Зарегистрирован: Пн окт 28, 2013 8:14 am
Откуда: Екатеринбург
Благодарил (а): 121 раз
Поблагодарили: 2010 раз

Re: Виджет RangeSlider для меню

Сообщение nick7zmail » Вт апр 12, 2016 10:18 am

sergejey писал(а):Пока вижу одну сложность -- добавление второго связанного свойства, что сейчас не предусмотрено. Подумаю...
Идея...не уверен, что правильная, но пока кажется логичной.

В общем механизм такой - создаём 1 обыкновенный слайдер в меню, за ним создаём второй слайдер - и у него в настройках пункт - "Объединить с предыдущим (слайдер для диапазона)" (что-то по типу как у кнопки - "Расположить на уровне предыдущего"). Ставишь галочку - они заключаются в общий <div>

Код: Выделить всё

<form>
    <div data-role="rangeslider">
        <label for="range-1a">Rangeslider:</label>
        <input type="range" name="range-1a" id="range-1a" min="0" max="100" value="40">
        <label for="range-1b">Rangeslider:</label>
        <input type="range" name="range-1b" id="range-1b" min="0" max="100" value="80">
    </div>
</form> 
А параметры становятся недоступны для редактирования (сливаются с предыдущим) кроме привязанного свойства. Таким образом на выходе меню должен рэнжслайдер нормальный получится, и у каждого свой объект будет. Осталось понять - как он должен найти именно тот слайдер, с которым "слиться")). Как вариант - ручной выбор из выборки слайдеров.
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
:arrow: Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
kymasya
Сообщения: 63
Зарегистрирован: Сб апр 25, 2015 2:14 pm
Благодарил (а): 7 раз
Поблагодарили: 5 раз

Re: Виджет RangeSlider для меню

Сообщение kymasya » Вс янв 15, 2017 12:56 pm

А ака дергать метод связанного объекта при изменении слайдера?
Аватара пользователя
nick7zmail
Сообщения: 7573
Зарегистрирован: Пн окт 28, 2013 8:14 am
Откуда: Екатеринбург
Благодарил (а): 121 раз
Поблагодарили: 2010 раз

Re: Виджет RangeSlider для меню

Сообщение nick7zmail » Вс янв 15, 2017 2:03 pm

kymasya писал(а):А ака дергать метод связанного объекта при изменении слайдера?
Просто связать изменяемое свойство, и любой метод этого объекта.
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
:arrow: Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
kymasya
Сообщения: 63
Зарегистрирован: Сб апр 25, 2015 2:14 pm
Благодарил (а): 7 раз
Поблагодарили: 5 раз

Re: Виджет RangeSlider для меню

Сообщение kymasya » Ср апр 26, 2017 9:59 am

Дергаю ползунки - а свойства не меняются!(
Ответить