mirror of
https://github.com/apache/cordova-android.git
synced 2025-02-20 23:56:20 +08:00
Forgot to add the example app. Works with the script
This commit is contained in:
Joe Bowser
parent
29ae492983
commit
93ec092eaf
100
bin/templates/project/assets/www/css/index.css
Normal file
100
bin/templates/project/assets/www/css/index.css
Normal file
@ -0,0 +1,100 @@
|
||||
html,
|
||||
body {
|
||||
height:100%;
|
||||
font-size:12px;
|
||||
width:100%;
|
||||
}
|
||||
|
||||
html {
|
||||
display:table;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color:#A7A7A7;
|
||||
background-image:linear-gradient(top, #A7A7A7 0%, #E4E4E4 51%);
|
||||
background-image:-webkit-linear-gradient(top, #A7A7A7 0%, #E4E4E4 51%);
|
||||
background-image:-ms-linear-gradient(top, #A7A7A7 0%, #E4E4E4 51%);
|
||||
background-image:-webkit-gradient(
|
||||
linear,
|
||||
left top,
|
||||
left bottom,
|
||||
color-stop(0, #A7A7A7),
|
||||
color-stop(0.51, #E4E4E4)
|
||||
);
|
||||
display:table-cell;
|
||||
font-family:'HelveticaNeue-Light', 'HelveticaNeue', Helvetica, Arial, sans-serif;
|
||||
text-transform:uppercase;
|
||||
vertical-align:middle;
|
||||
}
|
||||
|
||||
.app {
|
||||
background-image:url(../img/cordova.png);
|
||||
background-repeat:no-repeat;
|
||||
margin:0px auto;
|
||||
width:275px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size:2em;
|
||||
font-weight:300;
|
||||
margin:0px;
|
||||
overflow:visible;
|
||||
padding:0px;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.status {
|
||||
background-color:#333333;
|
||||
border-radius:4px;
|
||||
-webkit-border-radius:4px;
|
||||
color:#FFFFFF;
|
||||
font-size:1em;
|
||||
margin:0px auto;
|
||||
padding:2px 10px;
|
||||
text-align:center;
|
||||
width:100%;
|
||||
max-width:175px;
|
||||
}
|
||||
|
||||
.status.complete {
|
||||
background-color:#4B946A;
|
||||
}
|
||||
|
||||
.hide {
|
||||
display:none;
|
||||
}
|
||||
|
||||
@keyframes fade {
|
||||
from { opacity: 1.0; }
|
||||
50% { opacity: 0.4; }
|
||||
to { opacity: 1.0; }
|
||||
}
|
||||
|
||||
@-webkit-keyframes fade {
|
||||
from { opacity: 1.0; }
|
||||
50% { opacity: 0.4; }
|
||||
to { opacity: 1.0; }
|
||||
}
|
||||
|
||||
.blink {
|
||||
animation:fade 3000ms infinite;
|
||||
-webkit-animation:fade 3000ms infinite;
|
||||
}
|
||||
|
||||
/* portrait */
|
||||
/* @media screen and (max-aspect-ratio: 1/1) */
|
||||
.app {
|
||||
background-position:center top;
|
||||
height:100px; /* adds enough room for text */
|
||||
padding:180px 0px 0px 0px; /* background height - shadow offset */
|
||||
}
|
||||
|
||||
/* lanscape (when wide enough) */
|
||||
@media screen and (min-aspect-ratio: 1/1) and (min-width:445px) {
|
||||
.app {
|
||||
background-position:left center;
|
||||
height:140px; /* height + padding = background image size */
|
||||
padding-left:170px; /* background width */
|
||||
padding-top:60px; /* center the text */
|
||||
}
|
||||
}
|
||||
BIN
bin/templates/project/assets/www/img/cordova.png
Normal file
BIN
bin/templates/project/assets/www/img/cordova.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
@ -1,60 +1,24 @@
|
||||
<!DOCTYPE HTML>
|
||||
<!--
|
||||
Licensed to the Apache Software Foundation (ASF) under one
|
||||
or more contributor license agreements. See the NOTICE file
|
||||
distributed with this work for additional information
|
||||
regarding copyright ownership. The ASF licenses this file
|
||||
to you under the Apache License, Version 2.0 (the
|
||||
"License"); you may not use this file except in compliance
|
||||
with the License. You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing,
|
||||
software distributed under the License is distributed on an
|
||||
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
KIND, either express or implied. See the License for the
|
||||
specific language governing permissions and limitations
|
||||
under the License.
|
||||
-->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=320; user-scalable=no" />
|
||||
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
|
||||
<title>PhoneGap</title>
|
||||
<link rel="stylesheet" href="master.css" type="text/css" media="screen" title="no title">
|
||||
<script type="text/javascript" charset="utf-8" src="cordova-2.0.0.js"></script>
|
||||
<script type="text/javascript" charset="utf-8" src="main.js"></script>
|
||||
|
||||
</head>
|
||||
<body onload="init();" id="stage" class="theme">
|
||||
<h1>Welcome to Cordova!</h1>
|
||||
<h2>this file is located at assets/www/index.html</h2>
|
||||
<div id="info">
|
||||
<h4>Platform: <span id="platform"> </span>, Version: <span id="version"> </span></h4>
|
||||
<h4>UUID: <span id="uuid"> </span>, Name: <span id="name"> </span></h4>
|
||||
<h4>Width: <span id="width"> </span>, Height: <span id="height">
|
||||
</span>, Color Depth: <span id="colorDepth"></span></h4>
|
||||
</div>
|
||||
<dl id="accel-data">
|
||||
<dt>X:</dt><dd id="x"> </dd>
|
||||
<dt>Y:</dt><dd id="y"> </dd>
|
||||
<dt>Z:</dt><dd id="z"> </dd>
|
||||
</dl>
|
||||
<a href="#" class="btn large" onclick="toggleAccel();">Toggle Accelerometer</a>
|
||||
<a href="#" class="btn large" onclick="getLocation();">Get Location</a>
|
||||
<a href="tel:411" class="btn large">Call 411</a>
|
||||
<a href="#" class="btn large" onclick="beep();">Beep</a>
|
||||
<a href="#" class="btn large" onclick="vibrate();">Vibrate</a>
|
||||
<a href="#" class="btn large" onclick="show_pic();">Get a Picture</a>
|
||||
<a href="#" class="btn large" onclick="get_contacts();return false;">Get Phone's Contacts</a>
|
||||
<a href="#" class="btn large" onclick="check_network();return false;">Check Network</a>
|
||||
<dl>
|
||||
<dt>Compass Heading:</dt><dd id="h">Off</dd>
|
||||
</dl>
|
||||
<a href="#" class="btn large" onclick="toggleCompass();return false;">Toggle Compass</a>
|
||||
<div id="viewport" class="viewport" style="display: none;">
|
||||
<img style="width:60px;height:60px" id="test_img" src="" />
|
||||
</div>
|
||||
</body>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta name = "format-detection" content = "telephone=no">
|
||||
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width;" />
|
||||
<link rel="stylesheet" type="text/css" href="css/index.css" />
|
||||
<title>Hello Cordova</title>
|
||||
</head>
|
||||
<body>
|
||||
<div class="app">
|
||||
<h1>Apache Cordova™</h1>
|
||||
<div id="deviceready">
|
||||
<p class="status pending blink">Connecting to Device</p>
|
||||
<p class="status complete blink hide">Device is Ready</p>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="cordova-2.0.0.js"></script>
|
||||
<script type="text/javascript" src="js/index.js"></script>
|
||||
<script type="text/javascript">
|
||||
app.initialize();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
15
bin/templates/project/assets/www/js/index.js
Normal file
15
bin/templates/project/assets/www/js/index.js
Normal file
@ -0,0 +1,15 @@
|
||||
var app = {
|
||||
initialize: function() {
|
||||
this.bind();
|
||||
},
|
||||
bind: function() {
|
||||
document.addEventListener('deviceready', this.deviceready, false);
|
||||
},
|
||||
deviceready: function() {
|
||||
app.report('deviceready');
|
||||
},
|
||||
report: function(id) {
|
||||
document.querySelector('#' + id + ' .pending').classList.add('hide');
|
||||
document.querySelector('#' + id + ' .complete').classList.remove('hide');
|
||||
}
|
||||
};
|
||||
Loading…
Reference in New Issue
Block a user