Photo Editor

Release 2.4.0 and above.

A plugin that allows editing images in Synap Editor using the Image-editor provided by TOAST UI.

How to Use

Loading Plugin Files

<!-- The SynapEditor object must exist for this to take effect,
     so include after the editor script files. -->
<script src="url of tuiImageEditor.min.js"></script>
<link rel="stylesheet" href="url of tuiImageEditor.min.css">

UI

Using the plugin name 'tuiImageEditor', you can add a button to the toolbar area or the menu area.

Add to Toolbar

// Editor configuration
//...
'editor.toolbar': [
    //...,
    'tuiImageEditor',
    //...
],
// ...

Add to Image Balloon Popup

// Editor configuration
//...
'editor.balloon': {
    //...
    'image': [
        //...
        'tuiImageEditor',
        //...
    ],
    //...
}
//...

Add to Menu

// Editor configuration
//...
'editor.menu.definition': {
    //...,
    'tools': [
        //...,
        'tuiImageEditor',
        //...
    ],
    //...
},
//...

Configure the Plugin

Menu Position Setting

Release 2.18.2409, 3.0.2409 and above.

Sets the position where the image editor's menu will appear.

// synapeditor.config.js
//...
'tuiImageEditor.config': {
    'menuBarPosition': 'bottom'  // 'left', 'right', default value: 'bottom'
}
// ...