Of late I am deving in parallel on a sample at home project for a few reasons including practicing skills both in architecture but also so I can get more exposure to new languages, with the most recent addition being PYTHON.  The Google AppEngine currently supports PYTHON and JAVA, and since I am already doing a couple of things in JAVA I thought I would try my hand at PYTHON and I have to say, “I like it.”

Before I got onto the AppEngine, an immediate accompaniment to programming in PYTHON for the web was the DJango framework.  When you start reading through even the first page of the starting tutorials, you realise how easy and fast it is to get up and running with a saleable application.  The Google app engine includes features of DJango, but not all of them.  One main example is the fact that Google has defined its own data store and ORM for use with the AppEngine.

So inside the web application, we would want to logically separate different handlers for different situations, and the example which I am including in this post is for a Forum.  Two handlers immediately spring to mind being a handler to List all the forums and a handler to view an individual forum by id.

  • /Forums
  • /Forum/1/somename-of-the-forum

A colleague in the place were I work, pointed out a really handy function called slugify inside the DJango framework which simply took and string and made a url friendly version i.e. “The Forum” because “the-forum.”  Unfortunately though, I think this is not included inside the Google AppEngine, so it will probably be best to create an implementation of a “Slug Field” for our objects, and then it will be easy to say something like “forum.slug().”  I have not et implemented this yet, just up to the url rewriting part :-)

Yep, these functions are included inside the Google AppEngine, I was stupid for thinking otherwise.  Check out the import and the implementation I used below on the last code snippet.

I have created a file called handlers.py but I think it will be better to separate the handlers by file and by topic area i.e. Forum, Thread, Post etc…  but for this example, the two handlers I create are inside this 1 file.  Also, my implementation of the handler is purely for example only, i.e. I am outputting a string so we can recognise the different behaviour in each handler.

ForumListHandler

class ForumListHandler(webapp.RequestHandler):
    def get(self):
        for item in Forum.all():
            self.response.out.write("%s<br>" %
                                    (item.title))

ForumViewHandler

class ForumViewHandler(webapp.RequestHandler):
    def get(self,id,name):
        self.response.out.write("you are are looking for forum %s with id of : %s" % (name,id))

If you notice in the second handler, the function has 3 parameters, which will become clear with the next code snippet how they are populated.  The first handler will simply output a list of the forums, and the second will output a string which includes the values it will extract from the url of the get request.

I am currently paid to develop ASP.NET MVC where this syntax of automatically mapping a request with an overloaded function is very familiar and well structured.  Inside the main.py file you have a block of code where you add your mappings to handlers.  The following is the result of adding the required handlers for this example:

def main():
  application = webapp.WSGIApplication([('/', MainHandler),
                                        ('/forums',ForumListHandler),
                                        ('/forum/(\d+)/(.*)',ForumViewHandler)],
                                       debug=True)
  wsgiref.handlers.CGIHandler().run(application)

Of course the url mapping uses regular expressions, and I think from looking at this, that it first checks that the number of matches it has made on the url, is equal to the number of parameters inside the handler.  If this is a match it will then supply each parameter in the order in which they are matched using the regular expression.  From the above you can see I first match a sequence of digits, so this fits in with my get function shown above with the first parameter after self being id.

UPDATE:

I changed my implementation of the url rewrite rules, and for the forum view I decided that I would make the parameter a slug, with an obvious rule that each slug is unique.  The reason I did this, is because the entity key you get with an object inside the Google app engine, is not really the cleanest thing to put in there as it contains the entity type and guid and things.  So below is the updated version and also an updated handler for the forum list handler so we can output the forums and follow the links.  I will use the datastore admin tool to add some forums in.  Oh, just to mention, when a new model is saved to the datastore, you automatically get a CRUD interface for it.  A rough equivalence of this on Microsoft technology I would say is dynamic data, makes me wonder if they got inspiration from DJango for that.

def main():
  application = webapp.WSGIApplication([('/', MainHandler),
                                        ('/forums',ForumListHandler),
                                        ('/forum/(.*)',ForumViewHandler)],
                                       debug=True)
  wsgiref.handlers.CGIHandler().run(application)

And the updated handlers, which now outputs the link, and the other which simply accepts the slug:

from google.appengine.ext import webapp
from models import Forum
from django.template import defaultfilters

class ForumViewHandler(webapp.RequestHandler):
    def get(self,slug):
        self.response.out.write("you are are looking for forum with slug of : %s" % (slug))

class ForumListHandler(webapp.RequestHandler):
    def get(self):
        for item in Forum.all():
            self.response.out.write("<a href=\"/forum/%s\">%s</a><br>" %
                                    (defaultfilters.slugify(item.title), item.title))

image

image

Cheers,

Andrew


Sunday, November 29, 2009 11:38:28 PM (GMT Standard Time, UTC+00:00)  #    Disclaimer

This is the second in a small series I am writing on programmatic drawing inside Silverlight.  The first post I did on this was an analogue clock and it can be found here:

http://www.andrewrea.co.uk/2009/08/12/ProgrammaticDrawingWithSilverlight2030AnAnalogueClock.aspx

The code for this can be downloaded from the following link: http://lab.andrewrea.co.uk/DigitalClock.rar

In this post I will create a digital clock, with the disjointed digits you see in those stereotypical red digit alarm clocks.  The way I tackled this was look at the individual component parts and their grouping to ultimately give the representation of time or any other numerical value.  So each digit of the display is made up of individual bars with angle ends.  One of the key things with the angle ends, is that they are at a 45 degree angle, so that when brought together they line up with one another.

Image

image

Working In Silverlight

The parts of this inline with the code files are as follows:

  • IDigitalDigitPiece
  • IDigitalDigit
  • IDigitalState
  • IDigitalClockView

The second one in the list is the Digit State.  From the above examples you can see that each digit is made up of 7 component pieces, and each one represents their assigned digit by using different combinations of these digits.  In this case I have assigned two properties to each Digit being the OnColor and the OffColor.

The IDigitState has the following signature:

    public interface IDigitState
    {
        void Handle(IDigitalDigit digit);
    }

An example of one of the states is the following.  They simply assign the the OffColor or the OnColor to the Color property of the DigitalDigitPiece.

    public class FourState : IDigitState
    {

        #region IDigitState Members

        public void Handle(IDigitalDigit digit)
        {
            digit.DigitalDigitPieces[0].DigitColor = digit.OffColor;
            digit.DigitalDigitPieces[1].DigitColor = digit.OnColor;
            digit.DigitalDigitPieces[2].DigitColor = digit.OnColor;
            digit.DigitalDigitPieces[3].DigitColor = digit.OnColor;
            digit.DigitalDigitPieces[4].DigitColor = digit.OffColor;
            digit.DigitalDigitPieces[5].DigitColor = digit.OnColor;
            digit.DigitalDigitPieces[6].DigitColor = digit.OffColor;
        }

        #endregion
    }

I have pasted both the code for the digit and the digit piece below.  In hind sight I think it would have been better to use examples which display the binding.  The digit code displays how I am positioning the pieces after any resize or load events and the digit piece displays the code which shows how I am creating the shape of the pieces which make up the digit.

public partial class DigitalDigit : UserControl, IDigitalDigit
    {
        public List<DigitalDigitPiece> DigitalDigitPieces { get; protected set; }

        private double _sepDiameter;

        public double SepDiameter
        {
            get { return _sepDiameter; }
            set
            {
                if (value != _sepDiameter)
                {
                    _sepDiameter = value;
                    Draw();
                }
            }
        }

        private Color _sepColor;

        public Color SepColor
        {
            get { return _sepColor; }
            set
            {
                if (value != _sepColor)
                {
                    _sepColor = value;
                    Draw();
                }
            }
        }

        private Color _onColor = Colors.Red;

        public Color OnColor
        {
            get { return _onColor; }
            set { _onColor = value; }
        }

        private Color _offColor = Colors.Black;

        public Color OffColor
        {
            get { return _offColor; }
            set { _offColor = value; }
        }

        private double _pointSize = 10;

        public double PointSize
        {
            get { return _pointSize; }
            set
            {
                if (value != _pointSize)
                {
                    _pointSize = value;
                    Draw();
                }
            }
        }

        private Color _digitColor = Colors.Red;

        public Color DigitColor
        {
            get { return _digitColor; }
            set
            {
                if (value != _digitColor)
                {
                    _digitColor = value;
                    Draw();
                }
            }
        }

        public DigitalDigit()
        {
            InitializeComponent();
            CreateDigits();
            SizeChanged += new SizeChangedEventHandler(DigitalDigit_SizeChanged);
            Loaded += new RoutedEventHandler(DigitalDigit_Loaded);
        }

        void DigitalDigit_Loaded(object sender, RoutedEventArgs e)
        {
            Draw();
        }

        void DigitalDigit_SizeChanged(object sender, SizeChangedEventArgs e)
        {
            Draw();
        }

        protected void Draw()
        {
            foreach (var digit in DigitalDigitPieces)
            {
                digit.PointSize = PointSize;
            }

            AlignDigits();
        }

        protected double LongHeight
        {
            get
            {
                return (ActualHeight / 2) - _pointSize;
            }
        }

        protected void AlignDigits()
        {
            if (ActualWidth > 0 && ActualHeight > 0)
            {
                DigitalDigitPieces[0].Orientation = DigitalDigitPieceOrientation.Horizontal;
                DigitalDigitPieces[0].Height = ActualWidth - (DigitalDigitPieces[0].PointSize * 2);
                DigitalDigitPieces[0].SetValue(Canvas.LeftProperty, DigitalDigitPieces[0].PointSize);
                DigitalDigitPieces[0].PointSize = PointSize;

                DigitalDigitPieces[1].SetValue(Canvas.LeftProperty, 0D);
                DigitalDigitPieces[1].Height = LongHeight;
                DigitalDigitPieces[1].SetValue(Canvas.TopProperty, (double)DigitalDigitPieces[0].Width / 2);
                DigitalDigitPieces[1].PointSize = PointSize;

                DigitalDigitPieces[2].SetValue(Canvas.LeftProperty, (double)ActualWidth - DigitalDigitPieces[2].Width);
                DigitalDigitPieces[2].Height = LongHeight;
                DigitalDigitPieces[2].SetValue(Canvas.TopProperty, (double)DigitalDigitPieces[0].Width / 2);
                DigitalDigitPieces[2].PointSize = PointSize;

                DigitalDigitPieces[3].Orientation = DigitalDigitPieceOrientation.Horizontal;
                DigitalDigitPieces[3].Height = ActualWidth - (DigitalDigitPieces[3].PointSize * 2);
                DigitalDigitPieces[3].SetValue(Canvas.LeftProperty, DigitalDigitPieces[3].PointSize);
                DigitalDigitPieces[3].SetValue(Canvas.TopProperty, (((double)DigitalDigitPieces[2].GetValue(Canvas.TopProperty)) + (double)(DigitalDigitPieces[2].Height - DigitalDigitPieces[2].PointSize)));
                DigitalDigitPieces[3].PointSize = PointSize;

                DigitalDigitPieces[4].SetValue(Canvas.LeftProperty, 0D);
                DigitalDigitPieces[4].Height = LongHeight;
                DigitalDigitPieces[4].SetValue(Canvas.TopProperty, (((double)DigitalDigitPieces[3].GetValue(Canvas.TopProperty)) + (double)(DigitalDigitPieces[3].Width / 2)));
                DigitalDigitPieces[4].PointSize = PointSize;

                DigitalDigitPieces[5].SetValue(Canvas.LeftProperty, (double)ActualWidth - DigitalDigitPieces[4].Width);
                DigitalDigitPieces[5].Height = LongHeight;
                DigitalDigitPieces[5].SetValue(Canvas.TopProperty, (((double)DigitalDigitPieces[3].GetValue(Canvas.TopProperty)) + (double)(DigitalDigitPieces[3].Width / 2)));
                DigitalDigitPieces[5].PointSize = PointSize;

                DigitalDigitPieces[6].Orientation = DigitalDigitPieceOrientation.Horizontal;
                DigitalDigitPieces[6].Height = ActualWidth - (DigitalDigitPieces[6].PointSize * 2);
                DigitalDigitPieces[6].SetValue(Canvas.LeftProperty, DigitalDigitPieces[3].PointSize);
                DigitalDigitPieces[6].SetValue(Canvas.TopProperty, (((double)DigitalDigitPieces[5].GetValue(Canvas.TopProperty)) + (double)(DigitalDigitPieces[5].Height - DigitalDigitPieces[5].PointSize)));
                DigitalDigitPieces[6].PointSize = PointSize;
            }
        }

        protected void CreateDigits()
        {
            DigitalDigitPieces = new List<DigitalDigitPiece>();
            for (var i = 0; i < 7; i++)
            {
                var piece = new DigitalDigitPiece();
                DigitalDigitPieces.Add(piece);
                LayoutRoot.Children.Add(DigitalDigitPieces[i]);
            }
        }

        #region IDigitalDigit Members

        public void SetState(IDigitState state)
        {
            state.Handle(this);
        }

        #endregion

        public void Update()
        {
            Draw();
        }
    }

 public partial class DigitalDigitPiece : UserControl
    {
        private double _angle = 0D;

        private double _pointSize = 10;

        public double PointSize
        {
            get { return _pointSize; }
            set
            {
                if (value != _pointSize)
                {
                    _pointSize = value;
                    Draw();
                }
            }
        }

        private Color _digitColor;

        public Color DigitColor
        {
            get { return _digitColor; }
            set
            {
                if (value != _digitColor)
                {
                    _digitColor = value;
                    Draw();
                }
            }
        }

        private DigitalDigitPieceOrientation _orientation;

        public DigitalDigitPieceOrientation Orientation
        {
            get { return _orientation; }
            set
            {
                if (value != _orientation)
                {
                    _orientation = value;
                    Draw();
                }
            }
        }

        private Polygon _polygon;

        public Polygon Polygon
        {
            get { return _polygon; }
            set { _polygon = value; }
        }

        public DigitalDigitPiece()
        {
            _digitColor = Colors.Red;
            _orientation = DigitalDigitPieceOrientation.Vertical;
            _polygon = new Polygon();

            InitializeComponent();
            SizeChanged += new SizeChangedEventHandler(DigitalDigitPiece_SizeChanged);
            Loaded += new RoutedEventHandler(DigitalDigitPiece_Loaded);

            LayoutRoot.Children.Add(_polygon);
        }

        void DigitalDigitPiece_SizeChanged(object sender, SizeChangedEventArgs e)
        {
            Draw();
        }

        void DigitalDigitPiece_Loaded(object sender, RoutedEventArgs e)
        {
            Draw();
        }

        protected void Draw()
        {
            Width = _pointSize * 2;

            _polygon.Points = new PointCollection
            {
                 new Point(Width / 2,0),
                 new Point(Width, _pointSize),
                 new Point(Width, Height - _pointSize),
                 new Point(Width/2,Height),
                 new Point(0,Height-_pointSize),
                 new Point(0, _pointSize),
                 new Point(Width/2,0)
            };
            _polygon.Fill = new SolidColorBrush(DigitColor);
            _polygon.Stroke = new SolidColorBrush(Colors.Black);
            _polygon.StrokeThickness = 1D;

            var rotate = new RotateTransform();
            rotate.CenterX = _pointSize;
            rotate.CenterY = _pointSize;
            if (_orientation == DigitalDigitPieceOrientation.Horizontal)
            {
                if (_angle == 0 || _angle == 90)
                    _angle = -90;
            }
            else
            {
                if (_angle == -90)
                    _angle = 90;
                else
                    _angle = 0;
            }

            rotate.Angle = _angle;
            _polygon.RenderTransform = rotate;

        }
    }

The actual view is simply a user control which contains instances of the digits inside and arranges them accordingly.  The class which I have not mentioned is the separator class and that is simply two ellipses which I have added control for, both for size and the colour inside the containers.

<UserControl x:Class="DigitalClock.DigitalClockView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:custom="clr-namespace:DigitalClock">
    <Grid x:Name="LayoutRoot" Background="Black">
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition />
        </Grid.RowDefinitions>
        <custom:DigitalDigit x:Name="Hour1" Grid.Column="0" PointSize="20" OnColor="Beige" />
        <custom:DigitalDigit x:Name="Hour2" Grid.Column="1" PointSize="20" OnColor="Beige"/>
        <custom:DigitalClockSeparator x:Name="sep1" Grid.Column="2" HorizontalAlignment="Center" />
        <custom:DigitalDigit x:Name="Minute1" Grid.Column="3" PointSize="20" />
        <custom:DigitalDigit x:Name="Minute2" Grid.Column="4" PointSize="20" />
        <custom:DigitalClockSeparator x:Name="sep2" Grid.Column="5" HorizontalAlignment="Center"/>
        <custom:DigitalDigit x:Name="Second1" Grid.Column="6" PointSize="20" />
        <custom:DigitalDigit x:Name="Second2" Grid.Column="7" PointSize="20" />
    </Grid>
</UserControl>

I found a couple of gotchas and a big one includes that upon an exception, SilverLight will continue to try and render what it has even after an exception and it looks likes values default to zero, which admittedly seems logical.  Take a peek at this screen print from the above app during development.

image 

Tis all for now,

Cheers,


Andrew



.NET | C# | Silverlight
Sunday, November 22, 2009 11:22:03 PM (GMT Standard Time, UTC+00:00)  #    Disclaimer

Whilst thinking about securing an application and system I am currently building I recalled working with both the eBay and Amazon apis and the security features which they employed and remember thinking how good they were.  Both required token based authentication and more importantly signing each request with a different signature, whilst still maintaining an identity to the service provider which would handle the request.

The idea is rather simple.

You do not want your users downloading a third party piece of software which then asks them for their user name and password in order to use your service.  The security risks of such should be obvious.  The fact is, you want to offer your services for public consumption, but you also want to offer the ability for your services to be used in the context of a different user, again allowing third party software vendors to offer your customers applications they can use against your service.

Tokens

A token, i.e. some string, is used whose meaning is only known between a consumer and the service provider and protected by a secret key again only known between the consumer and the service provider. A few objectives for this type of thing are as follows:

  • A service provider differentiates between each consumer of its public facing service.
    • Not a pre requisite but something that goes hand in hand with the above, is that the service provider records each developer who in turn can create consumers.
  • A service can create a link between existing users and consumers of its public facing services.
  • The identifier of the link between a user and a consumer is absolutely unique. 
    • USER A – CONSUMER A – KEY: A
      USER B – CONSUMER A – KEY: B
      USER A – CONSUMER B – KEY: C
      USER B – CONSUMER B – KEY: D
  • The keys above are for display purposes only just to convey that no link between consumer and user is the same, they are absolutely unique.

My Initial Idea

I want to just put down my initial idea which again is based on both the eBay api and also the Amazon one.  It looks at securing the service against applications and also their use on behalf of users.

The fields involved are as follows:

  • ApplicationID
  • DeveloperID
  • Timestamp
  • UserToken
  • SecretKey
  • Signature

The only thing above which I got from Amazon is the timestamp thing, although it was a while ago when I used it, and I know now that this sort of thing is the norm.  The idea is you take all these values and concatenate them into a string, which you then hash using one of he many hashing or Hmac algorithms, this then forms the signature parameter. What you send to the service is then all parameters barring the SecretKey, which should remain known only to the consumer and the service provider.  Once received the service provider can query its data store for the secret key, hash all the values as the consumer did and make a comparison.  If these match then it can be assumed that the origin of the message is valid.

OAUTH

After more research in to this kind of thing I came across the twitter API which in turn led me to the OAUTH.  If you haven’t yet, then here is the link.

An open protocol to allow secure API authorization in a simple and standard method from desktop and web applications.

And also here which has some great walk troughs of it and process flows:

http://hueniverse.com/2007/10/beginners-guide-to-oauth-part-ii-protocol-workflow/

I am building a custom implementation of the protocol with a couple of demo layers inside Visual Studio 2010, WCF and MVC 2 which I will get on here in the next few days. They offer code in many different flavours to see examples of the protocol but being a protocol, just stick to it, and design it how you like.  That is what I am doing.

My examples will also make use of the previous crypto helper I made, as I think that I will use HMACSHA1 for the signing.  HMACSHA512 sounds a bit large when used in REST implementations. If you do not want to offer a REST implementation then why not go the whole hog and secure using HMACSHA512.

The Example

The example that I am building will be a simple website, which offers users a small service.  It will contain a section for developers to signup with and create an account with which they can create key sets for different applications they make.

Cheers for now,

Andrew


Thursday, November 05, 2009 9:49:36 PM (GMT Standard Time, UTC+00:00)  #    Disclaimer