meditor.class

Ir para a documentação deste ficheiro.

<?php
 
class MEditor extends MMultiLineField
{
    const BUTTON_SOURCE = 'Source';
    const BUTTON_SAVE = 'Save';
    const BUTTON_NEW_PAGE = 'NewPage';
    const BUTTON_PREVIEW = 'Preview';
    const BUTTON_TEMPLATES = 'Templates';
    const BUTTON_CUT = 'Cut';
    const BUTTON_COPY = 'Copy';
    const BUTTON_PASTE = 'Paste';
    const BUTTON_PASTE_TEXT = 'PasteText';
    const BUTTON_PASTE_FROM_WORD = 'PasteFromWord';
    const BUTTON_PRINT = 'Print';
    const BUTTON_SPELL_CHECKER = 'SpellChecker';
    const BUTTON_SCAYT = 'Scayt';
    const BUTTON_UNDO = 'Undo';
    const BUTTON_REDO = 'Redo';
    const BUTTON_FIND = 'Find';
    const BUTTON_REPLACE = 'Replace';
    const BUTTON_SELECT_ALL = 'SelectAll';
    const BUTTON_REMOVE_FORMAT = 'RemoveFormat';
    const BUTTON_FORM = 'Form';
    const BUTTON_CHECKBOX = 'Checkbox';
    const BUTTON_RADIO = 'Radio';
    const BUTTON_TEXT_FIELD = 'TextField';
    const BUTTON_TEXT_AREA = 'Textarea';
    const BUTTON_SELECT = 'Select';
    const BUTTON_BUTTON = 'Button';
    const BUTTON_IMAGE_BUTTON = 'ImageButton';
    const BUTTON_HIDDEN_FIELD = 'HiddenField';
    const BUTTON_BIDI_LTR = 'BidiLtr';
    const BUTTON_BIDI_RTL = 'BidiRtl';
    const BUTTON_BOLD = 'Bold';
    const BUTTON_ITALIC = 'Italic';
    const BUTTON_UNDERLINE = 'Underline';
    const BUTTON_STRIKE = 'Strike';
    const BUTTON_SUBSCRIPT = 'Subscript';
    const BUTTON_SUPERSCRIPT = 'Superscript';
    const BUTTON_NUMBERED_LIST = 'NumberedList';
    const BUTTON_BULLETED_LIST = 'BulletedList';
    const BUTTON_OUTDENT = 'Outdent';
    const BUTTON_INDENT = 'Indent';
    const BUTTON_BLOCKQUOTE = 'Blockquote';
    const BUTTON_CREATE_DIV = 'CreateDiv';
    const BUTTON_JUSTIFY_LEFT = 'JustifyLeft';
    const BUTTON_JUSTIFY_CENTER = 'JustifyCenter';
    const BUTTON_JUSTIFY_RIGHT = 'JustifyRight';
    const BUTTON_JUSTIFY_BLOCK = 'JustifyBlock';
    const BUTTON_LINK = 'Link';
    const BUTTON_UNLINK = 'Unlink';
    const BUTTON_ANCHOR = 'Anchor';
    const BUTTON_IMAGE = 'Image';
    const BUTTON_FLASH = 'Flash';
    const BUTTON_TABLE = 'Table';
    const BUTTON_HORIZONTAL_RULE = 'HorizontalRule';
    const BUTTON_SMILEY = 'Smiley';
    const BUTTON_SPECIAL_CHAR = 'SpecialChar';
    const BUTTON_PAGE_BREAK = 'PageBreak';
    const BUTTON_STYLES = 'Styles';
    const BUTTON_FORMAT = 'Format';
    const BUTTON_FONT = 'Font';
    const BUTTON_FONT_SIZE = 'FontSize';
    const BUTTON_TEXT_COLOR = 'TextColor';
    const BUTTON_BG_COLOR = 'BGColor';
    const BUTTON_MAXIMIZE = 'Maximize';
    const BUTTON_SHOW_BLOCKS = 'ShowBlocks';
    const BUTTON_ABOUT = 'About';
    const BUTTON_SEPARATOR = '-';
    const BUTTON_LINE_SEPARATOR = '/';
 
    private $config;
 
    public function __construct($name=NULL, $value='', $label='', $buttons=NULL, $buttonImage = false)
    {
        parent::__construct($name, $value, $label);
 
        if ( strpos(MIOLO::getInstance()->getTheme()->id, "sbootstrap") === false )
        {
            // update textarea valeu before doing field validation
            $this->page->onsubmit("( CKEDITOR.instances['$name'].updateElement() || true )");
 
            $this->page->addScript('ckeditor/ckeditor.js');
            if ( !$buttons )
            {
                $buttons[] = array(self::BUTTON_BOLD, self::BUTTON_ITALIC, self::BUTTON_UNDERLINE);
                $buttons[] = array(self::BUTTON_FONT, self::BUTTON_FONT_SIZE);
                $buttons[] = array(self::BUTTON_TEXT_COLOR, self::BUTTON_BG_COLOR);
                $buttons[] = array(self::BUTTON_LINK);
                $buttons[] = array(self::BUTTON_JUSTIFY_LEFT, self::BUTTON_JUSTIFY_CENTER, self::BUTTON_JUSTIFY_RIGHT, self::BUTTON_JUSTIFY_BLOCK);
                $buttons[] = array(self::BUTTON_NUMBERED_LIST, self::BUTTON_BULLETED_LIST, self::BUTTON_OUTDENT, self::BUTTON_INDENT);
                $buttons[] = array(self::BUTTON_CUT, self::BUTTON_COPY, self::BUTTON_PASTE);
                $buttons[] = array(self::BUTTON_UNDO, self::BUTTON_REDO);
                if ( $buttonImage )
                {
                    $buttons[] = array(self::BUTTON_IMAGE_BUTTON);
                }
            }
            $this->setButtons($buttons);
        }
 
        $this->setLanguage($this->manager->getConf('i18n.language'));
        $this->setClass('m-editor');
    }
 
    public function setButtons($buttons)
    {
        if ( !is_array($buttons) )
        {
            $buttons = array(array($buttons));
        }
        elseif ( !is_array($buttons[0]) )
        {
            $buttons = array($buttons);
        }
 
        $this->config['toolbar'] = $buttons;
    }
 
    public function setLanguage($lang)
    {
        $this->config['language'] = $lang;
    }
 
    public function setColor($color)
    {
        $this->config['uiColor'] = $color;
    }
 
    public function setConfigValue($key, $value)
    {
        $this->config[$key] = $value;
    }
 
    public function getConfigValue($key)
    {
        return $this->config[$key];
    }
 
    public function getConfig()
    {
        return $this->config;
    }
 
    public function setConfig($config)
    {
        $this->config = $config;
    }
 
    public function disableElementsPath()
    {
        $removePlugins = array();
 
        if ( $this->config['removePlugins'] )
        {
            $removePlugins = explode(',', $this->config['removePlugins']);
        }
 
        $removePlugins[] = 'elementspath';
        $this->config['removePlugins'] = implode(',', array_unique($removePlugins));
    }
 
    public function enableElementsPath()
    {
        if ( $this->config['removePlugins'] )
        {
            $removePlugins = explode(',', $this->config['removePlugins']);
            foreach ( $removePlugins as $key => $plugin )
            {
                if ( $plugin == 'elementspath' )
                {
                    unset($removePlugins[$key]);
                }
            }
            $this->config['removePlugins'] = implode(',', $removePlugins);
        }
    }
 
    public function generate()
    {
        $MIOLO = MIOLO::getInstance();
        $jsonConfig = json_encode($this->config);
        if ( strpos(MIOLO::getInstance()->getTheme()->id, "sbootstrap") === false )
        {
            $this->page->onload("CKEDITOR.replace('$this->name', $jsonConfig);");
        }
        else
        {            
            $this->page->onload("
            function InsertFile(editor){
                editor.editing.view.document.on(
                  \"drop\",
                  async (event, data) => {
                    if (
                      data.dataTransfer.files &&
                      !data.dataTransfer.files[0].type.includes(\"image\")
                    ) {
                      event.stop();
                      data.preventDefault();
                      insert(data.dataTransfer.files[0], editor);
                    }
                  },
                  { priority: \"high\" }
                );
            
                editor.editing.view.document.on(
                  \"dragover\",
                  (event, data) => {
                    event.stop();
                    data.preventDefault();
                  },
                  { priority: \"high\" }
                );
            }
            
              function insert(file, editor) {
                if (file) {
                  const form = new FormData();
                  form.append(\"Content-Type\", file.type);
                  form.append(\"upload\", file);
                  let httpRequest;
                  if (window.XMLHttpRequest) {
                    httpRequest = new XMLHttpRequest();
                  } else if (window.ActiveXObject) {
                    httpRequest = new ActiveXObject(\"Microsoft.XMLHTTP\");
                  }
                  httpRequest.open(\"POST\", \"/ckeditorUpload.php\", true);
                  httpRequest.onload = () => {
                    if (httpRequest.status === 200) {
                      const body = JSON.parse(httpRequest.responseText);
                      if (typeof body.error !== 'undefined'){
                        const error = body.error.message;
                        if(error.length > 0){
                            alert(error);
                            return;
                        }
                      }
                      const content = `<a target=\"_blank\" href=\"` + body.url + `\"/>` + file.name + `</a>`;
                      const viewFragment = editor.data.processor.toView(content);
                      const modelFragment = editor.data.toModel(viewFragment);
                      editor.model.insertContent(
                        modelFragment,
                        editor.model.document.selection
                      );
                      editor.editing.view.focus();
                    } else {
                      alert(
                        `Algo de errado com o upload do se arquivo, verifique a conexão e tente novamente!.
                      (` + httpRequest.status + ' - ' + httpRequest.statusText + `)`
                      );
                    }
                  };
                  httpRequest.send(form);
                }
              }
 
            ClassicEditor
                .create( document.querySelector( '[id=\"$this->name\"]' ), {
                    simpleUpload: {
                        uploadUrl: 'ckeditorUpload.php',
                    },
                })
                .then( editor => {              
                    ck_editors.set('$this->name', editor );
                    InsertFile(editor);
                    editor.editing.view.change( writer => {
                        writer.setStyle('margin-bottom', '5px', editor.editing.view.document.getRoot());
                        writer.setStyle('min-height', '300px', editor.editing.view.document.getRoot());
                        writer.setStyle('max-height', '300px', editor.editing.view.document.getRoot());                        
                    });
 
                    var elementoOriginal = $('#m_$this->name').find('[data-cke-tooltip-text=\"Link (Ctrl+K)\"]');
 
                    var cloneElemento = elementoOriginal.clone();
 
                    cloneElemento.insertAfter(elementoOriginal);
                    
                    cloneElemento.find('svg').remove();
                    cloneElemento.html('<svg class=\"ck ck-icon ck-reset_all-excluded ck-icon_inherit-color ck-button__icon\" viewBox=\"0 0 20 20\"><path d=\"M11.627 16.5zm5.873-.196zm0-7.001V8h-13v8.5h4.341c.191.54.457 1.044.785 1.5H2a1.5 1.5 0 0 1-1.5-1.5v-13A1.5 1.5 0 0 1 2 2h4.5a1.5 1.5 0 0 1 1.06.44L9.122 4H16a1.5 1.5 0 0 1 1.5 1.5v1A1.5 1.5 0 0 1 19 8v2.531a6.027 6.027 0 0 0-1.5-1.228zM16 6.5v-1H8.5l-2-2H2v13h1V8a1.5 1.5 0 0 1 1.5-1.5H16z\"></path><path d=\"M14.5 19.5a5 5 0 1 1 0-10 5 5 0 0 1 0 10zM15 14v-2h-1v2h-2v1h2v2h1v-2h2v-1h-2z\"></path></svg>');
                    cloneElemento.attr('data-cke-tooltip-text', 'Carregar documento do computador');
 
                    const inputElement = document.createElement(\"input\");
                    inputElement.type = \"file\";
                    inputElement.accept =
                        \".doc,.docx,.pdf,application/pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/vnd.oasis.opendocument.text,application/zip,application/vnd.rar\";
                    inputElement.addEventListener(\"change\", (event) => {
                        insert(event.target.files[0], editor);
                        $(event.target).val('');
                        
                    });
 
                    cloneElemento.on('click', function(){
                        inputElement.click();
                    });
 
                } )
                .catch( error => {
                    console.error( error );
                } );
 
            ");
        }
 
        // Reset CSS dos títulos pre definidos no ckeditor
        $MIOLO->page->addStyleCode('
            .ck-content h2 {
                display: block;
                font-size: 1.5em;
                margin-block-start: 0.83em;
                margin-block-end: 0.83em;
                margin-inline-start: 0px;
                margin-inline-end: 0px;
                font-weight: bold;
                unicode-bidi: isolate;
            }
 
            .ck-content h3 {
                display: block;
                font-size: 1.17em;
                margin-block-start: 1em;
                margin-block-end: 1em;
                margin-inline-start: 0px;
                margin-inline-end: 0px;
                font-weight: bold;
                unicode-bidi: isolate;
                color: unset;
            }
 
            .ck-content h4 {
                display: block;
                font-size: unset;
                margin-block-start: 1.33em;
                margin-block-end: 1.33em;
                margin-inline-start: 0px;
                margin-inline-end: 0px;
                font-weight: bold;
                unicode-bidi: isolate;
            }
 
            .ck-source-editing-area {
                min-height: 300px;
                max-height: 300px;
                margin-bottom:5px;
            }
 
            .ck-source-editing-area textarea {
                overflow: auto;
            }
 
            .ck.ck-dropdown .ck-dropdown__arrow {
                z-index: 0;
            }
 
            .image.ck-widget.ck-widget_selected.ck-widget_with-resizer {
                z-index: 0;
            }
        ');
 
        return parent::generate();
    }
}
?>