A week ago I
blogged about the initial thoughts for a Skin browser in
blog4umbraco (and in general) as well as looking at the server
part. Today I've started the work in the datatype - ie. the place
in blog4umbraco where you'll be able to fetch and change your
current skin.
While nowhere near done it was an interesting experience into
the very belly of the Umbraco core and an even better inspiration
on how we can make this much easier in the future. That was one of
my hopes for this calendar - that by eating our own dog food in an
über agile (read: completely unplanned) project we'd play with the
parts of Umbraco that we don't deal with normally. But let's start
from the beginning, shall we!
What is custom datatypes anyway?
Why not start by looking at what a datatype is. It's the
different types of edit options on content properties in Umbraco.
While that might sound a little complex, you know them already;
Upload, Richtext Editor, Ultimate Picker, Textbox multiple (and
what's up with that silly name for something that just a textarea,
Niels!), etc. In order words, datatypes are the "Type" you choose
when adding properties to a Document-, Member- or Media Type.
While Umbraco ships with more than twenty datatypes, you may
find that it's not sufficient and this is where the custom
datatypes comes in: As with any other areas of Umbraco you can add
your own.
The options
Datatypes are the most central part of Umbraco and can be a bit
overwhelming as they handle editing, persistence, xml generation
and configuration at their most extreme and the price for all this
is of course a good bunch of interfaces that you need to implement.
At the same time this was one of the very first things designed in
Umbraco back in 2004, so - well, let's just skip over that part
elegantly and say there's room for improvement - and improvement
has been made!
Instead of learning a lot about how all these interfaces work,
you can turn any ordinary user control into a custom datatype with
implementing just one interface with a single property by using the
existing "Usercontrol wrapper" datatype and the
IUsercontrolDataEditor interface (found in the
umbraco.editorControls.userControlGrapper namespace - notice the
nice typo in the namespace. That's called digital patina and gets
more and more charming as it age. It's definitely not a bug!).
While this technique is really easy and sweet it doesn't fit our
needs as we're trying to make a pretty generic datatype that can be
used in other places that just the blog4umbraco package, so...
AbstractDataEditor is our choice!
The abstractDataEditor was added in Umbraco 4.0.1 to make it
easier to build advanced custom datatypes. It makes it possible to
use composite controls together with custom configurators all while
not having to know about how everything is wired in Umbraco - just
what we need! But the whole configuration part is really something
that could need a lot of TLC as all the CRUD operations of config
values is a manual process which is really silly and unnecessary
complex. But this means that we can improve Umbraco and that's
awesome :)
While this (and the above) is great topics for future umbraco.tv
videos you can read more about making your own Abstract Data
Editors on Tims awesome blog.
With the Abstract DataEditor in place I was able to make a nice
(unpolished) way of configuring which package that the SkinBrowser
should query on the package repository as well as a placeholder
that'll take care of fetching new skins as well as install
them:
The SkinBrowser configurator
How it looks right now when placed on a document type
(currently a non-functional placeholder)
More on that very soon...