I've been thinking about how the ASP.NET Visual Designer should work with CSS and good semantic markup, and I've been thinking a lot about the role of both of these in the Web. In particular, what part do they play with ASP.NET?
I believe that the content of a document should be kept separate from its presentation. Semantic markup is good; structured content is easier for a machine to interpret and convert, as well as being cleaner and more elegant. CSS allows us to style a document without affecting its markup, and the same stylesheets can be applied to multiple documents for consistency and efficiency. Good semantic design also improves maintainability and accessibility.
But where does semantic HTML fit into this? A UI and a document are different things, and should be separated. I don't really care how semantically correct a UI is on principle, though it does have some advantages, especially accessibility. But the semantics of a UI and of a document are different. If only there were a 'document' tag that could be inserted into HTML to show which bits are documents or document fragments, and another set of tags for panels and menus and so on.
Usually the solution is to use CSS classes, with some kind of <div id="content"> containing the document. But what kind of CSS design system works well with this? I have considered a couple of approaches.
I think that both would be useful, actually. In both cases, however, I think it's important to keep the style design distinct from the document design, even if the "document" is a UI. I'm tempted to remove all the font size and style, italic, bold, indent etc. toolbar options from AspNetEdit and replace them with a CSS style selector and semantic element buttons like "em". Though I'm also considering ways of enforcing which types of elements different CSS classes can be applied to, maybe some kind of stylesheet schema, and a way to use schemas to enforce structured document design.
As an aside, I've often wondered why there isn't a "semantic word processor" that enforces document structure and styles, and removes the temptation to fiddle with the details.
Anyway, if anyone has any ideas about this, comments are welcome as always. I've already begun to implement some of the changes to the toolbox discussed last time; I decided to go with a simple treeview with a filtering box at the time. Unfortunately I'm very busy with academic work right now, but look for developments sometime next term!
Update:I recently came across microformats, which look cool. Nice semantically, meaningfully, defined structures. I'd love to have an HTML graphical editor driven by some sort of schema to restrict editing in certain regions of a page to particular formats like these.
I'm cleaning up some of AspNetEdit's widgets, the Toolbox and the PropertyGrid. My original plan was to use GTK#'s TreeView for both, but while working on the toolbox I realised that it may not be the best solution for this particular item.
Why? Well, it depends on how people want the toolbox to work. Should the basic mechanism stay as it is, a TreeView-style list with expandable categories in one huge scrollable box? Or should it be similar to Outlook, with effectively a radio-button choice of one category that gets its own scrollable area?
I've used Glade to create a side-by-side mockup of the two approaches:
I personally prefer the one on the left, but it does raise scalability problems with large numbers of categories, though this is not likely to be a common scenario. It would also make it more difficult to reorder categories.
Comments below, please.
Okay, I admit it, so far I've been "cheating", rendering the page to a temp file every time something changes. No longer! I present to you the all-singing, all-dancing Mozilla editor version. You can select controls on the surface, type text straight into the page, resize controls, and drag-n-drop! This is the first you'll have seen of my co-conspirator Blago's work, but trust me, it's been worth the wait.
In other news, saving and loading are temporarily broken. We also haven't exposed many of the Mozilla editor's features, the main ones being cut/copy/paste, undo/redo, styling, and table editing. However, at this point it's mainly just a matter of hooking them up to toolbar buttons.
Oh, and those are new control icons. They haven't been released yet, as they're too embarassing, but if some SVG genius would like to improve them, the source files are available on request.
I've finally committed the ASP.NET Graphical Designer to Mono Subversion, module 'aspeditor'. It's unimaginatively codenamed AspNetEdit. If anyone *really* wants to play with it, please be aware that right now it doesn't do an awful lot. Also it requires Mono class libraries hot out of SVN. I would advise waiting till an actual release the beginning of September; I'll keep my blog updated with screenshots. Here's the next:
As before, you can add controls to the design surface from the toolbox, and change their properties with the Property Browser. In this screenshot you can also see the new Collection Editor. All of this has been polished, and you can now save the document to a .aspx file. However, ASP directives are not suported yet, and the interactive design surface is still a little way away.
Okay, it's not quite as exciting as the title suggests. I've been hacking away on the Services and Component Model, and have reached the stage where I can display controls, select them from a drop-down list, change their properties, and have the change reflected on the design surface. You can't interact with the design surface directly yet, and the controls aren't really in a document, just a collection of controls. But it looks pretty!
Update, 28-7-05: Noticed I'd put this in the wrong category.
There was a bit of trouble initially as I couldn't obtain an nsIWebBrowser pointer from gtk_moz_embed_get_nsIWebBrowser. This turned out to be because the Gecko# WebControl hadn't been shown yet (i.e. window.ShowAll()), but I didn't figure this out as other functions like gtk_moz_embed_get_location worked fine.
Here's Blagovest Dachev's XUL GUI demo hosted in my container, with a simple C#->JS call demonstration. For anyone who hasn't seen the Mono Summer of Code page, Blago's working on the Mozilla half of this project.
However, splitting the call in two parts like this could have consequences; there's no telling what multithreading could do to concurrency. I guess some kind of unique identifier is in order.
I also need to finish all of the error and exception handling at some point, though it seems robust enough at the moment.
Gecko# wraps GtkMozEmbed, which is a C GTK widget, hiding Mozilla's native C++. Understandably this widget isn't bloated by wrapping the Mozilla DOM or other internals: it claims to exposes enough functionality for "about 80% of uses". Essentially this means a basic web browser.
However, to do anything interesting I need to interact with Gecko# from my C# code, and vice versa. There are two obvious ways to approach this:
So, assuming I choose the second for speed and ease of development, how do I go about implementing it? This time, I have four choices:
Well, I initially tried the fourth method, until I realised how much easier the first would be, and cursed XPCOM and the days it had taken from my life.
Fate has twisted sense of humour. Two days into the initial implementation of the editor's high-level architecture, as I began to flesh out the message passing system, I discovered the fickleness of Gecko#'s streams, and had to revert to XPCOM and P/Invoke.
More on this story later, once I have something working.
Hello everyone! (waves to as-yet nonexistent audience)
I finally bring to you some useful content in my blog. I have been accepted onto Google's Summer of Code and will be working with the Mono Project to bring you a user-friendly graphical designer for ASP.NET, which will be integrated into the MonoDevelop IDE.
I will be chronicling any interesting developments right here for your amusement and gratification. Stay tuned!
Three months since I last posted on this site, and all of those early posts were just about setting the site up. Seems lie the site's a bit pointless, really. Not that I've been sitting idle; I've been snowed under with academic work. I'll get something interesting up here eventually, I promise.
For now, let it be known that I am procrastinating my exam revision by upgrading the site to Drupal 4.6.
The site's only been up for five days and I'm already getting referrer spam. No comment spam yet, but I'll probably disable comments and trackbacks until I have some interesting stuff up, and sort it out then.
Thanks to some helpful advice on Caveat Lector I used a bunch of Apache .htaccess rules to filter out domains containing spam-like words. It's likely that there will be some false positives but until I find another way, it'll have to do.
In other news, Drupal's project module is giving me trouble; it refuses to track my projects' releases. I think it's PostgreSQL compatibility-related, but the exact reason is proving to be difficult to track down.