IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

[NiceEdit] Création d'un bouton


Sujet :

JavaScript

  1. #1
    Membre du Club
    Homme Profil pro
    Autre
    Inscrit en
    Août 2017
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Août 2017
    Messages : 63
    Points : 45
    Points
    45
    Par défaut [NiceEdit] Création d'un bouton
    Bonjour a tous

    Voila j utilise nicedit sur mon site et je souhaite mettre en place une nouvelle fonctionnalité a celui ci

    La partie detection du bouton fonctionne
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    var nicExampleOptions = {
        buttons : {
            'example' : {name : __('Terminal'), type : 'nicEditorTermButton'}
        },
    	iconFiles : {'example' : 'images/nicTerminal.gif'}
    };
    En fait ce bouton devrait me mettre le texte dans un <div class="term">texte sélectionné</div>

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    var nicEditorTermButton = nicEditorButton.extend({   
    	mouseClick : function(){
                   //code pour faire modification
            }
    });
    Je n y connais pas grand chose en java. Donc je fouine sur internet a la recherche d info mais je ne trouve pas.

    Pouvez vous m aider

  2. #2
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 873
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Salut,

    Tu n'as pas mis le code dans "mouseClick" mais déjà est-ce que l'icon apparait et est-ce que la fonction est exécutée quand tu cliques dessus ?

  3. #3
    Membre du Club
    Homme Profil pro
    Autre
    Inscrit en
    Août 2017
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Août 2017
    Messages : 63
    Points : 45
    Points
    45
    Par défaut
    Oui l icone est la. Dans la fonction j ai mis un alert. Ca fonctionne

  4. #4
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 873
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Ben donc ça marche où est donc le problème ?

    Du moins le problème ne vient pas de NicEdit apparemment mais peut-être que ta fonction ne fait pas ce que tu veux ?

  5. #5
    Membre du Club
    Homme Profil pro
    Autre
    Inscrit en
    Août 2017
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Août 2017
    Messages : 63
    Points : 45
    Points
    45
    Par défaut
    Ahh je me suis peut etre mal exprimer.
    En fait la fonction n est pas faite et je n y arrive pas.
    Si quelqu un pouvait m aider

  6. #6
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 873
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    C'est quoi ta fonction au juste ? Tu veux mettre une div avec la class "term" autour du texte sélectionné, c'est ça ?

    Un membre avait fait le même genre de chose dans son éditeur ici : Une< DIV> insérée, par une fonction, ne s'aligne pas dans une ligne <P>...

    J'ai posté un code au message #10...

  7. #7
    Membre du Club
    Homme Profil pro
    Autre
    Inscrit en
    Août 2017
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Août 2017
    Messages : 63
    Points : 45
    Points
    45
    Par défaut
    C est tout a fait ca. Le message en question c est le lien?
    Je ne vois pas de code :s

  8. #8
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 873
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Ben oui il faut cliquer sur le lien pour tester et voir aussi le code mais bon j'en ai fait un autre directement avec NicEdit : http://jsbin.com/pawekejecu/edit?html,js,output

    Tu peux tester en cliquant sur l’icône* "term" qui est à coté de l’icône "html"... *L’icône n'est pas terrible c'est juste pour tester, tu peux mettre la tienne...

    - J'ai ajouté du CSS pour la class "term" juste pour qu'on puisse voir l'effet de l'action (ajouter une div avec la class "term" autour du texte sélectionné), cela met le texte en couleur "greenyellow" sur fond noir...

    Mais tu peux aussi voir cela en regardant le code HTML en cliquant sur l’icône "html"...

    - Si tu ne sélectionnes pas de texte une alert est lancée avec pour message "Veuillez sélectionner du texte..."

  9. #9
    Membre du Club
    Homme Profil pro
    Autre
    Inscrit en
    Août 2017
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Août 2017
    Messages : 63
    Points : 45
    Points
    45
    Par défaut
    Je ne sais pas si on a le droit aux gros mots ici... mais t es un p..... de d... 😂😂

    Merci pour ton aide.
    Petite question? Le bouton html c est aussi un truc que tu as fais car je ne l ai pas moi. C est bien pratique pourtant.

  10. #10
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 873
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Non je ne pense pas qu'on a le droit aux "gros mots"...

    Sinon le bouton html ne vient pas de moi, tu peux l'ajouter toi-même avec les options...

  11. #11
    Membre du Club
    Homme Profil pro
    Autre
    Inscrit en
    Août 2017
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Août 2017
    Messages : 63
    Points : 45
    Points
    45
    Par défaut
    Oui j ai vu apres.

    Nouvelle question, et oui j arrette pas
    J ai pas encore fait de recherche mais est ce que je peux
    1. Compter le nombre de ligne sélectionnées
    2. Les splitter
    3. Mettre un marqueur dans le texte style si la ligne commence par @# par exemple alors un texte predefini se met au début de cette ligne.

    En fait ce bouton me sert a faire une console linux avec des lignes de commande
    Exemple
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    [root@ns1 colem]# sg_scan -i
    dev/sg2: scsi6 channel=0 id=2 lun=0
    NETAPP X287_S15K5288A15 NA00 [rmb=0 cmdq=1 pqual=0 pdev=0x0]
    /dev/sg3: scsi6 channel=0 id=3 lun=0
    NETAPP X287_S15K5288A15 NA00 [rmb=0 cmdq=1 pqual=0 pdev=0x0]
    Si je mets @# sg_scan -i qu il me mette [root@ns1 colem]# a la place.
    Vois tu ou je veux en venir ?

  12. #12
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 873
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Citation Envoyé par colem Voir le message
    Compter le nombre de ligne sélectionnées
    Qu'est-ce qu'une ligne ? Là est la question... Tu vois bien que visuellement quand tu ajoutes une div il y a un saut de ligne mais est-ce une ligne pour toi ? Pareil pour les paragraphes et les titres (balises h1,h2,h3...)... Et bien sûr il y a les lignes avec la balise <br>...

    Avec l'éditeur NicEdit tu peux avoir l'une de ces balises lorsque tu tapes sur "entrée", cela dépend du contexte...

    Pour avoir toujours la même chose il faudrait rentrer dans le code de l'éditeur...

    Ou bien, d’après ce que j'ai pu observer, tu peux avoir des lignes uniquement avec la balise <br> si tu évites de mettre des paragraphes et des titres... Dans ce cas il met des balises <br> lorsque tu tapes sur "entrée"...

    ---> Dans ce cas il suffit de compter le nombre de balise <br> pour avoir le nombre de lignes...

    Avant de faire ce code tu dois décider si ces conditions te conviennent...

    Citation Envoyé par colem Voir le message
    Les splitter
    Les diviser ? Oui mais soit plus précis, que veux-tu exactement ? Diviser par ligne ? Ou autre chose ?

    Et tu veux faire quoi ? Obtenir un tableau de chaque ligne ? Ou autre ?

    Soit précis et donne des exemples concrets...

    Citation Envoyé par colem Voir le message
    Si je mets @# sg_scan -i qu il me mette [root@ns1 colem]# a la place.
    Tu veux dire remplacer "@#" par "[root@ns1 colem]#" mais on garde "sg_scan -i", c'est ça ?

    Seulement si c'est en début de ligne ?

    Dans ce forum il y a probablement des membres qui peuvent faire ça avec une regex...

    Citation Envoyé par colem Voir le message
    Vois tu ou je veux en venir ?
    Tu veux faire toutes ces choses uniquement sur la partie du texte sélectionnée ou bien sur tout le texte contenu dans l'éditeur ?

    Et tu veux toujours ajouter la div avec la class "term" ?

  13. #13
    Membre du Club
    Homme Profil pro
    Autre
    Inscrit en
    Août 2017
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Août 2017
    Messages : 63
    Points : 45
    Points
    45
    Par défaut
    Perso je script qu en php donc le regex en lui meme je peux le faire si je sais quelle commande utiliser
    Sur le code que tu m as donné le texte se trouve dans rangeSelection ?

  14. #14
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 873
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Non, Tu peux le récupérer par exemple avec container.innerHTML, j'ai ajouté console.log(container.innerHTML) pour tester : http://jsbin.com/nicamavole/1/edit?js,console,output

  15. #15
    Membre du Club
    Homme Profil pro
    Autre
    Inscrit en
    Août 2017
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Août 2017
    Messages : 63
    Points : 45
    Points
    45
    Par défaut
    Visiblement je pourrais faire ceci
    console.log(container.innerHTML).replace(/[@#]/g, "[root@ns1 colem]#");
    A confirmer ou a essayer

    Comment je l insert dans le div maintenant?

  16. #16
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 873
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Il ne faut pas mettre console.log (ça c'était pour afficher le code html de la partie sélectionnée) pour avoir juste le code html de la partie sélectionnée c'est container.innerHTML...

    Pour le reste je ne comprends pas trop ce que tu veux faire, c'est quoi le rapport avec php ? Si tu travailles seulement dans l'éditeur coté client alors précise-le et explique bien ce que tu veux notamment en répondant aux questions que je t'ai posées...

  17. #17
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 873
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Un exemple avec un seul remplacement : http://jsbin.com/bivimorita/edit?js,output

  18. #18
    Membre du Club
    Homme Profil pro
    Autre
    Inscrit en
    Août 2017
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Août 2017
    Messages : 63
    Points : 45
    Points
    45
    Par défaut
    Non quand je parlais du php c'est pour dire qu qu'effectivement le javascriptc'est pas mon truc.

    http://jsbin.com/comizonahe/1/edit?output
    si tu selectionne les 3 lignes ca buggait mais plus maintenant je comprends pas

  19. #19
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 873
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Ben tant mieux si ça ne bogue pas, non ?

  20. #20
    Membre du Club
    Homme Profil pro
    Autre
    Inscrit en
    Août 2017
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Août 2017
    Messages : 63
    Points : 45
    Points
    45
    Par défaut
    Oui sur...
    C est sympat pour ton aide. Merci

Discussions similaires

  1. Création d'un bouton manuellement
    Par hitchie dans le forum MFC
    Réponses: 12
    Dernier message: 17/03/2006, 15h01
  2. [FLASH MX] Création d'un bouton standart.
    Par argon dans le forum Flash
    Réponses: 6
    Dernier message: 21/07/2005, 12h12
  3. [FLASH MX2004] Création d'un bouton Action Script
    Par chocobos dans le forum Flash
    Réponses: 12
    Dernier message: 13/04/2005, 12h03
  4. création d'un bouton de forme arrondie
    Par THIERRY L. dans le forum C++Builder
    Réponses: 2
    Dernier message: 15/12/2003, 14h04
  5. Réponses: 3
    Dernier message: 12/12/2003, 13h12

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo