the singularity of being and nothingness
Posts tagged Spry Framework
Spry's Rating Widget
Apr 16th
For a new project I'm working on, I will need a mechanism for users to vote on certain pieces of content. Now it turns out that there are a billion and one ways of doing this, with an additional billion sets of frameworks. I was quite overwhelmed by the number of choices, so I've been putting it off for a while now.
Yet fortuitously, a couple days ago I was browsing the Spry docs and noticed two very promising words: Rating Widget.
Surely this cannot be what I'm looking for, could it? Ah but it was!
Recently, Spry updated its growing library of widgets to include a standard "star" rating system. Like it's other widgets, the rating widget comes with a single css file and a single javascript file. And also like other Spry widgets, it is completely simple to implement.
Assuming you have referenced the css and javascript files correctly, here's all it takes to set up a star rating system:
<span id="myrating" class="ratingContainer"> <span class="ratingButton"></span> <span class="ratingButton"></span> <span class="ratingButton"></span> <span class="ratingButton"></span> <span class="ratingButton"></span> <input type="text" id="ratingValue" name="dynamic_rate"/> <span class="ratingRatedMsg">Thanks for voting !</span> </span>
It's so simple it's almost laughable. But it gets much better. Like all More >
Adobe's Spry Framework, Part Second
Mar 24th
A couple days ago, I posted an example of how Adobe's Spry Framework allows one to easily and quickly incorporate XML datasets into an application, allowing for a great alternative to page-to-page navigation and data mining.
One of the limitations I pointed out was the initial amount of coding involved. Well, that was because I'm an idiot.
While I've used Spry's Spry.Data.XMLDataSet() many times before, I literally had no idea how powerful it is, nor that it could interact with dynamically generated XML files, such as I was doing with ColdFusion components in my last example. However, such is not the case. Not only does this method allow me to do everything I was doing before, it involves a heck of lot less code. The entire invoke for the datasets here is:
var dsCities = new Spry.Data.XMLDataSet("getlocations.cfc method=getCities", "cities/city");var dsLocations = new Spry.Data.XMLDataSet("getlocations.cfc?method=getLocations&cityID={dsCities::@id}", "locations/location");
Two lines of javascript! Now of course, there is more to handle some of the behaviors…but I have effectively cut out about 100 lines from what I was doing before. Pretty cool!
Finally, the best part about this is it allows me to take full advantage of the framework's "spry:state". With this, one can set different "states" that will fire in relation More >
Coming Up for AIR
Mar 10th
(Please ignore the absurdity of the title–I couldn't help myself!)
A little over a week ago, Adobe officially released Adobe Integrated Runtime (AIR) 1.0 along with Flex 3 . While I've looked into a AIR a bit in conjunction with Flex apps, I've not really gone beyond that.
However, with the official release, I decided to take another look.
What is AIR? As the full name explicates, it is a runtime that can be used to, um, run programs on your computer, mobile device, etc. So as with Microsoft's .NET framework, AIR allows developers to create programs that can be packaged up and installed on these devices.
However, unlike Windows-only or Mac-Only (or Linux-Only) programs, AIR is ambivalent about the OS. As long as the client machine has the runtime installed, any application developed in AIR can run on it. This in itself is really cool, and takes the bite off the exclusivity of OS platforms.
But the coolest part about AIR is that you can leverage different technologies when building applications. For example, a while ago I built an extremely simple Countdown application using Flex 3. Easy enough.
But what if I don't want to use ActionScript 3? No problem! Using the HTML, CSS More >
Why It's Important to Read the Docs…
Dec 20th
This morning, I was working on a bit of code for a dynamic directory search that I am building for work. Because I like the paging options that Spry provides, I decided to wire up Spry to ColdFusion to create some datasets. No big deal.
However, I came across an issue I have not encountered with Spry before. Normally, in the master/detail/filter mode of Spry dataset work, I will load a dataset from ColdFusion on page load and then use Spry to filter these results. The filter parameters normally come from the dataset itself.
For example, here's a run of the mill dataset:
var dsPeople = new Spry.Data.XMLDataSet("com/getpeople.cfc?method=getPeople, "/directory/person");
This will get all the people in my database from the query results of my ColdFusion component. If I wanted to see a detailed view of one of the people, I would simply pass a Spry dataset value (e.g., '@id') to this dataset, and it would handle it nicely.
While this works fine for a small number of records, what if we're talking about tens of thousands? I'm actually not sure how long it would take for Spry to deal with, say, 10,000 personal information records. However, I suspect it would be an arduous task More >
A Sexy Spry Gallery
Oct 27th
If one has been on the internet for 3 seconds, it is obvious that dynamic photo galleries are useful and popular things. After all, who wants to scroll through pages of pictures when they can all be loaded into one interface that can be controlled like a CD player (remember those…)?
Historically, the best photo galleries have been handled by Flash. After all, it is a super easy thing to do, can be highly stylized and customized, and just generally works well. The attendant problem, however, has been two-fold. Although generally lightweight, Flash is still pretty bulky, and as Interent Explorer has made us painfully aware, is not always treated with open arms by browsers. Second, unless one has gone to trouble of coding to read an XML file, or is using remoting to connect to a database, Flash is just a pain to manage and can be time consuming to make simple additions, deletions, etc.
In recent years, some very good javascript alternatives have popped up. While some are far better than others, the appeal of all is that they are generally less bandwidth expensive than flash and can be *more easily* modified than their flash alternatives.
Spry has made its More >
A Feedreader with Spry
Oct 18th
I know I've been posting alot about Spry lately, but the more I use it, the more I love it! Using the simple-to-implement tools which Spry provides, I am able to spend more time dealing with server-side processing, rather than fighting javascript to get a couple of cool effects.
A few weeks ago, I blogged about using Spry to return confirmation or error messages for a registration form asychronously to alert users to possible errors in their form BEFORE submission.
Today's example is based on the same principle, although more of an "independant app." A week ago, a co-worker and I were talking about the idea of placing a "feed reader" inside of a web page, so that users could not only display links to feeds that they follow, but also allow for the feed to be displayed directly in the page. After our conversation, my thoughts immediately turned to Spry as I was sure a quick, easy solution would be possible.
I was right.
There is really nothing to this. In classic Spry usability-friendliness, this can be accomplished in about two lines of code:
var dsFeeds = new Spry.Data.XMLDataSet("getfeeds.cfc?method=updateFeed", "feeds/feed", { useCache:false });var dsFeedContent = new Spry.Data.XMLDataSet("getfeeds.cfc?method=getFeeds&feedURL={dsFeeds::link}", "rss/channel/item");
The first line creates a Spry More >
A Little Taste of Spry 1.6 Goodness
Oct 3rd
A few days I blogged about Adobe's release (and sexy-fication) of the javascript framework Spry 1.6. While I have not had a lot of time to play around with the absolutely unique elements, some cool additions are the improvements they made to the password verification and confirmation widgets. With the root password widget, the developer can create a pretty robust set of validation rules for user-entered passwords, such as setting minimum and maximum lengths, required special characters/numbers, etc. The best part is that the Spry framework makes these validations incredibly easy to implement on a normal HTML form. For example, here is an example password field I have created:
<span id="passwordValidation"> <input type="password" name="password" id="password" /> <span class="passwordRequiredMsg">Please enter a password.</span> <span class="passwordMinCharsMsg">Your password must be at least 7 characters long.</span> <span class="passwordInvalidStrengthMsg">Your password must contain at least 1 number.</span></span>
That's it. Basically, the entire password widget is a span wrap on the password field. Within this, special validation messages can be defined. On this example, I have set an error message for "required," "minimum characters" and "password strength".
On the function side, the following is all that is required to fully validate this field:
var password = new More > A New Day, A New Spry
Oct 1st
Recently, I have blogged about how incredibly cool Adobe's javascript framework—Spry—is and what potential it has for making great dynamic web content. In those posts, I was talking about Spry pre-release version 1.5. Up until 1.4, it would not seem that Adobe was too terribly interested in marketing Spry. After all, there had not been even a logo created for the project, and the online documentation and samples was incredibly difficult to navigate. With 1.4, Adobe made the smart move of bundling Spry into Dreamweaver CS3, with native Dreamweaver support for Spry tags and functions, a major benefit for noobs like me getting their feet wet with a javascript framework.
However, about a month after the release of Dreamweaver CS3, the Spry team released 1.5. It included some seriously cool updates on all fronts–data, widgets and effects. But for whatever reason, they did not release a Dreamweaver updater. This means that to use 1.5, the user had to download it and replace the bundled 1.4 files with the new version. While not a huge deal, it is not particularly helpful for Dreamweaver support of the new features as they were not included in the original release. As a plus, a More >
Adobe's Spry Framework, Part Second
Sep 17th
A couple days ago, I posted an example of how Adobe's Spry Framework allows one to easily and quickly incorporate XML datasets into an application, allowing for a great alternative to page-to-page navigation and data mining.
One of the limitations I pointed out was the initial amount of coding involved. Well, that was because I'm an idiot.
While I've used Spry's Spry.Data.XMLDataSet() many times before, I literally had no idea how powerful it is, nor that it could interact with dynamically generated XML files, such as I was doing with ColdFusion components in my last example. However, such is not the case. Not only does this method allow me to do everything I was doing before, it involves a heck of lot less code. The entire invoke for the datasets here is:
var dsCities = new Spry.Data.XMLDataSet("getlocations.cfc method=getCities", "cities/city");var dsLocations = new Spry.Data.XMLDataSet("getlocations.cfc?method=getLocations&cityID={dsCities::@id}", "locations/location");
Two lines of javascript! Now of course, there is more to handle some of the behaviors…but I have effectively cut out about 100 lines from what I was doing before. Pretty cool!
Finally, the best part about this is it allows me to take full advantage of the framework's "spry:state". With this, one can set different "states" that will fire in relation More >
Web 2.0 Goodness – Adobe's Spry Framework
Sep 12th
Ok, so as everyone who reads this blog knows (or should know…), I am a web designer/web developer. On the development side, I am best at ColdFusion , one of the under-appreciated programming langugages out there. While ColdFusion is awesome, one of the drawbacks of it (as well as of PHP, .NET, etc.) is that it is a server-side technology, meaning (surprise, surprise) that all of the code processing done is accomplished on the server. So, any of the cool Web 2.0 stuff out there, like asynchronous form submission, has to use Javascript.
While ColdFusion 8 has some seriously cool AJAX features built into it that handle alot of this kind of thing with ease, it is not free and wonderful hosting companies (like GoDaddy) are slow to upgrade their servers to the newest version. Therefore, the onus is upon the developer to utilize the various work-arounds until ColdFusion 8 is firmly entrenched.
One tool that makes life significantly easier is Adobe's Spry Framework . While Spry includes a lot of the cool effects of other Javascript frameworks, one of the best parts of it is the easy way in which it allows Spry to make server-side calls to allow applications to harness More >
