Flutter without Fluid

The World Without the Fluid Framework

The purpose of this section is to provide an example of how Flutter would be built, without the use of the Fluid Framework.

Working from the directory structure created above, we will add a couple more directories and files.

1) In the "webapp" directory, add a new sub-directory called "flutter-plain-jquery"

2) Inside the "flutter-plain-jquery" directory we'll add another sub-directory called "sample-data"

3) In the "shared/js" directory, add a new sub-directory called "jquery"

Your Directory should now look something like this...

4) Next we'll add the files necessary to make Flutter work. Please copy the files below into the appropriate directories

File	Directory
jquery.keyboard.a11y.js	webapp/shared/css
jquery	webapp/shared/js/jquery
ui.core.js	webapp/shared/js/jquery
ui.dialog.js	webapp/shared/js/jquery
ui.draggable.js	webapp/shared/js/jquery
Flutter.html	webapp/flutter-plain-jquery
Flutter.js	webapp/flutter-plain-jquery
Friends	webapp/flutter-infused/sample-data
user_timeline_12368532.json	webapp/flutter-plain-jquery/sample-data
user_timeline_14538601.json	webapp/flutter-plain-jquery/sample-data
user_timeline_14538636.json	webapp/flutter-plain-jquery/sample-data
user_timeline_14951188.json	webapp/flutter-plain-jquery/sample-data
user_timeline_17868497.json	webapp/flutter-plain-jquery/sample-data
user_timeline_19539154.json	webapp/flutter-plain-jquery/sample-data
user_timeline_5915782.json	webapp/flutter-plain-jquery/sample-data
user_timeline_752673.json	webapp/flutter-plain-jquery/sample-data

Your Directory should now look something like this...

Flutter-Plain-jQuery	Flutter-Infused
Relies on hard coded selectors to find elements in the DOM	The Fluid Framework allows selectors to be specified by the integrator. The component does come with defaults for the selectors, which the integrator is free to use or override.
Flutter.js is a set of behaviour governing the various aspects of Flutter-Plain-jQuery	The Fluid Framework's event system allows the Flutter-Infused to be partitioned into components/subcomponents, by providing a means of communication between them. The event system is constructed in such a way that individual components/subcomponents do not need to be aware of the existence of one another, but can just listen for events they are interested in. These events are also available to the integrator to listen to, thereby allowing Flutter to be extended
There aren't really options. You are able to pass in information about URL's	The options merging from the Fluid Framework provides a simple way to make your component customizable. Changing default options are as simple as specifying which options and values to override in an options object, passed to the Creator function