Demo
Demo BuoyantJS here!
NOTE: that only the library will be reasonably usable in that environment.
History
- BuoyantJS was developed at DEPTHDEVELOPMENT by AdamCarson in 2013 and received its most current updates in 2015.
- Supports single-page web apps via multiple controllers, views, and models.
- Made to develop web apps faster and more simplistically.
- Encourages a separation of concerns using two-way data-binding and data watching on service calls.
- BuoyantJS is designed to be used independently of AngularJS and jQuery, though AngularJS may be used with BuoyantJS, and jQuery with the BuoyantJS framework only.
- Variable "watching" and "expressions" similar to AngularJS would be available, but I have a family and other web apps to attend to. I will likely not develop this feature until ECMAScript 7 with native watching becomes available.
- BuoyantJS is nearly identical in concept to AngularJS and jQuery, and appears to be written very similarly, so syntactically it will be familiar to most developers. I've never read the code for AngularJS or jQuery; however, from a superficial standpoint it looks nearly identical.
- There is no intent to compete with AngularJS, nor jQuery. BuoyantJS was made for the fun of the learning and creation process.
Updates
2015-04-16
The new BuoyantJS web app and documentation is now available at http://depthdev.com/buoyantjs/!
The BuoyantJS versioning was reset to version 1.0.0 after several major adjustments and enhancements.2015-03-31
Fixed event delegation on/off issues.2015-03-09
The new BuoyantJS web app and documentation is now available at http://depthdev.com/buoyantjs/!2015-02-28
Code-breaking syntax change on the "css" method.2015-02-25
Added an "off" method to remove listeners (included delegated listeners)
Fixed scope of event delegation on the "on" method
Fixed scope of the "find" method2015-02-18
- Simplified controller syntax
- Clean URL on single-page navigation with back-button support
- Independent controllers including ones outside the view
- AJAX with two-way data-binding
- For each data-binding
- Simplified JSON handling (stringification is automatically performed when AJAXed)
- Any namespace/prefix can be used in the markup
2015-01-31
BuoyantJS was pushed to production today with some new features:- The entire framework (library included) is only 13KB!
- Minification/uglify proof
- Simplified Controller and Model/Script integration
- Ideal handling of views/HTML
- Routing
- Instant view & model change using the controller on link click
- Vanity URLs
- Support for hash and hash-bang
- AJAX/HTTP now supports
- text, HTML, JavaScript, JSON, and XML
- GET/POST
- success, error, and finally callbacks
This version requires a slightly different syntax for adding controllers.
2015-01-16
BuoyantJS was pushed to production today with some new features:- Only 9K minified! The entire framework with D.O.M. querying/manipulation and this new MVC two-way data-binding is only 9KB!
- Supports the full MVC pattern now! (NOTE: You can survive minification if you stringify the MVC property names on the MVC object)
- You provide your own Model (script), View (markup) and Controller (scope name)
- Run (and/or re-run) any controller at any time! (NOTE: multiple MVC's on a single page are not allowed, but can be swapped instantly!)
- Performance enhanced just a tad
2015-01-16
BuoyantJS was pushed to production today with repeating content (which includes data-binding)!2015-01-15
BuoyantJS was pushed to production today with attribute listeners of "click," "keyup," and "change"!2015-01-14
BuoyantJS was pushed to production today with event delegation!
Example syntax: $('body').on('click', 'input', function() { $(this).css('background:#08f'); });2015-01-06
BuoyantJS was pushed to production today for this site only with the new two-way data-binding features and ability to use endless controllers!2014-11-01
The Buoyant framework (BuoyantJS), is a DOM and data-binding framework originally built for this site.
This was built last year about the same time and has since been added on to, and cleaned up. Currently, event delegation and data-binding is being added.
The syntax and method naming conventions mostly match jQuery as to not confuse coding between similar libraries. I've never read the jQuery code, but it appears to work the same way.
This framework currently has:
30+ methods (including setters/getters)
- on
- each
- find
- addClass
- removeClass
- toggleClass
- fadeIn
- fadeOut
- css
- parent
- child
- children
- siblings
- prev
- next
- html
- text
- val
- selectedIndex
- attr
- removeAttr
- focus
- remove
- width
- height
- length
- exists
AJAX
Data-binding (in development)
2014-02-15
Ironed out some of the methods in the BuoyantJS library and also built some new ones.2014-01-28
First public beta release of the new version of BuoyantJS!