Samurize: лучшая система гаджетов для Windows — Лайфхакер

Samurize: лучшая система гаджетов для Windows - Лайфхакер Гаджет

Основное окно

Разметка основного окна ничем не отличается от разметки любой другой веб-страницы. Вдобавок нам предоставляют несколько исключительно гаджетовских тегов. Для задания фона гаджета, используется тег

g:background

. Любое содержимое, размещенное в данном элементе будет фоновым для всего основного окна.


Я не стал делать задний фон гаджету, с помощью параметра opacity=«0» фон стал абсолютно прозрачным.

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

Gadget.xml

Мы укажем в манифесте минимально нужную информацию.

Беспроводные костные наушники aftershokz


Наушники

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

Интересно, что раньше для передачи звука во внутреннее ухо в кость вживляли специальный штифт. Теперь же сверлить череп не нужно, наушники Aftershokz надеваются на голову, и сразу можно слушать музыку.

Браслет wme2


Умный

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

Разрабатывался браслет авторами первых iPhone, так что здесь все на высоте — и дизайн, и возможности. Интересной особенностью браслета является его способность измерить возраст вегетативной нервной системы.

Кратко о возможностях WME2:

Сейчас этот браслет уже можно купить в РФ.

Гаджеты для windows 10/8/7

Запуск и выбор скина

Запустить программу можно из главного меню. После запуска в системном трее появится новый значок, с помощью которого и производится управление. Правым кликом по иконке приложения вызываем контекстное меню, там находим пункт Выбрать файл и выбираем нужную тему.

Корректор осанки lumo lift

В общем, узнать о состоянии своего организма — это хорошо. Как известно, сидячая работа — вредит здоровью. И хуже всего — это неправильное положение тела при работе. Здесь может

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

Lumo Lift оптимально использовать при работе за компьютером (и, может быть, в метро, если вы много часов проводите в подземке).

Гаджет:  исследовательский проект на тему"Гаджеты в жизни детей" | Образовательная социальная сеть

Пишем гаджет windows sidebar с нуля

Недавно мне понадобилось создать гаджет для Windows Sidebar. Навыков в этом у меня не было, поэтому, немного погуглив и почитав

документацию

, приступаем.

Сразу покажу то, что получилось в итоге
Samurize: лучшая система гаджетов для Windows - Лайфхакер

Гаджет будет получать информацию с сайта в виде xml, парсить и, собственно, отображать. Также гаджет будет проверять наличие новых версий, и в случае их присутствия, отказываться работать 🙂
Изначально, ради получения опыта, хотел написать гаджет полностью на VBScript (так как с ним еще не имел дела), но в конечном итоге пришлось делать вставки на JavaScript.
Перейдем непосредственно к коду. Весь код здесь я рассматривать не буду, покажу лишь основные моменты. Ссылка на готовый гаджет – в конце статьи.
Главный файл гаджета – его манифест – файл Gadget.xml. Он должен называться именно так и располагаться в корне нашего архива (гаджет есть ни что иное, как архив ZIP с расширением .gadget).

<?xml version="1.0" encoding="utf-8" ?>
<gadget>
 <name>Weather from Info.Denms.Ru</name>
 <version>1.0.1232</version>
 <hosts>
  <host name="wdenms">
   <base type="HTML" apiVersion="1.0.0" src="main.html" />
   <permissions>Full</permissions>
   <platform minPlatformVersion="1.0" />
  </host>
 </hosts>
  <icons>
    <icon width="64" height="64" src="icon.png" />
  </icons> 
 <author name="cvs">
  <info url="http://info.denms.ru" />
 </author>
 <description>Weather Widget (Info.Denms.Ru)</description>
</gadget>

Рассмотрим его более подробно.
Элемент <base> должен содержать apiVersion, равный 1.0.0 (на данный момент), а также атрибут src, в котором указан главный файл нашего гаджета;
<permissions> — разрешения для гаджета. Устанавливаем равным full;
<platform> — минимальная версия Widows Sidebar. На данный момент – 1.0;
Параметры <name> — имя гаджета, <version> — версия, <author> — информация об авторе, <info> — ссылка на страницу с гаджетом, <icon> — иконка гаджета и <descrtiption> будут отображаться на панели установленных гаджетов.

Файл main.html – обычный html файл, приводить его полностью не буду, остановлюсь лишь на некоторых моментах.
С помощью элемента g:background задается фон гаджета. Сделаем его прозрачным.

<g:background id="background" style="position:absolute; z-index:-1; top:0; left:0;" opacity="0"></g:background>

Гаджет может находиться в двух состояниях – docked (слева на скрине выше), и undocked (справа). Будем хранить текущее состояние гаджета в переменной JavaScript docked.

<SCRIPT Language="VBScript">
'Вызов функции JavaScript из области VBS
function isDocked
    isDocked = isDockedJS()
End Function    
</script>
<script src="main.vbs" type="text/vbscript"></script>

<SCRIPT Language="JavaScript">
    docked = 0;
    function isDockedJS() { 
      return docked;
    }
</SCRIPT>
<script type="text/javascript" src="main.js"></script>

Функция-обертка isDocked потребуется нам в дальнейшем, чтобы из VBScript узнать текущее состояние гаджета (как я не старался, но реализовать это на чистом VBScript не смог). Еще одно замечание – скрипты корректно работают именно в этом порядке, т.е. сначала описываем скрипты VBScript, потом JavaScript.

Остальные элементы в main.html представлены элементами DIV с абсолютным позицированием. Впоследствии из скриптов мы будем обращаться к ним по их id.

  <div id="small_needupdate"></div>

С помощью JavaScript зададим состояния docked и undocked для гаджета, а так же укажем файл настроек (main.js)

System.Gadget.onDock = resize;
System.Gadget.onUndock = resize;
System.Gadget.settingsUI = "settings.html";
System.Gadget.onSettingsClosed = SettingsClosed;

docked=0; //начальное состояние гаджета
resize(); //инициализация

Как видно из листинга выше, при смене состояний гаджета будет вызываться функция resize().

function resize() {

 bd = document.body.style;
 System.Gadget.beginTransition();

 if (System.Gadget.docked) {
   // small state
    bd.width=148;  //устанавливаем размеры гаджета
    bd.height=201;
    docked = 1;
    bd.background='url(images/gadget.png) no-repeat'; //устанавливаем фон
   //далее следует перенос значений из состояния undocked в docked и обнуление элементов для состояния undocked
    document.getElementById("small_needupdate").innerHTML = document.getElementById("big_needupdate").innerHTML;
   document.getElementById("big_needupdate").innerHTML = "";
   //...
} else {
    // big state
    bd.width=230;
    bd.height=160;
    bd.background='url(images/gadgeth.png) no-repeat';
    docked=0;
    //перенос значений из состояния docked в undocked и обнуление элементов для состояния docked
   document.getElementById("big_needupdate").innerHTML = document.getElementById("small_needupdate").innerHTML;
   document.getElementById("small_needupdate").innerHTML = "";
   //...
}
System.Gadget.endTransition(System.Gadget.TransitionType.morph,1);
}

Также можно описать функцию сохранения настроек. В моем гаджете их нет, но для примера покажу как это делается

function SettingsClosed(event) {
 if (event.closeAction == event.Action.commit) {
  //alert System.Gadget.Settings.readString('test');
 }
}

readString – читает ранее сохраненную строку, writeString, соответственно, записывает.
Методы System.Gadget.beginTransition(); и System.Gadget.endTransition(); нужны для “плавного» изменения размера гаджета. В Windows Seven они игнорируются, но я все же оставил их для обратной совместимости.

Гаджет:  Гаджет погоды для Windows 7

Как уже говорилось выше, сервер предоставляет нам информацию о погоде в формате xml.

<?xml version="1.0"?>
<all>
  <day id="today">
  <temp>1.7</temp>
  <cloudyim>41</cloudyim>
  <cloudy>пасмурно</cloudy>
  <air>снег</air>
  <humidity>87</humidity>
  <wind_direction>Ю-З</wind_direction>
  <wind_speed>5</wind_speed>
  <min>-3</min>
  <max>-1</max>
</day>
<day id="ПТ">
  <min>-1</min>
  <cloudyim>26</cloudyim>
  <max>1</max>
</day>
  <day id="СБ">
  <min>-9</min>
  <cloudyim>41</cloudyim>
  <max>0</max>
</day>
…
</all>

Скачивать и парсить xml будем на VBScript.

Sub DownloadXML2
    Set objXML = CreateObject("Microsoft.XmlHttp")
    objXML.Open "GET", "http://info.kovonet.ru/weather.xml", True
    objXML.OnReadyStateChange = GetRef("objXML_onreadystatechange")
    objXML.setRequestHeader "If-Modified-Since", "Sat, 1 Jan 2000 00:00:00 GMT"
    objXML.Send
    iTimeoutID = window.SetTimeout("mySleep", 1000)
End Sub

Функция mySleep будет проверять наше соединение на таймаут.

Sub mySleep
  if bRespReceived = "false" then 'ответ еще не получен
    iTimeout = iTimeout   1
    if (iTimeout > 30) then  'таймаут
       timerFirstRun = window.SetTimeout("Update", 60000) 'попытка повторного обновления через минуту
    else 'таймаут еще не достигнут, продолжаем считать секунды
      iTimeoutID = window.SetTimeout("mySleep", 1000)
    end if
   end if
End Sub

В случае успешного скачивания objXML.readyState будет равен четырем, а статус (objXML.status) вернет значение 200.

Function objXML_onreadystatechange()
  If (objXML.readyState = 4) Then
    'msgbox objXML.statusText
    If (objXML.status = 200) Then
      bRespReceived=true
      SaveFile(objXML.responseText)
    else 
      timerFirstRun = window.SetTimeout("Update", 60000) 'попытка повторного обновления через минуту
    End If
  End If
End Function

В этом случае сохраняем файл во временную папку Windows

Function SaveFile(what)
  Set fso = CreateObject("Scripting.FileSystemObject")
  tempFolder = fso.GetSpecialFolder(2)
  filepath = tempFolder "weather.xml"
  Dim fso1, tf
  Set fso1 = CreateObject("Scripting.FileSystemObject")
  Set tf = fso1.CreateTextFile(filepath, True, True)  'rewrite, unicode
  tf.Write(what) 
  tf.Close
  ParseXML
End Function

и начинаем парсить файл.

Sub ParseXML
  Set fso = CreateObject("Scripting.FileSystemObject")
  tempFolder = fso.GetSpecialFolder(2)
  filepath = tempFolder "weather.xml"
  Set xmlDoc = CreateObject("Msxml2.DOMDocument") 
  xmlDoc.async="false"
  xmlDoc.load(filepath)
  'главная нода – в нашем случае <all>
  Set currNode = xmlDoc.documentElement
  'дни недели – <day>
  Set dayNode = currNode.firstChild
  While Not dayNode Is Nothing
    Set currNode = dayNode.firstChild
    While Not currNode Is Nothing
      if currNode.parentNode.getAttribute("id") = "today" then 'сегодняшний день
      if currNode.nodeName = "temp" then document.getElementById(prefix "maintemp").innerHTML = currNode.childNodes(0).text Chr(176)
      'отображаем остальные элементы
    Else 'не сегодняшний день, отображаем более мелко
      '...
    end If
    Set currNode = currNode.nextSibling
    Wend
  Set dayNode = dayNode.nextSibling
Wend
End Sub

Проверка на новые версии производится точно таким же способом.
Не забываем создать файл настроек — settings.html, о существовании которого мы объявили выше.

<html>
 <head>
  <title>Настройки</title>
  <style type="text/css">
  body { width:220px; height:120px; }
  </style>
 </head>
 <body>
  <div style="text-align:center">
   <strong>Weather from Info.Denms.Ru<br/><script type="text/javascript">document.write(System.Gadget.version);</script></strong><br/>
   © cvs, 2021<br/>
   <a href="http://info.denms.ru">http://info.kovonet.ru</a><br/><br/>
  </div>
 </body>
</html>

Вот, собственно, и все. Буду рад, если моя (первая :)) статья оказалась кому-то полезной.

Использованные источники:
http://www.script-coding.com/XMLDOMscripts.html;
http://msdn.microsoft.com/en-us/library/bb508511(v=VS.85).aspx;
VBScript Programmers Reference, 3rd Edition;
ну, и, конечно, http://google.com.

Ссылка на гаджет – http://info.kovonet.ru/test.gadget.

Радиометка nut

А чтобы не лишиться своих вещей (например, заряженного в предыдущем пункте смартфона), стоит приобрести

, с двухсторонней системой обнаружения.

Что умеет такая метка? Да многое:

Собственно, на сегодня все — с таким комплектом разных девайсов можно чувствовать себя защищенным, всезнающим и здоровым 🙂

Редактор

Будьте готовы к тому, что многие темы или отдельные гаджеты могут у вас сразу не заработать. Не пугайтесь, это связано с тем, что отображение некоторых системных параметров привязано к конкретному компьютеру и требует настройки. Для этого существует редактор тем.

Запускается редактор из контекстного меню значка в системном трее. Слева расположен перечень элементов темы, посередине предпросмотр, справа — свойства выделенного элемента. Сложного ничего нет и методом тыка любой человек сможет разобраться в редактировании гаджетов. А еще с помощью редактора можно создавать свои темы, но это тема для отдельной большой статьи.

Сестра, скальпель


Гаджет – это обыкновенный zip-файл, который внутри себя хранит нужную информацию для развертывания. Сам гаджет – это набор HTML, CSS, JavaScript файлов, изображений и т.д.

Гаджет состоит из нескольких файлов с условными названиями:

Для управления поведением, видом гаджета,, хранения данных используется специальный объект System.Gadget.

Скрипты и плагины

Хотя в базовой конфигурации Samurize имеет довольно неплохую функциональность, есть возможность расширить его возможности с помощью специальных плагинов. Плагины эти разработаны сообществом пользователей программы и служат самым разнообразным целям.

Гаджет:  Mining Gadgets - Лазерный инструмент и бур (1.16.4, 1.15.2, 1.14.4) • Моды для Minecraft

Темная сторона, люк

Самый главный файл – JavaScript. Сразу оговорюсь, alert и confirm в гаджетах не работают. Для отладки гаджета, можно воспользоваться Visual Studio, но для этого нужно выполнить два хитрых действия. Прежде всего, включить отладчик JavaScript в Internet Explorer

Добавить в нужном месте кода гаджета строку:

debugger;

и перезапустить гаджет.

Мы объявляем две глобальных переменных, которые отвечают за время в минутах для обновления данных в гаджете, для меня оптимально 30 минут, а также счетчик отсчета оставшихся минут до обновления

var updateInterval = 30;
var updateMinutes = updateInterval;

Функция init содержит действия для инициализации гаджета, мне в данном случае было нужно установить прозрачность гаджета на 40%, чтобы он не перекрывал полностью кусочек рабочего стола.

function init() {
System.Gadget.Settings.write("PrivateSetting_GadgetOpacity", 40);
}

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

function startMonitoring() {
init();

updateList();
setInterval(updateList, updateInterval * 1000 * 60);
setInterval(updateTimer, 1000 * 60);

statusLink.onclick = function() {
updateList();
}
}


Добавление обработчика на нажатие происходит в данном случае двумя способами:

element.onclick = function(){}
$(element).get(0).onclick = function(){}

Продвинутые способы в гаджетах не работают:

element.attachEvent('onclick', function(){})
$(element).bind('click', function(){})

Для обновления самого таймера маленькая функция updateTimer, которая каждую минуту рассчитывает сколько времени осталось до обновления.

function updateTimer() {
updateMinutes = updateMinutes == 0 ? updateInterval : updateMinutes - 1;
$('#statusLink').html('Update in ' updateMinutes ' m.');
}

И наконец, обновление списка серверов, для возвращенных данных я использую JSON, вид ответа примерно такой:

[{«ip»:«***.45.**.60»,«lastHitTime»:«2009-09-06 00:07:24»,«runningTasks»:«1»}]

Для получения самих данных – getJSON. Вы можете использовать и AJAX, он прекрасно работает в гаджетах. Прежде всего, используя getJSON мы можем отлаживать код в браузере, не добавляя его в гаджет, AJAX нам такое сделать не позволит. В зависимости от загрузки сервера, я закрашиваю ячейку разным фоном.

Умные часы lg urbane

Теперь перейдем к чисто деловым гаджетам. Одним из них можно назвать умные часы

, которые позиционируются разработчиком, как цифровой помощник. Эти часы могут если не все, то многое: напоминания, уведомления о предстоящих событиях, фитнес-функции. И еще это устройство относится к категории «премиум»: металлический корпус, металлический же или кожаный ремешок — все это стильное и привлекательное.

Характеристики? Довольно интересные:

Универсальная настольная зарядная станция


Чтобы не слишком беспокоиться о заряде в аккумуляторах всех своих гаджетов, может пригодиться

— настольная зарядная USB станция. Это отличное решение как для дома, так и для офиса.

На зарядной станции одновременно можно разместить и быстро зарядить 4 устройства, причем станция автоматически адаптируется к iPad, iPhone, телефонам и планшетам Samsung и мобильным устройствам других производителей.

Заключение

В рамках одной статьи невозможно дать более полное представление о всех возможностях этой замечательной программы. Скажу лишь, что по мере знакомства с Samurize у меня сложилось впечатление, что с ее помощью можно сделать практически все. Например, сделать в Windows почти такую же панель задач с отображением системной информации, как в Ubuntu.

Или направить на свой Рабочий стол поток мудрости в виде автоматически обновляемых вдохновляющих цитат из сети.

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

Оцените статью
GadgetManiac
Добавить комментарий