torstai 8. lokakuuta 2015

Mobiilituotekehitys: Painoindeksilaskuri Cordova

Mobiilituotekehitys kurssi
Ensimmäinen Cordova ohjelma

  • Painoindeksilaskuri
  • Tämä ohjelma laskee painoindeksisi pituutesi ja painosi mukaan, sekä kertoo oletko ali-, normaali- tai ylipainoinen!
  • alpha/ei toimi
  • APK 22

  • Tarkoituksena luoda toimiva painoindeksi laskuri Cordovalla. Muistiinpanojen pohjalta rakennettu kokonaisuus. En saanut toimimaan omalla tietokoneella, luulen johtuvan cordovan asennusesta (?)


Koodit, joita käytin ohjelman luomiseen. 
 
HMTL:
<!DOCTYPE html>

<html>
    <head>
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data:
gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
        <meta name="format-detection" content="telephone=no">
        <meta name="msapplication-tap-highlight" content="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">
<meta charset="utf-8" />
        <title>Painoindeksilaskuri</title>
    </head>
    <body>
<h1>Painoindeksilaskuri</h1>
<p> Kirjoita kenttiin painosi ja pituutesi.</p>
<p> Ohjelma laske painoindeksisi! </p>
        <form>
Paino <input id="paino" type="text" autofocus> kg
<br/>
Pituus <input id="pituus" type="text"> cm
<p>Painoindeksisi on  <span id="bmi"> <span>.</p>
<p><span id="result"> <span></p>
</form>

        <script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/calculate.js"></script>
        <script type="text/javascript" src="js/index.js"></script>
    </body>
</html>

JQUERY:
function calculateBMI(){
var p1=$("#paino").val();
var p2=$("#pituus").val();
var bmi=Math.round(p1/(p2/100*p2/100));
$("#bmi").text(bmi);

if (bmi < 18){
$("#result").text("Alipainonen.");

} else if (bmi < 25 && bmi > 18.5){
$("#result").text("kiva normaali.");

} else if (bmi < 28 && bmi > 25){
$("#result").text("Normaali.");

} else if (bmi > 28){
$("#result").text("Ylipainonen.");
}
}
function onReady() {
calculateBMI();
$("INPUT").change(calculateBMI)
}

$(document).ready(onReady);


Lähteet:
http://learn.ionicframework.com/videos/windows-android/
http://terokarvinen.com/2015/aikataulu-–-mobiilituotekehitys-bus4tn008-5-syksylla-2015
http://terokarvinen.com/2015/hello-cordova-develop-android-apps-on-ubuntu-linux#comment-21203
Tunnilla(2) tehdyt muistiinpanot (sis. jquery)
http://pastebin.com



Ei kommentteja:

Lähetä kommentti