https://github.com/astares/seaside-tinymce

Seaside wrapper for Tiny MCE
https://github.com/astares/seaside-tinymce

pharo seaside

Last synced: 4 days ago
JSON representation

Seaside wrapper for Tiny MCE

• Host: GitHub
• URL: https://github.com/astares/seaside-tinymce
• Owner: astares
• License: mit
• Created: 2020-04-03T11:50:44.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2020-04-13T09:32:11.000Z (over 4 years ago)
• Last Synced: 2024-10-31T06:41:49.512Z (about 2 months ago)
• Topics: pharo, seaside
• Language: HTML
• Size: 354 KB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Seaside-TinyMCE

[Seaside](http://www.seaside.st) wrapper for Tiny MCE Editor

## Project info

The "TinyMCE for Seaside" project provides the [TinyMCE][1] editor libraries for use in Seaside applications.

### Project location

The project is located on GitHub at [https://github.com/astares/Seaside-TinyMCE](https://github.com/astares/Seaside-TinyMCE)

### License

The Smalltalk code is under MIT License. Note that TinyMCE has an LGPL license.

## Installation

First install Seaside into your [Pharo](http://www.pharo.org) image:

```Smalltalk

Metacello new

  baseline:'Seaside3';

  repository: 'github://SeasideSt/Seaside:develop/repository';

  load.

```

Now you can install the packages necessary for TinyMCE by evaluating:

```Smalltalk

Metacello new

   baseline:'TinyMCE';

   repository: 'github://astares/Seaside-TinyMCE:master/src';

   load

```

## Run locally

After starting the Seaside server you can check out the example at

    http://localhost:8080/tinymce

    

    

![alt text](screen.png "Screenshot")

## How to use

### Add the file library

As usual you should create a subclass of WAComponent for an own Seaside web application component. To use the library just register it with your Seaside application.

```Smalltalk

register

    |app|

    app := WAAdmin register: self asApplicationAt: 'tinymce'.

    app addLibrary: TMCEFileLibrary 

```

### Render the editor component

To render the editor component you just need a textArea tag in your generated HTML code and modify it to be a TinyMCE Editor using a simple JavaScript. Here is an example Seaside rendering method:

```Smalltalk

renderContentOn: html

    html heading: 'TinyMCE Demo'.

    html form: [ 

        html textArea 

            callback: [ :value | text := value];

            with: text.

        html break.	

        html submitButton: 'Send to server and display' ].

        html break; horizontalRule.	

        html html: text.

        "Add the script to run TinyMCE"	

        html script: ' tinymce.init({selector:''textarea''});'

```

Check out the [TinyMCE](http://www.tinymce.com) documentation for more.