[Виджет] to do (дела, задачи) в меню и сцены, ver 3.23

Готовое оформление с исполнительным кодом

Модераторы: immortal, newz20

Аватара пользователя
Vovix
Сообщения: 1151
Зарегистрирован: Пн янв 27, 2014 1:43 am
Откуда: г.Ижевск
Благодарил (а): 58 раз
Поблагодарили: 499 раз
Контактная информация:

Re: Виджет to do (дела, задачи) в меню

Сообщение Vovix » Сб ноя 28, 2015 8:01 pm

Aleks130699 писал(а):....
А как на сцену установить?
По установке на СЦЕНУ: всё от сюда подходит , т.е. если будете использовать и на сценах тоже, то нужно только использовать для отображения в коде: %TodoList.StreamingCode%

в Дополнительный код CSS:
СпойлерПоказать

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

@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css");
#list {
  position: relative;
}

#list .new #newtask {
  float: left;
  width: calc(100% - 100px);
  height: 100px;
  padding: 0;
  margin: 0;
  outline: 0;
  border: 0;
  background: #222;
  line-height: 50px;
  text-indent: 25px;
}

#list .new input {
  font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
  font-size: 32px;
  color: #FFF;
  text-align: justify;
  line-height: normal;
 /* font-smoothing: antialiased; */
}


#list .new #newtask::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}
#list .new button {
  cursor: pointer;
  float: right;
  width: 100px;
  height: 100px;
  padding: 0;
  margin: 0;
  outline: 0;
  border: 0;
  background: #111111;
  font-size: 84px;
  color: #FFF;
}
#list .list .item {
  clear: both;
  height: 50px;
  
}
#list .list .item input {
  cursor: default;
  float: left;
  width: calc(100% - 150px);
  height: 50px;
  padding: 0;
  margin: 0;
  outline: 0;
  border: 0;
  background: transparent;
  text-indent: 25px;
  font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
  font-size: 20pt;
  color: #FFF;
  text-align: justify;
  line-height: normal;
  
}
#list .list .item input.checked {
  opacity: .5;
  text-decoration: line-through;
}
#list .list .item .rightblock {
  float: right;
}
#list .list .item button{
 cursor: pointer;
  float: left;
  width: 50px;
  height: 50px;
  padding: 0;
  margin: 0;
  outline: 0;
  border: 0;
  background: rgba(0,0,0,0.1);
  font-size: 32px;
  color: #FFF;  
} 
в Дополнительный код JavaScript
СпойлерПоказать

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

function btnRunClicked() {
     var newtask=$('#newtask').val();
     if (newtask) {
           $.get( "/objects/", { object:"TodoList", op:"m", m:"new", task:newtask } );
           return false;
     } 
} 

function checkClicked(ctask) {
     if (ctask) {
           $.get( "/objects/", { object:"TodoList", op:"m",m:"check", task:ctask } );
           return false;
     } 
} 

function deleteClicked(dtask) {
    if (dtask) {
           $.get( "/objects/", { object:"TodoList", op:"m", m:"delete", task:dtask } );
           return false;
     } 
} 
Мой -CONNECT-
Windows 7(PHP 7.2) + Raspberry Pi(освещение на 1-Wire) + MP751(управление) + ESP8266(сенсоры) + LAN(сенсоры)
-=: Если вам помогло моё сообщение, нажмите кнопку "Поблагодарить за сообщение автора: Vovix" (кнопка Спасибо) справа! :=-
Aleks130699
Сообщения: 97
Зарегистрирован: Чт ноя 19, 2015 5:33 pm
Благодарил (а): 7 раз
Поблагодарили: 7 раз

Re: Виджет to do (дела, задачи) в меню

Сообщение Aleks130699 » Сб ноя 28, 2015 9:57 pm

Vovix писал(а):
Aleks130699 писал(а):....
А как на сцену установить?
По установке на СЦЕНУ: всё от сюда подходит , т.е. если будете использовать и на сценах тоже, то нужно только использовать для отображения в коде: %TodoList.StreamingCode%

в Дополнительный код CSS:
СпойлерПоказать

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

@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css");
#list {
  position: relative;
}

#list .new #newtask {
  float: left;
  width: calc(100% - 100px);
  height: 100px;
  padding: 0;
  margin: 0;
  outline: 0;
  border: 0;
  background: #222;
  line-height: 50px;
  text-indent: 25px;
}

#list .new input {
  font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
  font-size: 32px;
  color: #FFF;
  text-align: justify;
  line-height: normal;
 /* font-smoothing: antialiased; */
}


#list .new #newtask::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}
#list .new button {
  cursor: pointer;
  float: right;
  width: 100px;
  height: 100px;
  padding: 0;
  margin: 0;
  outline: 0;
  border: 0;
  background: #111111;
  font-size: 84px;
  color: #FFF;
}
#list .list .item {
  clear: both;
  height: 50px;
  
}
#list .list .item input {
  cursor: default;
  float: left;
  width: calc(100% - 150px);
  height: 50px;
  padding: 0;
  margin: 0;
  outline: 0;
  border: 0;
  background: transparent;
  text-indent: 25px;
  font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
  font-size: 20pt;
  color: #FFF;
  text-align: justify;
  line-height: normal;
  
}
#list .list .item input.checked {
  opacity: .5;
  text-decoration: line-through;
}
#list .list .item .rightblock {
  float: right;
}
#list .list .item button{
 cursor: pointer;
  float: left;
  width: 50px;
  height: 50px;
  padding: 0;
  margin: 0;
  outline: 0;
  border: 0;
  background: rgba(0,0,0,0.1);
  font-size: 32px;
  color: #FFF;  
} 
в Дополнительный код JavaScript
СпойлерПоказать

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

function btnRunClicked() {
     var newtask=$('#newtask').val();
     if (newtask) {
           $.get( "/objects/", { object:"TodoList", op:"m", m:"new", task:newtask } );
           return false;
     } 
} 

function checkClicked(ctask) {
     if (ctask) {
           $.get( "/objects/", { object:"TodoList", op:"m",m:"check", task:ctask } );
           return false;
     } 
} 

function deleteClicked(dtask) {
    if (dtask) {
           $.get( "/objects/", { object:"TodoList", op:"m", m:"delete", task:dtask } );
           return false;
     } 
} 
вот эти то мне коды и нужны были)))
Аватара пользователя
Vovix
Сообщения: 1151
Зарегистрирован: Пн янв 27, 2014 1:43 am
Откуда: г.Ижевск
Благодарил (а): 58 раз
Поблагодарили: 499 раз
Контактная информация:

Re: Виджет to do (дела, задачи) в меню

Сообщение Vovix » Пн ноя 30, 2015 1:18 am

Версия 3.1 от 30.11.2015 г., универсальная и самодостаточная и для сцены и для меню!
  • изменил цветовую гамму и способ формирования цвета
  • более удобная вставка в сцены
  • исправлены некоторые ошибки
  • обновление списка на сцене теперь непосредственно средствами javascript
  • изменены теги отображения на сцене (унифицированы с меню)
  • еще некоторые изменения..
СпойлерПоказать
to do list.jpg
to do list.jpg (46.75 КБ) 595 просмотров
Установка:
Перед началом установки, если была установлена прошлая версия, рекомендую (настоятельно) удалить класс ToDo со всеми объектами и методами, если нужно сохранить задачи, то содержимое свойства TodoList.todo можно предварительно сохранить куда-нибудь и потом восстановить после установки.

1) Скачать файл с импортом Класса, объекта и метода - 2015_11_30_ToDo.txt в архиве.
2) Импортировать его себе в объекты
должен появиться класс ToDo, объект TodoList и единственный метод объекта (именно объекта) - install
3) Зайти в метод install объекта и нажать Настроить
СпойлерПоказать
to do install_1.jpg
to do install_1.jpg (35.96 КБ) 595 просмотров
4) запустить его на выполнение вручную (нажать test)
СпойлерПоказать
to do install_2.jpg
to do install_2.jpg (120.12 КБ) 595 просмотров
5) Поздравляю! Установка закончена!

Использование в меню:
1) Создать пункт типа HTML с данными: %TodoList.StreamingCodeMenu%
обратите внимание на ID созданного элемента меню, он вам понадобиться!
СпойлерПоказать
to do use_menu.jpg
to do use_menu.jpg (99.41 КБ) 595 просмотров
2) Для корректного отображения нужно заменить номер ID на свой (тот который у вас у пункта меню с модулем) менять нужно в свойстве TodoList.menuCSS на строке с видом (в начале):

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

#item194 { /* здесь item194 - это номер ID пункта меню в котором он размещен */                   

Использование в сценах:
1) Создать элемент сцены типа HTML в нужном вам месте со следующими настройками:
Дополнительный код JavaScript : %TodoList.JS%
Дополнительный код CSS : %TodoList.sceneCSS%
Состояние с любым именем и Кодом : %TodoList.StreamingCodeScene%
СпойлерПоказать
to do use_scene.jpg
to do use_scene.jpg (64 КБ) 595 просмотров
2) Должны получить такой результат в сцене:
СпойлерПоказать
to do list scene.jpg
to do list scene.jpg (46.88 КБ) 595 просмотров
Дополнительные возможности:
Во всех методах (кроме view), имеется, примерно, такой код:

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

$sayTodo = gg("Sets.sayTodo");
                   if ($sayTodo) { 
                       say ("Todo задача: "".$task."" - отмечена как ".$tcheck,($sayTodo-2));
                } 
Цель - проговаривание/запись действий с задачами Алисой в Истории событий (логе)!
Регулирование функции, у меня, производиться значением свойства Sets.sayTodo, а именно значение "0" - не говорить и не писать; "1" - писать в лог; "2" - писать и проговаривать, если текущий уровень minMsgLevel равен "0".
Сам параметр Sets.sayTodo у меня задается в меню, в разделе настройки, например так:
СпойлерПоказать
st.jpg
st.jpg (8.16 КБ) 594 просмотра
Вложения
2015_11_30_ToDo.zip
(3.49 КБ) 24 скачивания
За это сообщение автора Vovix поблагодарил:
nick7zmail (Пн ноя 30, 2015 9:21 am)
Рейтинг: 1.25%
Мой -CONNECT-
Windows 7(PHP 7.2) + Raspberry Pi(освещение на 1-Wire) + MP751(управление) + ESP8266(сенсоры) + LAN(сенсоры)
-=: Если вам помогло моё сообщение, нажмите кнопку "Поблагодарить за сообщение автора: Vovix" (кнопка Спасибо) справа! :=-
Аватара пользователя
nick7zmail
Сообщения: 6977
Зарегистрирован: Пн окт 28, 2013 8:14 am
Откуда: Екатеринбург
Благодарил (а): 119 раз
Поблагодарили: 1757 раз

Re: Виджет to do (дела, задачи) в меню

Сообщение nick7zmail » Пн ноя 30, 2015 9:21 am

Ну все же подготовил для создания модуля =D
Кстати говоря, Сергей неплохую идею высказал. Можно твое оформление прикрутить к модулю wunderlist. Тем более что в модуле Сергея уже есть методы по добавлению/удалению задач...по клику на кнопках - можно их вызывать.
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
:arrow: Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Аватара пользователя
Vovix
Сообщения: 1151
Зарегистрирован: Пн янв 27, 2014 1:43 am
Откуда: г.Ижевск
Благодарил (а): 58 раз
Поблагодарили: 499 раз
Контактная информация:

Re: Виджет to do (дела, задачи) в меню

Сообщение Vovix » Пн ноя 30, 2015 12:02 pm

nick7zmail писал(а):Ну все же подготовил для создания модуля =D
Кстати говоря, Сергей неплохую идею высказал. Можно твое оформление прикрутить к модулю wunderlist. Тем более что в модуле Сергея уже есть методы по добавлению/удалению задач...по клику на кнопках - можно их вызывать.
пока не будет инструкции по созданию модуля я решил не делать его!
примеры посмотрел, в т.ч. и ваш... понял, что у меня есть вопросы и не один!
методом "тыка" разбираться не хочу...
Мой -CONNECT-
Windows 7(PHP 7.2) + Raspberry Pi(освещение на 1-Wire) + MP751(управление) + ESP8266(сенсоры) + LAN(сенсоры)
-=: Если вам помогло моё сообщение, нажмите кнопку "Поблагодарить за сообщение автора: Vovix" (кнопка Спасибо) справа! :=-
Аватара пользователя
Vovix
Сообщения: 1151
Зарегистрирован: Пн янв 27, 2014 1:43 am
Откуда: г.Ижевск
Благодарил (а): 58 раз
Поблагодарили: 499 раз
Контактная информация:

Re: Виджет to do (дела, задачи) в меню

Сообщение Vovix » Пн ноя 30, 2015 12:08 pm

nick7zmail,
может возьметесь за написание инструкции?
Мой -CONNECT-
Windows 7(PHP 7.2) + Raspberry Pi(освещение на 1-Wire) + MP751(управление) + ESP8266(сенсоры) + LAN(сенсоры)
-=: Если вам помогло моё сообщение, нажмите кнопку "Поблагодарить за сообщение автора: Vovix" (кнопка Спасибо) справа! :=-
Аватара пользователя
nick7zmail
Сообщения: 6977
Зарегистрирован: Пн окт 28, 2013 8:14 am
Откуда: Екатеринбург
Благодарил (а): 119 раз
Поблагодарили: 1757 раз

Re: Виджет to do (дела, задачи) в меню

Сообщение nick7zmail » Пн ноя 30, 2015 12:55 pm

Vovix писал(а):может возьметесь за написание инструкции?
Хотел записать видео-урок по основам, кто то в теме "создание модуля" просил...
Обязательно займусь, как только будет время, и жены не будет дома =D...скорее - ближе к концу недели.
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
:arrow: Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Аватара пользователя
nick7zmail
Сообщения: 6977
Зарегистрирован: Пн окт 28, 2013 8:14 am
Откуда: Екатеринбург
Благодарил (а): 119 раз
Поблагодарили: 1757 раз

Re: Виджет to do (дела, задачи) в меню

Сообщение nick7zmail » Пн ноя 30, 2015 12:57 pm

Мне кажется или опять часть сообщений кануло в небытие?
Raspberry Pi3+Broadlink+esp8266 (blynk)+AMS
Если вам помогло какое-либо сообщение - не забывайте пользоваться кнопкой "СПАСИБО".
:arrow: Услуги в профиле коннект
>>>>>Мой новый канал на ютутбе, подписывайтесь!<<<<<
Аватара пользователя
Vovix
Сообщения: 1151
Зарегистрирован: Пн янв 27, 2014 1:43 am
Откуда: г.Ижевск
Благодарил (а): 58 раз
Поблагодарили: 499 раз
Контактная информация:

Re: Виджет to do (дела, задачи) в меню

Сообщение Vovix » Пн ноя 30, 2015 1:12 pm

nick7zmail писал(а):Мне кажется или опять часть сообщений кануло в небытие?
ДА! ПРИ ЧЕМ Я УСТАЛ ПИСАТЬ ВСЁ ОДНО И ТО-ЖЕ КАЖДЫЙ РАЗ СНОВА!
Мой -CONNECT-
Windows 7(PHP 7.2) + Raspberry Pi(освещение на 1-Wire) + MP751(управление) + ESP8266(сенсоры) + LAN(сенсоры)
-=: Если вам помогло моё сообщение, нажмите кнопку "Поблагодарить за сообщение автора: Vovix" (кнопка Спасибо) справа! :=-
Аватара пользователя
Vovix
Сообщения: 1151
Зарегистрирован: Пн янв 27, 2014 1:43 am
Откуда: г.Ижевск
Благодарил (а): 58 раз
Поблагодарили: 499 раз
Контактная информация:

Re: Виджет to do (дела, задачи) в меню

Сообщение Vovix » Пн ноя 30, 2015 1:14 pm

все мои старания до 4-х утра сегодня - насмарку!
Мой -CONNECT-
Windows 7(PHP 7.2) + Raspberry Pi(освещение на 1-Wire) + MP751(управление) + ESP8266(сенсоры) + LAN(сенсоры)
-=: Если вам помогло моё сообщение, нажмите кнопку "Поблагодарить за сообщение автора: Vovix" (кнопка Спасибо) справа! :=-
Ответить