chrome extension

[sofia_k_1]

Καλησπέρα!Νέα στο forum και χάρηκα πολύ που σας βρήκα!

Δεν ξέρω αν έχει ασχοληθεί κανείς με chrome extension κλπ αλλά έχω μια απορία.Για να δημιουργήσω ένα extension χρειάζεται κυρίως html,css και javascript..Στο ψάξιμο που κάνω γιατί θέλω να φτιάξω ένα είδα ότι τα extension δεν αναγνωρίζουν τα popup και προτείνεται να χρησιμοποιηθούν jquery modal.Είδα κάποια youtube για το πώς φτιάχνονται αλλά δεν βρήκα κάπου πώς μπορώ να καλέσω να ένα javascript αρχείο μέσα σε αυτό για να εκτελεστούν κάποιες λειτουργίες.

Μήπως ξέρει κάποιος για να μου δώσει κάποια βοήθεια?

[Ponous]

Είχα ασχοληθεί παλία με chrome extensions. Γενικά με δυο προτάσεις ένα chrome extension μπορεί να λειτουργήσει όπως ακριβώς μια πραγματική ιστοσελίδα. Η διαφορά είναι όπως έχεις μερικές επιπλέον επιλογές(αν τις χρειαστείς φυσικά) για να μπορέσεις να έχεις πρόσβαση στον browser η σε άλλα παράθυρα του κτλ.

Άρα στο ερώτημά σου, το πιο πιθανόν είναι πως το πρόβλημα σου δεν είναι πως φορτώνεις js file σε ένα chrome extension αλλά πως φορτώνεις ένα js file σε μια σελίδα. Κάτι τέτοιο μπορεί να γίνει ως εξής:

Δες εδώ περισσότερα: w3schools

Τώρα. Αν έχεις μια ιδέα από html,css , js και είδες και μερικά βίντεο στο youtube να πάρεις μια ιδέα σε συμβουλεύω να μπεις στο official documentation του chrome. Εκεί θα δεις πως μπορείς να καλέσεις ένα js file χωρίς να χρειαστεί να ορίσεις html-css-js. Ας πούμε δες εδώ. Στην πρώτη κιόλας σελίδα, στα πρώτα βήματα σου δείχνει πως να προσθέσεις το δικό σου script χωρίς να δημιουργήσεις popup.html

Γενικά μπορεί να φαίνεται πιο δύσκολο στην αρχή το documentation του chrome αλλά εκεί όντως θα μάθεις πως να φτιάξεις ένα extension. Στο youtube τα περισσότερα ήταν baby steps only. Φυσικά αν κατάλαβα καλά η δική σου προσέγγιση αφορά ένα popup.html αρχείο όπου εκεί πλέον δουλεύεις με τις τεχνολογίες του διαδικτύου και όχι με τις επιλογές που προσφέρει η google

Edit: Sorry έπρεπε να αφαιρέσω τον κώδικα διότι με μπλόκαρε το σύστημα του insomnia. Δες τα links και θα τα βρεις μέσα

Επεξ/σία 3 Ιουνίου 2020 από Ponous

[sofia_k_1]

Καταρχάς σε ευχαριστώ για την απάντηση σου κ τον χρόνο που διέθεσες. 

Τα link που παραθέτεις τα έχω διαβάσει αρκετές φορές για να καταλάβω τα διαδικαστικά. 

Αυτό που ρωτάω είναι ίσως καθαρά προγραμματιστικο κομμάτι (μιας κ δεν υπάρχουν παραδειγματα πάνω σε αυτό ή εγώ δεν έχω βρει). 

Έχοντας κάνει τις διαδικασίες που αναφέρονται στο documentation άρχισα να φτιάχνω το html αρχείο (ας το πούμε index.html).  Στην html έχω φτιαξει 3 buttons. Και στο js αρχείο  κάποια functions που θα εκτελούνται με κάθε κουμπί κ τις καλώ. 

Απλά είδα στο documentation ότι δεν υποστηριζονται τα popup (τα κλασσικά). και ψάχνοντας βρήκα ότι προτείνουν να χρησιμοποιήσω jquery modal dialogs. 

Λοιπον έψαξα κ έφτιαξα το ένα button να καλει το modal dialog αλλά δεν ξέρω πως να καλέσω την function που προορίζεται για το button αυτο μέσα στο modal.Σε αυτό δυσκολεύομαι. 

Αυτό ρωτάω.. Αν ξέρει κάποιος πως γίνεται. 

Υγ:@Ponous τι κώδικα έπρεπε να αφαιρέσεις? Δεν κατάλαβα! 

[dimitrisz123]

εχεις προσθεσει to javascript αρχειο μεσα στο html, μεσα στο body αλλα κατω κατω;

ετσι;

<script type="text/javascript" src="your-js-file.js"></script>

 

Επεξ/σία 4 Ιουνίου 2020 από dimitrisz123

[sofia_k_1]

Ναι το έχω προσθέσει αυτό. 

Δεν καταλαβαίνω όμως το πως το καλώ. Για παράδειγμα αφού δεν επιτρέπεται το inline javascript κ πρέπει να χρησιμοποιήσω addevebtlisteners το έχω φτιάξει αυτό κ το πως θα καλούνται. 

Αλλά όταν τρέχω το extension δοκιμαστικά αντί να βγάζει το αποτέλεσμα που θέλω μου βγάζει πχ το αναγνωριστικό του extension. Ενώ ο κώδικας στην console δουλεύει κ εκεί μπερδεύομαι. 

Λίγο αργότερα θα γράψω ένα παρόμοιο κώδικα εδώ μπας και με ξεμπερδεψετε (αν μπορείτε) 

[dimitrisz123]

addon.rar

Δεν ξερω απο addons αλλα οπως το περιγραφεις εφτιαξα αυτο με 3 κουμπια κλπ κλπ

[sofia_k_1]

αυτό είναι απλό html-javascript.

Δεν λειτουργεί έτσι στα extension.

Να το δοκιμάσω σε απλή μορφή μπας και δουλέψει και επανέρχομαι

[sofia_k_1]

ως απλό html/js αυτό που έφτιαξες δουλεύει..

όταν  το έφτιαξα ως extension δεν δούλεψε. Σε αυτό δεν καταλαβαίνω τι κάνω λάθος αφού ακολουθώ τις τις οδηγίες του documentation

[Ponous]

Στείλε κώδικα να δούμε που είναι το λάθος.

Είχα συμπεριλάβει κώδικα για το πως να προσθέσεις js files στο extension αλλά το forum δεν μου το επέτρεψε.

[sofia_k_1]

26 λεπτά πριν, Ponous είπε

Στείλε κώδικα να δούμε που είναι το λάθος.

Είχα συμπεριλάβει κώδικα για το πως να προσθέσεις js files στο extension αλλά το forum δεν μου το επέτρεψε.

Αν το ανεβάσεις αυτόν τον κώδικα σε ένα word?? 

 

[sofia_k_1]

για να επανέλθω γιατί δεν καταλαβαίνω τι έχω κάνει λάθος:

για το modal εκανα χρήση του https://www.w3schools.com/howto/howto_css_modals.asp

και η μόνη αλλαγή που έκανα ήταν στο σημείο έδώ που πρόσθεσα id στο <p> και έβγαλα το κείμενο.

 

<!-- Modal content -->
  <div class="modal-content">
    <span class="close">&times;</span>
    <p id="ds"> </p>
  </div>
 

και στο κομμάτι εδώ:

btn.onclick = function() {
  modal.style.display = "block";
}

πρόσθεσα τον κώδικα:

 

let ds = document.getElementById("ds");

    let list = [];

    let Message = " forms are: \n ";

    let Forms = document.querySelectorAll('form');

    if (Forms.length > 0) {

        for (var i = 0; i < Forms.length; i++) {

            list.push(Forms[i].action);

            ds.innerHTML+= Message + "<a href=" + list[i] + ">" + list[i] + "</a>" + "\n";

        }

    }

    else {

        ds.innerHTML += Message + "no forms";

    }

το αποτέλεσμα στο extension είναι ναι μεν να ανοίγει το modal αλλά να μην βγάζει το αποτέλεσμα που πρέπει (δηλαδή τα actions) αλλά βγάζει ως λινκ το αναγνωριστικό του extension.

Τι έχω κάνει λαθος?

Επεξ/σία 6 Ιουνίου 2020 από sofia_k_1

[sofia_k_1]

Κάποιος που να μπορεί να βοηθήσει παρακαλώ?? 

Επεξ/σία 7 Ιουνίου 2020 από sofia_k_1

[sofia_k_1]

Ουσιαστικά μου δείχνει ως url την διαδρομή που εχει το αρχείο στον δίσκο δηλαδή file:///c: κλπ

[Ponous]

Έχω τρέξει τον κώδικα σου και όντως είχα το url που ανέφερες. Δλδ εμφανίζει file:///c κτλπ...

Κοίτα μια πρόχειρη λύση που δοκίμασα ήταν να προσθέσω ακόμα ένα data-action attribute στις φόρμες οι οποίες παίρνουν τα ίδια δεδομένα με αυτά που δέχονται στο action.

Ας πούμε: έστω πως το action είναι το sth.php

<form data-action="sth.php" action="sth.php" method="POST">

Και στην javascript μπορείς να το διαβάσεις ως εξής

forms[i].getAttribute('data-action')

Η διαφορά είναι πως στο data-action εγώ απλά δίνω ένα string ενώ στο action δίνεις ένα route η κάποιο τέλος πάντων relative path.

[sofia_k_1]

Το ερώτημα εδώ όμως είναι το εξής:

Εφόσον εγώ θέλω να βρίσκονται τα url των φορμών εκτός του action στην javascript υπάρχει κάτι άλλο? 

Γιατί δεν  ξέρω αν πχ όλες αν όλες οι φόρμες στο net έχουν αυτό το data-action πχ. 

Μην προσθέτω εγώ δηλαδή παραπάνω πεδία. 

Πώς γίνεται όμως πχ στο console να λειτουργεί/δουλεύει ο κώδικας κ να εμφανίζονται τα actions σε κάθε σελίδα που δοκιμάζω κ μετά να μην μου δουλεύει όταν τα βάζω στην html?