source: Dev/trunk/src/client/dojox/mobile/tests/test_pageTurningUtils-callback.html

Last change on this file was 483, checked in by hendrikvanantwerpen, 11 years ago

Added Dojo 1.9.3 release.
File size: 3.0 KB
Line 
1<!DOCTYPE html>
2<html>
3<head>
4        <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"/>
5        <meta name="apple-mobile-web-app-capable" content="yes" />
6        <title>Page Turning</title>
7        <link href="../themes/common/PageTurning.css" rel="stylesheet">
8        <script type="text/javascript" src="../deviceTheme.js" data-dojo-config="mblThemeFiles: ['base']"></script>
9        <script type="text/javascript" src="../../../dojo/dojo.js" data-dojo-config="async: true, parseOnLoad: true, mblAlwaysHideAddressBar: true"></script>
10
11        <script type="text/javascript">
12                require([
13                        "dojo/_base/connect",
14                        "dojo/dom",
15                        "dojo/ready",
16                        "dojox/mobile/pageTurningUtils",
17                        "dojox/mobile/parser",
18                        "dojox/mobile",
19                        "dojox/mobile/compat"
20                ], function(connect, dom, ready, pageTurningUtils){
21                        utils = new pageTurningUtils();
22                       
23                        ready(function(){
24                                // Set property values to pageTurningUtils object
25                                utils.init(285, 388);
26                               
27                                // Initialize catalog node
28                                utils.initCatalog(dom.byId("catalog"));
29                               
30                                // Connect to onPageTurned callback function
31                                connect.connect(utils, "onPageTurned", null, function(pageNode){
32                                        dom.byId("msgArea").innerHTML = "onPageTurned: " + pageNode.id;
33                                });
34                        });
35                       
36                        prev = function(){
37                                dom.byId("msgArea").innerHTML = "onPageTurned: ";
38                                utils.turnToPrev();
39                        };
40                       
41                        next = function(){
42                                dom.byId("msgArea").innerHTML = "onPageTurned: ";
43                                utils.turnToNext();
44                        };
45                });
46        </script>
47</head>
48<body style="visibility:hidden;">
49        <div id="view1" data-dojo-type="dojox.mobile.View">
50                <h1 data-dojo-type="dojox.mobile.Heading">Page Turning</h1>
51                <div style="margin:5px;">
52                        <button onclick="prev()" style="width:50px">Prev</button>
53                        <button onclick="next()" style="width:50px">Next</button>
54                </div>
55                <div id="msgArea" style="margin:10px;">onPageTurned: </div>
56                <div id="catalog" style="margin:10px;">
57                        <div id="page1">
58                                <img alt="" id="front1" src="images/pic1.jpg"/>
59                                <div id="back1"></div>
60                        </div>
61                        <div id="page2">
62                                <img alt="" id="front2" src="images/pic2.jpg"/>
63                                <div id="back2"></div>
64                        </div>
65                        <div id="page3">
66                                <img alt="" id="front3" src="images/pic3.jpg"/>
67                                <div id="back3"></div>
68                        </div>
69                        <div id="page4">
70                                <img alt="" id="front4" src="images/pic4.jpg"/>
71                                <div id="back4"></div>
72                        </div>
73                        <div id="page5">
74                                <img alt="" id="front5" src="images/pic5.jpg"/>
75                                <div id="back5"></div>
76                        </div>
77                        <div id="page6">
78                                <img alt="" id="front6" src="images/pic6.jpg"/>
79                                <div id="back6"></div>
80                        </div>
81                        <div id="page7">
82                                <img alt="" id="front7" src="images/pic7.jpg"/>
83                                <div id="back7"></div>
84                        </div>
85                        <div id="page8">
86                                <img alt="" id="front8" src="images/pic8.jpg"/>
87                                <div id="back8"></div>
88                        </div>
89                        <div id="page9">
90                                <img alt="" id="front9" src="images/pic9.jpg"/>
91                                <div id="back9"></div>
92                        </div>
93                        <div id="page10">
94                                <img alt="" id="front10" src="images/pic10.jpg"/>
95                                <div id="back10"></div>
96                        </div>
97                </div>
98        </div>
99</body>
100</html>
Note: See TracBrowser for help on using the repository browser.