Namespaced binding handlers

src/bindings/alertBinding.js

@@ -1,4 +1,4 @@
-ko.bindingHandlers.alert = {
+ko.bindingHandlers['knockstrap.alert'] = {
     init: function () {
         return { controlsDescendantBindings: true };
     },
@@ -36,4 +36,4 @@ ko.bindingHandlers.alert = {
     }
 };
 
-ko.virtualElements.allowedBindings.alert = true;
+ko.virtualElements.allowedBindings['knockstrap.alert'] = true;

src/bindings/carouselBinding.js

@@ -1,4 +1,4 @@
-ko.bindingHandlers.carousel = {
+ko.bindingHandlers['knockstrap.carousel'] = {
 
     defaults: {
         css: 'carousel slide',
@@ -42,7 +42,7 @@
     init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
         var $element = $(element),
             value = valueAccessor(),
-            defaults = ko.bindingHandlers.carousel.defaults,
+            defaults = ko.bindingHandlers['knockstrap.carousel'].defaults,
             extendDefaults = function(defs, type) {
                 var extended = {
                     name: defs.name,

src/bindings/checkboxBinding.js

@@ -1,5 +1,5 @@
 // Knockout checked binding doesn't work with Bootstrap checkboxes
-ko.bindingHandlers.checkbox = {
+ko.bindingHandlers['knockstrap.checkbox'] = {
     init: function (element, valueAccessor) {
         var $element = $(element),
             handler = function (e) {

src/bindings/classBinding.js

@@ -3,7 +3,7 @@
 // Inspired by https://github.com/knockout/knockout/wiki/Bindings---class
 var previousClassKey = '__ko__previousClassValue__';
 
-ko.bindingHandlers['class'] = {
+ko.bindingHandlers['knockstrap.class'] = {
     update: function (element, valueAccessor) {
         if (element[previousClassKey]) {
             ko.utils.toggleDomNodeCssClass(element, element[previousClassKey], false);

src/bindings/modalBinding.js

@@ -1,4 +1,4 @@
-ko.bindingHandlers.modal = {
+ko.bindingHandlers['knockstrap.modal'] = {
     defaults: {
         css: 'modal fade',
         dialogCss: '',
@@ -29,7 +29,7 @@
     init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
         var $element = $(element),
             value = valueAccessor(),
-            defaults = ko.bindingHandlers.modal.defaults,
+            defaults = ko.bindingHandlers['knockstrap.modal'].defaults,
             options = ko.utils.extend({ show: $element.data().show || false }, ko.utils.unwrapProperties(value.options)),
             extendDefaults = function (defs, val) {
                 var extended = {

src/bindings/popoverBinding.js

@@ -1,6 +1,6 @@
 var popoverDomDataTemplateKey = '__popoverTemplateKey__';
 
-ko.bindingHandlers.popover = {
+ko.bindingHandlers['knockstrap.popover'] = {
 
     init: function (element) {
         var $element = $(element);

src/bindings/progressBinding.js

@@ -1,4 +1,4 @@
-ko.bindingHandlers.progress = {
+ko.bindingHandlers['knockstrap.progress'] = {
     defaults: {
         css: 'progress',
         text: '',
@@ -12,7 +12,7 @@
         var $element = $(element),
             value = valueAccessor(),
             unwrappedValue = ko.unwrap(value),
-            defs = ko.bindingHandlers.progress.defaults,
+            defs = ko.bindingHandlers['knockstrap.progress'].defaults,
             model = $.extend({}, defs, unwrappedValue);
 
         if (typeof unwrappedValue === 'number') {

src/bindings/radioBinding.js

@@ -1,5 +1,5 @@
 // Knockout checked binding doesn't work with Bootstrap radio-buttons
-ko.bindingHandlers.radio = {
+ko.bindingHandlers['knockstrap.radio'] = {
     init: function (element, valueAccessor) {
 
         if (!ko.isObservable(valueAccessor())) {

src/bindings/toggleBinding.js

@@ -1,4 +1,4 @@
-ko.bindingHandlers.toggle = {
+ko.bindingHandlers['knockstrap.toggle'] = {
     init: function (element, valueAccessor) {
         var value = valueAccessor();
 

src/bindings/tooltipBinding.js

@@ -1,4 +1,4 @@
-ko.bindingHandlers.tooltip = {
+ko.bindingHandlers['knockstrap.tooltip'] = {
     init: function (element) {
         var $element = $(element);
 

src/templates/progress.html

@@ -1,5 +1,5 @@
 <div class="progress-bar" role="progressbar" aria-valuemin="0" aria-valuemax="100"
-    data-bind="style: { width: barWidth }, attr: { 'aria-valuenow': value }, css: { active: animated, 'progress-bar-striped': striped }, 'class': barType">
+    data-bind="style: { width: barWidth }, attr: { 'aria-valuenow': value }, css: { active: animated, 'progress-bar-striped': striped }, 'knockstrap.class': barType">
     <span data-bind="css: { 'sr-only': textHidden }">
         <span data-bind="text: value"></span>% <span data-bind="text: text"></span>
     </span>

tests/bindings/alertBindingBehaviors.js

@@ -1,5 +1,5 @@
 describe('Binding: alert', function () {
-    this.prepareTestElement('<div data-bind="alert: value"></div>');
+    this.prepareTestElement('<div data-bind="knockstrap.alert: value"></div>');
 
     beforeEach(function () {
         this.testElement.after('<script id="test-template" type="text/html"><div class="test-template" data-bind="text: label">Text</div></script>');
@@ -97,7 +97,7 @@
         };
 
         // change test element to ko virtual elements for this spec
-        this.testElement = this.testElement.removeAttr('data-bind').html('<!-- ko alert: value --><!-- /ko -->');
+        this.testElement = this.testElement.removeAttr('data-bind').html('<!-- ko knockstrap.alert: value --><!-- /ko -->');
 
         ko.applyBindings(vm, this.testElement[0]);
 

tests/bindings/carouselBindingBehaviors.js

@@ -1,5 +1,5 @@
 describe('Binding: carousel', function () {
-    this.prepareTestElement('<div data-bind="carousel: value"></div>');
+    this.prepareTestElement('<div data-bind="knockstrap.carousel: value"></div>');
 
     beforeEach(function() {
         this.testElement.after('<script id="test-template" type="text/html"><div class="test-template" data-bind="text: label">Text</div></script>');

tests/bindings/checkboxBindingBehaviors.js

@@ -1,6 +1,6 @@
 describe('Binding: checkbox', function () {
     describe('Array case', function () {
-        this.prepareTestElement('<div class="btn-group form-group" data-toggle="buttons" data-bind="checkbox: value">'
+        this.prepareTestElement('<div class="btn-group form-group" data-toggle="buttons" data-bind="knockstrap.checkbox: value">'
             + '<label class="btn btn-primary"><input type="checkbox" value="A" />A</label>'
             + '<label class="btn btn-primary"><input type="checkbox" value="B" />B</label>'
             + '<label class="btn btn-primary"><input type="checkbox" value="C" />C</label>'
@@ -105,7 +105,7 @@
 
     describe('Boolean case', function () {
         this.prepareTestElement('<div class="btn-group form-group" data-toggle="buttons">'
-        + '<label class="btn btn-primary"><input type="checkbox" data-bind="checkbox: value" />A</label>'
+        + '<label class="btn btn-primary"><input type="checkbox" data-bind="knockstrap.checkbox: value" />A</label>'
         + '</div>');
 
         it('Should throw exception for non-observable value', function () {

tests/bindings/classBindingBehaviors.js

@@ -1,5 +1,5 @@
 describe('Binding: class', function () {
-    this.prepareTestElement('<div data-bind="class: value"></div>');
+    this.prepareTestElement('<div data-bind="knockstrap.class: value"></div>');
 
     it('Should add class to element', function () {
         var vm = {

tests/bindings/modalBindingBehaviors.js

@@ -1,5 +1,5 @@
 describe('Binding: modal', function () {
-    this.prepareTestElement('<div data-bind="modal: value"></div>');
+    this.prepareTestElement('<div data-bind="knockstrap.modal: value"></div>');
 
     beforeEach(function() {
         this.testElement.after('<script id="test-template" type="text/html"><div id="test">Text</div></script>');

tests/bindings/popoverBindingBehaviors.js

@@ -1,5 +1,5 @@
 describe('Binding: popover', function () {
-    this.prepareTestElement('<div data-bind="popover: value">Test</div>');
+    this.prepareTestElement('<div data-bind="knockstrap.popover: value">Test</div>');
 
     afterEach(function() {
         $('.popover').remove();

tests/bindings/progressBindingBehaviors.js

@@ -1,5 +1,5 @@
 describe('Binding: progress', function() {
-    this.prepareTestElement('<div data-bind="progress: value"></div>');
+    this.prepareTestElement('<div data-bind="knockstrap.progress: value"></div>');
 
     it('Should add "progress" class to target element', function() {
         ko.applyBindings({ value: 1 }, this.testElement[0]);

tests/bindings/radioBindingBehaviors.js

@@ -1,5 +1,5 @@
 describe('Binding: radio', function () {
-    this.prepareTestElement('<div class="btn-group form-group" data-toggle="buttons" data-bind="radio: value">'
+    this.prepareTestElement('<div class="btn-group form-group" data-toggle="buttons" data-bind="knockstrap.radio: value">'
         + '<label class="btn btn-primary"><input type="radio" name="options" value="A" />A</label>'
         + '<label class="btn btn-primary"><input type="radio" name="options" value="B" />B</label>'
         + '</div>');

tests/bindings/toggleBindingBehaviors.js

@@ -1,5 +1,5 @@
 describe('Binding: toggle', function () {
-    this.prepareTestElement('<button data-toggle="button" data-bind="toggle: value">toggle</button>');
+    this.prepareTestElement('<button data-toggle="button" data-bind="knockstrap.toggle: value">toggle</button>');
 
     it('Shoud throw exception for non-observable value', function() {
         var el = this.testElement[0];

tests/bindings/tooltipBindingBehaviors.js

@@ -1,5 +1,5 @@
 describe('Binding: tooltip', function () {
-    this.prepareTestElement('<div data-bind="tooltip: options">Text</div>');
+    this.prepareTestElement('<div data-bind="knockstrap.tooltip: options">Text</div>');
 
     afterEach(function() {
         $('.tooltip').remove();