Kodulehe loomine, 31. kord

25.05.2022
 |  Kommentaare pole

Tühikutega tekst

Kõik alljärgnevad muudatused tuleb teha faili mangukood.js:

1. esmalt muudame funktsiooni algseis

1.1 teeme kindlaks, kas failist loetud rida sisaldab tühikut (kood tuleb lisada selle osa järele, kus selgitatakse välja sõna esimene ja viimane täht, ehk siis massiivi leitud_tahed esimesed väärtused:

i=1;
tyhik_leitud=0;
while (i<otsitava_sona_tahed.length && tyhik_leitud==0)
{
  if (otsitava_sona_tahed[i]==" ")
  {
   leitud_tahed.push(" ");
   tyhik_leitud=1;
  } 
  i++;
}

Kus:

  • omistame loendurile i algväärtus 1 ==> i=1;
  • omistame muutujale tyhik_olemas algväärtuse 0 ==> tyhik_leitud=0;
  • teostame while-tsüklit, kuni loendur i on väiksem massiiv kui otsitava_sona_tahed liikmete arv ja muutuja tyhik_leitudi väärtus on 0 ==> while (i<otsitava_sona_tahed.length && tyhik_leitud==0)
    • kui massiivis otsitava_sona_tahed kohal i on väärtus ” ” (tühik) ==> if (otsitava_sona_tahed[i]==” “)
      • lisatakse tühik massiivi leitud_tahed ==> leitud_tahed.push(” “);
      • omistatakse muutujale tyhik_leitud väärtus 1 ==> tyhik_leitud=1;
    • loenduri i väärtust suurendatakse 1 võrra ==> i++;

1.2 Täiendame kuvatava teksti loomist selliselt, et tühiku asemel kuvatakse sidekriips:

kuvatav_tekst=kuvatav_tekst+" "+otsitava_sona_tahed[i].toUpperCase();

asemel kasutame if-else-tingimuslauset:

if (otsitava_sona_tahed[i]==" ")
{
  kuvatav_tekst=kuvatav_tekst+" -"; 
}
else
{
  kuvatav_tekst=kuvatav_tekst+" "+otsitava_sona_tahed[i].toUpperCase();
}

2. Täiendame funktsiooni taheproov kuvatava sõna loomist analoogselt eelnevaga:

kuvatav_tekst=kuvatav_tekst+" "+otsitava_sona_tahed[i].toUpperCase();

asemel kasutame if-else-tingimuslauset:

if (otsitava_sona_tahed[i]==" ")
{
  kuvatav_tekst=kuvatav_tekst+" -"; 
}
else
{
  kuvatav_tekst=kuvatav_tekst+" "+otsitava_sona_tahed[i].toUpperCase();
}

Tühikute asemel Bootstrap’i ikoonide kasutamine

1. Faili mang.html päisesse tuleb lisada viide ikoonidele:

<head>
  <title>Meie mäng</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" type="text/css" href="mangukujundus.css">
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css" rel="stylesheet">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css"/>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/js/bootstrap.bundle.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="mangukood.js"></script>
</head>

2. lisada faili mangukood.js sidekriipsu asemel soovitud ikooni viide (NB! asendame senised jutumärgid ülekomadega), muudatused tuleb teha nii funktsioonis algseis kui ka funktsioonis taheproov:

if (otsitava_sona_tahed[i]==" ")
{
   kuvatav_tekst=kuvatav_tekst+' <i class="bi bi-flower3"></i>'; 
}
else
{
   kuvatav_tekst=kuvatav_tekst+" "+otsitava_sona_tahed[i].toUpperCase();
}

Ikoonid ja neile vastavad koodid on leitavad sellelt lehelt.