Today I was celebrating with champagne at my office (not really but it sounds good), I have finally contributed my first lines of code to the Umbraco Core! =D

I fixed a small issue with the MetaWeblog API which makes it possible to create content from programs like Windows live writer, Word, Blogger and so on.

Issue: http://issues.umbraco.org/issue/U4-840

Changeset: http://umbraco.codeplex.com/SourceControl/network/forks/enkelmedia/umbracoMetaApiUrl/changeset/9f87c0f1fb30

How did i do it?

I was surprised by that fact that it was quite easy to contribute and I would like to describe how I did.

1. I read though the articles about how to contribute found at our.umbraco.org/contribute

2. Created an account on codeplex.com

3. Installed TortoiseHg as my Mercurial client to work the Umbraco repository. (and read this small tutorial on how to use it)

4. Created my own fork of the Umbraco repository on Codeplex (may not be needed, read last part of this page: Fork is taking to…)

5. Cloned my new fork to my local computer

6. Performed my changed to the code and made a commit.

7. Pushed the commit to my fork on Codeplex and created a pull request to the official Umbraco project.

So if you find annoying this and bugs in Umbraco, at least report them! If you have the time an knowledge, clone the repository and fix them. I got some great feedback from Sebastiaan Janssena and really learned some new stuff on the way!

All the best!

Today I was playing with my our public website, enkelmedia.se, where I host this blog. It’s built with Umbraco, some custom document types and some event handlers that takes care of the sorting and stuff.

One of the features that I’ve been playing with is the MetaWeblog API which makes it possible to post content to Umbraco using almost any device. You can use Windows Live Writer (like I’m doing right now), an iPhone app or any other software that supports the MetaWeblog API.

Some stuff did not work

What I found was that the implementation in Umbraco sometimes lacks in it’s handling of exceptions. I.e. clicking yes in this dialog made my blog root node disappear and I hade to consult this post by Alan Donnelly to solve it. I removed the last entries in cmsContentVersion and republished the node using the direct url /umbraco/editContent.aspx?id=yada.

Even more annoying

Was the fact that the Umbraco implementation of MetaWeblog API returns your sites url whithout scheme or ports:

yadadomain.com/blog.aspx

Window Live Writer expects something like this:

http://www.yadadomain.com/blog.aspx

And the crazy party is that there is no way to change it in the Windows Live Writer UI, the textbox is disabled:

The only way is to open “regedit” and look for this key: HKEY_CURRENT_USER\Software\Microsoft\Windows Live\Writer\Weblogs\ where you can change the settings of Live Writer.

Contribution to the core?

We’ll to be honest, until now I haven’t really taking the time to clone the repository from CodePlex before, I’ve played around with the source and used is as a reference and for documentation – but never really change any thing.

But today I read though the instructions on how to contribute and actually performed my first pull request!

http://umbraco.codeplex.com/SourceControl/network/forks/enkelmedia/umbracoMetaApiUrl/contribution/3372

Hej!

I fortsättningen kommer jag skriva en och annan bloggpost på engelska för att göra informationen tillgänglig för dem som inte haft förmånen att lära sig vårt fina språk =D
So this will be my first blog post in English, and I'm going to try to explain how to use the Client Dependency Framework with Umbraco CMS.

Client what?

First of all, the Client Dependency framework helps you to include, combine and compress javascript and CSS-files used on the website. It is not Umbraco-specific but this post will focus on how to use it in Umbraco.

Why?

There are a couple of good reason to use this framework.

• Compressing and combining resource files reduces load time.
• UserControls och Razor macros can insert dependent files in the head-tag without any fancy pluming.

This picture shows our.umbraco.org, they are using the Client Dependency Framework, but haven't activated it. Becuse of this the browser has to download around 20 different css and javascript files.

How?

Umbraco ships with the Client Dependency framework and there is not much that you need to set up. If you want to use the framework in a user control, just add a reference to it.

<%@ Register Namespace="ClientDependency.Core.Controls" Assembly="ClientDependency.Core" TagPrefix="cd" %>

Or, as I perfer, just add the reference to the web.config file. Since the framework will be used in a lot o places, it's much cleaner to keep the reference in web.config   

</pages>
   </controls>
      ...
      <add tagPrefix="cd" namespace="ClientDependency.Core.Controls" assembly="ClientDependency.Core" />
   </controls>
</pages>

When the reference is in place, we need to add a ClientDependencyLoader-control at the place where we want to include the CSS and JavaScript-files. Just add this line of code somewhere in the head-tag of you master-template.

<cd:ClientDependencyLoader runat="server" id="Loader" />

To include resources you just need to use these two lines.

<!-- Using web forms -->
<cd:CssInclude FilePath="~/css/style-120830.css" Priority="0" runat="server"  />
<cd:JsInclude FilePath="~/scripts/jquery-1.3.1.min.js" Priority="0" runat="server" />

<!-- Using razor -->
@Html.RequiresCss("ColorScheme.css", "Styles").RequiresJs("/Js/jquery-1.3.2.min.js");

You can add resources directly in the templates or in custom user controls or razor macros, it's even possible to add them in code using attributes.

// CSS
[ClientDependency(ClientDependencyType.Css, "~/css/style.css")] 

// JavaScript
[ClientDependency(ClientDependencyType.Javascript, "~/scripts/util.js")]

Priority

Can be used when you need one file to load before another, ie. if you are using jQuery it needs to load before any plug-ins. A lower priority means it will be render before higher values.

Compression and combination

It's important to notice that Client Dependency Framework will not combine or compress files unless the compilation debug is set to false.

<compilation defaultLanguage="c#" debug="false" batch="false" targetFramework="4.0">

Another thing that took me a while to get my head around was how to reset the cache:

• Change the version number in the ClientDependency config (/conifg/ ClientDependency.config)
• Remove the ClientDependency folder from App_Data 

More reading

http://clientdependency.codeplex.com/documentation

http://our.umbraco.org/wiki/reference/templates/adding-css-and-javascript-using-the-clientdependency