<?xml version="1.0" encoding="UTF-8"?>
<projectDescription>
- <name>Compass</name>
- <comment></comment>
- <projects>
- </projects>
- <buildSpec>
- <buildCommand>
- <name>org.eclipse.wst.common.project.facet.core.builder</name>
- <arguments>
- </arguments>
- </buildCommand>
- <buildCommand>
- <name>org.eclipse.wst.jsdt.core.javascriptValidator</name>
- <arguments>
- </arguments>
- </buildCommand>
- <buildCommand>
- <name>json.validation.builder</name>
- <arguments>
- </arguments>
- </buildCommand>
- <buildCommand>
- <name>org.tizen.web.jslint.nature.JSLintBuilder</name>
- <arguments>
- </arguments>
- </buildCommand>
- <buildCommand>
- <name>org.tizen.web.css.nature.CSSBuilder</name>
- <arguments>
- </arguments>
- </buildCommand>
- <buildCommand>
- <name>org.eclipse.wst.validation.validationbuilder</name>
- <arguments>
- </arguments>
- </buildCommand>
- <buildCommand>
- <name>org.tizen.web.project.builder.WebBuilder</name>
- <arguments>
- <dictionary>
- <key>usedLibraryType</key>
- <value>WebUIFramework</value>
- </dictionary>
- </arguments>
- </buildCommand>
- </buildSpec>
- <natures>
- <nature>json.validation.nature</nature>
- <nature>org.tizen.web.jslint.nature.JSLintNature</nature>
- <nature>org.tizen.web.css.nature.CSSNature</nature>
- <nature>org.eclipse.wst.jsdt.core.jsNature</nature>
- <nature>org.eclipse.wst.common.project.facet.core.nature</nature>
- <nature>org.eclipse.wst.common.modulecore.ModuleCoreNature</nature>
- <nature>org.tizen.web.project.builder.WebNature</nature>
- </natures>
+ <name>Compass</name>
+ <comment></comment>
+ </projects>
+ <buildSpec>
+ <buildCommand>
+ <name>org.eclipse.wst.common.project.facet.core.builder</name>
+ </arguments>
+ </buildCommand>
+ <buildCommand>
+ <name>org.eclipse.wst.jsdt.core.javascriptValidator</name>
+ </arguments>
+ </buildCommand>
+ <buildCommand>
+ <name>json.validation.builder</name>
+ </arguments>
+ </buildCommand>
+ <buildCommand>
+ <name>org.tizen.web.jslint.nature.JSLintBuilder</name>
+ </arguments>
+ </buildCommand>
+ <buildCommand>
+ <name>org.tizen.web.css.nature.CSSBuilder</name>
+ </arguments>
+ </buildCommand>
+ <buildCommand>
+ <name>org.eclipse.wst.validation.validationbuilder</name>
+ </arguments>
+ </buildCommand>
+ <buildCommand>
+ <name>org.tizen.web.project.builder.WebBuilder</name>
+ <dictionary>
+ <key>usedLibraryType</key>
+ <value>WebUIFramework</value>
+ </dictionary>
+ </arguments>
+ </buildCommand>
+ </buildSpec>
+ <natures>
+ <nature>json.validation.nature</nature>
+ <nature>org.tizen.web.jslint.nature.JSLintNature</nature>
+ <nature>org.tizen.web.css.nature.CSSNature</nature>
+ <nature>org.eclipse.wst.jsdt.core.jsNature</nature>
+ <nature>org.eclipse.wst.common.project.facet.core.nature</nature>
+ <nature>org.eclipse.wst.common.modulecore.ModuleCoreNature</nature>
+ <nature>org.tizen.web.project.builder.WebNature</nature>
+ </natures>
</projectDescription>
Copyright (c) 2013 Samsung Electronics Co., Ltd. All rights reserved.
Except as noted, this software is licensed under Flora License, Version 1.1
Please, see the LICENSE.Flora file for Flora License, Version 1.1 terms and conditions.
+
<?xml version="1.0" encoding="UTF-8"?>
-<widget
- xmlns="http://www.w3.org/ns/widgets"
- xmlns:tizen="http://tizen.org/ns/widgets"
- id="http://sample-web-application.tizen.org/compass" version="2.2.0"
- viewmodes="fullscreen">
-
- <tizen:application
- id="2dKf9wyV6t.Compass"
- package="2dKf9wyV6t"
- required_version="2.2" />
-
- <content src="index.html" />
-
- <icon src="icon.png" />
-
- <name>Compass</name>
-
- <feature name="http://tizen.org/feature/screen.size.normal.720.1280" />
-
- <tizen:setting
- screen-orientation="portrait"
- context-menu="disable"
- background-support="disable"
- encryption="disable"
- install-location="auto" />
-
+<widget xmlns="http://www.w3.org/ns/widgets" xmlns:tizen="http://tizen.org/ns/widgets"
+ id="http://sample-web-application.tizen.org/compass" version="2.2.0"
+ viewmodes="fullscreen">
+ <tizen:application id="2dKf9wyV6t.Compass" package="2dKf9wyV6t"
+ required_version="2.2" />
+ <content src="index.html" />
+ <icon src="icon.png" />
+ <name>Compass</name>
+ <feature name="http://tizen.org/feature/screen.size.normal.720.1280"/>
+ <tizen:setting screen-orientation="portrait"
+ context-menu="disable" background-support="disable" encryption="disable"
+ install-location="auto" />
</widget>
html, body {
- margin: 0px;
- padding: 0px;
- overflow: hidden;
- background: black;
- -webkit-user-select: none;
+ margin: 0px;
+ padding: 0px;
+ overflow: hidden;
+ background: black;
}
#application {
- position: absolute;
- margin: 0px;
- padding: 0px;
- left: 0px;
- top: 0px;
- right: 0px;
- bottom: 0px;
- background-image: url('../images/compass_bg_new.png');
- background-repeat: no-repeat;
- background-position: right top;
- overflow: hidden;
+ position: absolute;
+ margin: 0px;
+ padding: 0px;
+ left: 0px;
+ top: 0px;
+ right: 0px;
+ bottom: 0px;
+ background-image: url('../images/compass_bg_new.png');
+ background-repeat: no-repeat;
+ background-position: right top;
+ overflow: hidden;
}
-#rotation {
- position: absolute;
- left: 44px;
- top: 351px;
- background-image: url('../images/compass_rotation.png');
- background-repeat: no-repeat;
- width: 392px;
- height: 392px;
- -webkit-transition: all 0.7s ease-out;
- -webkit-transform: rotate(0deg);
+#rotation{
+ position: absolute;
+ left: 44px;
+ top: 351px;
+ background-image: url('../images/compass_rotation.png');
+ background-repeat: no-repeat;
+ width: 392px;
+ height: 392px;
+ -webkit-transition: all 0.7s ease-out;
+ -webkit-transform: rotate(0deg);
}
-#shadow {
- position: absolute;
- left: 44px;
- top: 351px;
- background-image:url('../images/compass_cover.png');
- background-repeat: no-repeat;
- width: 392px;
- height: 392px;
+#shadow{
+ position: absolute;
+ left: 44px;
+ top: 351px;
+ background-image:url('../images/compass_cover.png');
+ background-repeat: no-repeat;
+ width: 392px;
+ height: 392px;
}
-#direction {
- position: absolute;
- left: 44px;
- top: 95px ;
- width: 392px;
- height: 37px;
- text-align: center;
- font-weight: bold;
- color: #FFFFFF;
- font-family: sans-serif;
- font-size: 30pt;
+#direction{
+ position: absolute;
+ left: 44px;
+ top: 95px ;
+ width: 392px;
+ height: 37px;
+ text-align: center;
+ font-weight: bold;
+ color: #FFFFFF;
+ font-family: verdana;
+ font-size: 30pt;
}
-#angle {
- position: absolute;
- left: 44px;
- top: 120px ;
- width: 392px;
- height: 70px;
- text-align: center;
- font-weight: bold;
- color: #FFFFFF;
- font-family: sans-serif;
- font-size: 55pt;
+#angle{
+ position: absolute;
+ left: 44px;
+ top: 120px ;
+ width: 392px;
+ height: 70px;
+ text-align: center;
+ font-weight: bold;
+ color: #FFFFFF;
+ font-family: verdana;
+ font-size: 55pt;
}
<!DOCTYPE html>
<html>
<head>
-
- <meta charset="utf-8" />
- <meta name="viewport" content="width=480, user-scalable=no">
-
- <title>Compass</title>
- <meta name="description" content="Compass" />
-
- <link rel="stylesheet" href="./css/style.css" />
- <script type="text/javascript" src="./js/jquery-1.7.1.min.js" defer="defer"></script>
- <script src="./js/main.js" defer="defer"></script>
-
+<meta charset="utf-8" />
+<meta name="viewport" content="user-scalable=no, width=480">
+<title>Compass</title>
+<link rel="stylesheet" href="./css/style.css" />
+<script type="text/javascript" src="./js/jquery-1.7.1.min.js" defer="defer"></script>
+<script src="./js/main.js" defer="defer"></script>
</head>
<body>
-
- <div id="application">
- <div id="rotation"><canvas id="canvas" width="392" height="392"></canvas></div>
- <div id="shadow"></div>
- <div id="direction"></div>
- <div id="angle"></div>
- </div>
-
+ <div id="application">
+ <div id="rotation"><canvas id="canvas" width="392" height="392"></canvas></div>
+ <div id="shadow"></div>
+ <div id="direction"></div>
+ <div id="angle"></div>
+ </div>
</body>
-</html>
+</html>
\ No newline at end of file
/*global document, window, tizen, $*/
-// application data:
-var lastAngle = -1, // last measurement
- rotation = 0; // compass rotation
+var angleMemory = -1,
+ rotation = 0;
-/**
- * Function handles new orientation data received from the device.
- *
- * @param eventData deviceorientation event containing new orientation data
- */
-function onDeviceOrientation(eventData) {
- 'use strict';
- // check if the angle has changed from the previous measurement
- if (eventData.alpha !== lastAngle) {
- var angle = eventData.alpha,
- deltaAngle,
- text = '';
+function onDeviceOrientation(dataEvent) {
+ "use strict";
+ if (dataEvent.alpha !== angleMemory) {
+ var angle = dataEvent.alpha,
+ deltaAngle,
+ text = '';
- // find direction from given angle
- if (angle < 68 || angle > 292) {
- text += 'NORTH';
- } else if (angle > 112 && angle < 248) {
- text += 'SOUTH';
- }
- if (angle > 22 && angle < 158) {
- text += 'EAST';
- } else if (angle > 202 && angle < 338) {
- text += 'WEST';
- }
+ if (angle < 68 || angle > 292) {
+ text += 'NORTH';
+ } else if (angle > 112 && angle < 248) {
+ text += 'SOUTH';
+ }
+ if (angle > 22 && angle < 158) {
+ text += 'EAST';
+ } else if (angle > 202 && angle < 338) {
+ text += 'WEST';
+ }
- // check angle change and calculate the rotation of the compass
- deltaAngle = lastAngle - angle;
- if (Math.abs(deltaAngle) > 180) {
- if (deltaAngle > 0) {
- rotation -= ((360 - lastAngle) + angle);
- } else {
- rotation += (lastAngle + (360 - angle));
- }
- } else {
- rotation += deltaAngle;
- }
+ deltaAngle = angleMemory - angle;
+ if (Math.abs(deltaAngle) > 180) {
+ if (deltaAngle > 0) {
+ rotation -= ((360 - angleMemory) + angle);
+ } else {
+ rotation += (angleMemory + (360 - angle));
+ }
+ } else {
+ rotation += deltaAngle;
+ }
- // save current measurement
- lastAngle = angle;
+ angleMemory = angle;
- // update the direction and angle labels
- $('#direction').text(text);
- $('#angle').html(Math.round(angle) + '<sup>o</sup>');
- // rotate the compass image
- $('#rotation').css('-webkit-transform', 'rotate(' + rotation + 'deg)');
- }
+ $('#direction').text(text);
+ $("#angle").html(Math.round(angle) + "<sup>o</sup>");
+ $('#rotation').css('-webkit-transform', 'rotate(' + rotation + 'deg)');
+ }
}
-/**
- * Function for binding device orientation changes to handler.
- */
function startSensor() {
- 'use strict';
- // bind device orientation changes to handler function
- window.addEventListener('deviceorientation', onDeviceOrientation, false);
+ "use strict";
+ window.addEventListener("deviceorientation", onDeviceOrientation, false);
}
-/**
- * Function binding UI events.
- */
-function bindEvents() {
- 'use strict';
- window.addEventListener('tizenhwkey', function (e) {
- if (e.keyName === 'back') {
- tizen.application.getCurrentApplication().exit();
- }
- });
+function hdExitButton() {
+ "use strict";
+ window.addEventListener('tizenhwkey', function(e) {
+ if (e.keyName == "back") {
+ tizen.application.getCurrentApplication().exit();
+ }
+ });
}
-/**
- * Function for initializing the application.
- */
function init() {
- 'use strict';
- // bind UI events
- bindEvents();
- // begin reading compass
- startSensor();
+ "use strict";
+ hdExitButton();
+ startSensor();
}
-// initialize application when the document is ready
+
+
$(document).ready(init);
projects / apps / web / sample / Compass.git / commitdiff