User Rating Scorecard, Part III

“All things are created twice. There’s a mental or first creation, and a physical or second creation of all things. You have to make sure that the blueprint, the first creation, is really what you want, that you’ve thought everything through. Then you put it into bricks and mortar. Each day you go to the construction shed and pull out the blueprint to get marching orders for the day. You begin with the end in mind.”
Stephen Covey

I like the way that my 5 star rating scorecard widget came out, but I still want to be able to do more than just stars, and be more flexible than having just a 1 to 5 rating system. Ultimately, it would be nice to be able to customize things a bit more with different icons or images, be able to pick your own colors, and even have a different image for each rating value. As always, I would want to have a default value for just about everything, so your wouldn’t have to specify most of that if you didn’t need or want to, but it would be nice to have the option. I’d like to be able to support the following customization attributes:

  • snh-max – this would be the upper limit on rating value, and I would make it totally optional, with a default value of 5, which seems to be pretty universal for most use cases.
  • snh-icon – this would be the name of one of the stock Retina Icons, which again, would be optional and default to star if you didn’t override it.
  • snh-image – this would be a link to an uploaded image file, which would serve the same purpose as the snh-icon, but provide the ability have a custom image not found in the stock icon set. Obviously, you could only have one or the other, so there would have to be some hierarchy established in the event that someone specified both an icon and an image.
  • snh-image-array – this would be an array of links much like the snh-image attribute, but instead of a single image, it would provide the capability to have a different image for each rating value. Again, there would have to be some kind of hierarchy established to avoid a conflict between an array of images, a single image, or a single icon.
  • snh-name – this would be the text equivalent of the icon or image, and would default to Star, to match the default icon. This name would be used in some of the labels, and would allow you to replace labels such as 1 Star with 1 Bell or 1 Thumbs Up.
  • snh-plural – this would just be the plural version of snh-name, and really only necessary if adding an “s” to the end of the word didn’t come out right. In the examples above, 2 Stars or 2 Bells would be OK, but 2 Thumbs Ups wouldn’t be right, so you would want to add snh-plural=”Thumbs Up” to fix that.
  • snh-icon-color – this would give you the ability to choose the color of the selected icon, and again, I would make this optional and have a default color selected so you wouldn’t have to specify this unless you wanted something different.
  • snh-bar-colors – this would be an array of HTML colors codes that would give you the ability to choose the colors in the vote breakdown bar chart. Like most other items on my wish list, this would be optional and there would be default values that would be used in the event that you elected not to customize this particular parameter.

These are all of the things that I can think of at the moment, but I am sure that others will come up over time. Of course it’s one thing to have all of these ideas in your head and quite another to actually write the code to make it happen. At this point, these are just ideas. If I want to actually see it in action, I will have to actually do the work!