Аналоговые flash-часы, получающие текущее время с сервера. Продолжение.

Итак, продолжим недавно начатую тему. Но сегодня мы объединим два предыдущих урока («ActionScript: flash-часы, получающие текущее время с сервера» и ««Механические» часы на ActionScript 3.0»), чтобы создать полноценные аналоговые flash-часики, получающие данные о текущем времени от скрипта на сервере. Ещё раз повторюсь, что описанное ниже полностью основано на двух указанных ранее уроках. Поэтому за подробными объяснениями я отсылаю к этим постам, а здесь комментарии будут сведены к минимуму.

Итак, у нас есть сервер, а на сервере есть php-скрипт, возвращающий текущее время в секундах (см.: «ActionScript: flash-часы, получающие текущее время с сервера»). Кроме этого, мы знаем, как загрузить данные о текущем времени и как их использовать в flash-ролике (см. там же).

А из другого урока мы знаем, как создать простые аналоговые часики на ActionScript 3.0 (см.: ««Механические» часы на ActionScript 3.0»).

Объединяем эти два урока и получаем примерно следующее...

Код ActionScript 3.0:

/* импорт классов */ import flash.display.Sprite; import flash.utils.getTimer; import flash.events.*; import flash.net.*; /* далее расположены основные настройки, которые можно редактировать */ const diametr:uint = 400; // диаметр циферблата const COLH:uint = 0x333333; // цвет часовой стрелки const COLM:uint = 0x333333; // цвет минутной стрелки const COLS:uint = 0x333333; // цвет секундной стрелки const WH:uint = 60; // длина часовой стрелки const WM:uint = 70; // длина минутной стрелки const WS:uint = 70; // длина секундной стрелки const HH:uint = 6; // толщина часовой стрелки const HM:uint = 4; // толщина минутной стрелки const HS:uint = 1; // толщина секундной стрелки /* служебные переменные */ var curtime:Number; var dif:uint; /* создаём табло для часов и добавляем на сцену */ var clockTablo:ClockTablo = new ClockTablo(); addChild(clockTablo); /* до загрузки текущего времени наши часы будут невидимыми */ clockTablo.visible = false; /* создаём часовую стрелку */ var clockH:Sprite = new Sprite(); clockTablo.addChild(clockH); clockH.graphics.lineStyle(HH, COLH, 1); clockH.graphics.moveTo(0, 0); clockH.graphics.lineTo(0, -(WH)); clockH.x = diametr / 2; clockH.y = diametr / 2; /* создаём минутную стрелку */ var clockM:Sprite = new Sprite(); clockTablo.addChild(clockM); clockM.graphics.lineStyle(HM, COLM, 1); clockM.graphics.moveTo(0, 0); clockM.graphics.lineTo(0, -(WM)); clockM.x = diametr / 2; clockM.y = diametr / 2; /* создаём секундную стрелку */ var clockS:Sprite = new Sprite(); clockTablo.addChild(clockS); clockS.graphics.lineStyle(HS, COLS, 1); clockS.graphics.moveTo(0, 0); clockS.graphics.lineTo(0, -(WS)); clockS.x = diametr / 2; clockS.y = diametr / 2; /* на центр табло накладываем маленький круг, который выполняет исключительно декоративную роль - закрывает стык стрелок */ var clockT:Sprite = new Sprite(); clockTablo.addChild(clockT); clockT.graphics.beginFill(COLH, 1); clockT.graphics.drawCircle(0, 0, HH); clockT.graphics.endFill(); clockT.x = diametr / 2; clockT.y = diametr / 2; /* загружаем данные о текущем времени с сервера */ var urlRequest:URLRequest = new URLRequest("gettime.php?"+Math.random()*int.MAX_VALUE); var urlLoader:URLLoader = new URLLoader(); urlLoader.dataFormat = URLLoaderDataFormat.VARIABLES; urlLoader.addEventListener(Event.COMPLETE, onComplete); urlLoader.addEventListener(SecurityErrorEvent.SECURITY_ERROR, onSecurityError); urlLoader.addEventListener(IOErrorEvent.IO_ERROR, onIOError); urlLoader.load(urlRequest); /* функция, которая сработает при удачной загрузке данных с сервера */ function onComplete(event:Event):void { clockTablo.visible = true; var loader:URLLoader = URLLoader(event.target); curtime = parseInt(loader.data.curtime,10) * 1000; dif = getTimer(); addEventListener(Event.ENTER_FRAME, onEnterFrames); } /* функции, которые сработают, если при загрузке данных с сервера возникнут ошибки */ function onSecurityError(event:SecurityErrorEvent):void { trace("Ошибка!!!"); } function onIOError(event:IOErrorEvent):void { trace("Ошибка!!!"); } /* обновление часиков */ function onEnterFrames(event:Event):void { /* узнаём текущее время */ var now:Date = new Date(curtime + (getTimer() - dif)); /* узнаём, сколько сейчас часов, минут и секунд */ var h:Number = now.getHours(); var m:Number = now.getMinutes(); var s:Number = now.getSeconds(); /* рассчитываем поворот стрелок */ var hAngle:Number = (360 * h / 12) + (0.5 * m); var mAngle:Number = 360 * m / 60; var sAngle:Number = 360 * s / 60; /* меняем поворот стрелок */ clockH.rotation = hAngle; clockM.rotation = mAngle; clockS.rotation = sAngle; }

Получаем следующий результат:

Вот, в принципе, и всё :-) Решение, конечно, имеет ряд недостатков и далеко не идеальное, но вполне работоспособное.

Скачать исходники к данному уроку (под Adobe Flash CS 5.5).

Автор: admin

Дата добавления: 2012-07-11

Просмотров: 4935

Рейтинг поста: +4-

Правила перепечатки

Социальные закладки:
Комментарии:
Комментатор
Комментарий добавил(а): Андрей
Дата добавления: 2015-01-14
Полностью с Вами согласен.
Ещё раз благодарю за Вашу ресурс, так держать = )
Комментатор
Комментарий добавил(а): edapskov
Дата добавления: 2015-01-14
Андрей, это уже зависит от ваших потребностей: кому-то надо показывать время в конкретном часовом поясе, а кому-то - время у конкретного пользователя. Кроме этого, настройки времени на сервере могут тоже различаться.
Комментатор
Комментарий добавил(а): Андрей
Дата добавления: 2015-01-14
Здравствуйте, уважаемый Админ!
Нашёл небольшую недоработку в скрипте ваших часов.
А именно, в процессе эксплуатации выяснилось, что часы берут время Гринвичу с сервера, и изменяют его согласно часовому поясу пользователя, а не сервера.
Для решения проблемы, необходимо пользоваться методами:
var h:Number = now.getUTCHours();
var m:Number = now.getUTCMinutes();
var s:Number = now.getUTCSeconds();
и прибавлять часы на соответствующий пояс.
Для Московского (+3) это будет выглядеть так:
if (h<21)
{
h=h+3;
}
else
{
h=h-21;
}
--
С уважением.
Комментатор
Комментарий добавил(а): Андрей
Дата добавления: 2015-01-08
Благодарю! Теперь разобрался что к чему )
Комментатор
Комментарий добавил(а): edapskov
Дата добавления: 2015-01-08
> Подскажите пожалуйста, эти часы как я понял понял, будут грузить сервер запросами?

Всего один простенький запрос к серверу при загрузке страницы с этими флеш-часами.
Комментатор
Комментарий добавил(а): Андрей
Дата добавления: 2015-01-08
Здравствуйте, уважаемый Админ!
Подскажите пожалуйста, эти часы как я понял понял, будут грузить сервер запросами?
Добавить комментарий:







[ + ] помощь по форматирование текста

Идиот-тест

Если все обязательные поля (отмечены * ) заполнены необходимой информацией, то нажимаем кнопку Добавить комментарий.

Меню
Подписка
Рубрики
Метки
Последние комментарии
Рейтинг постов
Реклама
Друзья
География гостей
Статистика
Яндекс.Метрика