DotNetSlackers Community

Head First Design Patterns: Template Method

antrad — Wed, 08 Oct 2008 15:20:00 GMT

Template Method...here it is:

Defines the skeleton of an algorithm, deferring some steps to subclasses. Template Method lets subclasses redefine certain steps of an algorith without changing the algorithm's structure.

using System;
using System.Collections.Generic;
using System.Text;

namespace TemplateMethod
{
    /// <summary>
    /// Abstract class
    /// </summary>
    public abstract class CaffeineBeverageWithHook
    {
        public void prepareRecipe()
        {
            boilWater();
            braw();
            pourInCup();
            addCondiments();
        }

        public abstract void braw();
        public abstract void addCondiments();

        public void boilWater()
        {
            System.Console.WriteLine("Boiling water...");
        }

        public void pourInCup()
        {
            System.Console.WriteLine("Pouring into cup...");
        }
    }
}


using System;
using System.Collections.Generic;
using System.Text;

namespace TemplateMethod
{
    /// <summary>
    /// Concrete class
    /// </summary>
    public class CoffeeWithHook : CaffeineBeverageWithHook
    {
        public override void braw()
        {
            System.Console.WriteLine("Dripping Coffee through filter...");
        }

        public override void addCondiments()
        {
            System.Console.WriteLine("Adding sugar and milk...");
        }
    }
}


using System;
using System.Collections.Generic;
using System.Text;
using TemplateMethod;

namespace test
{
    class Program
    {
        static void Main(string[] args)
        {
            CaffeineBeverageWithHook obj = new CoffeeWithHook();
            obj.prepareRecipe();
            System.Console.ReadLine();
        }
    }
}

Bye
Antonio

jBlogMvc : part 1 Building the Administration Area

amrelsehemy — Mon, 06 Oct 2008 14:45:00 GMT

NOTE: In this series I build a blogengine using ASP.NET MVC and jQuery from scratch in order to learn more about these new technologies. If you haven't read the first post in this series, I would encourage you do to that first , or check out the jBlogMvc category . You can also always subscribe to the feeds . In this part of the series, I build the administration area of the blog engine I am building using the ASP.NET MVC and jQuery, in this part I will cover more basic features used in any blog...(read more)

jBlogMvc : part 2 Editing, Deleting, Paging Posts and Rss feeds

amrelsehemy — Mon, 06 Oct 2008 14:39:00 GMT

NOTE: In this series I build a blogengine using ASP.NET MVC and jQuery from scratch in order to learn more about these new technologies. If you haven't read the first post in this series, I would encourage you do to that first , or check out the jBlogMvc category . You can also always subscribe to the feeds . What about new features this part will cover : Configuration is saved in the database. Managing Posts (Editing, Deleting). Posts are now paged. Some jquery magic is used. So, lets have a...(read more)

Eval Statements Don't Access Fields

bmains — Sat, 04 Oct 2008 00:49:00 GMT

I tried to define the following:

Public Class EvaluationCriteria
Public DisplayText As String
Public IsMet As Boolean = False

Hoping that I could get away with this. Turns out, as these two values are referenced in binding via the Eval() method, these don't work correctly. So it turns out, fields dont' necessarily work correctly with Eval. Didn't know that until I was trying to shortcut

Silverlight free controls

antrad — Fri, 03 Oct 2008 10:46:00 GMT

I am not a fun of client side tecnology but Silverlight is really interesting. Here you can find some free controls.

Bye

Antonio

JQuery, the very very basics - Lesson 4

xxxd — Thu, 02 Oct 2008 19:22:00 GMT

On again with the very basics of JQuery. Thanks again for all of the kicks, dzones, stumbled-upons. I am wearing a permanent thank-you smile now. :)

JQuery, the very very basics - Lesson 3

JQuery, the very very basics - Lesson 2

JQuery, the very very basics - Lesson 1

Now that we have done with the selection and manipulation of JQuery elements, time for some actions (event handling). Actions, reactions, interactions, through which we learn, connect and play, through which web becomes an inseperable part of our lives.

However, it is daunting to create a sophisticated uniform interaction model on the array of competing browsers. Besides, there are different DOM event models. Admit it, how many times have you had this Yes/No interchange between you and your user?

Yes, it works

No, it does not. It does not do anything.

What browser do you use?

...

Well, JQuery shields us with a unified front for cross-browser event handling model. It also allows an event to be tied with or released from multiple event listeners. For any events (blur, change, click, focus, keydown ...), we can access their properties such as keyCode, pageX, pageY, screenX, screenY, shiftKey, target.

Event binding and unbinding: bind() and unbind()

bind(eventType, data, listener)

So instead of attaching a click event to an image as the following:

With JQuery, we bind event handler(s) using the bind() command.

It is easy to uniformly handle an event of a matched set of elements with JQuery selectors and the bind() command.

For example, modified the above code a little,

Now we have just instructed every image on a page to respond the click event.

The bind() command can be used to bind indefinite event handlers to one event. Again, consider the above example, change it a bit:

Every coin has two sides. We bind then we unbind, in either of the following ways:

unbind(eventType, listener)

unbind(event)

Directly using event names and triggering event handlers: eventName() and trigger()

The most common-place events get first-class, convenience treatment. For these everyday, everywhere events: click, focus, select, submit, blur, we can omit the bind() command and directly set up handlers for them.

The syntax is: eventName(listener), such as click ( function () { } ) ;

or simply eventName(), such as click () ;

For example,

$('img').click(function(event) { alert('My id = ' + this.id);});

$('img#clickMe').click() // this fakes a click action from the image whose id = clickMe

trigger(eventType)

Sometimes it is necessary to trigger an action instead of merely responding. For example, sometimes we want programmatically trigger the action of submitting a form. How can we do it? Go trigger.

//...

trigger('submit');

We can trigger such action through the firing of another event.

Toggling event handlers: toggle(handler1, handler2, handler3, ...)

With JQuery, convenience is the key. If there is a behavior that occurs habitually, there is bound to be a command that helps you to do just that. Such is case of toggling. As you can see from the syntax of the toggle() command, you can toggle among a good number of handlers.

Toggling is good to adjust styles of a matched set of elements. First time, I turn blue; next time, I go green; then, I change to red ... until I change back to blue. Again. And again.

Hovering over: hover(mouseoverhandler, mouseouthanlder)

hover() is another example of convenience command. We are all delighted to see hyperlinks and images change into and out of different style or images. For that, we all have been busy writing out mouseover() and mouseout() code. Now, with JQuery, we just call this command: hover().

Head First Design Patterns: Command Pattern

antrad — Thu, 02 Oct 2008 12:03:00 GMT

Again Desgin Patterns...

Command Pattern:Encapsulate a request as an object, thereby letting you parametrize clients with different requests,queue,or log requests, and support undoable operations.

Command Pattern in C#:

//Command interface
using System;
using System.Collections.Generic;
using System.Text;

namespace Command
{
    public interface ICommand
    {
        void Execute();
    }
}

using System;
using System.Collections.Generic;
using System.Text;

namespace Command
{
    //Concrete Command
    public class LightOffCommand : ICommand
    {

        #region ICommand Members

        public void Execute()
        {
            throw new Exception("The method or operation is not implemented.");
        }

        #endregion
    }
}

using System;
using System.Collections.Generic;
using System.Text;

namespace Command
{
    /// <summary>
    /// Concrete Command
    /// </summary>
    public class LightOnCommand : ICommand
    {
        Light lg;
        public LightOnCommand(Light my)
        {
            this.lg = my;
        }
        #region ICommand Members

        public void Execute()
        {
            this.lg.On();
        }

        #endregion
    }
}


using System;
using System.Collections.Generic;
using System.Text;

namespace Command
{
    /// <summary>
    /// Null command, concrete command
    /// </summary>
    public class NoCommand : ICommand
    {
        #region ICommand Members

        public void Execute()
        {
            System.Console.WriteLine("No command");
        }

        #endregion
    }
}

using System;
using System.Collections.Generic;
using System.Text;

namespace Command
{
    //Receiver
    public class Light
    {
        private string _DescLight="Light";

        public string DescLight
        {
            get { return _DescLight; }
            set { _DescLight = value; }
        }

        public Light(string place)
        {
            this._DescLight = place;
        }
        public void On()
        {
            System.Console.WriteLine(this.DescLight + " is ON.");
        }
        public void Off()
        {
            System.Console.WriteLine(this.DescLight + " is OFF.");
        }
    }
}

using System;
using System.Collections.Generic;
using System.Text;

namespace Command
{
    /// <summary>
    /// Invoker
    /// </summary>
    public class RemoteControl
    {
        ICommand[] onCommands;
        ICommand[] offCommands;

        public RemoteControl()
        {
            this.onCommands = new ICommand[7];
            this.offCommands = new ICommand[7];
            for(int i=0;i<7;i++){
                this.offCommands = new NoCommand();
                this.offCommands = new NoCommand();
            }
        }

        public void stCommand(int slot, ICommand on,ICommand off)
        {
            this.onCommands[slot]=on;
            this.offCommands[slot]=off;
        }

        public void onButtonPushed(int slot)
        {
            this.onCommands[slot].Execute();
        }

        public void offButtonPushed(int slot)
        {
            this.offCommands[slot].Execute();
        }
    }
}

Bye 
Antonio

MVP award for 2009

sonu — Wed, 01 Oct 2008 14:25:00 GMT

I just received the notification from Microsoft that I have been re-awarded for the MVP 2009. Its a great feeling to get awarded from Microsoft. I truely appreciate that.

Thanks MS.

Callback Method Errors from AJAX Web Services

bmains — Tue, 30 Sep 2008 20:38:00 GMT

As I mentioned before, AJAX supports calling web services from the client using an XmlHttpRequest object. But sometimes, things don't go as expected. If you make the call, an error may occur in the web service, which you'd get an error prompt. However, there's one other aspect to this.

Sometimes the web service works fine, but you get an error with the breakpoint in the executor of the web service (ASP.NET AJAX code). There isn't a callstack, which is really hard to debug. What I've been finding out is that an error in the success or failed callbacks (which every web service supports a success or failed callback method that returns the results) will also act as if the executor failed, but that isn't the case.

Head First Design Pattern :Decorator

antrad — Mon, 29 Sep 2008 10:14:00 GMT

This is C# code for Decorator. For more info see into book...

//Base abstract class
using System;
namespace Decorator
{
    /// <summary>
    /// Base class for Beverage. It represents the Component
    /// </summary>
    public abstract class Beverage
    {
        string _Description;

        public string Description
        {
            get { return _Description; }
            set { _Description = value; }
        }

        public abstract double CalculateCost();
    }
}

//Concrete class
using System;
using System.Collections.Generic;
using System.Text;

namespace Decorator
{
    /// <summary>
    /// Concrete class for Component
    /// </summary>
    public class Coffee : Decorator.Beverage
    {
        
        public override double  CalculateCost()
        {
            return 1;
        }
    }
}

//Base abstract class for decorator
using System;
using System.Collections.Generic;
using System.Text;

namespace Decorator
{
    /// <summary>
    /// Class for Decorator
    /// </summary>
    public abstract class CondimentDecorator : Decorator.Beverage
    {
        public abstract string Description
        {
            get;
            set;
        }
    }
}

//Decorator concrete class
using System;
using System.Collections.Generic;
using System.Text;

namespace Decorator
{
    /// <summary>
    /// Concrete decorator
    /// </summary>
    public class Mocha : Decorator.CondimentDecorator
    {
        Beverage bev;

        public Mocha(Beverage b)
        {
            this.bev = b;
        }

        public override double CalculateCost()
        {
            return this.bev.CalculateCost() +0.20;
        }

        public override string Description
        {
            get
            {
                return "Mocha";
            }
            set
            {
                throw new Exception("The method or operation is not implemented.");
            }
        }
    }
}

Bye
Antonio

Head First Design Patterns: Observer Pattern

antrad — Mon, 29 Sep 2008 09:52:00 GMT

I am reading this book and it is very useful for repeat GOF Design Patterns. But I found that source code is Java. But we prefer C# :P...

So I will implement all main patterns in C#...

I post here code about Observer:

//Subject
using System;
using System.Collections.Generic;
using System.Text;

namespace Observer
{
    public interface ISubject
    {
        void RegisterObserver(IObserver o);
        void RemoveObserver(IObserver o);
        void NotifyObservers();
    }
}

using System;
using System.Collections.Generic;
using System.Text;

namespace Observer
{
    public interface IObserver
    {
        void Update(double temp, double humidity, double preasure);
    }
}

using System;
using System.Collections.Generic;
using System.Text;

namespace Observer
{
    public interface IDisplay
    {
        void Dispay();
    }
}

//Subject Code
using System;
using System.Collections.Generic;
using System.Text;

namespace Observer
{
    public class WeatherData : ISubject
    {
        double _humidity;

        public double Humidity
        {
            get { return _humidity; }
            set { _humidity = value; }
        }
        double _preassure;

        public double Preassure
        {
            get { return _preassure; }
            set { _preassure = value; }
        }
        double _temperature;

        public double Temperature
        {
            get { return _temperature; }
            set { _temperature = value; }
        }

        /// <summary>
        /// Observers
        /// </summary>
        System.Collections.Generic.IList<IObserver> objs = new System.Collections.Generic.List<IObserver>();
        #region ISubject Members

        public void RegisterObserver(IObserver o)
        {
            objs.Add(o);
        }

        public void RemoveObserver(IObserver o)
        {
            objs.Remove(o);
        }

        public void NotifyObservers()
        {
            foreach (IObserver obj in objs)
                obj.Update(this._temperature, this._humidity, this._preassure);
        }

        #endregion
    }
}

//Observer code
using System;
using System.Collections.Generic;
using System.Text;

namespace Observer
{
    public class CurrentDispaly : IObserver,IDisplay
    {
        double _humidity;
        double _preassure;
        double _temperature;
        ISubject subject;

        public CurrentDispaly(ISubject sub)
        {
            //Istanzia l'oggetto e lo aggiunge come Observer
            subject = sub;
            subject.RegisterObserver(this);
        }
        #region IObserver Members

        public void Update(double temp, double humidity, double preasure)
        {
            this._temperature = temp;
            this._preassure = preasure;
            this._humidity = humidity;
            this.Dispay();
        }

        #endregion

        #region IDisplay Members

        public void Dispay()
        {
            System.Console.WriteLine(this._humidity + " " + this._preassure + " " + this._temperature);
        }

        #endregion
    }
}

Bye

Antonio

AJAX: Pushing down LINQ objects via Web Services

bmains — Fri, 26 Sep 2008 16:05:00 GMT

If you use web services to stream data to the client via the ASP.NET AJAX framework, you may experience challenges when you use LINQ to SQL or Entities as your data model. This is because LINQ objects retain all of their relationships, which the serialization capabilities have trouble serializing entity sets and such. The workaround to this is to create an anonymous type.

The anonymous type entry works well, as long as the web service method returns an object. The anonymous type ensures that only serializable types are returned; any relationship properties can also be pushed down which makes it nice.

Could not create type '' at System.Web.UI.SimpleWebHandlerParser.GetType(String typeName)

bmains — Fri, 26 Sep 2008 15:41:00 GMT

I got this error when trying to view the WSDL, and to access the web service via AJAX. The issue turned out to be easy; the type name in the ASMX file didn't match the full name of the class. I switched folders for this object, so I created it in a different folder, without changing the @WebService directive. So Visual Studio doesn't rename the paths whenever the folders change, and thus a manual change is required in the code-behind file and the @WebService directive.

JQuery, the very very basics - Lesson 3

xxxd — Fri, 26 Sep 2008 15:07:00 GMT

Snail on with my learning and writing about the very very basic lessons on JQuery. Again, thanks to all of you for the kicking (ouch! yet the more the merrier), dzon-ing and reddit-ing. I am still glowing in and baffled by the attention (as little as it is. Big for me, since I am no Scott Gu) ...

JQuery, the very very basics - Lesson 2

JQuery, the very very basics - Lesson 1

In "modern" (DOM) web programming, web pages are made up of a hierarchy of elements. Manipulation of elements goes far beyond styling and positioning, it involves almost everything, adding / deleting content, appending and removing children elements, attaching itself to a new parent, cloning ... Everything is possible. The question is : How?

Content manipulation: html() and text()

Pretty much all JQuery commands go both ways: get and set. To access a property only, call the command without parameter; to modify, call the command with a parameter.

html() returns the innerHTML property of a element;

html(content) set the element's innerHTML to the content passed

text() returns the text content (stripped of any html markups) ;

text(content) changes the text content of the calling elements.

So say for example, we have a little html code as the following:

$('table#table1').html(); // returns everything inside the table (id=table1), including the html tags

$('table#table1').text(); // however returns only the actual content (in one big unsepearable string): test1item1

Form element values: val()

To get or set values of form elements, we use val() command (in its two-way street fashion: val() for get and val(content) for set).

A couple of especially neat things about val() command with form element.

a) Remember how we used to painstakingly enumerate through a group of radios until we found the chosen one?

Now with JQuery (with selectors and val()), we may just say:

var selected = $('input[name=selectMe]:checked').val();

b) Remember that JQuery command can always multitask, besides that it can chain up more number of commands than a chain smoker do with cigarettes?

Here is the deal with the val(values) command. It can be used to set up values for each element in selected set in one shot.

Consider the following code:

$('input').val(['red','blue','orange']);

It will check all checkboxes or radio boxes whose value matches any of the values in the array (red, blue, orange) passed to command.

Appending and inserting

JQuery is skilled in moving things around. And it uses exactly the same English words we do (except in a very very economic fashion).

append(something): stick the "something" passed to the end of a matched set;

appendTo(target): stick everything in the selected set to the end of the target;

prepend(something): stick the "something" passed to the beginning of a matched set;

prependTo(target): stick everything in the selected set to the beginning of the target;

before(something): insert the "something" before each element of the matched set

insertBefore(target): insert the whole matched set before the targeted set of elements

after(something) : insert the "something" after each element of the matched set

insertAfter(target) : insert the whole matched set after the targeted set of elements

Wrapping and removing

Like candies that need sparkling wrapping paper, sometimes we want to wrap our element(s) in some sort of wrappers too. For this, we can use wrap(wrapper) command.

$('p.note').wrap("<div class='note'>This is our notes section</div>");

Flipping the coin, we may want to remove things from a wrapper too.

remove(): removes all elements in a selected set. For example:

$('div.note').remove();

Cloning with clone()

We do cloning with clone(), then move the clone to elsewhere, chaining up with commands such as appendTo, insertBefore, before, after, etc.

$('img#cloneme').clone().appendTo('div#gallary');

Read more

JQuery, the very very basics - Lesson 4

Inheritance and Associations with Entity Framework Part 1

mosessaur — Fri, 26 Sep 2008 11:44:00 GMT

In this multi parts series I'll explore how to build inheritance with Entity Framework showing 2 different approaches of inheritance in Entity Framework. Beside that I'll show how to build simple association between 2 entities and show how to provide custom code to retrieve other parts of the relation when inheritance is applied.

My plan not to exceed 3 parts as the subject is not that huge, it is just the demonstration with screen shots that will make the post large that is why I divided it to multi part. I am not good at screen casts beside I don't have a software license to produce one.

Sys.InvalidOperationException: Cannot serialize non finite numbers

bmains — Thu, 25 Sep 2008 19:14:00 GMT

I got the above error when passing data to a web service. On the web service, a field is defined as int?. But when I try to pass a null value, I get the above error because the value is showing up as NaN. So it sees NaN and throws this exception. As an alternative, I'm going to have to use a -1 instead, or convert the value to a string.

I chose the conversion to a string as the option to use as I convert the values to a string to pass in serialized form, which turned out to be the best option. It really worked well for passing data to/from client and server.

Page.Request.ApplicationPath Not Working in IIS 6

bmains — Thu, 25 Sep 2008 14:11:00 GMT

For whatever reason, an application of mine errorred on the page.Request.ApplicationPath statement. Apparently in IIS6, this isn't working for whatever reason. It returns null and the pathing doesn't work correctly. The virtual pathing approach with the tilde did work correctly in this scenario.

Redirect to Error Page When Maximum Request Length is Exceeded [FileUpload]

haissam — Thu, 25 Sep 2008 07:01:00 GMT

How many times you tried to catch the maximum request length error thrown by the FileUplad control if the web.config HttpRuntime entry is not modified?
In this blog post, Haissam Abdul Malak will create an HttpModule which check if the file is larger than 4 MB to redirect the user to a webform "Error.aspx".
The module will register to the BeginRequest event to execute the needed code

Below is the implementation

using System;
using System.Collections.Generic;
using System.Text;
using System.Web;

namespace HAMModule
{
    public class MyModule : IHttpModule
    {
        public void Init(HttpApplication app)
        {
            app.BeginRequest += new EventHandler(app_BeginRequest);

        }
        void app_BeginRequest(object sender, EventArgs e)
        {
            HttpContext context = ((HttpApplication)sender).Context;

            if (context.Request.ContentLength > 4096000)
            {
                IServiceProvider provider = (IServiceProvider)context;
                HttpWorkerRequest wr = (HttpWorkerRequest)provider.GetService(typeof(HttpWorkerRequest));

                // Check if body contains data
                if (wr.HasEntityBody())
                {
                    // get the total body length
                    int requestLength = wr.GetTotalEntityBodyLength();
                    // Get the initial bytes loaded
                    int initialBytes = wr.GetPreloadedEntityBody().Length;

                    if (!wr.IsEntireEntityBodyIsPreloaded())
                    {
                        byte[] buffer = new byte[512000];
                        // Set the received bytes to initial bytes before start reading
                        int receivedBytes = initialBytes;
                        while (requestLength - receivedBytes >= initialBytes)
                        {
                            // Read another set of bytes
                            initialBytes = wr.ReadEntityBody(buffer, buffer.Length);
                            // Update the received bytes
                            receivedBytes += initialBytes;
                        }
                        initialBytes = wr.ReadEntityBody(buffer, requestLength - receivedBytes);

                    }
                }
  // Redirect the user to an error page.
                context.Response.Redirect("Error.aspx");
            }

        }
        public void Dispose()
        {
        }
    }
}

Now all you need to do is to add the module in the web.config file by adding the below entry under system.Web

Hope this helps,

Username Availability Validator almost ready, the early demo

mosessaur — Mon, 22 Sep 2008 16:52:00 GMT

Few weeks ago Dave started the Advanced ASP.NET AJAX Server Controls book giveaway contest. And yesterday he announced that the control is almost completed, but the contest door is still open. So I thought to grape the bits and start testing it and build a simple sample. [View Demo]

The sample that I am going to demonstrate here will use ASP.NET Create User Wizard control with UserName Availability Validator. In this sample I'll show the important properties of this control as well as the current issues exist.

jBlogMvc Series Started! Keep tuned with Amr Elsehemy

mosessaur — Mon, 22 Sep 2008 16:51:00 GMT

Amr Elsehemey started to blog about ASP.NET MVC. He picked up a good subject to blog about; Building ASP.NET MVC Blog Engine using ASP.NET MVC and jQuery, he named it "jBlogMvc" Yesterday he posted his first post in the series, and myself I am waiting for the rest of the series as for it is going to be very interesting, because I have couple of ideas in mind.

He is going to explore the code and posting samples as he developing this simple blog engine. We have been talking about this subject for few days now, and really he has some cool ideas to present. Keep tuned with Amr, I am sure he is going to amuse us with some kicking posts just as he did in his Design Time Support post series.

Digsby - Bringing Many Content Sources to One Place

bmains — Sat, 20 Sep 2008 03:17:00 GMT

If you haven't had a chance to check it out, check out the Digsby tool: http://www.digsby.com/?utm_campaign=new&utm_content=new&utm_medium=new&utm_source=new. It brings your IM, social networking, and email all into one little application. It works really well and I like it a lot. It's a great IM tool and has a lot of great features. If you're into facebook, you can set your facebook status right in the tool, and check all mini-feed.

In addition, you can check your gmail, msn, yahoo chat/email right in the tool as well. Really cool. But, if you read the EULA, it's not for work purposes (but can be installed on a work machine for personal purposes).

Localization\Globalization Considerations and Tips

mosessaur — Fri, 19 Sep 2008 00:08:00 GMT

I've been worked with localization and globalization for a while now. During that period I faced issues and learned many things about the subject. Here I am going to share some of my own ideas and tips to avoid falling in certain issues. It worth to mention that I am talking from GUI point of view and not Application Data point of view.

Unrecognized Configuration Section "name"

bmains — Thu, 18 Sep 2008 19:18:00 GMT

If you get the error above, there could be a couple of reasons:

The XML setup in the configuration file is in error; maybe there isn't a closing tag or something syntacticly is missing.
If creating a custom configuration section, this could be that the entry in the <configSections> collection is missing; every custom configuration section must be registered in <configSections>.
The type provided is incorrect; maybe the type is in a different assembly than is stated, or the type name has a typo.

Some things to try out if you get this.

WPF Path Markup Syntax

bmains — Wed, 17 Sep 2008 23:48:00 GMT

You may have seen in my previous post a series of coordinates with a combination of letters to form one really long string in the PathGeometry. This string is actually a syntax that evaluates to various Segment objects (ArcSegment, LineSegment, etc). This is called path markup language, or has also been called path mini language.

So what do M, C, Z, etc. mean in the markup language? You can find a guide to these options here: http://msdn.microsoft.com/en-us/library/ms752293.aspx

JQuery, the very very basics - Lesson 2

xxxd — Wed, 17 Sep 2008 18:24:00 GMT

Continue on with the series of lessons I learned about some of the very basics of JQuery. Thanks to all of you who has generously kicked, dzoned, redditted my first of N posts on this topic:

JQuery, the very very basics - Lesson 1

So it is nice to be able to use a combination of JQuery selectors to grab an array of elements, however, it would be better if we know how to inspect them one by one and operate on them.

size() and each(iterator)

To determine the size of the set we just selected, we use the size() command.

For example, to list all the ids of the <p> elements we just selected, we can use a for ... loop and the size() command:

To cut the chase even more, we can use the each() command, which takes a literal function as parameter to deal with each element in the set. The element can be accessed using the this keyword. So rewrite the above code:

Get and set attributes' values

attr(name) and attr(name, value)

Well, you probably have guessed it. The first attr() command lets you access the value of an attibute designated by the name, the second attr() command assign the named attribute with the value specified in the second parameter.

For example, I have a dummy <p> element as such:

$('p#p1').attr('title') returns the value of the attribute title ('test'),

$('p#p1').attr('title', 'more than a test') change the title's value to "more than a test".

Css Style: Dress up, dress down

addClass(names), removeClass(names) and toggleClass(name)

addClass dresses up all of the elements in a selected set with one css class or multiple css classes; conversely, removeClass strips off the elements one or more css classes specified by the name paramter, as in:

$('p.notes').addClass('notes', 'highlight');

$('p.notes').removeClass('highlight');

Do not we all love to toggle, add and remove, switch and off? Well, toggleClass command does just this, add the specified css class to element(s) if it is not there, remove it if it is.

$('p.notes').toggleClass('highlight');

css(name, value)

What if we want to change css style of elements without using any css class names? There, css command affords us to do so.

$('p.note').css('background-color', 'yellow'); changes the background color of all <p> elements whose class name is note.

There are more css related commands such as width(value), height(value) to allow us to directly change elements' apparence, for example:

$('p.note').width(500).height(100); changes the width then height of all <p> elements whose class name is note.

Read more

JQuery, the very very basics - Lesson 3

JQuery, the very very basics - Lesson 4