navigate.js


  Windows8 JS(Metro) テンプレート items.js



01.(function () {
02.    "use strict";
03. 
04.    var appViewState = Windows.UI.ViewManagement.ApplicationViewState;
05.    var ui = WinJS.UI;
06. 
07.    ui.Pages.define("/pages/items/items.html", {
08. 
09.        // This function updates the ListView with new layouts
10.        initializeLayout: function (listView, viewState) {
11.            /// <param name="listView" value="WinJS.UI.ListView.prototype" />
12. 
13.            if (viewState === appViewState.snapped) {
14.                listView.layout = new ui.ListLayout();
15.            } else {
16.                listView.layout = new ui.GridLayout();
17.            }
18.        },
19. 
20.        itemInvoked: function (args) {
21.            var groupKey = Data.groups.getAt(args.detail.itemIndex).key;
22.            WinJS.Navigation.navigate("/pages/split/split.html", { groupKey: groupKey });
23.        },
24. 
25.        // この関数は、ユーザーがこのページに移動するたびに呼び出されます。
26.        // ページ要素にアプリケーションのデータを設定します。
27.        ready: function (element, options) {
28.            var listView = element.querySelector(".itemslist").winControl;
29.            listView.itemDataSource = Data.groups.dataSource;
30.            listView.itemTemplate = element.querySelector(".itemtemplate");
31.            listView.oniteminvoked = this.itemInvoked.bind(this);
32. 
33.            this.initializeLayout(listView, Windows.UI.ViewManagement.ApplicationView.value);
34.            listView.element.focus();
35.        },
36. 
37.        // この関数は、viewState の変更に応じてページ レイアウトを更新します。
38.        updateLayout: function (element, viewState, lastViewState) {
39.            /// <param name="element" domElement="true" />
40.            /// <param name="viewState" value="Windows.UI.ViewManagement.ApplicationViewState" />
41.            /// <param name="lastViewState" value="Windows.UI.ViewManagement.ApplicationViewState" />
42. 
43.            var listView = element.querySelector(".itemslist").winControl;
44.            if (lastViewState !== viewState) {
45.                if (lastViewState === appViewState.snapped || viewState === appViewState.snapped) {
46.                    var handler = function (e) {
47.                        listView.removeEventListener("contentanimating", handler, false);
48.                        e.preventDefault();
49.                    }
50.                    listView.addEventListener("contentanimating", handler, false);
51.                    var firstVisible = listView.indexOfFirstVisible;
52.                    this.initializeLayout(listView, viewState);
53.                    listView.indexOfFirstVisible = firstVisible;
54.                }
55.            }
56.        }
57.    });
58.})();










  infoboard   管理者用   





フリーフォントWEBサービス
SQLの窓WEBサービス

SQLの窓フリーソフト

素材

一般WEBツールリンク

SQLの窓

フリーソフト

JSライブラリ