Планы

Новые релизы, обновления и т.п.

Модератор: immortal

Vit
Сообщения: 867
Зарегистрирован: Вт янв 17, 2012 12:31 pm
Благодарил (а): 121 раз
Поблагодарили: 76 раз

Re: Планы

Сообщение Vit » Вс мар 03, 2019 5:02 pm

пример плана кто нибудь киньте для тестов с объектами уже...

заранее спасибо
За это сообщение автора Vit поблагодарили (всего 3):
Taras81 (Вс мар 03, 2019 8:41 pm) • Molostov (Пн мар 04, 2019 12:00 am) • Chainik (Пн мар 04, 2019 8:06 pm)
Рейтинг: 4.11%
Chainik
Сообщения: 762
Зарегистрирован: Вс янв 10, 2016 11:05 am
Благодарил (а): 84 раза
Поблагодарили: 210 раз

Re: Планы

Сообщение Chainik » Пн мар 04, 2019 8:16 pm

А можно поинтересоваться в целях повышения образованности?
Можно ли с помощью svg-планов сделать анимацию (естественно, завязанную на свойства)?

Тут, правда, "гифки", но мысль, думаю, понятна.
Двери, окна, шторы, вентили и т.д.
СпойлерПоказать
6842794.gif
6842794.gif (180.79 КБ) 468 просмотров
Door_animation_home082815_01.gif
Door_animation_home082815_01.gif (80.16 КБ) 468 просмотров
LavishPreciousElephant-size_restricted.gif
LavishPreciousElephant-size_restricted.gif (264.28 КБ) 468 просмотров
Аватара пользователя
sergejey
Site Admin
Сообщения: 4263
Зарегистрирован: Пн сен 05, 2011 6:48 pm
Откуда: Минск, Беларусь
Благодарил (а): 74 раза
Поблагодарили: 1422 раза
Контактная информация:

Re: Планы

Сообщение sergejey » Вт мар 05, 2019 8:27 pm

Открываю рубрику "рецепты" :) Буду по возможности делиться собственными находками, как сделать то или иное с помощью планов. Призываю следовать примеру. Рецепты будем собирать ссылками в первом сообщении темы.

Начнём с простого интерактива -- выпадающее графическое меню. Хочу сделать так, чтобы по нажатию на один элемент, показывалась группа других элементов, у каждого из которых своё назначение.

Шаг 1. Делаем элемент-активатор в виде эллипса (это условно, каждый может свои делать разумеется) и называем его btnMenu1
Изображение
Его задача будет показывать/прятать меню

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

Шаг 3. Для красоты добавляем фон под меню и объединяем элементы меню в группу (кроме кнопки-активатора!)
Изображение
Группу вместе с фоном ставим на задний план, что б она не перекрывала кнопку-активатор.

Шаг 4. Ставим признак "Скрыть" для нашей группы
Изображение

Шаг 5. Финальный штрих -- добавляем скрипт отображения/скрытия группы по нажатию на кнопку-активатор:
Изображение
Это делается через заполнение настройки Интерактивность, пункта onClick и мини-сценария $('#groupMenu1').toggle(); -- этот сценарий переключает видимость группы groupMenu1, которую мы создали ранее.

Шаг 6. Пользуемся. Сохраняем SVG файл, загружаем в план и проверяем -- по клику на красный круг показывается "меню" с фоном и другими кружками. Можем теперь легко создавать состояния для элементов меню заставлять их управлять устройствами :)

Изображение

Таким образом, мы сделали интерактивный интерфейс средствами графического редактора :)
За это сообщение автора sergejey поблагодарили (всего 3):
cabat (Ср мар 06, 2019 9:42 am) • odinvolk (Чт мар 07, 2019 5:48 am) • Jilber (Чт мар 07, 2019 8:38 pm)
Рейтинг: 4.11%

Сергей Джейгало, разработчик MajorDoMo
Идеи, ошибки -- за предложениями по исправлению и развитию слежу только здесь!
Профиль Connect -- информация, сотрудничество, услуги
Аватара пользователя
sergejey
Site Admin
Сообщения: 4263
Зарегистрирован: Пн сен 05, 2011 6:48 pm
Откуда: Минск, Беларусь
Благодарил (а): 74 раза
Поблагодарили: 1422 раза
Контактная информация:

Re: Планы

Сообщение sergejey » Вт мар 05, 2019 9:08 pm

Рецепт -- показ элементов управления в зависимости от приближения.

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

Шаг 1. Создадим какой-то план в базовом слое. Будем считать это наш общий план и бирюзовый прямоугольник это какая-то комната.
Изображение

Шаг 2. Создадим ещё один слой, который будет содержать детальные элементы. Наша задача -- отображать этот слой только когда пользователь достаточно приблизит изображение. Для примера добавим пару элементов на этот слой.
Изображение

Шаг 3. Скроем верхний слой -- по-умолчанию он должен быть скрыт.
Изображение

Шаг 4. Сохраняем картинку в SVG и загружаем её в наш план. Обязательно включаем управление масштабом (иначе не будет работать пользовательское масштабирование)
Изображение
После сохранения мы увидим нашу картинку без слоя с деталями и увеличение нам ничего не покажет.

Шаг 5. Переключаемся на закладку "Дополнительный код JavaScript" и пишем туда следующий сценарий:

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

function checkZoomLevel() {
 var zoomLevel=panZoom.getZoom();
 if (zoomLevel>2) {
    $('#layer1').show();
 } else {
    $('#layer1').hide();
 }
 setTimeout('checkZoomLevel();',500);
}
setTimeout('checkZoomLevel();',500);
Этот сценарий раз в пол секунды проверяет текущий уровень увеличения и если он больше заданного порога (в данном случае 2х), то показывает слой с деталями, иначе скрывает его.

Шаг 6. Проверяем, что всё работает как надо :)

Изображение

Само собой, все элементы слоёв могут быть динамическими, но пока слой не показывается, то и элементы не будут отрабатывать события нажатия и т.п.
За это сообщение автора sergejey поблагодарили (всего 3):
cabat (Ср мар 06, 2019 9:41 am) • odinvolk (Чт мар 07, 2019 5:48 am) • Dicont (Пт мар 08, 2019 12:49 am)
Рейтинг: 4.11%

Сергей Джейгало, разработчик MajorDoMo
Идеи, ошибки -- за предложениями по исправлению и развитию слежу только здесь!
Профиль Connect -- информация, сотрудничество, услуги
Аватара пользователя
sergejey
Site Admin
Сообщения: 4263
Зарегистрирован: Пн сен 05, 2011 6:48 pm
Откуда: Минск, Беларусь
Благодарил (а): 74 раза
Поблагодарили: 1422 раза
Контактная информация:

Re: Планы

Сообщение sergejey » Вт мар 05, 2019 9:26 pm

khlon писал(а):
Сб мар 02, 2019 12:40 am
Ситуация не изменилась. Нет полей для ввода css и Js.
Или я что то не так делаю?
Всё так, сорри, это я файлы недогрузил. Сейчас исправил.
За это сообщение автора sergejey поблагодарили (всего 2):
khlon (Вт мар 05, 2019 10:13 pm) • odinvolk (Чт мар 07, 2019 9:54 pm)
Рейтинг: 2.74%

Сергей Джейгало, разработчик MajorDoMo
Идеи, ошибки -- за предложениями по исправлению и развитию слежу только здесь!
Профиль Connect -- информация, сотрудничество, услуги
odinvolk
Сообщения: 37
Зарегистрирован: Ср май 31, 2017 3:06 am
Откуда: odinwolk@gmail.com
Благодарил (а): 140 раз
Поблагодарили: 9 раз

Re: Планы

Сообщение odinvolk » Чт мар 07, 2019 9:51 pm

Vit писал(а):
Вс мар 03, 2019 5:02 pm
пример плана кто нибудь киньте для тестов с объектами уже...

заранее спасибо
https://github.com/odinvolk/OkBitScene ... /plans.svg
odinvolk
Сообщения: 37
Зарегистрирован: Ср май 31, 2017 3:06 am
Откуда: odinwolk@gmail.com
Благодарил (а): 140 раз
Поблагодарили: 9 раз

Re: Планы

Сообщение odinvolk » Чт мар 07, 2019 9:52 pm

Chainik писал(а):
Пн мар 04, 2019 8:16 pm
А можно поинтересоваться в целях повышения образованности?
Можно ли с помощью svg-планов сделать анимацию (естественно, завязанную на свойства)?

Тут, правда, "гифки", но мысль, думаю, понятна.
Двери, окна, шторы, вентили и т.д.
СпойлерПоказать
6842794.gif Door_animation_home082815_01.gif LavishPreciousElephant-size_restricted.gif
https://github.com/odinvolk/OkBitScenes ... Door01.svg
За это сообщение автора odinvolk поблагодарили (всего 2):
dengi.76 (Чт мар 07, 2019 10:16 pm) • Chainik (Чт мар 07, 2019 11:41 pm)
Рейтинг: 2.74%
Аватара пользователя
sergejey
Site Admin
Сообщения: 4263
Зарегистрирован: Пн сен 05, 2011 6:48 pm
Откуда: Минск, Беларусь
Благодарил (а): 74 раза
Поблагодарили: 1422 раза
Контактная информация:

Re: Планы

Сообщение sergejey » Чт мар 07, 2019 11:30 pm

Рецепт: Вращающийся элемент (вентилятор)

Шаг 1. Находим в интернете основную картинку для нашего элемента (желательно в формате SVG).
Для вентилятора я нашёл картинку здесь: https://www.onlinewebfonts.com/icon/566786
Изображение
Внизу есть ссылка для скачивания в формате SVG.

Шаг 2. Импортируем нашу картинку на план (напоминаю, редактируем план в редакторе Inkscape)
(Файл -> Импортировать)
Размер картинки будет большим, скорее всего, так что уменьшаем её до нужного размера с зажатым Ctrl (чтобы сохранялись пропорции)
Изображение

Шаг 3. Для красоты изменим цвет заливки с чёрного на синий (в нижней части редактора кликаем на нужный цвет в палитре)
Изображение

Шаг 4. Делаем круглую подложку
Выбираем инструмент эллипс, меняем цвет, рисуем, пермещаем вниз, чтоб он был под вентилятором.
С помощью инструмента "Выровнять и расставить" центрируем два элемента точно друг над другом (выделив их оба)
Изображение

Вообще подложка нам нужна для следующих вещей:
а) Для создания группы (см. ниже) -- без группы будет неправильно работать трансформация вращения элемента (это важно!)
б) Для расширения области нажатия -- без подложки нам надо было бы для реакции попадать во вращающиеся лопасти вентилятора
в) Для красоты :)

Шаг 5. Объединяем наши два объекта в группу и называем её понятным именем (например, ventOffice)
Изображение
(при желании мы можем сколько угодно дублировать эту группу, давая через свойства объекта другие имена)

Шаг 6. Загружаем изображение в наш план и создаём состояние следующего типа:
Изображение
В состоянии важно задать:
а) Элемент, к которому он относится (ventOffice)
б) Связанный объект и применяемое условие (устройство Вентилятор и его статус)
в) Стиль, который будет применяться в случае выполнения условия
г) Действие, которое будет выполняться при клике на элемент (переключение Вентилятора)

Шаг 7. Всё, радуемся красоте управления вентилятором

Изображение

(gif не очень хорошо передаёт плавность, но на самом деле оно довольно здорово выглядит)
За это сообщение автора sergejey поблагодарили (всего 2):
Chainik (Чт мар 07, 2019 11:41 pm) • Jilber (Чт мар 07, 2019 11:51 pm)
Рейтинг: 2.74%

Сергей Джейгало, разработчик MajorDoMo
Идеи, ошибки -- за предложениями по исправлению и развитию слежу только здесь!
Профиль Connect -- информация, сотрудничество, услуги
Chainik
Сообщения: 762
Зарегистрирован: Вс янв 10, 2016 11:05 am
Благодарил (а): 84 раза
Поблагодарили: 210 раз

Re: Планы

Сообщение Chainik » Пт мар 08, 2019 4:07 pm

Пробую повторить план с вентилятором. Не нашел стиля "Вращение".
Нет стиля Вращение.png
Нет стиля Вращение.png (6.25 КБ) 228 просмотров
Систему со всеми установленными модулями обновлял сегодня. Ветка мастер.

А в остальном вроде все работает.
Аватара пользователя
dengi.76
Сообщения: 113
Зарегистрирован: Вт фев 06, 2018 9:40 pm
Откуда: Пермь
Благодарил (а): 62 раза
Поблагодарили: 0

Re: Планы

Сообщение dengi.76 » Пт мар 08, 2019 4:21 pm

Здравствуйте. Попробовал воспроизвести у себя План с вентилятором - всё Отлично получилось, но вот при добавлении на сцену возникла проблема...,но по порядку. На сцене я создаю элемент HTML, создаю состояние Default и вбиваю туда код вентилятора. При попытке зайти на вкладку ПРОСМОТР/РЕДАКТИРОВАНИЕ получаю ошибку :Error
Details
http://192.168.1.30/admin.php?pd=cGFuZW ... ab=preview
1064: You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '' at line 1
SELECT * FROM plan_states WHERE PLAN_ID=
Backtrace
#0 C:\_majordomo\htdocs\lib\mysqli.class.php(396): custom_error->__construct('1064: You have ...', 0)
#1 C:\_majordomo\htdocs\lib\mysqli.class.php(185): mysql->Error('SELECT * FROM p...', 0)
#2 C:\_majordomo\htdocs\lib\mysqli.class.php(204): mysql->Exec('SELECT * FROM p...')
#3 C:\_majordomo\htdocs\lib\sqlFunctions.class.php(70): mysql->Select('SELECT * FROM p...')
#4 C:\_majordomo\htdocs\modules\plans\plans.class.php(229): SQLSelect('SELECT * FROM p...')
#5 C:\_majordomo\htdocs\modules\plans\plans.class.php(198): plans->getPreview(63)
#6 C:\_majordomo\htdocs\modules\plans\plans.class.php(98): plans->usual(Array)
#7 C:\_majordomo\htdocs\lib\jTemplate.class.php(713) : eval()'d code(8): plans->run()
#8 C:\_majordomo\htdocs\lib\jTemplate.class.php(713): eval()
#9 C:\_majordomo\htdocs\lib\jTemplate.class.php(195): jTemplate->parseModules('[#module name="...', NULL, '')
#10 C:\_majordomo\htdocs\lib\jTemplate.class.php(109): jTemplate->parse('[#module name="...', NULL, '')
#11 C:\_majordomo\htdocs\lib\objects.class.php(1123): jTemplate->__construct('inner_code', NULL)
#12 C:\_majordomo\htdocs\modules\scenes\scenes.class.php(1246): processTitle('[#module name="...')
#13 C:\_majordomo\htdocs\modules\scenes\scenes_edit.inc.php(815): scenes->getElements('SCENE_ID='63' A...')
#14 C:\_majordomo\htdocs\modules\scenes\scenes.class.php(832): require('C:\\_majordomo\\h...')
#15 C:\_majordomo\htdocs\modules\scenes\scenes.class.php(293): scenes->edit_scenes(Array, '63')
#16 C:\_majordomo\htdocs\modules\scenes\scenes.class.php(100): scenes->admin(Array)
#17 C:\_majordomo\htdocs\lib\jTemplate.class.php(713) : eval()'d code(8): scenes->run()
#18 C:\_majordomo\htdocs\lib\jTemplate.class.php(713): eval()
#19 C:\_majordomo\htdocs\lib\jTemplate.class.php(195): jTemplate->parseModules('...', Array, './templates/')
#20 C:\_majordomo\htdocs\lib\jTemplate.class.php(109): jTemplate->parse('...', Array, './templates/')
#21 C:\_majordomo\htdocs\lib\parser.class.php(93): jTemplate->__construct('./templates/pan...', Array, Object(panel))
#22 C:\_majordomo\htdocs\lib\parser.class.php(63): parser->jtemplate_parse('./templates/pan...', Array)
#23 C:\_majordomo\htdocs\modules\panel.class.php(192): parser->__construct('./templates/pan...', Array, Object(panel))
#24 C:\_majordomo\htdocs\admin.php(34): panel->run()
#25 {main}

Error
Details
http://192.168.1.30/admin.php?pd=cGFuZW ... ab=preview
1064: You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '' at line 1
SELECT * FROM plan_states WHERE PLAN_ID=
Backtrace
#0 C:\_majordomo\htdocs\lib\mysqli.class.php(396): custom_error->__construct('1064: You have ...', 0)
#1 C:\_majordomo\htdocs\lib\mysqli.class.php(213): mysql->Error('SELECT * FROM p...', 0)
#2 C:\_majordomo\htdocs\lib\sqlFunctions.class.php(70): mysql->Select('SELECT * FROM p...')
#3 C:\_majordomo\htdocs\modules\plans\plans.class.php(229): SQLSelect('SELECT * FROM p...')
#4 C:\_majordomo\htdocs\modules\plans\plans.class.php(198): plans->getPreview(63)
#5 C:\_majordomo\htdocs\modules\plans\plans.class.php(98): plans->usual(Array)
#6 C:\_majordomo\htdocs\lib\jTemplate.class.php(713) : eval()'d code(8): plans->run()
#7 C:\_majordomo\htdocs\lib\jTemplate.class.php(713): eval()
#8 C:\_majordomo\htdocs\lib\jTemplate.class.php(195): jTemplate->parseModules('[#module name="...', NULL, '')
#9 C:\_majordomo\htdocs\lib\jTemplate.class.php(109): jTemplate->parse('[#module name="...', NULL, '')
#10 C:\_majordomo\htdocs\lib\objects.class.php(1123): jTemplate->__construct('inner_code', NULL)
#11 C:\_majordomo\htdocs\modules\scenes\scenes.class.php(1246): processTitle('[#module name="...')
#12 C:\_majordomo\htdocs\modules\scenes\scenes_edit.inc.php(815): scenes->getElements('SCENE_ID='63' A...')
#13 C:\_majordomo\htdocs\modules\scenes\scenes.class.php(832): require('C:\\_majordomo\\h...')
#14 C:\_majordomo\htdocs\modules\scenes\scenes.class.php(293): scenes->edit_scenes(Array, '63')
#15 C:\_majordomo\htdocs\modules\scenes\scenes.class.php(100): scenes->admin(Array)
#16 C:\_majordomo\htdocs\lib\jTemplate.class.php(713) : eval()'d code(8): scenes->run()
#17 C:\_majordomo\htdocs\lib\jTemplate.class.php(713): eval()
#18 C:\_majordomo\htdocs\lib\jTemplate.class.php(195): jTemplate->parseModules('...', Array, './templates/')
#19 C:\_majordomo\htdocs\lib\jTemplate.class.php(109): jTemplate->parse('...', Array, './templates/')
#20 C:\_majordomo\htdocs\lib\parser.class.php(93): jTemplate->__construct('./templates/pan...', Array, Object(panel))
#21 C:\_majordomo\htdocs\lib\parser.class.php(63): parser->jtemplate_parse('./templates/pan...', Array)
#22 C:\_majordomo\htdocs\modules\panel.class.php(192): parser->__construct('./templates/pan...', Array, Object(panel))
#23 C:\_majordomo\htdocs\admin.php(34): panel->run()
#24 {main}
Но самое интересное в другом - у меня две сцены, и когда я добавляю вентилятор на вторую сцену то всё работает и ошибок нет !?!
Далее, ради пробы я создал третью сцену..., и добавил вентилятор - и вновь та-же ошибка !
Пожалуйста, помогите разобраться, а то я уже всю голову сломал.
Заранее спасибо !
Ответить