const container = document.querySelector(".container"),
      dropdown = document.getElementById("dropdownMenu"),
      infoText = container.querySelector(".info-text");

const dictionary = {
  "ανάπτυξη": {
    "definition": "Όταν υπάρχει εξέλιξη σε κάτι.",
    "example": "Η καλή [ανάπτυξη]των παιδιών έρχεται μέσα από μια σωστή και ισορροπημένη διατροφή.",
    "verbs": "",
    "image": "img/anaptuksi.jpg"
  },
  "διάκριση": {
    "definition": "Θεωρώ κάτι διαφορετικό από κάτι άλλο.",
    "example": "Κάθε παιδί έχει δικαίωμα στη μη [διάκρισή]του.",
    "verbs": "",
    "image": "img/diakrisi.jpg"
  },
  "διαφέρω": {
    "definition": "Είμαι ξεχωριστός από κάποιον άλλο.",
    "example": "Κάθε άνθρωπος [διαφέρει]από κάποιον άλλο. Είμαστε όλοι διαφορετικοί.",
    "verbs": "/ διαφορετικότητα, διαφορετικό",
    "image": "img/diafero.jpg"
  },
  "δικαίωμα": {
    "definition": "Κάτι που ισχύει για όλους.",
    "example": "Κάθε παιδί έχει το [δικαίωμα]στην οικογένεια.",
    "verbs": "≠ υποχρέωση ή καθήκον",
    "image": "img/dikaioma.jpg"
  },
  "ειρήνη": {
    "definition": "Η κατάσταση κατά την οποία δεν γίνονται πολεμικές συγκρούσεις.",
    "example": "Η [ειρήνη]και η ασφάλεια των πολιτών πρέπει να είναι πρωταρχικοί στόχοι ενός κράτους.",
    "verbs": "≠ πόλεμος",
    "image": "img/eirini.jpg"
  },    
  "ελευθερία": {
    "definition": "Όταν δεν υπάρχει κάποιος περιορισμός.",
    "example": "Η [ελευθερία]είναι ένα βασικό δικαίωμα όλων των ανθρώπων.",
    "verbs": "≠ σκλαβιά ",
    "image": "img/eleutheria.jpg"
  },
  "ζωή": {
    "definition": "Το διάστημα από τη γέννηση μέχρι τον θάνατο.",
    "example": "Να γεμίζεις τη [ζωή]σου με ευχάριστες στιγμές.",
    "verbs": "≠ θάνατος",
    "image": "img/zoi.jpg"
  },
  "ισότητα": {
    "definition": "Η σχέση μεταξύ ίσων ανθρώπων ή πραγμάτων.",
    "example": "Η [ισότητα]των δύο φύλων είναι πολύ σημαντική.",
    "verbs": "≠ ανισότητα",
    "image": "img/isotita.jpg"
  },
  "καρδιά": {
    "definition": "Όργανο του ανθρώπινου σώματος που αντλεί και στέλνει αίμα.",
    "example": "Άμα σταματήσει η [καρδιά]να κτυπάει, ο άνθρωπος πεθαίνει.",
    "verbs": "| άκαρδος = αυτός που δεν έχει καρδιά, δεν συμπονάει / σχήμα",
    "image": "img/kardia.jpg"
  },
  "οικογένεια": {
    "definition": "Τα πρόσωπα που συνήθως συνδέονται με συγγενικό δεσμό και συνήθως ζουν στο ίδιο σπίτι.",
    "example": "Κάθε Χριστούγεννα μαζευόταν όλη η [οικογένεια]στο σπίτι της γιαγιάς.",
    "verbs": "",
    "image": "img/oikogeneia.jpg"
  },     
  "παιδί": {
    "definition": "Μικρής ηλικίας άνθρωπος, ο οποίος δεν είναι ακόμη έφηβος ή ενήλικας.",
    "example": "Το [παιδί]έπαιζε ανέμελα στην παιδική χαρά.",
    "verbs": "",
    "image": "img/paidi.jpg"
  },
  "πολυγλωσσία": {
    "definition": "Το να γνωρίζει και να μιλάει κάποιος πολλές γλώσσες.",
    "example": "Η [πολυγλωσσία]είναι ένα εξαιρετικό προσόν τη σημερινή εποχή.",
    "verbs": "",
    "image": "img/polyglossia.jpg"
  },
  "πολυχρωμία": {
    "definition": "Πολλά χρώματα.",
    "example": "Αυτό που παρατηρούσε κανείς στους πίνακές του ήταν η [πολυχρωμία]τους.",
    "verbs": "",
    "image": "img/poluxromia.jpg"
  },
  "προστασία": {
    "definition": "Η διαδικασία απομάκρυνσης από τους κινδύνους.",
    "example": "Η μαμά προσπάθησε να προστατεύσει το παιδί της την ώρα του σεισμού. Το πήρε αγκαλιά σαν ασπίδα [προστασίας].",
    "verbs": "",
    "image": "img/prostasia.jpg"
  },
  "πρόσφυγας": {
    "definition": "Αυτός ή αυτή που εγκαταλείπει τη χώρα του/της επειδή κινδυνεύει.",
    "example": "Είναι [πρόσφυγας]από τον πόλεμο και ήρθε να αναζητήσει μια καλύτερη ζωή.",
    "verbs": "",
    "image": "img/prosfugas.jpg"
  },     
  "συμμετοχή": {
    "definition": "Συνεργασία για την πραγματοποίηση μιας δραστηριότητας.",
    "example": "Πρέπει να δηλώσεις [συμμετοχή], αν θέλεις να λάβεις μέρος στον διαγωνισμό σκάκι.",
    "verbs": "",
    "image": "img/summetoxi.jpg"
  },
  "ταυτότητα": {
    "definition": "Τα στοιχεία εκείνα που καθιστούν ένα άτομο μοναδικό.",
    "example": "Στο αεροδρόμιο ο αστυνομικός ζήτησε να δει την [ταυτότητά]μου.",
    "verbs": "/ επίσημο έγγραφο που περιλαμβάνει πληροφορίες ενός ατόμου",
    "image": "img/tautotita.jpg"
  },
  "υγεία": {
    "definition": "Η καλή λειτουργία και φυσική κατάσταση ενός ζωντανού οργανισμού.",
    "example": "Είναι πολύ σημαντικό να έχουμε την [υγεία]μας.",
    "verbs": "",
    "image": "img/ugeia.jpg"
  },
  "φροντίζω": {
    "definition": "Νοιάζομαι, περιποιούμαι, προσπαθώ.",
    "example": "1.Η νοσοκόμα [φρόντισε]την πληγή του παιδιού. <br>2.<b>Φροντίζω</b>να είμαι στην ώρα μου και να μην αργώ στα ραντεβού μου.",
    "verbs": "",
    "image": "img/frontizo.jpg"
  },
  "ψυχαγωγία": {
    "definition": "Η ευχαρίστηση μέσω μιας πνευματικής κυρίως δραστηριότητας.",
    "example": "Η ανάγνωση ενός βιβλίου είναι μια μορφή [ψυχαγωγίας].",
    "verbs": "",
    "image": "img/psixagogia.jpg"
  },      
};

function search() {
    container.classList.remove("active");
   infoText.style.color = "#000";

    var word = dropdown.options[dropdown.selectedIndex].text;

    infoText.innerHTML = `Αναζήτηση της λέξης <span>"${word}"</span>`;

    if (!dictionary[word]) {
        infoText.innerHTML = `Δεν μπόρεσα να βρω τη λέξη <span>"${word}"</span>.`
    }
    else {
        container.classList.add("active");   
        var spanElement = document.querySelector('.meaning .details span');
        spanElement.innerHTML = "";

        var su_example = dictionary[word].example.replace("[", "<b>");
        var su_example = su_example.replace("]", "</b>");

        var textNode = document.createElement("p");
        spanElement.appendChild(textNode);
        spanElement.innerHTML= dictionary[word].definition;

        if (dictionary[word].verbs.length >0) {
          var strongElement = document.createElement('strong');
          strongElement.textContent = ' ' + dictionary[word].verbs;
          spanElement.appendChild(strongElement);
        }

        document.querySelector(".example span").innerHTML = su_example;
        document.querySelector(".wimage img").src = dictionary[word].image;
        document.querySelector(".wimage img").style.width='70%';
        document.querySelector(".wimage img").style.height = '20%';
        document.querySelector(".wimage img").alt = word;
    }
}
