From 0546c9dbd27764d065c804a99c1a42107ad6b0d5 Mon Sep 17 00:00:00 2001 From: Simon DENEL Date: Thu, 19 Feb 2015 16:53:45 +0100 Subject: [PATCH] Update bootstrap-toggle.js Facilitate integration with Angular, where the DOM style can be computed afterward. Solution is inspired by: http://buzzdecafe.github.io/2014/03/20/directive-after-dom/ --- js/bootstrap-toggle.js | 27 ++++++++++++++++----------- 1 file changed, 16 insertions(+), 11 deletions(-) diff --git a/js/bootstrap-toggle.js b/js/bootstrap-toggle.js index 533914e..f9741ee 100644 --- a/js/bootstrap-toggle.js +++ b/js/bootstrap-toggle.js @@ -73,17 +73,22 @@ }) this.$toggle.append($toggleGroup) - var width = this.options.width || Math.max($toggleOn.outerWidth(), $toggleOff.outerWidth())+($toggleHandle.outerWidth()/2) - var height = this.options.height || Math.max($toggleOn.outerHeight(), $toggleOff.outerHeight()) - $toggleOn.addClass('toggle-on') - $toggleOff.addClass('toggle-off') - this.$toggle.css({ width: width, height: height }) - if (this.options.height) { - $toggleOn.css('line-height', $toggleOn.height() + 'px') - $toggleOff.css('line-height', $toggleOff.height() + 'px') - } - this.update(true) - this.trigger(true) + var setWidthHeight = function() { + var width = this.options.width || Math.max($toggleOn.outerWidth(), $toggleOff.outerWidth())+($toggleHandle.outerWidth()/2); + var height = this.options.height || Math.max($toggleOn.outerHeight(), $toggleOff.outerHeight()); + if(width == 0) { setTimeout(setWidthHeight, 100); return; } + $toggleOn.addClass('toggle-on') + $toggleOff.addClass('toggle-off') + this.$toggle.css({ width: width, height: height }) + + if (this.options.height) { + $toggleOn.css('line-height', $toggleOn.height() + 'px') + $toggleOff.css('line-height', $toggleOff.height() + 'px') + } + this.update(true) + this.trigger(true) + }.bind(this); + setWidthHeight(); } Toggle.prototype.toggle = function () {