123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100 |
- <!DOCTYPE HTML>
- <html>
- <head>
- <meta charset="utf-8"/>
- <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
- <meta name="HandheldFriendly" content="true"/>
- <meta name="MobileOptimized" content="320"/>
- <title>Hello H5+</title>
- <script type="text/javascript" src="../js/common.js"></script>
- <script type="text/javascript">
- var duration=null,counter=null,loading=null;
- document.addEventListener( "plusready", function(){
- counter = document.getElementById("counter");
- loading = document.getElementById("loading");
- duration = document.getElementById("duration");
- duration.addEventListener( "touchstart", durationStart, false );
- duration.addEventListener( "touchend", durationEnd, false );
- plus.statistic.eventTrig( "open" );
- plus.statistic.eventStart( "stay" );
- }, false );
- function statisticBack() {
- plus.statistic.eventEnd( "stay" );
- back();
- }
- var tc=null,tl=null,count=0;
- var ds=null;
- function doCounter(){
- loading.style.webkitTransition = "all 0.8s ease-in-out";
- loading.style.borderWidth = "0";
- loading.style.borderColor = "rgba(128,128,128,0.8)";
- tc = setTimeout( function(){
- count++;
- loading.style.webkitTransition = "";
- loading.style.borderWidth = "50px";
- loading.style.borderColor = "rgba(255,255,255,0)";
- counter.innerText = count;
- tl=setTimeout( doCounter, 0 );
- }, 1000 );
- }
- function durationStart(){
- ds = new Date();
- count = 0;
- counter.innerText = "0";
- counter.style.visibility = "visible";
- doCounter();
- outSet( "按下开始计时:" );
- }
- function durationEnd(){
- clearTimeout( tc );
- tc = null;
- clearTimeout( tl );
- tl = null;
- loading.style.webkitTransition = "";
- loading.style.borderWidth = "50px";
- loading.style.borderColor = "rgba(255,255,255,0)";
- counter.style.visibility = "hidden";
- var d = (new Date()).getTime()-ds.getTime();
- plus.statistic.eventDuration( "press", d );
- outLine( "您按下的时间为"+d+"ms,后台会将此数据提交到服务器!" );
- }
- </script>
- <link rel="stylesheet" href="../css/common.css" type="text/css" charset="utf-8"/>
- <style type="text/css">
- .counter {
- width: 100px;
- height: 100px;
- margin: 0 auto;
- line-height: 100px;
- font-size: 48px;
- visibility: hidden;
- }
- .loading {
- height: 100px;
- width: 100px;
- border-style:solid;
- position:relative;
- top: -100px;
- display:inline-block;
- box-sizing:border-box;
- border-width:50px;
- border-color:rgba(255,255,255,0);
- border-radius: 50px;
- }
- </style>
- </head>
- <body>
- <br/>
- <p class="des">应用会在后台统计打开此页面的次数及在此页面停留的时间,目前应用集成的是友盟统计插件,相关统计数据需要登录到<a href="" onclick="plus.runtime.openURL('http://www.umeng.com/');">友盟官网</a>查看。</p>
- <div style="height:100px;">
- <div id="counter" class="counter">0</div>
- <div id="loading" class="loading"></div>
- </div>
- <div id="duration" class="button">统计按下时长</div>
- <br/>
- <div id="outpos"/>
- <div id="output">
- Statistic模块管理统计功能,用于提供应用内统计的能力,支持统计和分析用户属性和用户行为数据。
- </div>
- </body>
- </html>
|