You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@cordova.apache.org by an...@apache.org on 2012/07/19 01:16:56 UTC
[5/10] adding standard sample app to bada
http://git-wip-us.apache.org/repos/asf/incubator-cordova-bada-wac/blob/1bf09f15/Res/css/index.css
----------------------------------------------------------------------
diff --git a/Res/css/index.css b/Res/css/index.css
new file mode 100644
index 0000000..c869f87
--- /dev/null
+++ b/Res/css/index.css
@@ -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 */
+ }
+}
http://git-wip-us.apache.org/repos/asf/incubator-cordova-bada-wac/blob/1bf09f15/Res/img/cordova.png
----------------------------------------------------------------------
diff --git a/Res/img/cordova.png b/Res/img/cordova.png
new file mode 100644
index 0000000..e8169cf
Binary files /dev/null and b/Res/img/cordova.png differ
http://git-wip-us.apache.org/repos/asf/incubator-cordova-bada-wac/blob/1bf09f15/Res/index.html
----------------------------------------------------------------------
diff --git a/Res/index.html b/Res/index.html
index 5ce902c..f5cf621 100644
--- a/Res/index.html
+++ b/Res/index.html
@@ -1,167 +1,24 @@
-<!--
-
- 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 xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en">
-<head>
- <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
- <meta name="viewport" content="target-densitydpi=high-dpi, user-scalable=no" />
- <title>Cordova Sample</title>
- <script type="text/javascript" src="./js/cordova.js"></script>
- <style type="text/css">
- button.btn {
- color:#050;
- font: bold 24px 'trebuchet ms',helvetica,sans-serif;
- background-color:#fed;
- width: 400px;
- height: 100px;
- border: 1px solid;
- border-color: #696 #363 #363 #696;
- /* filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffffff',EndColorStr='#ffeeddaa'); */
- }
-
- button.btn2 {
- color:#050;
- font: bold 24px 'trebuchet ms',helvetica,sans-serif;
- background-color:#fed;
- width: 200px;
- height: 100px;
- border: 1px solid;
- border-color: #696 #363 #363 #696;
- /* filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffffff',EndColorStr='#ffeeddaa'); */
- }
- </style>
- <link href="osp://webapp/css/style.css" rel="stylesheet" type="text/css" />f
- <script type="text/javascript" src="osp://webapp/js/webapp_core.js"> </script>
- <script type="text/javascript" src="osp://webapp/js/webapp_ui.js"> </script>
- <script>
- document.addEventListener("deviceready", function(e) {alert('Cordova is ready');});
- </script>
-</head>
-<body>
- <ul>
- <li>
- <h3>Device</h3>
- <div><button type="button" class="btn" onclick="setDeviceInfo()">DeviceInfo</button></div>
- <span id="device"></span>
- </li>
- <li>
- <h3>Acceleration</h3>
- <div>
- <button type="button" class="btn" onclick="getCurrentAcceleration();">getCurrentAcceleration</button>
- </div>
- <div>
- <button type="button" class="btn" id="accelBtn" onclick="toggleAcceleration();">watchAcceleration</button>
- </div>
- <div>
- <span id="acceleration"></span>
- </div>
- </li>
- <li>
- <h3>Geolocation</h3>
- <div>
- <button type="button" class="btn" onclick="getCurrentPosition();">getCurrentPosition</button>
- </div>
- <div>
- <button type="button" class="btn" id="geoBtn" onclick="togglePosition();">watchPosition</button>
- </div>
- <div>
- <span id="geolocation"></span>
- </div>
- </li>
- <li>
- <h3>Compass</h3>
- <div>
- <button type="button" class="btn" onclick="getCurrentHeading();">getCurrentHeading</button>
- </div>
- <div>
- <button type="button" class="btn" id="compassBtn" onclick="toggleCompass();">watchHeading</button>
- </div>
- <div>
- <span id="heading"></span>
- </div>
- </li>
- <li>
- <h3>Connection</h3>
- <div>
- <button type="button" class="btn" onclick="getConnection();">getConnectionType</button>
- </div>
- <div>
- <span id="connection"></span>
- </div>
- </li>
- <li>
- <h3>Notifications</h3>
- <div>
- <button type="button" class="btn" onclick="notificationAlert();">Alert</button>
- </div>
- <div>
- <button type="button" class="btn" onclick="notificationAlert();">Confirm</button>
- </div>
- <div>
- <button type="button" class="btn" onclick="notificationVibrate();">Vibrate</button>
- </div>
- <div>
- <button type="button" class="btn" onclick="notificationBeep();">Beep</button>
- </div>
- <div>
- <button type="button" class="btn" onclick="notificationLightOn();">Light ON</button>
- </div>
- </li>
- <li>
- <h3>Camera</h3>
- <div>
- <button type="button" class="btn" onclick="cameraPreview();">cameraPreview</button>
- </div>
- <div id="cameraControls" style="display:none;">
- <span>
- <button type="button" class="btn2" onclick="startVideoCapture();">startVideoCapture</button>
- <button type="button" class="btn2" onclick="stopVideoCapture();">stopVideoCapture</button>
- </span>
- <div>
- <button type="button" class="btn" onclick="captureImage2();">captureImage</button>
- </div>
- </div>
- <div id="preview"></div>
- </li>
- <li>
- <h3>Capture</h3>
- <div>
- <button type="button" class="btn" onclick="captureImage();">captureImage</button>
- <button type="button" class="btn" onclick="captureVideo();">captureVideo</button>
- <button type="button" class="btn" onclick="getPicture();">getPicture</button>
- </div>
- <div id="media">
- </div>
- </li>
- <li>
- <h3>Contacts</h3>
- <div>
- <button type="button" class="btn" onclick="createContact();">createContact</button>
- <button type="button" class="btn" onclick="findContact();">findContact</button>
- <button type="button" class="btn" onclick="updateContact();">updateContact</button>
- <button type="button" class="btn" onclick="removeContact();">removeContacts</button>
- </div>
- </li>
- </ul>
- <script type="text/javascript" src="./js/sample.js"></script>
-</body>
+<html>
+ <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>