A Week with Toolbar, Part 2

After a great start something needs to go wrong. If there is a piece of software that repeatedly made me cry, thats TinyMCE. Especially heart breaking is Plone's integration of it. Nevertheless I stood strong and since gods of TinyMCE don't like to see big guys cry I defeated dark forces, which are always trying to escape when you look into TinyMCE code.

Today I finished a week long work which was focusing on plone.app.toolbar. I must say I'm really happy with results and I hope you will be also.

I'm especially proud of my work on plone.overlay.js and jquery.iframe.js where I took few steps back, clean up the code and as a result we now have stable overlay library which works via iframe.

And I finally found enough time to get toolbar that was designed by Rob Gietema into plone.app.toolbar. See pictures below.

Ofcourse please keep in mind that plone.app.toolbar is not finished, but it was a great progress this week and there is more to come.

Widgets, Toolbar, Deco and Tiles?

Maybe another explanation of above title is not needed, but I would just like to clarify once again, whats the purpose behind all this different packages.

  • ``plone.app.widgets``: Trying to clear the mess that we have with widgets in Plone's forms, by providing set of high quality widgets.
  • ``plone.app.toolbar``: Depends on plone.app.widgets. Creates toolbar on top of the page. This toolbar is actually another iframe and when soma button in toolbar gets clicked, content of that link loads in overlay which is part of same iframe as toolbar. This way we don't have to worry about breaking some backend forms when creating new theme for Plone. Forms in overlays are using widgets from plone.app.widgets.
  • ``plone.app.standardtiles``: Depends on plone.app.toolbar. Provides view for managing tiles outside content area, eg. Logo tile, Footer tile, ...
  • ``plone.app.deco``: Depends on plone.app.toolbar. Provides nice drag'n'drop editor to manage tiles inside content area.

Last 5 days in pictures

Instead of embarrassing myself with even more crippled english I'll just left you with some pictures of last days of work on plone.app.toolbar.

http://garbas.si/galleries/blog-2013/installing-plone-toolbarhttp://garbas.si/galleries/blog-2013/plone-installed

First we install plone.

http://garbas.si/galleries/blog-2013/toolbar

This is new design of toolbar by Rob, I hope you like it.

http://garbas.si/galleries/blog-2013/toolbar-dropdownhttp://garbas.si/galleries/blog-2013/loading-overlayhttp://garbas.si/galleries/blog-2013/overlay-headerhttp://garbas.si/galleries/blog-2013/overlay-buttons

Forms are using bootstrap styles.

http://garbas.si/galleries/blog-2013/saving-overlayhttp://garbas.si/galleries/blog-2013/overlay-sharinghttp://garbas.si/galleries/blog-2013/overlay-select-default-page

Many buttons in toolbar are opening in overlay already. Others will follow soon.

http://garbas.si/galleries/blog-2013/overlay-content-ruleshttp://garbas.si/galleries/blog-2013/overlay-add-link

How do I get this lovely stuff on my leptop

Clone buildout.deco and use toolbar.cfg buildout configuration.

~% git clone git://github.com/plone/buildout.deco.git
~% cd  buildout.deco/
~/buildout.deco% python bootstrap.py -d -c toolbar.cfg
~/buildout.deco% bin/buildout -c toolbar.cfg
~/buildout.deco% bin/instance fg

After Plone starts create new Plone site with Plone Toolbar profile.

Now at this point I would like to throw you into direction of documentation, but currently all documentation is out of date or is not existing. Until I find time to write it, please don't be a stranger and poke me for any help/questions/assistance you have with plone.app.toolbar I'll take time to get you started with developing plone.app.toolbar right away.

When will toolbar be ready

I told already many times that we're almost there. Very rouge estimation is that a month of work like last week is needed and we would have a working version of plone.app.toolbar done. For that reason I'll be opening Chipin, but more on this topic I'll write tomorrow. I hope I can count on your support.

And last I would like to thank Pretaweb for sponsoring my work of last week.

UPDATE:fixed typos in commands in "How do I get this lovely stuff on my leptop"
comments powered by Disqus