Skip to content

Commit e7e9cce

Browse files
committed
Add file-upload section to readme.
1 parent 83d97c9 commit e7e9cce

File tree

1 file changed

+43
-1
lines changed

1 file changed

+43
-1
lines changed

readme.textile

Lines changed: 43 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -172,6 +172,49 @@ $(this).wysihtml5('resetDefaults')
172172

173173
Operations on the defaults are not thread-safe; if you're going to change the defaults, you probably want to do it only once, after you load the bootstrap-wysihtml plugin and before you start instantiating your editors.
174174

175+
h2. Image Upload
176+
177+
To turn on the image upload support, you need to reference "jQuery-File-Upload":https://github.com/blueimp/jQuery-File-Upload and its dependencies:
178+
179+
<pre>
180+
<script src="lib/js/jquery.ui.widget.js"></script>
181+
<script src="lib/js/jquery.iframe-transport.js"></script>
182+
<script src="lib/js/jquery.fileupload.js"></script>
183+
</pre>
184+
185+
Then, if @options.fileUpload@ is given, there will be an additional file input field in the insert image modal.
186+
187+
<pre>
188+
$('#some-textarea').wysihtml5({
189+
// options passed to jQuery-File-Upload.
190+
fileUpload: {
191+
url: 'http://localhost:8888',
192+
dataType: 'json',
193+
done: function(e, data) {
194+
var images = [];
195+
$.each(data.result.files, function(index, file) {
196+
images.push({
197+
src: file.url,
198+
alt: file.name
199+
});
200+
});
201+
return images;
202+
}
203+
}
204+
});
205+
</pre>
206+
207+
The @done@ callback should return an object or an array of objects with the following format:
208+
209+
<pre>
210+
{
211+
src: 'http://example.com/path/to/the/image',
212+
alt: 'img alt' // optional
213+
}
214+
</pre>
215+
216+
Note that **@src@ must be a full absolute url**.
217+
175218
h2. The underlying wysihtml5 object
176219

177220
You can access the "wysihtml5 editor object":https://github.com/xing/wysihtml5 like this:
@@ -181,7 +224,6 @@ var wysihtml5Editor = $('#some-textarea').data("wysihtml5").editor;
181224
wysihtml5Editor.composer.commands.exec("bold");
182225
</pre>
183226

184-
185227
h2. I18n
186228

187229
You can use Bootstrap-wysihtml5 in other languages. There are some translations available in the src/locales directory. You can include your desired one after the plugin and pass its key to the editor. Example:

0 commit comments

Comments
 (0)