Twitter is…

I just started using twitter…I know…yeah for me but until just recently I never understood twitter. I was of the mindset that Facebook status updates where the way to go. Compact, secure, great level of engagement – Until I started really using Twitter.

So, here is how my developer brain breaks down what twitter is and how its useful.

Twitter is a loosely coupled system where Facebooks implmentation of status updates is ….um…not loose coupling

Man…that is a horrable analogy! Can someone do better…PLEASE

Related posts:

1. Twitter Notify – A Windows Live Writer Twitter Plug-in

Outside Prospective

Often times its hard to see someone else’s prospective, especially when it relates to how they see you. I was recently afforded the clarity of another’s prospective

I don’t think EVERYONE hates you. I would probably say a majority, but it’s probably like 51% hate / 49% love

Me: I think its more like 90% dislike, 5% hate, 2% undecided, 3% love

I just have been handed the early returns:

65% dislike, 10 % distrust, 7% mildly annoyed by,  5% annoyed, 4% kinda ok with, 4% could care less about, 3% hope to see you destroyed,  3% love,  2% undecided, 2% just waiting to see what you f up next

Its a JOKE! …wait…is it only funny because its true?

No related posts.

DRY: CSS #1

I find that DRY is the most underused understated TLA in application development today. Even when dealing with developers that come from a model-driven architecture (the java developers I work with).

Professor Wikipedia has this to say about DRY:

The DRY code philosophy is stated as “Every piece of knowledge must have a single, unambiguous, authoritative representation within a system.”

And

When the DRY principle is applied successfully, a modification of any single element of a system does not change other logically-unrelated elements. Additionally, elements that are logically related all change predictably and uniformly, and are thus kept in sync.

Ok, back to me and my um…”wet” css. Here is a snippet from our central CSS repository. You see we all use the same central CSS files….good in theroy…not sure about it in practice yet.

What a wasteful use of bits…

   1:  .textXXSmallRed {

   2:  color:#FF0000;

   3:  font-family:verdana,arial,helvetica,sans-serif;

   4:  font-size:xx-small;

   5:  font-weight:normal;

   6:  }

   7:   

   8:   

   9:  .textXXSmallRedBold {

  10:  color:#FF0000;

  11:  font-family:verdana,arial,helvetica,sans-serif;

  12:  font-size:xx-small;

  13:  font-weight:bold;

I know, I know…the naming is far from Structural naming convention. And what would happen if we need to change all the side-bar links from red to blue…global search and replace….sounds like fun….but this post is about DRY!

   1:  <span class="bold red xxsmall">here is my text</span>

Again with the poor naming…I know already! lets try to stay on the DRY topic. The code above shows how multiple classes can be applied to an element. The CSS is then much easier to manage…also, IMHO, its more human readable.

Ok, enough venting…back to work…

No related posts.

ASP.NET MVC SiteMap

Note: This code does not support caching or security trimming. It is simply a way to build something that compares to the .NET TreeView control using the MVC pattern.

Recently one of my clients had the "perfect storm" of requirements, restrictions, deadlines and policies that lead to the need to develop a MVC TreeView(ish) control.

Requirements:

1. Database storage – Site administrations needed a simple interface into editing and I was not about to write something to update XML files.
2. NOT use the SQL Service Broker for easy SQL caching support – Security concerns….I assume…I was never told why NOT but just NO.
3. Support the MVC pattern – new projects where being developed using ASP.NET MVC
4. Easy to implement and maintain

Design:

1. With MS shipping jQuery it would be nice to use a jQuery plugin to render the tree
2. Leverage existing technology – Exising project are using the SQL SiteMap Provider, hence, accompanying tables and stored procedures.
3. Extend the ASP.NET MVC HtmlHelpers class

Note: I assume your application is currently setup to use the SQL SiteMap Provider…or at least the Table for the provider exists.

Step 1: Create a Stored Procedure that uses a CTE

Most of the heavy lifting happens here. As you can see, when viewing the full-size image, the results are ordered by "thePath". That makes parsing the results into a ordered list very easy.

   1:  WITH siteMapCTE(SYSID, ID, Parent,title,description,url,roles, level, thePath) AS (

   2:      SELECT SYSID, ID, Parent,title,description,url,roles, 1 as level, CONVERT(VARBINARY(MAX), ID) AS thePath

   3:      FROM aspnet_SiteMap WHERE Parent is NULL

   4:      UNION ALL

   5:      SELECT e.SYSID, e.ID, e.Parent,e.title,e.description,e.url,e.roles, c.level + 1, c.thePath + CONVERT(VARBINARY(MAX), e.ID) AS thePath

   6:      FROM aspnet_SiteMap e

   7:      INNER JOIN siteMapCTE c

   8:      ON e.Parent = c.ID

   9:  )

  10:  SELECT * FROM siteMapCTE ORDER BY thePath, title

Step 2: Create new HtmlHelper method

First off..Stephen Walther’s first ASP.NET MVC article was on writing html helpers using Extension Methods. I have his sample in a current project so it was a great place to drop in the new method.

<Extension()> _

        Public Function ListBasedSiteMap(ByVal HtmlHelper As HtmlHelper, ByVal items As Object) As String

            If items Is Nothing Then

                Throw New ArgumentNullException("items")

            End If

            Dim builder As New StringBuilder()

            Dim mPreviousLevel As Integer

            Dim mUrl As String = String.Empty

            builder.Append("<div class=""demo"" id=""testMap""><ul>")

            For Each row As DataRow In items.Rows

                If row.Item("url").ToString.Contains("~/") = True Then

                    mUrl = "/" & System.Configuration.ConfigurationManager.AppSettings("application.name") & "" & row.Item("url").ToString.Split("~/")(1)

                Else

                    mUrl = row.Item("url").ToString

                End If

                If row.Item("level") = 1 Then

                    builder.AppendLine("<li id=""" & row.Item("id") & """ class=""open""><a href=""" & mUrl & """>" & row.Item("title") & "</a>")

                ElseIf mPreviousLevel < row.Item("level") Then

                    'child 

                    builder.AppendLine("<ul>")

                    builder.AppendLine("<li id=""" & row.Item("id") & """><a href=""" & mUrl & """>" & row.Item("title") & "</a>")

                ElseIf mPreviousLevel = row.Item("level") Then

                    builder.AppendLine("<li id=""" & row.Item("id") & """><a href=""" & mUrl & """>" & row.Item("title") & "</a>")

                ElseIf mPreviousLevel > row.Item("level") Then

                    'close level

                    builder.AppendLine("</li>")

                    builder.AppendLine("</ul>")

                    builder.AppendLine("<li id=""" & row.Item("id") & """><a href=""" & mUrl & """>" & row.Item("title") & "</a>")

                Else

                    'parent ?

                End If

                added.Add(row.Item("id"))

                mPreviousLevel = row.Item("level")

            Next

            builder.AppendLine("</ul></div>")

            Return builder.ToString()

        End Function

Oh…I pass the results in as a data table….you can change that to be whatever your passing….

Step 3: Get results to your view

How ever you like, get the data to the view. Again, I am using my own DAL and pass the results in as a Data Table

Step 4: Put the unordered list on the view

   1:  <%=Html.ListBasedSiteMap(ViewData("siteMap"))%>

Don’t forget to import the HtmlHelpers namespace…in your paper (I presume its a master page or the web.config)

   1:  <%@ Import Namespace="yourNameSpace.HtmlHelpers" %>

Break

Ok, at this point you should have an non-styled unordered list of SiteMap nodes that looks something like. All we have to do now is style, wire and go. As a matter of fact, the sitemap should work too!…it just looks like crap.

Step E: jsTree!

I’m not going to walk you through the process of wiring up your site to use jsTree but that is the next step. download, and put the files into your project, add the script and link tags for the javascript and css…modify the CSS as needed…

So maybe I did walk you through it…anyway.

Step VI: onload event….um…

I’m using dojo for this project with the exception of the TreeView so I leveraged dojo’s OOP and onload….this should work but its not tested.

   1:  var first = null;

   2:  $(function() { 

   3:  tree1 = new tree_component();

   4:              tree1.init(jQuery("#testMap"), {

   5:                  cookies: {

   6:                      prefix: "sitemap",

   7:                      opts: { path: '/' }

   8:                  },

   9:                  callback: {

  10:                      onchange: function(NODE) {

  11:                          if (!first) {

  12:                              first = true;

  13:                          } else { document.location.href = jQuery(NODE).children("a:eq(0)").attr("href"); }

  14:                      }

  15:                  }

  16:              });

  17:   });

Finish

Here is what I ended up with…

Again, I know…no caching…no security trimming but it works and you can allow management of the nodes from a web interface (of course you have to code that) … If anyone adds trimming please let me know…I don’t have a need now but I’d like to keep this all together in one place.

No related posts.