[plugin] Cmixml: CKEditor full, codemirror et insert médias natif

SudwebdesignSudwebdesign Membre
25 mai modifié dans Plugins
Editeur wysiwyg + gestionnaire de fichier natif + CKEditor 4.11.3 + 7 thèmes + codemirror

téléchargement ici

## Version 1.1.0 - CKeditor 4.11.4 + PHP in static (22/05/2019) ##
[+] CKeditor 4.11.4 full + 7 themes + Plugin CodeMirror 1.17.12.pre+1 (CodeMirror 5.46.0)
[+] plugins ck : removeRedundantNBSP,entities,html5video,html5audio
fix flat skin.js
fix no notif in fullscreen : inline css .cke_notifications_area{z-index:1000001!important} : (autosave)
[+] minimalist theme
[-] flat theme
fix media mngr funks to activate html5 audio & video plugs (retail by me browser url + lng in video) +
extraAllowedContent: 'audio[*]{*};video[*]{*}',
[+] https://github.com/w8tcha/CKEditor-CodeMirror-Plugin/commit/c3e1001c298c3f2e481fbe6510fdfa0456ce0696 (not for static)
[+] config : Activer ckeditor pour des pages spécifiques


## Version 1.0.0 - CKeditor 4.11.3 + PHP (13/03/2019) ##
[+] CKeditor 4.11.3 full + 7 themes + Plugin CodeMirror 1.17.10 (CodeMirror 5.44.0)
[+] 11 langues
[+] config : création du dossier blob_ck
[+] Pour l'insert d'image on utilise le gestionnaire des médias natif de PluXml
[+] Hooks abs2rel >>> urls2Root & toRoot

Notre temps est la seule monnaie vraie ;)

Site, Dépôt, framagit, MyShop, Factux

Réponses

  • cpalocpalo Membre
    Bonjour,

    premier contact... pas mal - testé avec la 5.8 dev
    Je vais donc y ajouter maintenant mon dossier custom, ce qui pourrait etre fait par défaut et ce qui simplifierait les maj

    Petite question, c'est quoi ce dossier ;[+] config : création du dossier blob_ck

    Cordialement
  • SudwebdesignSudwebdesign Membre
    15 mars modifié
    cpalo a écrit:
    Bonjour,

    premier contact... pas mal - testé avec la 5.8 dev
    Je vais donc y ajouter maintenant mon dossier custom, ce qui pourrait etre fait par défaut et ce qui simplifierait les maj

    Petite question, c'est quoi ce dossier ;[+] config : création du dossier blob_ck

    Cordialement

    C'est le dossier data/medias/blob_ck ou sont envoyées les images drag&dropées.

    Comme avec CKeditor il est possible de lui glisser et déposer des images dans son interface.
    Au lieu d'être transformée en url BASE64 et alourdir le html (c'est le comportement par défaut de CK), elles sont automatiquement téléversé dans le dossier data/medias/blob_ck (Voir les fichiers php ajax_upload* du plugin)

    En plus il tourne sur la 5.8, merci du retour :)


    Ps : je viens de relire mon code et en réalité ce dossier est créé lors de la première image téléversée par le fichier ajax_upload.php, ligne 71
    [== PHP ==]
        if(!is_dir($absoImageFolder)) mkdir($absoImageFolder);// if not, create upload folder
    
    Pardon pour la confusion, J'aurais du écrire
    [+] ajax upload : création du dossier data/medias/blob_ck

    Notre temps est la seule monnaie vraie ;)

    Site, Dépôt, framagit, MyShop, Factux

  • Slt @vous,

    une nouvelle mouture est dispo ds le dépôts

    Version 1.1.0 - CKeditor 4.11.4 + PHP in static + htm5 audio et vidéo plugin.

    Voir le 1er post pour plus de détail et le télécharger

    Notre temps est la seule monnaie vraie ;)

    Site, Dépôt, framagit, MyShop, Factux

  • AlbaAlba Membre

    Hello, concrètement, on retrouve le gestionnaire de fichier de pluxml dans l'éditeur ? c'est top ! il est tellement mieux que celui de ckeditor.

  • cpalocpalo Membre

    Bonjour,

    En phase de test par rapport à ta précédente version de CKEditor.

    Petite question... le bouton basculer l'éditeur.

    Fonction que j'apprécie beaucoup et que je trouve plus conviviale que que le menu"source" même s'il y a la coloration avec codemirror.

    Le style est obtenu à partir de quel fichier?

    Merci

    Cordialement

  • SudwebdesignSudwebdesign Membre
    8 juin modifié

    Slt cpalo, le style qui permet la bascule de l'éditeur est un script (chercher ckToggleEditor ds le fichier Cmixml.php)

    function ckToggleEditor(id) {
    // console.log('ckToggleEditor(id)',id,CKEDITOR.instances);
    /*
    for(var i in CKEDITOR.instances) {
      console.log('each',i,CKEDITORAPI.GetInstance(i));
    
    	}
    */
    
    	var ta = document.getElementById(id);//textarea
    	//~ var ck = document.getElementById('cke_'+id);//.ckeditorGet();//;//editeur
    	//~ console.log('ckToggleEditor(ck)',ck,ck.style.display);//editeur
    //	console.log('ckToggleEditor(ta)',ta,ta.style.display);//textarea
    	if(ta.style.display == 'none'){
    //		console.log('ckToggleEditor(id) OFF',id);
    //		console.log('CKEDITOR.instances',CKEDITOR.instances[id]);
    		CKEDITOR.instances[id].destroy()
    	}else{
    //		console.log('ckToggleEditor(id) ON',id);
    		ckeInit(id);//CKEDITOR.replace(id); one with opts
    	}
    }
    

    Le voici nettoyé:

    function ckToggleEditor(id) {
    	var ta = document.getElementById(id);//textarea
    	if(ta.style.display == 'none'){
    		CKEDITOR.instances[id].destroy();
    	}else{
    		ckeInit(id);//CKEDITOR.replace(id); one with opts
    	}
    }
    

    Il est appelé a chaque clic (onclick) de chaque boutons.

    Est ce bien cela le but de ta question?

    Notre temps est la seule monnaie vraie ;)

    Site, Dépôt, framagit, MyShop, Factux

  • cpalocpalo Membre

    Bonjour,

    Ce n'est pas tout à fait ça ma question même si tu y réponds en partie.

    Je preferre utiliser ce bouton plutôt que le menu source de la barre d'outil.

    En effet je trouve que c'est agréable à saisir et surtout cette mise en forme (d'où ma question sur où se trouve le css en question)

    Et ma seconde remarque était qu'avec ce mode basculer, je n'ai plus vraiment besoin du menu source.

  • SudwebdesignSudwebdesign Membre
    9 juin modifié

    @cpalo AMHA c'est la "magie" de CK, s'il y a un expert de cet éditeur ds le coin...

    Au passage si vous souhaitez régler les objets (boutons) de la barre, chercher ds Cmixml.php

    extraPlugins:

                extraPlugins:'removeRedundantNBSP,entities,html5video,html5audio,showprotected,textmatch,autosave,autolink,notification,notificationaggregator,save,codemirror,uploadimage,justify,showblocks,embed,embedbase,embedsemantic,autoembed,lineutils,widgetselection,widget,toolbar<?php echo $extraPlugins ?>',
    

    ou toolbarGroups

    				toolbarGroups: [
    ...
    ".($_SESSION['profil']<PROFIL_MODERATOR?"               {name:'admin',   groups:['mode','doctools']},":'')."
    ...
    

    pour faire rapide Il suffit de commenter le groupe "admin" et codemirror (le mode source) disparaitra de CK ;)

    				toolbarGroups: [
    ...
    ".($_SESSION['profil']<PROFIL_MODERATOR?"//               {name:'admin',   groups:['mode','doctools']},":'')."
    ...
    

    et comme on dit qui peut le plus peut le moins.

    Ravis qu'il vous plaise car il est expérimental, comme tout ds ce monde et l'éditeur du nouveau forum qui disparait parfois après un arobase pseudo et appuis sur la barre d'espace ou certains ctrl+z ou ctrl+y

    @plx

    Notre temps est la seule monnaie vraie ;)

    Site, Dépôt, framagit, MyShop, Factux

  • cpalocpalo Membre

    Bonsoir

    Est-ce que le code ci-dessous signifie qu'il y un ckeditor different suivant le profil de l'utilisateur et ou suivant le mode d'affichage ( statique vs article?

    $toolbarGroups="
                toolbarGroups:[
                   {name:'document',   groups:['tools','document']},
    ".($_SESSION['profil']<PROFIL_MODERATOR?"               {name:'admin',   groups:['mode','doctools']},":'')."
                   {name:'board',   groups:['clipboard','undo','find','selection']},
                   {name:'editing',   groups:['links','insert','others']},
    ".(($mode=='statique'OR$mode=='parametres_edittpl')?"               {name:'forms'},":'')."
                         '/',
                   {name:'paragraph',   groups:['br','list','align','basicstyles']},
                   {name:'style',   groups:['styles','colors','cleanup']}
                ],".PHP_EOL;
    
  • Bien vu Oui c'est bien ça ;)

    Pour les gestionnaires et plus le groupe d'outils 'admin' s'active (codemirror entre autre)

    $_SESSION['profil'] < PROFIL_MODERATOR
    


    Pour les pages statiques (gestionnaire & plus) et la page de modif* des fichiers du thème s'ajoute aussi le groupe 'form' (pour aider a la création de formulaire html). *Est accessibles aux administrateurs (et gestionnaire?)

    $mode=='statique' OR $mode=='parametres_edittpl'
    


    Notre temps est la seule monnaie vraie ;)

    Site, Dépôt, framagit, MyShop, Factux

Connectez-vous ou Inscrivez-vous pour répondre.