Markus Lang
Постоялец
- Регистрация
- 8 Июл 2008
- Сообщения
- 267
- Реакции
- 170
- Автор темы
- #1
Если у вас есть мак с установленным апачем и php с помощью простого веб приложения легким движением руки iPhone превращается в пульт управления.
Как все это работает? Да очень просто. Наш iPhone через сафари будет посылать запрос php скрипту, который в свою очередь будет выполнять AppleScript, ну а уж он будет посылать команды приложениям.
И так поехали. Для начала научим наше приложение управлять iTunes и QuickTime Player, какие еще команды будет уметь выполнять приложения будет зависеть только от вашей фантазии.
Для начала в файле commands.php опишем обработку запросов и выполнение комманд. Приведу полный текст скрипта.
Обработчик есть, теперь напишем страницу с которой мы собственно и будет всем управлять.
Строка
указывает, что наша страница будет занимать всю ширину экрана и не будет изменять свои размеры. Для того чтобы придать нашей странице вид обычного приложения подключим style.css в котором пропишем несколько стилей для iPhone (стили взял с сайта apple, поэтому привожу как есть).
В итого на iPhone мы должны увидеть примерно следующее
Некоторые могли заметить, что рядом с заголовком iTunes выводится название текущее трека, для этого на страницу добавим пару строк
А этот выведет название текущего трека.
Вот мы и сделали наше веб приложение для Iphone'а. Спасибо за внимание.
Как все это работает? Да очень просто. Наш iPhone через сафари будет посылать запрос php скрипту, который в свою очередь будет выполнять AppleScript, ну а уж он будет посылать команды приложениям.
И так поехали. Для начала научим наше приложение управлять iTunes и QuickTime Player, какие еще команды будет уметь выполнять приложения будет зависеть только от вашей фантазии.
Для начала в файле commands.php опишем обработку запросов и выполнение комманд. Приведу полный текст скрипта.
Думаю тут все понятно. В зависимости от полученной команды выполняется определенный скрипт. Команды AppleScript будет выполнять через вызов утилиты osascript с помощью функции exec()<?php
if ($_GET['app'] == 'iTunes')
{
if ($_GET['cmd'] == 'Play')
{
$cmd = 'tell application "iTunes" to play';
}
if ($_GET['cmd'] == 'Pause')
{
$cmd = 'tell application "iTunes" to pause';
}
if ($_GET['cmd'] == 'NextSong')
{
$cmd = 'tell application "iTunes" to next track';
}
if ($_GET['cmd'] == 'PrevSong')
{
$cmd = 'tell application "iTunes" to previous track';
}
}
if ($_GET['app'] == 'QuickTime')
{
if ($_GET['cmd'] == 'Play')
{
$cmd = 'tell application "QuickTime Player" to activate (play document 1)';
}
if ($_GET['cmd'] == 'Pause')
{
$cmd = 'tell application "QuickTime Player" to activate (pause document 1)';
}
if ($_GET['cmd'] == 'Fullscreen')
{
$cmd = 'tell application "QuickTime Player" to activate (present document 1 scale screen)';
}
if ($_GET['cmd'] == 'Close')
{
$cmd = 'tell application "QuickTime Player" to activate (close document 1)';
}
}
exec('osascript -e \'' . $cmd . '\'');
header('location: /remote/');
?>
exec('osascript -e \'' . $cmd . '\'');
Обработчик есть, теперь напишем страницу с которой мы собственно и будет всем управлять.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=no" />
<title>iRemote</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<h1>QuickTime</h1>
<ul>
<li><a href="commands.php?app=QuickTime&cmd=Play">Play</a></li>
<li><a href="commands.php?app=QuickTime&cmd=Pause">Pause</a></li>
<li><a href="commands.php?app=QuickTime&cmd=Fullscreen">Fullscreen</a></li>
<li><a href="commands.php?app=QuickTime&cmd=Close">Close</a></li>
</ul>
<h1>iTunes</h1>
<ul>
<li><a href="commands.php?app=iTunes&cmd=Play">Play</a></li>
<li><a href="commands.php?app=iTunes&cmd=Pause">Pause</a></li>
<li><a href="commands.php?app=iTunes&cmd=NextSong">Next Song</a></li>
<li><a href="commands.php?app=iTunes&cmd=PrevSong">Previous Song</a></li>
</ul>
</body>
</html>
Строка
<meta name="viewport" content="width=device-width, user-scalable=no" />
указывает, что наша страница будет занимать всю ширину экрана и не будет изменять свои размеры. Для того чтобы придать нашей странице вид обычного приложения подключим style.css в котором пропишем несколько стилей для iPhone (стили взял с сайта apple, поэтому привожу как есть).
body
{
margin: 0;
padding: 0;
margin-left:10px;
background-color: rgb(197,204,211); /* Set the page color to light blue */
-webkit-text-size-adjust:none; /* Turn off font resizing */
}
h1
{
margin:0;
padding-top:10px;
padding-right:10px;
padding-bottom:10px;
padding-left:10px;
font-size:17px;
font-family: Helvetica;
font-weight:bold;
color: rgb(76,86,108); /* Set each label color */
}
ul
{
padding: 0;
margin-top:0;
margin-right:10px;
margin-bottom:17px; /* Set each list 17 pixels from the top of the button bar(or the top of the next list) */
font-size:17px;
font-family: Helvetica;
font-weight:bold;
color:black;
width: 300px;
background-color: white; /* Each list has a white background fill */
border-width: 1px; /* Draw a rectangle around each list */
border-style:solid ;
border-color:rgb(217,217,217);
-webkit-border-radius: 8px; /* Round each corner of the created rectangle */
}
li
{
list-style-type: none;
border-top-width:1px; /* Create lines between cells. Each line is placed above each item */
border-top-style:solid;
border-top-color:rgb(217,217,217);
padding-top:10px;
padding-right:10px;
padding-bottom:14px; /* Indent the cell content 14 pixels from the bottom edge of a cell */
padding-left:10px;
}
li:first-child
{
border-top:0; /* Remove border above the first item of the list */
}
a /* Handle the click/tap highlight. Highlight an entire cell with the iPhone grey background when tapped */
{
display: block; /* Sets the href to be a block rather than inline */
/* The padding properties adjust the text content within the href block */
padding-top: 8px;
padding-right: 8px;
padding-bottom: 12px;
padding-left: 8px;
/* The margin properties adjust the size of the href block */
margin-top: -8px;
margin-right: -8px;
margin-bottom: -12px;
margin-left: -8px;
text-decoration: none;
color:black;
}
В итого на iPhone мы должны увидеть примерно следующее
Некоторые могли заметить, что рядом с заголовком iTunes выводится название текущее трека, для этого на страницу добавим пару строк
Этот код будет выводить название файла загруженного в QuickTime<h1>QuickTime - <?php echo exec('osascript -e \'tell application "QuickTime Player" to get the name of the document 1\'')?></h1>
<h1>iTunes - <?php echo exec('osascript -e \'tell application "iTunes" to get the name of the current track\'');?></h1>
А этот выведет название текущего трека.
Вот мы и сделали наше веб приложение для Iphone'а. Спасибо за внимание.