<?xml version="1.0" encoding="utf-8"?>
<rss xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:pingback="http://madskills.com/public/xml/rss/module/pingback/" xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/" xmlns:dc="http://purl.org/dc/elements/1.1/" version="2.0">
  <channel>
    <title>Human-Debugger.net - Software Development|Design Patterns</title>
    <link>http://www.human-debugger.net/blog/</link>
    <description>Raba - Defend your code</description>
    <language>en-us</language>
    <copyright>Shani Raba</copyright>
    <lastBuildDate>Sun, 07 Jun 2009 02:48:07 GMT</lastBuildDate>
    <generator>newtelligence dasBlog 2.3.9074.18820</generator>
    <managingEditor>human.debugger.net@gmail.com</managingEditor>
    <webMaster>human.debugger.net@gmail.com</webMaster>
    <item>
      <trackback:ping>http://www.human-debugger.net/blog/Trackback.aspx?guid=92c5a9aa-8278-4b78-ae36-53ee76732b6a</trackback:ping>
      <pingback:server>http://www.human-debugger.net/blog/pingback.aspx</pingback:server>
      <pingback:target>http://www.human-debugger.net/blog/PermaLink,guid,92c5a9aa-8278-4b78-ae36-53ee76732b6a.aspx</pingback:target>
      <dc:creator>Shani Raba</dc:creator>
      <wfw:comment>http://www.human-debugger.net/blog/CommentView,guid,92c5a9aa-8278-4b78-ae36-53ee76732b6a.aspx</wfw:comment>
      <wfw:commentRss>http://www.human-debugger.net/blog/SyndicationService.asmx/GetEntryCommentsRss?guid=92c5a9aa-8278-4b78-ae36-53ee76732b6a</wfw:commentRss>
      <title>Rendering Objects to Html</title>
      <guid isPermaLink="false">http://www.human-debugger.net/blog/PermaLink,guid,92c5a9aa-8278-4b78-ae36-53ee76732b6a.aspx</guid>
      <link>http://www.human-debugger.net/blog/2009/06/07/RenderingObjectsToHtml.aspx</link>
      <pubDate>Sun, 07 Jun 2009 02:48:07 GMT</pubDate>
      <description>&lt;div&gt;&lt;p&gt;&lt;strong&gt;Background:&lt;/strong&gt;&lt;/p&gt; &lt;p&gt;We are writing a new task for the ArcGis Explorer, this task needs to place images on the globe using its X,Y coordinates.&lt;br&gt;While for each instance on the globe we need to render its details as html.&lt;/p&gt; &lt;p&gt;&lt;strong&gt;Mission:&lt;/strong&gt;&lt;/p&gt; &lt;p&gt;Rendering the objects to html, we are still didn't find the right place (on the server or on the client), but let assume that they both need to do the same job.&lt;/p&gt; &lt;p&gt;&lt;strong&gt;Ideas:&lt;/strong&gt;&lt;/p&gt; &lt;ol&gt; &lt;li&gt;&lt;strong&gt;Render in code:&lt;/strong&gt;&lt;br&gt;This is the naive way of thinking. while you are first thinking about this&amp;nbsp; problem you might think to add the object an &lt;em&gt;ToHtml()&lt;/em&gt; method.&lt;br&gt;Always think about the: &lt;a href="http://www.objectmentor.com/resources/articles/srp.pdf"&gt;Single Responsibility Principle (SRP)&lt;/a&gt;.&lt;br&gt;You can still think about Writing an &lt;em&gt;HtmlWriter&lt;/em&gt; or &lt;em&gt;HtmlRenderer&lt;/em&gt; class that gets object and render the object using reflection or something else, but than you will find yourself indenting you JavaScript\html\CSS in C#, for example you can watch this code:&lt;br&gt;&lt;br&gt; &lt;div&gt; &lt;div style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   1:&lt;/span&gt; var items = &lt;span style="color: #0000ff"&gt;new&lt;/span&gt; List&amp;lt;&lt;span style="color: #0000ff"&gt;string&lt;/span&gt;&amp;gt; {&lt;span style="color: #006080"&gt;"Shani"&lt;/span&gt;, &lt;span style="color: #006080"&gt;"Doron"&lt;/span&gt;, &lt;span style="color: #006080"&gt;"Nati"&lt;/span&gt;, &lt;span style="color: #006080"&gt;"Yossi"&lt;/span&gt;};&lt;/pre&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   2:&lt;/span&gt; var sb = &lt;span style="color: #0000ff"&gt;new&lt;/span&gt; StringBuilder();&lt;/pre&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   3:&lt;/span&gt; items.ForEach(currentItem =&amp;gt; &lt;/pre&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   4:&lt;/span&gt;         sb.AppendFormat(&lt;span style="color: #006080"&gt;"&amp;lt;li&amp;gt;{0}&amp;lt;/li&amp;gt;"&lt;/span&gt;, currentItem)&lt;/pre&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   5:&lt;/span&gt;         );&lt;/pre&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   6:&lt;/span&gt; &lt;span style="color: #0000ff"&gt;string&lt;/span&gt; data = sb.ToString();&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;
&lt;div&gt;Let's think about the time we will need to change the UI from &lt;em&gt;&amp;lt;li&amp;gt; &lt;/em&gt;to one with style or maybe even change the list to be styled as table...&lt;/div&gt;
&lt;div&gt;&amp;nbsp;&lt;/div&gt;
&lt;li&gt;&lt;strong&gt;XSL - is pretty more dynamic than code, isn't it?&lt;br&gt;&lt;/strong&gt;So we are now looking for something more dynamic, something that we can read from a file so we can give it to our designer to play with the UI.&lt;br&gt;This lead us to the second option: at my past all our reports were rendered using XSL files, personally I don't like this option.&lt;br&gt;But the main reason is that we will need to serialize our objects to XML, while in most cases all you need is to render only few fields.&lt;br&gt;
&lt;li&gt;&lt;strong&gt;Let's found another Template Engine:&lt;/strong&gt;&lt;br&gt;The first one I can think of is the MVC Engine or Brail. after some searching reading and Testing I found &lt;a href="http://www.stringtemplate.org/"&gt;StringTemplate&lt;/a&gt;.&lt;u&gt;&lt;br&gt;&lt;/u&gt;Here is a simple code for using the API:&lt;br&gt;&lt;br&gt;
&lt;div&gt;
&lt;div style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   1:&lt;/span&gt; var templateFolder = &lt;span style="color: #0000ff"&gt;new&lt;/span&gt; StringTemplateGroup(&lt;span style="color: #006080"&gt;"SimpleLoopTemplate"&lt;/span&gt;, &lt;span style="color: #006080"&gt;@"\TemplateEngineTestCase\WinApp"&lt;/span&gt;);&lt;/pre&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   2:&lt;/span&gt; var template = templateFolder.GetInstanceOf(&lt;span style="color: #006080"&gt;"3_simpleLoop"&lt;/span&gt;);&lt;/pre&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   3:&lt;/span&gt; &lt;span style="color: #008000"&gt;//here we are binding our list to the template&lt;/span&gt;&lt;/pre&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   4:&lt;/span&gt; template.SetAttribute(&lt;span style="color: #006080"&gt;"items"&lt;/span&gt;, &lt;span style="color: #0000ff"&gt;new&lt;/span&gt; List&amp;lt;&lt;span style="color: #0000ff"&gt;string&lt;/span&gt;&amp;gt; {&lt;span style="color: #006080"&gt;"Shani"&lt;/span&gt;, &lt;span style="color: #006080"&gt;"Doron"&lt;/span&gt;, &lt;span style="color: #006080"&gt;"Nati"&lt;/span&gt;, &lt;span style="color: #006080"&gt;"Yossi"&lt;/span&gt;});&lt;/pre&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   5:&lt;/span&gt; var data = template.ToString();&lt;/pre&gt;&lt;/div&gt;&lt;br&gt;and here is the template (file name: &lt;em&gt;3_simpleLoop.st&lt;/em&gt;):&lt;br&gt;&lt;/div&gt;
&lt;div&gt;
&lt;div style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   1:&lt;/span&gt; $items: {num1| &lt;/pre&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   2:&lt;/span&gt;   &lt;span style="color: #0000ff"&gt;&amp;lt;&lt;/span&gt;&lt;span style="color: #800000"&gt;li&lt;/span&gt;&lt;span style="color: #0000ff"&gt;&amp;gt;&lt;/span&gt;$num1$&lt;span style="color: #0000ff"&gt;&amp;lt;/&lt;/span&gt;&lt;span style="color: #800000"&gt;li&lt;/span&gt;&lt;span style="color: #0000ff"&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   3:&lt;/span&gt;   }$&lt;/pre&gt;&lt;pre style="border-bottom-style: none; padding-bottom: 0px; line-height: 12pt; border-right-style: none; background-color: #f4f4f4; margin: 0em; padding-left: 0px; width: 100%; padding-right: 0px; font-family: consolas, 'Courier New', courier, monospace; border-top-style: none; color: black; font-size: 8pt; border-left-style: none; overflow: visible; padding-top: 0px"&gt;&lt;span style="color: #606060"&gt;   4:&lt;/span&gt; $end$&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;
&lt;div&gt;&amp;nbsp;&lt;/div&gt;&lt;/li&gt;&lt;/ol&gt;
&lt;p&gt;&lt;strong&gt;Conclusion:&lt;/strong&gt;&lt;/p&gt;
&lt;div&gt;The StringTemplate give us an API to solve our problem - and using such code and template we can render our Models to different Views.&lt;/div&gt;
&lt;div&gt;But is this API is easy or even stable?&lt;br&gt;&lt;br&gt;&lt;em&gt;In later posts we will see more samples using the StringTemplate.&lt;br&gt;Hopefully samples for using Brail too.&lt;/em&gt;&lt;/div&gt;&lt;img width="0" height="0" src="http://www.human-debugger.net/blog/aggbug.ashx?id=92c5a9aa-8278-4b78-ae36-53ee76732b6a"/&gt;&lt;/div&gt;</description>
      <comments>http://www.human-debugger.net/blog/CommentView,guid,92c5a9aa-8278-4b78-ae36-53ee76732b6a.aspx</comments>
      <category>.Net 3.5</category>
      <category>Software Development</category>
      <category>Software Development/Design Patterns</category>
    </item>
    <item>
      <trackback:ping>http://www.human-debugger.net/blog/Trackback.aspx?guid=0952cb9d-e120-40c5-8bef-1d7aafaf1b7c</trackback:ping>
      <pingback:server>http://www.human-debugger.net/blog/pingback.aspx</pingback:server>
      <pingback:target>http://www.human-debugger.net/blog/PermaLink,guid,0952cb9d-e120-40c5-8bef-1d7aafaf1b7c.aspx</pingback:target>
      <dc:creator />
      <wfw:comment>http://www.human-debugger.net/blog/CommentView,guid,0952cb9d-e120-40c5-8bef-1d7aafaf1b7c.aspx</wfw:comment>
      <wfw:commentRss>http://www.human-debugger.net/blog/SyndicationService.asmx/GetEntryCommentsRss?guid=0952cb9d-e120-40c5-8bef-1d7aafaf1b7c</wfw:commentRss>
      <slash:comments>3</slash:comments>
      <title>Design Patterns - Lecture #1</title>
      <guid isPermaLink="false">http://www.human-debugger.net/blog/PermaLink,guid,0952cb9d-e120-40c5-8bef-1d7aafaf1b7c.aspx</guid>
      <link>http://www.human-debugger.net/blog/2007/08/18/DesignPatternsLecture1.aspx</link>
      <pubDate>Sat, 18 Aug 2007 16:33:24 GMT</pubDate>
      <description>&lt;div&gt;&lt;P&gt;I thought about the time we all spend on reading some well known patterns. I found this strange reading again and again the same logic. We all know the pattern but we doing it to be sure we use all the best practices.&lt;/P&gt;
&lt;P&gt;Inspired by the book: &lt;A href="http://www.amazon.com/Head-First-Design-Patterns/dp/0596007124"&gt;Head First - Design Patterns&lt;/A&gt;, I rewrite the two basic patterns of Strategy and Observer. and create a snippets for your own use. so next time you won't need to get to Google it up.&lt;/P&gt;
&lt;P&gt;Here are the snippets, for your own use: (right click &amp;amp; download)&lt;BR&gt;&lt;A href="http://www.human-debugger.net/SiteData/DesignPatterns/Strategy.snippet"&gt;Strategy.snippet &lt;/A&gt;&lt;BR&gt;&lt;A href="http://www.human-debugger.net/SiteData/DesignPatterns/Observer.snippet"&gt;Observer.snippet&lt;/A&gt;&lt;/P&gt;
&lt;P&gt;
&lt;P&gt;More to come on the next posts.&lt;/P&gt;
&lt;P&gt;
&lt;HR&gt;
Remark: There could be a lot of variation for those patterns, those I wrote here were taken as a combination of the books samples and a few best practices I found out.&lt;img width="0" height="0" src="http://www.human-debugger.net/blog/aggbug.ashx?id=0952cb9d-e120-40c5-8bef-1d7aafaf1b7c"/&gt;&lt;/div&gt;</description>
      <comments>http://www.human-debugger.net/blog/CommentView,guid,0952cb9d-e120-40c5-8bef-1d7aafaf1b7c.aspx</comments>
      <category>.Net 2.0</category>
      <category>Software Development/Design Patterns</category>
    </item>
  </channel>
</rss>