Windows Summit 2010 4/6/2017 © 2010 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be.

Presentation on theme: "Windows Summit 2010 4/6/2017 © 2010 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be."— Presentation transcript:

1 Windows Summit 2010 4/6/2017 © 2010 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

2 Leon Braginski Senior Program Manager Microsoft Corporation
Internet Explorer 9 Desktop Integration Using Pinning (Internet Explorer 9 のピン固定表示によるデスクトップ統合) Leon Braginski Senior Program Manager Microsoft Corporation

3 目的 Web サイトでアプリケーションのような ユーザー エクスペリエンスを提供する新 機能を発見する
ピン (pinning) による固定表示機能を利用 するためのコードを理解する

4 議題 Windows の固定表示 (ピン) の概要 なぜ固定表示を使うのか？
Thursday, April 06, 2017 議題 Windows の固定表示 (ピン) の概要 なぜ固定表示を使うのか？ Internet Explorer 9 での Web サイトの固定 表示 リソース Microsoft 社外秘

5 Windows 7 と Internet Explorer 9 の 固定表示とジャンプ リスト
デモ Windows 7 と Internet Explorer 9 の 固定表示とジャンプ リスト

6 Web サイトのタスク バーへの固定 URL やタブをタスク バーにドラッグ可能 どんな Web サイトもタスクバーに固定可能
開発者が追加できる拡張機能: ジャンプ リストのアイテム プレビュー サムネイル バーのボタン オーバーレイ アイコン

7 JavaScript API による Web サイトのスタート メニューへの追加
プログラムによってのみ、 スタート メニューへのサイ トの追加が可能 API により、タスク バーで はなくスタート メニューに Web サイトを固定表示可能

8 コード: JavaScript によるスタート メニューへの Web サイトの追加
// 正しい機能検出を備えたコード if (  window.external.msAddSiteMode  )  {         window.external.msAddSiteMode(); } else  {         // サイト モードはサポートされない // Beta での対処方法 try {         window.external.msAddSiteMode(); catch (ex) {

9 Web アプリケーションがサイト モードで動作していることを検出する
// 正しい機能検出を備えたコード if (window.external.msIsSiteMode && window.external.msIsSiteMode()) { // サイトはサイト モードで動作中 } else { // サイトはサイト モードで動作していない // Windows メニューへのサイトの追加を推奨 // Beta での対処方法 try {        if (window.external.msIsSiteMode() ) { catch (ex) {         // サイトはサイト モードで動作していない

10 ジャンプ リストの構造 カテゴリ タスク 1 つのカテゴリのみ 最大 20 のアイテム JavaScript で追加 ページ固有のアクション
最近使用した項目の自動 表示 タスク 最大 5 タスク アプリケーション固有の アクション メタ タグでの追加 カテゴリ タスク 高品質なアイコン

11 カテゴリへのアイテムの追加 window.external.msSiteModeCreateJumplist
('Developer Blog Posts'); window.external.msSiteModeAddJumpListItem ('Benefits …' , ' ' … window.external.msSiteModeShowJumplist();

12 タスクへのアイテムの追加 <meta name="msapplication-task"
content="name=Dev Portal - New Items; action-uri=new.htm; icon-uri=./images/alert.ico"/> <meta name="msapplication-task" content="name=Dev Portal – Blogs; action-uri=Default.htm; icon-uri=./images/favicon.ico"/>

13 固定表示されたサイトのアイコン お気に入りサイトのアイコンをタスク バー上でアプリケーション アイコンとして使用
オーバーレイ アイコンを表示または非表示にするには: window.external.msSiteModeSetIconOverlay(…); window.external.msSiteModeClearIconOverlay(); オーバーレイ アイコン アプリケーション アイコン

14 タスク バーのプレビュー ウィンドウの構造 サムネイル バーのボタン タスク バー サムネイル ツール バーへの追加が可能
クリックするとイベントが 再生 非表示可能 複数のスタイルが可能 サムネイル ツール バー

15 コード: ツール バーのプレビュー ボタン document.addEventListener('msthumbnailclick', thumbnailclick, false); … btnPlayVideo = window.external.msSiteModeAddThumbBarButton('play.ico','Play'); stylePause = window.external.msSiteModeAddButtonStyle(btnPlayVideo, 'Pause.ico','Pause'); stylePlay = window.external.msSiteModeAddButtonStyle(btnPlayVideo, 'Play.ico','Play'); window.external.msSiteModeShowThumbBar(); function thumbnailclick(btn) { if (btn.buttonID == btnPlayVideo ) { if (videoIsPlaying) { Window.external.msSiteModeShowButtonStyle(btnPlayVideo, stylePause); }

16 Internet Explorer 9 のアイコン ガイド
Windows Summit 2010 4/6/2017 Internet Explorer 9 のアイコン ガイド 機能 96 dpi 120 dpi 144 dpi 新しいタブ ページ タイル 32x32 40x40*  *48 を 40 に調整 48x48 固定表示されたサイト (タスクバー、スタート メニュー) 64x64 固定表示されたサイト (トップ フレーム) 24x24 ジャンプ リストのアイテム 16x16 サムネイル バーのボタン タブとお気に入り (Internet Explorer 8 にもあり) © 2010 Microsoft Corporation.All rights reserved.Microsoft、Windows、Windows Vista およびその他の製品名は、米国 Microsoft Corporation の米国およびその他の国における登録商標または商標です。 このプレゼンテーション スライドに記載された内容は情報の提供のみを目的としており、このプレゼンテーション スライドの作成日におけるマイクロソフトの見解を示すものです。マイクロソフトは市場の変化に対応する必要があるため、このプレゼンテーション スライドの内容に関する責任をマイクロソフトは問われないものとします。また、このプレゼンテーションの日付以降に発表される情報の正確性を保証できません。 明示、黙示または法律の規定にかかわらず、これらの情報についてマイクロソフトはいかなる責任も負わないものとします。

17 デモ 固定表示について…

18 皆様へのお願い 貴社の Web サイト用に高品質のお気に入り アイコンを使用してください。
Windows Summit 2010 4/6/2017 皆様へのお願い 貴社の Web サイト用に高品質のお気に入り アイコンを使用してください。 32x32 以上 固定表示のエクスペリエンスを向上させる ために、以下のものを提供してください。 ジャンプ リストのアイテム 通知用のオーバーレイ アイコン サムネイル プレビュー ボタン 下記で固定表示のデモをご覧ください。 © 2010 Microsoft Corporation.All rights reserved.Microsoft、Windows、Windows Vista およびその他の製品名は、米国 Microsoft Corporation の米国およびその他の国における登録商標または商標です。 このプレゼンテーション スライドに記載された内容は情報の提供のみを目的としており、このプレゼンテーション スライドの作成日におけるマイクロソフトの見解を示すものです。マイクロソフトは市場の変化に対応する必要があるため、このプレゼンテーション スライドの内容に関する責任をマイクロソフトは問われないものとします。また、このプレゼンテーションの日付以降に発表される情報の正確性を保証できません。 明示、黙示または法律の規定にかかわらず、これらの情報についてマイクロソフトはいかなる責任も負わないものとします。

19 Windows 7 | Presenter Mode
Thursday, April 06, 2017 リソース アイコンに関するガイドライン Pinned Sites MSDN Cookbook MSDN の Internet Explorer 9 に関する資料 Internet Explorer Test Drive Windows タスクバーの拡張機能 Microsoft Confidential

20 Windows Summit 2010 4/6/2017 © 2010 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION. © 2010 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.