markItUp! is a JavaScript plugin built on the jQuery library. It allows you to turn any textarea into a markup editor.
This is a plugin for markItUp! to add the ability to browse for images and files to upload via ajax. A link to the file, or image tag is then returned to the editor.
This plugin supports Textile, Markdown and HTML.
This plugin was written for Perch – a light weight PHP content management system. This is a simplified, standalone version of the plugin shipped by default with Perch.
Copy the image_upload
folder into your markitup
folder.
Use the following to add the button to your toolbar. You may wish to replace the default ‘Pictures’ button.
{name:'Picture', className:'image-upload', closeWith:function(markItUp){miu.ImageUpload.upload(markItUp,'textile');}},
{name:'File', className:'file-upload', closeWith:function(markItUp){miu.ImageUpload.upload(markItUp,'textile',true);}},
Replace textile
with markdown
or html
for your language of choice.
The supplied image_upload.php
file performs an extremely basic file upload in PHP. Customise the paths at the start of the file to your system.
The plugin looks for three HTML5 data-
attributes on your textarea
tag, and if present, passes them along to the upload script:
data-width
data-height
data-crop
This can be used by the upload script for processing the image to match the context. This processing uses a Perch API, and so is not included with this version of the upload script. It could be easily implemented.