Image Properties - carstenschaefer/ImagerJs GitHub Wiki

Provides a tool for setting image properties in redactors editor. (Redactor plugin only)

---

Possible settings:

• Image Size by its width and height.
• Alignment of image: Left, Right, Center, Inline or Floating.
• Transparent background (best for floating images).

Enabling the Plugin

plugins: [
    'Rotate',
    'Crop',
    'Resize',
    'Properties'
]

Configuration

pluginsConfig: {
    Properties: {
      minWidth: 50,
      minHeight: 50
    }
}

Configuration of ImagerJs Options for Preview Usage

var imagerOptionsPreview = {
      plugins: ['Resize', 'Crop', 'Rotate', 'Toolbar'],
      waitingCursor: 'wait', 
      editModeCss: editModeCss,
      pluginsConfig: pluginsConfig,
      quality: quality,
      quality: 0.9,
      targetScale: 0.5,
      hideFileSelection: true
};

Configuration of ImagerJs Options for Use in Redactor

var imagerOptionsRedactor = {
      plugins: ['Resize', 'Crop', 'Rotate', 'Toolbar', 'Save', 'Delete', 'Properties']
      waitingCursor: 'wait', 
      editModeCss: editModeCss,
      pluginsConfig: pluginsConfig,
      quality: quality,
      hideFileSelection: true
};

Configuration of Redactors Options

var redactorConfig = {
      plugins: ['ImagerJs'],
      ImagerJs: {
          contentConfig: contentConfig,
          hideFileSelection: true,
          quality: quality,
          redactor: imagerOptionsRedactor,
          preview: imagerOptionsPreview
      }
};

• Optional setting. If not specified, the settings shown in the example will be used.
• minWidth: sets the minimum width of properties window.
• minHeight: sets the minimum height of properties window.