diff --git a/lib/notify.js b/lib/notify.js index 66d40c6..ce1a44b 100644 --- a/lib/notify.js +++ b/lib/notify.js @@ -3,21 +3,21 @@ var scroll = require("./ghostmode.scroll"); var utils = require("./browser.utils"); -var styles = [ - "display: none", - "padding: 15px", - "font-family: sans-serif", - "position: fixed", - "font-size: 0.9em", - "z-index: 9999", - "right: 0px", - "top: 0px", - "border-bottom-left-radius: 5px", - "background-color: #1B2032", - "margin: 0", - "color: white", - "text-align: center" -]; +var styles = { + display: "none", + padding: "15px", + fontFamily: "sans-serif", + position: "fixed", + fontSize: "0.9em", + zIndex: 9999, + right: 0, + top: 0, + borderBottomLeftRadius: "5px", + backgroundColor: "#1B2032", + margin: 0, + color: "white", + textAlign: "center" +}; var elem; var options; @@ -34,12 +34,29 @@ exports.init = function (bs) { var cssStyles = styles; if (options.notify.styles) { - cssStyles = options.notify.styles; + + if (Object.prototype.toString.call(options.notify.styles) === "[object Array]") { + // handle original array behavior, replace all styles with a joined copy + cssStyles = options.notify.styles.join(";"); + } else { + for (var key in options.notify.styles) { + if (options.notify.styles.hasOwnProperty(key)) { + cssStyles[key] = options.notify.styles[key]; + } + } + } } elem = document.createElement("DIV"); elem.id = "__bs_notify__"; - elem.style.cssText = cssStyles.join(";"); + + if (typeof cssStyles === "string") { + elem.style.cssText = cssStyles; + } else { + for (var rule in cssStyles) { + elem.style[rule] = cssStyles[rule]; + } + } var flashFn = exports.watchEvent(bs); diff --git a/test/client-new/notify.js b/test/client-new/notify.js index 62379cb..f53fe45 100644 --- a/test/client-new/notify.js +++ b/test/client-new/notify.js @@ -10,7 +10,7 @@ describe("The Notify Element", function() { var expected = "rgb(27, 32, 50)"; assert.equal(actual, expected); }); - it("can be initialised with custom styles", function() { + it("can be initialised with custom styles array", function() { bs.options.notify = { styles: [ @@ -30,6 +30,23 @@ describe("The Notify Element", function() { var expected = "yellow"; assert.equal(actual, expected); }); + it("can be initialised with custom style overrides", function() { + + bs.options.notify = { + styles: { + fontSize: "18px", + backgroundColor: "plum" + } + }; + var elem = notify.init(bs); + var actualFontSize = elem.style.fontSize; + var expectedFontSize = "18px"; + var actualBGColor = elem.style.backgroundColor; + var expectedBGColor = "plum"; + assert.equal(actualFontSize, expectedFontSize); + assert.equal(actualBGColor, expectedBGColor); + }); + it("can return a callback for watching", function(){ var stub = sinon.stub(notify, "flash");