YUI Editor Question

Not out of the box, but you could add the code to modify the toolbar.

If your JS isn't great, let me know and I'll throw you a snippet when I get time.

Another (possibly better) solution would be if MT's asset section supported adding assets from the web.

Well that was a lot easier than I thought, I love YUI :)

Add this to your mt-static/plugins/yuieditor/config.js in the afterYUIInit function:

    YUIEditor.toolbar.addButtonToGroup({ type: 'push', label: 'Image Asset', value: 'insertasset' }, 'insertitem');
    YUIEditor.toolbar.on('insertassetClick', function() {
        //Get the selected element
        var _sel = YUIEditor._getSelectedElement();
        //If the selected element is an image, do the normal thing so they can manipulate the image
        if (_sel && _sel.tagName && (_sel.tagName.toLowerCase() == 'img')) {
            //Do the normal thing here..
        } else {
            //They don't have a selected image, open MT's default asset interface
            var div = DOM.getElement( "editor-content-enclosure" );
            app.openDialog( "__mode=list_assets&_type=asset&edit_field=" + div.getAttribute( "edit-field" )
                + "&blog_id=" + div.getAttribute( "mt:blog-id" ) + "&dialog_view=1&filter=class&filter_val=image" );
            //This is important.. Return false here to not fire the rest of the listeners
            return false;
        }
    }, YUIEditor, true);

    //We need to add another button to access MT's file asset as well as the image asset

    YUIEditor.toolbar.addButtonToGroup({ type: 'push', label: 'File Asset', value: 'insertfile' }, 'insertitem');

    YUIEditor.toolbar.on('insertfileClick', function() {

        var div = DOM.getElement( "editor-content-enclosure" );

        app.openDialog( "__mode=list_assets&_type=asset&edit_field=" + div.getAttribute( "edit-field" )

            + "&blog_id=" + div.getAttribute( "mt:blog-id" ) + "&dialog_view=1" );

    }, YUIEditor, true);

Whilst you are in there, set ConfigUseMTAssets to false (so that the default yui one is shown and we then add the MT ones with the above code).

You will also need to make an icon for the button and something like this to the mt-static/plugins/yuieditor/assets/css/yui_editor.css

.yui-skin-sam .yui-toolbar-container .yui-toolbar-insertasset span.yui-toolbar-icon,
.yui-skin-sam .yui-toolbar-container .yui-button-insertasset-selected span.yui-toolbar-icon {
    background-image: url( ../assets/insert_file.gif );
    background-position: 3px 3px;
    left: 5px;
}

That should do it.

Very Cool! Thanks Richard! I would have asked you via your blog but the captcha wasn't working in the comments yesterday. I'm glad you're here to help out :-)

I'll give it a try today and let you know how it goes!

Hi Richard,

Most of the code works but when I click the icons to upload to the MT asset manager, the screen turns dark gray as if to open it up but nothing appears. Any ideas? I tried playing around with the javascript but couldn't get it to work.

Any suggestions?

hmmm weird. What MT and YUI versions you using?

Compare your config.js to mine:

http://www.richardbenson.co.uk/mt/mt-static/plugins/YUIEditor/config.js

Okay thanks for that! I think there was a line break or something in there that messed things up for me. I'll test it out today and let you know how it goes :-)