csseditor

Développement d'extensions tierces
Dani
Nouveau
Messages : 1
Inscription : 03 Mai 2011 17:24

csseditor

Messagepar Dani » 03 Mai 2011 17:41

Hi Cyril

Merci toi Cyril, pour la extension csseditor fantastique. Mais j'ai un problem avec lui quand j'ai besoin de csseditor avec l'extension cufon de Andreas Schempp. Toujours, après sauvegarder csseditor, les informations de cufon ne sont pas là. J'éspère que tu peux corriger ca. Merci beaucoup!

Dani

Avatar de l’utilisateur
cyril
Site Admin
Messages : 170
Inscription : 14 Avr 2008 20:20
Localisation : Valence (Drôme)

Re: csseditor

Messagepar cyril » 22 Mai 2011 11:30

Bonjour Dani,

Merci pour l’intérêt que tu portes a cette extension.
Par contre je suis désolé mais je ne pourrais pas me pencher sur ce problème d'ici quelques temps.

Si quelqu'un a une solution, je peux bien sûr prendre le temps de l'intégrer.
Cordialement,

Cyril

Avatar de l’utilisateur
cyril
Site Admin
Messages : 170
Inscription : 14 Avr 2008 20:20
Localisation : Valence (Drôme)

Re: csseditor

Messagepar cyril » 27 Mai 2011 19:01

Salut Dani,

Je viens de proposer une solution : http://www.contao-community.org/viewtop ... 486#p13486
Cordialement,

Cyril

ConceptImageRennes
Nouveau
Messages : 1
Inscription : 09 Déc 2013 00:46
Localisation : Rennes

Re: csseditor

Messagepar ConceptImageRennes » 09 Déc 2013 01:45

Bonjour,

Je profite d'un fil sur ce module pour faire une petite mise à jour avec Ace qui remplace Code Mirror dans Contao depuis un petit bout de temps.
Dans /csseditor/classes/CssEditor.php (vers ligne 30) :

Code : Tout sélectionner

   /**
    * Save input
    * @var boolean
    */
   protected $blnSave = true;

   public function __construct()
   {
      $GLOBALS['TL_CSS'][] = 'system/modules/css_editor/assets/csseditor.css';
      
      // Include the CodeMirror scripts
      $GLOBALS['TL_CSS'][] = 'assets/codemirror/'.CODEMIRROR.'/codemirror.css';
      $GLOBALS['TL_JAVASCRIPT'][] = 'assets/codemirror/'.CODEMIRROR.'/codemirror.js';
      
      // Include the CodeMirror UI scripts
      $GLOBALS['TL_CSS'][] = 'system/modules/css_editor/assets/codemirror-ui.css';
      $GLOBALS['TL_JAVASCRIPT'][] = 'system/modules/css_editor/assets/codemirror-ui.js';

      parent::__construct();
   }

est remplacé par :

Code : Tout sélectionner

   /**
    * Save input
    * @var boolean
    */
   protected $blnSave = true;

   public function __construct()
   {
      
      // Include the CodeMirror scripts
      $GLOBALS['TL_JAVASCRIPT'][] = 'assets/ace/'.ACE.'/ace.js" charset="utf-8';

      parent::__construct();
   }

Au passage, on peut virer les fichiers dans /csseditor/assets.

Et le JS dans le template /csseditor/templates/be_cssedit.html5 (vers ligne 85) :

Code : Tout sélectionner

<script>
window.addEvent('domready', function() {
   var textarea = $('ctrl_<?php echo $this->contentId; ?>');
   var uiOptions = {
      path : 'system/modules/css_editor/assets/',
      imagePath : 'system/modules/css_editor/assets/',
      searchMode : 'popup',
      buttons : ['search','undo','redo','jump','about']
   }

   var codeMirrorOptions = {
      mode: "css",
      lineNumbers: true
   }

   var editor = new CodeMirrorUI(textarea,uiOptions,codeMirrorOptions);
});
</script>

peut être modifié par :

Code : Tout sélectionner

<script>
window.addEvent('domready', function() {
  var ta = $('ctrl_<?php echo $this->contentId; ?>');

  var div = new Element('div', {
    'id':'ctrl_<?php echo $this->contentId; ?>_div',
    'class':ta.get('class')
  }).inject(ta, 'after');

  ta.setStyle('display', 'none');

  var editor = ace.edit('ctrl_<?php echo $this->contentId; ?>_div');
  editor.setTheme("ace/theme/clouds");
  editor.getSession().setValue(ta.value);
  editor.getSession().setMode("ace/mode/css");
  editor.getSession().setUseSoftTabs(false);

  editor.commands.addCommand({
    name: 'Fullscreen',
    bindKey: 'F11',
    exec: function(editor) {
      editor.container.toggleClass('fullsize');
      editor.resize();
    }
  });

  // Disable command conflicts with AltGr (see #5792)
  editor.commands.bindKey('Ctrl-alt-a|Ctrl-alt-e|Ctrl-alt-h|Ctrl-alt-l|Ctrl-alt-s', null)

  var updateTextarea = function() {
    ta.value = editor.getValue();
  };

  editor.getSession().on('change', updateTextarea);

  var updateHeight = function() {
    var newHeight
      = editor.getSession().getScreenLength()
      * editor.renderer.lineHeight
      + editor.renderer.scrollBar.getWidth();
    var setHeight = Math.max(newHeight, editor.container.getStyle('height'));
    editor.container.setStyle('height', setHeight.toString() + 'px');
    editor.resize();
  };

  updateHeight();
  editor.getSession().on('change', updateHeight);
});
</script>

Testé et approuvé (bon après, ça reste un éditeur embarqué ...).
On pourrait réutiliser la propriété startHeight pour redimensionner le textarea par défaut, mais la possibilité de basculer en plein écran avec F11 rend cette fonctionnalité quelque peu obsolète.


Revenir vers « Développement d'extensions »

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 2 invités