Страница 43 из 121
Re: Дизайн сцен 2
Добавлено: Чт мар 02, 2017 7:52 pm
Vovix
темка убежала...
а полезная ведь!
Re: Дизайн сцен 2
Добавлено: Пт мар 03, 2017 7:14 am
platon70
Простите за невежество, но я ни как не пойму как запустить обсуждаемую сцену на планшете. Majordomo установлен на ноутбуке. Сцену я настроил. Пока не полностью, а только главную страницу и погоду. Еще добавил страницу с GPS, но пока не разобрался с выводом карты (я так понял, что карту должен подгружать планшет за счет встроенного GPS). Поправьте, если что не так. На планшете установил Majordroid. Настроил локальную сеть. Как-бы связь с сервером есть. Как вывести на планшете сцены во весь экран? Пересмотрел кучу видео на youtube, но там только инфа, как настроить саму сцену, а вот работа с планшетом ни где не описана.
Re: Дизайн сцен 2
Добавлено: Пт мар 03, 2017 8:37 am
Vovix
platon70 писал(а):Простите за невежество, но я ни как не пойму как запустить обсуждаемую сцену на планшете.......
В общем-то если вы посмотрели видео на youtube по адаптации темы -
https://www.youtube.com/watch?v=ZRWDUY4UZfY&t=1106s , то там все есть,
но тем не менее:
Majordroid вам по сути не нужен (хотя можно и с ним),
на вашем планшете нужен браузер, а чтобы на экране не было ни чего лишнего кроме отображения сцены, браузер нужен в так называемом "режиме киоска" (рекомендую погуглить для своего браузера).
Ну и в браузере запускаете страницу вашей сцены вида:
xxx.xxx.xxx.xxx/popup/scenes/YY.html
где xxx.xxx.xxx.xxx - ip в локальной сети вашей
YY.html - YY это ID вашей сцены.
Re: Дизайн сцен 2
Добавлено: Пт мар 03, 2017 9:32 am
platon70
Vovix писал(а):
Ну и в браузере запускаете страницу вашей сцены вида: xxx.xxx.xxx.xxx/popup/scenes/YY.html
где xxx.xxx.xxx.xxx - ip в локальной сети вашей
YY.html - YY это ID вашей сцены.
Вот это дело. Теперь все понятно!
Re: Дизайн сцен 2
Добавлено: Пт мар 03, 2017 11:59 am
adzam
Dark_Veter писал(а):Aleks130699 писал(а):Мне интересно как сделать изменяющийся фон))Просто я в программировании еще не сильно разобрался))
Я следующим образом сделал:
1. Положил нужные картинки в cms/scenes/backgrounds/
2. Создал сценарий getSceneImage со следующим кодом (картинки в массивах надо будет поменять на нужные).
Код: Выделить всё
if($params['scene'] == "weather") {
$winter = array("cms/scenes/backgrounds/winter_1067x640.jpg");
$spring = array("cms/scenes/backgrounds/spring_1067x640.jpg");
$summer = array("cms/scenes/backgrounds/summer_1067x640.jpg");
$autumn = array("cms/scenes/backgrounds/autumn_1067x640.jpg",
"cms/scenes/backgrounds/weather_1067x640.jpg");
$seasons = array(0 => $winter,
1 => $spring,
2 => $summer,
3 => $autumn);
$season = $seasons[floor(date('n') / 3) % 4];
$img = $season[rand(0, count($season) - 1)];
if (file_exists($img)) {
header("Content-type: image/jpg");
readfile($img);
}
} else {
$images = array("cms/scenes/backgrounds/weather_1067x640.jpg",
"cms/scenes/backgrounds/city_1067x640.jpg",
"cms/scenes/backgrounds/plants_1067x640.jpg");
$img = $images[rand(0, 2)];
if (file_exists($img)) {
header("Content-type: image/jpg");
readfile($img);
}
}
3. Создал сцену и в строке фоновое изображение указал созданный выше сценарий:
Код: Выделить всё
/objects/?script=getSceneImage&scene=weather
В принципе код можно еще оптимизировать и уменьшить, но я пока этим не заморачивался.
А как сделать чтоб картирка менялась каждые 5 минут в произвольном порядке из папки с картинками?
Re: Дизайн сцен 2
Добавлено: Пт мар 03, 2017 12:59 pm
Dark_Veter
первое что в голову пришло) Создаем сценарий, который найдет все картинки в указанной директории, записывыем путь случайной картинки в свойство, запускаем этот сценарий каждые 5 минут из onNewMinute или модуль cron или таймаутом в этом же сценарии (SetTimeOut("ChangeSceneImage","runScript('ChangeSceneImage');", 300);). Картинку соответственно берем из свойства.
Пример, сценарий с именем ChangeSceneImage:
Код: Выделить всё
$directory = "./images"; // Папка с изображениями
$allowed_types = array("jpg", "png", "gif"); //разрешенные типы изображений
$file_parts = array();
$ext = "";
$i = 0;
$img_array = array();
//пробуем открыть папку
$dir_handle = @opendir($directory) or die("Ошибка при открытии папки !!!");
while ($file = readdir($dir_handle)) { //поиск по файлам
if ($file == "." || $file == "..")
continue; //пропустить ссылки на другие папки
$file_parts = explode(".", $file); //разделить имя файла и поместить его в массив
$ext = strtolower(array_pop($file_parts)); //последний элемент - это расширение
if (in_array($ext, $allowed_types)) {
$img_array[] = $directory . '/' . $file;
$i++;
}
}
closedir($dir_handle); //закрыть папку
sg('ThisComputer.ImageForScene', $img_array[rand(0, count($img_array))]);
Re: Дизайн сцен 2
Добавлено: Пт мар 03, 2017 9:10 pm
adzam
Большое спасибо , все заработало, это как раз что я и хотел.
Но эти меняющиеся картинки я хочу применить как фон на заглавной странице.
Но картинки на этой странице не хотят обновляться сами, только если обновляешь всю страницу вручную.
Может подскажите как заставить обновляться?
Файл default.html прилагаю.
<!--#
@version 0.2 (auto-set)
#-->
<script src="/templates_alt/jsgraphics/jsgraphics.js"></script>
<script src="/templates_alt/jsgraphics/state1.js"></script>
<style>
.ui-widget-content {
border: 1px solid transparent; /* рамка домашних страниц */
background: transparent; /* фон домашних страниц */
color: #333333;
}
::-webkit-scrollbar { /* убираем скроллы, общий справа*/
height:0px;
width: 0px;
scrolling:no;
}
.ui-tabs .ui-tabs-panel { /* увеличил рамку правого окна*/
padding:0em 0em;
}
</style>
<body scroll="no">
<script type="text/javascript" src="<#ROOTHTML#>js/ui.tabs.paging.js"></script>
<!-- Таблица -->
<table width="100%" border="0" style="background-image: url(%ThisComputer.ImageForScene%);position: fixed; overflow: hidden;">
<tr>
<td valign="top" colspan="4" width="100%">
<!-- шапка #1e5799 4%, #1e5799 14%,#B9D5EB 18%,-->
<div style="text-align: center; height:30; width:100%; overflow:hidden;background-repeat: no-repeat; background-image: url(/templates_alt/icon/lenta1275-31.png);position:relative; left: 0px; top:0px;">
<span style="cursor: default;position:relative; height:0; width:275;overflow:hidden;left:0px; top:6px;font-family: Arial, Helvetica, sans-serif; font-size:16px; text-align:center;color:#F9FC43;text-shadow: 1px 1px 2px black, 0 0 2em green">%Mainsity.metcast|300%</span>
</div>
</td>
</tr>
<tr>
<!-- вторая строка -->
<td width="8%" valign="center" >
<script language="javascript">
function leftPanelToggle() {
$('#leftPanel').toggle();
if ( $("#leftPanel").is(":visible") ) {
$("#leftPanelToggleIcon").attr("src","/templates_alt/icon/icon_left.png");
} else {
$("#leftPanelToggleIcon").attr("src","/templates_alt/icon/icon_right.png");
}
return false;
}
</script>
<a href="/"><img src="/templates_alt/icon/logo120-3a.gif" style=" position:relative; left:8px; top:0px"></a>
<a href="#" onClick="return leftPanelToggle();">
<img id="leftPanelToggleIcon" border="0" src="/templates_alt/icon/icon_left.png" border="0" style=" position: relative;left: 22px; top: -2px;"></a>
</td>
<!-- второй столбик -->
<td width="86%" colspan="2" valign="center" >
<style>
::-webkit-scrollbar { /* убираем скроллы, общий справа*/
height:0px;
width: 0px;
scrolling:no;
}
</style>
<div width="100%" height="100%" border="0" bgcolor="green" style="border-radius: 0.4em 0.4em 0.4em 0.4em;background:transparent">
<iframe src="/popup/scenes/3.html" width="100%" scrolling="no" height="100%" style="border-color: rgba(0, 0, 255, 0);height: 79px;margin: 10px;"></iframe>
</div>
</td>
<!-- третий столбик -->
<td width="18%" valign="center" >
<div style="background-repeat: no-repeat;background-image: url(/templates_alt/icon/bg31.png); position:relative; left: 10px; top:0px; height: 110;">
<div align="left" id="txt" style=' position:relative; left:0px; top:0px;cursor: default;text-align:center; text-shadow: 1px 1px 2px black, 0 0 1em green;font-size:5em;color:#F9FC43'>
</div>
<br>
<div id="txt1" style="font-family: Arial, Helvetica, sans-serif;text-shadow: 1px 1px 2px black, 0 0 2em green;position:relative; left:10px; top: -8px;cursor: default; text-align:center;color:#56d590;font-size:1.3em">
</div>
<div class="clock" style="position:relative; left: 9px; top:0px">
<ul class="cl">
<li class="ck" id="hours"></li>
<li class="ck" id="point">:</li>
<li class="ck" id="min"></li>
</ul>
<div id="Date"></div>
</div>
</div>
<style>
.container {width: 210px; margin: 0 auto; overflow: hidden;}
.clock {width:200px; padding:0px; border:0px solid #333; color:#F9FC43;text-shadow: 2px 2px 2px black }
#Date { font-family: Arial, Helvetica, sans-serif; font-size:15px; text-align:center;color:#56d590;;text-shadow: 2px 2px 2px black}
.cl { width:200px; margin:0 auto; padding:0px; list-style:none; text-align:center; }
.ck { display:inline; font-size:4.5em; text-align:center; font-family:Arial, Helvetica, sans-serif;text-shadow: 2px 2px 2px black }
#point { position:relative; -moz-animation:mymove 1s ease infinite; -webkit-animation:mymove 1s ease infinite; padding-left:10px; top:-5px; padding-right:10px; }
@-webkit-keyframes mymove
{
0% {opacity:1.0; border:0px solid #000;}
59% {opacity:0; text-shadow:none; }
100% {opacity:1.0; border:0px solid #000; }
}
@-moz-keyframes mymove
{
0% {opacity:1.0; border:1px solid #000;}
59% {opacity:0; text-shadow:none; }
100% {opacity:1.0; border:1px solid #000; }
}
</style>
<script type="text/javascript">
$(document).ready(function() {
// Создаем две переенные с названиями месяцев и дней недели в массиве
var monthNames = [ "января", "Февраля", "марта", "апреля", "мая", "июня", "июля", "августа", "Cентября", "октября", "ноября", "декабря" ];
var dayNames= ["Воскресенье","Понедельник","Вторник","Среда","Четверг","Пятница","Суббота"]
// Создаем объект newDate()
var newDate = new Date();
// Извлекаем текущую дату из объекта Date
newDate.setDate(newDate.getDate());
// Навыходе день, дата, месяц и год
$('#Date').html(dayNames[newDate.getDay()] + " " + newDate.getDate() + ' ' + monthNames[newDate.getMonth()]);
setInterval( function() {
// Создаем объект newDate() и извлекаем секунды текущего времени
var seconds = new Date().getSeconds();
// Добавляем начальный ноль к значению секунд
$("#sec").html(( seconds < 10 ? "0" : "" ) + seconds);
},1000);
setInterval( function() {
// Создаем объект newDate() и извлекаем минуты текущего времени
var minutes = new Date().getMinutes();
// Добавляем начальный ноль к значению минут
$("#min").html(( minutes < 10 ? "0" : "" ) + minutes);
},1000);
setInterval( function() {
// Создаем объект newDate() и извлекаем часы из текущего времени
var hours = new Date().getHours();
// Добавляем начальный ноль к значению часов
$("#hours").html(( hours < 10 ? "0" : "" ) + hours);
}, 1000);
});
</script>
</div>
</td>
</tr>
<!-- третья строка-->
<tr>
<td width="8%" >
<div width="100%" style="text-align: center; height:30;overflow:hidden; background: url(/templates_alt/icon/lenta120x35.png) no-repeat;position:relative; left: 0px; top:0px;">
</div>
</td>
<td width="8%">
<div style="text-align: center; height:30; width:100%; overflow:hidden;background-size: 100%; background-image: url(/templates_alt/icon/lenta120x35.png);position:relative; left: 0px; top:0px;">
</div>
</td>
<td width="64%">
<div style="text-align: center; height:30; width:100%; overflow:hidden; background-image: url(/templates_alt/icon/lenta820x35.png);position:relative; left: 0px; top:0px;">
</div>
</td>
<td width="16%">
<div style="text-align: center; height:30; width:100%; overflow:hidden; background-image: url(/templates_alt/icon/lenta230x35.png);position:relative; left: 0px; top:0px;">
</div>
</td>
</tr>
<!-- четвертая строка первый столбик -->
<tr>
<td valign="top" colspan="2" width="235" id="leftPanel">
<iframe src="<#ROOTHTML#>menu.html" width="235" height="459" id="navFrame" style="background: transparent" border="0" frameborder=0 framespacing=0></iframe>
</td>
<!-- четвертая строка второй столбик -->
<td valign="top" colspan="2" width="100%">
<Style> <!--# убираем меню с домашних страниц #-->
.ui-tabs .ui-tabs-nav {
display: none;
}
.ui-tabs .ui-tabs-panel {
padding: 0em 0em;
top: 7px;
position: relative;
}
</Style>
<div id="tabs">
<ul>
[#begin LAYOUTS#]
<li>
<a href="#tabs-[#ID#]"[#if ICON!=""#] style="padding:1px 1em 2px 0.5em"[#endif#]>[#if ICON!=""#]<img src="<#ROOTHTML#>cms/layouts/[#ICON#]" align="absmiddle" height="28"> [#endif#][#TITLE#]</a></li>
[#end LAYOUTS#]
<li>
<a href="#tabs-last"><span id='tablast_title'>***</span></a></li>
</ul>
[#begin LAYOUTS#]
<div id="tabs-[#ID#]">...</div>
[#end LAYOUTS#]
<div id="tabs-last">
...
</div>
</div>
</td>
</tr>
</table>
<script language="javascript">
var iFrameHeight=590;
$(document).ready(function() {
// Handler for .ready() called.
iFrameHeight=$(document).height()-110;
//alert($(document).height());
$('#navFrame').height(iFrameHeight+57);
[#begin LAYOUTS#]
$('#htmlTab[#NUM#]').height(iFrameHeight);
[#end LAYOUTS#]
//alert($('#defaultFrame').height());
});
[#begin LAYOUTS#]
var layoutTimer[#ID#];
[#end LAYOUTS#]
$("#tabs").tabs({
show: function(event, ui) {
iFrameHeight=$(document).height()-110;
var selected = $( "#tabs" ).tabs( "option", "selected" );
//alert(selected);
[#begin LAYOUTS#]
if (selected == [#NUM#]) {
clearTimeout(layoutTimer[#ID#]);
[#if TYPE="app"#]
if ($('#tabs-[#ID#]').html()=='...') {
$('#tabs-[#ID#]').html('<iframe src="<#ROOTHTML#>popup/[#APP#].html" width=100% height="'+iFrameHeight+'" border="0" frameborder="0"></iframe>');
}
[#endif TYPE#]
[#if TYPE="url"#]
if ($('#tabs-[#ID#]').html()=='...') {
$('#tabs-[#ID#]').html('<iframe src="[#URL#]" width=100% height="'+iFrameHeight+'" border="0" frameborder="0"></iframe>');
}
[#endif TYPE#]
[#if TYPE="html"#]
if ($('#tabs-[#ID#]').html()=='...') {
$('#tabs-[#ID#]').html('<iframe src="<#ROOTHTML#>page/[#ID#].html" width=100% height="'+iFrameHeight+'" border="0" frameborder="0"></iframe>');
}
[#endif TYPE#]
} else {
if ($('#tabs-[#ID#]').html()!='...') {
clearTimeout(layoutTimer[#ID#]);
layoutTimer[#ID#]=setTimeout("$('#tabs-[#ID#]').html('...');", 59*1000);
}
}
[#end LAYOUTS#]
}});
$('#tabs').tabs('paging', {cycle:false, follow:false});
</script>
</body>
Re: Дизайн сцен 2
Добавлено: Сб мар 11, 2017 10:45 pm
adzam
Нужна помощь.
У меня есть три html сцены :
info-1
info-2
info-3
Как можно запустить их, чтоб они переключались по кольцу каждые 5 минут.
В настройках ничего не нашел.
Может скриптом каким-либо.
В меню есть Задержка при ротации:, а в сценах ничего не нашел.
Помогите пож.
Re: Дизайн сцен 2
Добавлено: Вс мар 12, 2017 12:55 am
adzam
Еще вопрос вот в элементах сцен есть такой пункт как Анимация появления,
Допустим если поставить в анимацию появления значение слева на право, то Сцена красиво заезжает с левой стороны.
А можно ли сделать , чтоб при смене сцен она так-же красиво уехала в право (допустим) уступая место новой сцене.
Иначе говоря как можно сделать анимацию исчезновения сцены.
Re: Дизайн сцен 2
Добавлено: Вс апр 16, 2017 4:51 pm
banderos
Подскажите пожалуйста как создать историю для ow_fact.temperature?

нашел на фуруме и добавил