diff --git a/README.md b/README.md index b436c32..17f3b6b 100644 --- a/README.md +++ b/README.md @@ -85,19 +85,24 @@ notie.alert({ notie.force({ type: Number|String, // optional, default = 5, enum: [1, 2, 3, 4, 5, 'success', 'warning', 'error', 'info', 'neutral'] text: String, - buttonText: String // optional, default = 'OK' -}, callback()) + buttonText: String, // optional, default = 'OK' + callback: Function // optional +}, callbackOptional()) notie.confirm({ text: String, - yesText: String, // optional, default = 'Yes' - noText: String // optional, default = 'Cancel' -}, yesCallbackOptional(), noCallbackOptional()) + submitText: String, // optional, default = 'Yes' + cancelText: String, // optional, default = 'Cancel' + submitCallback: Function, // optional + cancelCallback: Function // optional +}, submitCallbackOptional(), cancelCallbackOptional()) notie.input({ text: String, submitText: String, // optional, default = 'Submit' cancelText: String // optional, default = 'Cancel' + submitCallback: Function(value), // optional + cancelCallback: Function(value), // optional autocapitalize: 'words', // default: 'none' autocomplete: 'on', // default: 'off' autocorrect: 'off', // default: 'off' @@ -116,7 +121,8 @@ notie.input({ notie.select({ text: String, - cancelText: String, + cancelText: String, // optional, default = 'Cancel' + cancelCallback: Function, // optional choices: [ { type: Number|String, // optional, default = 1 @@ -125,12 +131,14 @@ notie.select({ } ... ] -}) +}, cancelCallbackOptional()) notie.date({ value: Date, submitText: String, // optional, default = 'OK' - cancelText: String // optional, default = 'Cancel' + cancelText: String, // optional, default = 'Cancel' + submitCallback: Function(date), // optional + cancelCallback: Function(date) // optional }, submitCallbackOptional(date), cancelCallbackOptional(date)) ``` @@ -149,19 +157,20 @@ notie.alert({ type: 'info', text: 'FYI, blah blah blah.' }) notie.force({ type: 3, text: 'You cannot do that, sending you back.', - buttonText: 'OK' -}, function () { - notie.alert({ type: 3, text: 'Maybe when you\'re older...' }) + buttonText: 'OK', + callback: function () { + notie.alert({ type: 3, text: 'Maybe when you\'re older...' }) + } }) notie.confirm({ - text: 'Are you sure you want to do that?', - yesText: 'Yes', - noText: 'Cancel' -}, function () { - notie.alert({ type: 1, text: 'Good choice!' }) -}, function () { - notie.alert({ type: 3, text: 'Aw, why not? :(' }) + text: 'Are you sure you want to do that?
That\'s a bold move...', + cancelCallback: function () { + notie.alert({ type: 3, text: 'Aw, why not? :(', time: 2 }) + }, + submitCallback: function () { + notie.alert({ type: 1, text: 'Good choice! :D', time: 2 }) + } }) notie.confirm({ text: 'Are you sure?' }, function() { notie.confirm({ text: 'Are you really sure?' }, function() { @@ -175,13 +184,15 @@ notie.input({ text: 'Please enter your email:', submitText: 'Submit', cancelText: 'Cancel', + cancelCallback: function (value) { + notie.alert({ type: 3, text: 'You cancelled with this value: ' + value }) + }, + submitCallback: function (value) { + notie.alert({ type: 1, text: 'You entered: ' + value }) + }, value: 'jane@doe.com', type: 'email', placeholder: 'name@example.com' -}, function(value) { - notie.alert({ type: 1, text: 'You entered: ' + value }) -}, function(value) { - notie.alert({ type: 3, text: 'You cancelled with this value: ' + value }) }) notie.input({ @@ -197,18 +208,23 @@ notie.input({ notie.input({ text: 'Please enter the price:', + cancelCallback: function (value) { + notie.alert({ type: 3, text: 'You cancelled with this value: ' + value }) + }, + submitCallback: function (value) { + notie.alert({ type: 1, text: 'You entered: ' + value }) + }, type: 'text', placeholder: '500', allowed: new RegExp('[^0-9]', 'g') -}, function(value) { - notie.alert({ type: 1, text: 'You entered: ' + value }) -}, function(value) { - notie.alert({ type: 3, text: 'You cancelled with this value: ' + value }) }) notie.select({ text: 'Demo item #1, owner is Jane Smith', - cancelText: 'Cancel', + cancelText: 'Close', + cancelCallback: function () { + notie.alert({ type: 5, text: 'Cancel!' }) + }, choices: [ { text: 'Share', @@ -239,15 +255,17 @@ notie.select({ ] }) -notie.date({ - value: new Date(2015, 8, 27), - submitText: 'Submit', - cancelText: 'Cancel' -}, function (date) { - notie.alert({ type: 1, text: 'You selected: ' + date.toISOString() }) -}, function (date) { - notie.alert({ type: 3, text: 'You cancelled: ' + date.toISOString() }) -}) +function date() { + notie.date({ + value: new Date(2015, 8, 27), + cancelCallback: function (date) { + notie.alert({ type: 3, text: 'You cancelled: ' + date.toISOString() }) + }, + submitCallback: function (date) { + notie.alert({ type: 1, text: 'You selected: ' + date.toISOString() }) + } + }) +} ``` #### Use ES6 to inherit `this`: diff --git a/dist/notie.js b/dist/notie.js index 4944fbb..27c858e 100644 --- a/dist/notie.js +++ b/dist/notie.js @@ -180,9 +180,7 @@ var typeToClassLookup = { neutral: options.classes.backgroundNeutral }; -var getTransitionStyle = function getTransitionStyle() { - return options.transitionSelector + ' ' + options.transitionDuration + 's ' + options.transitionCurve; -}; +var transitionFull = options.transitionSelector + ' ' + options.transitionDuration + 's ' + options.transitionCurve; var enterClicked = function enterClicked(event) { return event.keyCode === 13; @@ -202,7 +200,7 @@ var addToDocument = function addToDocument(element) { if (element.listener) window.addEventListener('keydown', element.listener); tick().then(function () { - element.style.transition = getTransitionStyle(); + element.style.transition = transitionFull; element.style[from] = 0; }); }; @@ -237,7 +235,7 @@ var addOverlayToDocument = function addOverlayToDocument(owner, from) { document.body.appendChild(element); tick().then(function () { - element.style.transition = getTransitionStyle(); + element.style.transition = transitionFull; element.style.opacity = options.overlayOpacity; }); }; @@ -302,12 +300,13 @@ var alert = exports.alert = function alert(_ref) { }); }; -var force = exports.force = function force(_ref2, callback) { +var force = exports.force = function force(_ref2, callbackArg) { var _ref2$type = _ref2.type, type = _ref2$type === undefined ? 5 : _ref2$type, text = _ref2.text, _ref2$buttonText = _ref2.buttonText, - buttonText = _ref2$buttonText === undefined ? 'OK' : _ref2$buttonText; + buttonText = _ref2$buttonText === undefined ? 'OK' : _ref2$buttonText, + callback = _ref2.callback; blur(); hideAlerts(); @@ -316,10 +315,10 @@ var force = exports.force = function force(_ref2, callback) { var id = generateRandomId(); element.id = id; - var elementMessage = document.createElement('div'); - elementMessage.classList.add(options.classes.textbox); - elementMessage.classList.add(options.classes.backgroundInfo); - elementMessage.innerHTML = '
' + text + '
'; + var elementText = document.createElement('div'); + elementText.classList.add(options.classes.textbox); + elementText.classList.add(options.classes.backgroundInfo); + elementText.innerHTML = '
' + text + '
'; var elementButton = document.createElement('div'); elementButton.classList.add(options.classes.button); @@ -328,10 +327,10 @@ var force = exports.force = function force(_ref2, callback) { elementButton.onclick = function () { removeFromDocument(id); removeOverlayFromDocument(); - if (callback) callback(); + if (callback) callback();else if (callbackArg) callbackArg(); }; - element.appendChild(elementMessage); + element.appendChild(elementText); element.appendChild(elementButton); element.listener = function (event) { @@ -343,12 +342,14 @@ var force = exports.force = function force(_ref2, callback) { addOverlayToDocument(); }; -var confirm = exports.confirm = function confirm(_ref3, yesCallback, noCallback) { +var confirm = exports.confirm = function confirm(_ref3, submitCallbackArg, cancelCallbackArg) { var text = _ref3.text, - _ref3$yesText = _ref3.yesText, - yesText = _ref3$yesText === undefined ? 'Yes' : _ref3$yesText, - _ref3$noText = _ref3.noText, - noText = _ref3$noText === undefined ? 'Cancel' : _ref3$noText; + _ref3$submitText = _ref3.submitText, + submitText = _ref3$submitText === undefined ? 'Yes' : _ref3$submitText, + _ref3$cancelText = _ref3.cancelText, + cancelText = _ref3$cancelText === undefined ? 'Cancel' : _ref3$cancelText, + submitCallback = _ref3.submitCallback, + cancelCallback = _ref3.cancelCallback; blur(); hideAlerts(); @@ -357,34 +358,34 @@ var confirm = exports.confirm = function confirm(_ref3, yesCallback, noCallback) var id = generateRandomId(); element.id = id; - var elementMessage = document.createElement('div'); - elementMessage.classList.add(options.classes.textbox); - elementMessage.classList.add(options.classes.backgroundInfo); - elementMessage.innerHTML = '
' + text + '
'; + var elementText = document.createElement('div'); + elementText.classList.add(options.classes.textbox); + elementText.classList.add(options.classes.backgroundInfo); + elementText.innerHTML = '
' + text + '
'; var elementButtonLeft = document.createElement('div'); elementButtonLeft.classList.add(options.classes.button); elementButtonLeft.classList.add(options.classes.elementHalf); elementButtonLeft.classList.add(options.classes.backgroundSuccess); - elementButtonLeft.innerHTML = yesText; + elementButtonLeft.innerHTML = submitText; elementButtonLeft.onclick = function () { removeFromDocument(id); removeOverlayFromDocument(); - if (yesCallback) yesCallback(); + if (submitCallback) submitCallback();else if (submitCallbackArg) submitCallbackArg(); }; var elementButtonRight = document.createElement('div'); elementButtonRight.classList.add(options.classes.button); elementButtonRight.classList.add(options.classes.elementHalf); elementButtonRight.classList.add(options.classes.backgroundError); - elementButtonRight.innerHTML = noText; + elementButtonRight.innerHTML = cancelText; elementButtonRight.onclick = function () { removeFromDocument(id); removeOverlayFromDocument(); - if (noCallback) noCallback(); + if (cancelCallback) cancelCallback();else if (cancelCallbackArg) cancelCallbackArg(); }; - element.appendChild(elementMessage); + element.appendChild(elementText); element.appendChild(elementButtonLeft); element.appendChild(elementButtonRight); @@ -397,13 +398,15 @@ var confirm = exports.confirm = function confirm(_ref3, yesCallback, noCallback) addOverlayToDocument(element); }; -var input = function input(_ref4, submitCallback, cancelCallback) { +var input = function input(_ref4, submitCallbackArg, cancelCallbackArg) { var text = _ref4.text, _ref4$submitText = _ref4.submitText, submitText = _ref4$submitText === undefined ? 'Submit' : _ref4$submitText, _ref4$cancelText = _ref4.cancelText, cancelText = _ref4$cancelText === undefined ? 'Cancel' : _ref4$cancelText, - settings = _objectWithoutProperties(_ref4, ['text', 'submitText', 'cancelText']); + submitCallback = _ref4.submitCallback, + cancelCallback = _ref4.cancelCallback, + settings = _objectWithoutProperties(_ref4, ['text', 'submitText', 'cancelText', 'submitCallback', 'cancelCallback']); blur(); hideAlerts(); @@ -412,10 +415,10 @@ var input = function input(_ref4, submitCallback, cancelCallback) { var id = generateRandomId(); element.id = id; - var elementMessage = document.createElement('div'); - elementMessage.classList.add(options.classes.textbox); - elementMessage.classList.add(options.classes.backgroundInfo); - elementMessage.innerHTML = '
' + text + '
'; + var elementText = document.createElement('div'); + elementText.classList.add(options.classes.textbox); + elementText.classList.add(options.classes.backgroundInfo); + elementText.innerHTML = '
' + text + '
'; var elementInput = document.createElement('input'); elementInput.classList.add(options.classes.inputField); @@ -463,7 +466,7 @@ var input = function input(_ref4, submitCallback, cancelCallback) { elementButtonLeft.onclick = function () { removeFromDocument(id); removeOverlayFromDocument(); - if (submitCallback) submitCallback(elementInput.value); + if (submitCallback) submitCallback(elementInput.value);else if (submitCallbackArg) submitCallbackArg(elementInput.value); }; var elementButtonRight = document.createElement('div'); @@ -474,10 +477,10 @@ var input = function input(_ref4, submitCallback, cancelCallback) { elementButtonRight.onclick = function () { removeFromDocument(id); removeOverlayFromDocument(); - if (cancelCallback) cancelCallback(elementInput.value); + if (cancelCallback) cancelCallback(elementInput.value);else if (cancelCallbackArg) cancelCallbackArg(elementInput.value); }; - element.appendChild(elementMessage); + element.appendChild(elementText); element.appendChild(elementInput); element.appendChild(elementButtonLeft); element.appendChild(elementButtonRight); @@ -494,10 +497,11 @@ var input = function input(_ref4, submitCallback, cancelCallback) { }; exports.input = input; -var select = exports.select = function select(_ref5) { +var select = exports.select = function select(_ref5, cancelCallbackArg) { var text = _ref5.text, _ref5$cancelText = _ref5.cancelText, cancelText = _ref5$cancelText === undefined ? 'Cancel' : _ref5$cancelText, + cancelCallback = _ref5.cancelCallback, choices = _ref5.choices; blur(); @@ -509,12 +513,12 @@ var select = exports.select = function select(_ref5) { var id = generateRandomId(); element.id = id; - var elementMessage = document.createElement('div'); - elementMessage.classList.add(options.classes.textbox); - elementMessage.classList.add(options.classes.backgroundInfo); - elementMessage.innerHTML = '
' + text + '
'; + var elementText = document.createElement('div'); + elementText.classList.add(options.classes.textbox); + elementText.classList.add(options.classes.backgroundInfo); + elementText.innerHTML = '
' + text + '
'; - element.appendChild(elementMessage); + element.appendChild(elementText); choices.forEach(function (_ref6, index) { var _ref6$type = _ref6.type, @@ -550,6 +554,7 @@ var select = exports.select = function select(_ref5) { elementCancel.onclick = function () { removeFromDocument(id, from); removeOverlayFromDocument(); + if (cancelCallback) cancelCallback();else if (cancelCallbackArg) cancelCallbackArg(); }; element.appendChild(elementCancel); @@ -563,13 +568,15 @@ var select = exports.select = function select(_ref5) { addOverlayToDocument(element, from); }; -var date = exports.date = function date(_ref7, submitCallback, cancelCallback) { +var date = exports.date = function date(_ref7, submitCallbackArg, cancelCallbackArg) { var _ref7$value = _ref7.value, value = _ref7$value === undefined ? new Date() : _ref7$value, _ref7$submitText = _ref7.submitText, submitText = _ref7$submitText === undefined ? 'OK' : _ref7$submitText, _ref7$cancelText = _ref7.cancelText, - cancelText = _ref7$cancelText === undefined ? 'Cancel' : _ref7$cancelText; + cancelText = _ref7$cancelText === undefined ? 'Cancel' : _ref7$cancelText, + submitCallback = _ref7.submitCallback, + cancelCallback = _ref7.cancelCallback; blur(); hideAlerts(); @@ -678,7 +685,7 @@ var date = exports.date = function date(_ref7, submitCallback, cancelCallback) { elementButtonLeft.onclick = function () { removeFromDocument(id); removeOverlayFromDocument(); - if (submitCallback) submitCallback(value); + if (submitCallback) submitCallback(value);else if (submitCallbackArg) submitCallbackArg(value); }; var elementButtonRight = document.createElement('div'); @@ -689,7 +696,7 @@ var date = exports.date = function date(_ref7, submitCallback, cancelCallback) { elementButtonRight.onclick = function () { removeFromDocument(id); removeOverlayFromDocument(); - if (cancelCallback) cancelCallback(value); + if (cancelCallback) cancelCallback(value);else if (cancelCallbackArg) cancelCallbackArg(value); }; elementDateSelectorInner.appendChild(elementDateUpMonth); diff --git a/dist/notie.min.js b/dist/notie.min.js index 5aaf416..ebd413c 100644 --- a/dist/notie.min.js +++ b/dist/notie.min.js @@ -1 +1 @@ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.notie=t():e.notie=t()}(this,function(){return function(e){function t(s){if(n[s])return n[s].exports;var a=n[s]={i:s,l:!1,exports:{}};return e[s].call(a.exports,a,a.exports,t),a.l=!0,a.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,s){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:s})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=1)}([function(e,t){e.exports=function(e){return e.webpackPolyfill||(e.deprecate=function(){},e.paths=[],e.children||(e.children=[]),Object.defineProperty(e,"loaded",{enumerable:!0,get:function(){return e.l}}),Object.defineProperty(e,"id",{enumerable:!0,get:function(){return e.i}}),e.webpackPolyfill=1),e}},function(e,t,n){"use strict";(function(e){var n,s,a,c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e};!function(i,o){"object"===c(t)&&"object"===c(e)?e.exports=o():(s=[],n=o,a="function"==typeof n?n.apply(t,s):n,!(void 0!==a&&(e.exports=a)))}(void 0,function(){return function(e){function t(s){if(n[s])return n[s].exports;var a=n[s]={i:s,l:!1,exports:{}};return e[s].call(a.exports,a,a.exports,t),a.l=!0,a.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,s){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:s})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,n){function s(e,t){var n={};for(var s in e)t.indexOf(s)>=0||Object.prototype.hasOwnProperty.call(e,s)&&(n[s]=e[s]);return n}Object.defineProperty(t,"__esModule",{value:!0});var a="function"==typeof Symbol&&"symbol"===c(Symbol.iterator)?function(e){return"undefined"==typeof e?"undefined":c(e)}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":"undefined"==typeof e?"undefined":c(e)},i=Object.assign||function(e){for(var t=1;t1&&void 0!==arguments[1]?arguments[1]:"top";e.classList.add(o.classes.container),e.style[t]="-10000px",document.body.appendChild(e),e.style[t]="-"+e.offsetHeight+"px",e.listener&&window.addEventListener("keydown",e.listener),l().then(function(){e.style.transition=m(),e.style[t]=0})},y=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"top",n=document.getElementById(e);n&&(n.style[t]="-"+n.offsetHeight+"px",n.listener&&window.removeEventListener("keydown",n.listener),d(o.transitionDuration).then(function(){n.parentNode&&n.parentNode.removeChild(n)}))},L=function(e,t){var n=document.createElement("div");n.id=o.ids.overlay,n.classList.add(o.classes.overlay),n.classList.add(o.classes.backgroundOverlay),n.style.opacity=0,e&&o.overlayClickDismiss&&(n.onclick=function(){y(e.id,t),h()}),document.body.appendChild(n),l().then(function(){n.style.transition=m(),n.style.opacity=o.overlayOpacity})},h=function(){var e=document.getElementById(o.ids.overlay);e.style.opacity=0,d(o.transitionDuration).then(function(){e.parentNode&&e.parentNode.removeChild(e)})},g=t.hideAlerts=function(e){var t=document.getElementsByClassName(o.classes.alert);if(t.length){for(var n=0;n'+s+"",l.onclick=function(){return y(m)},l.listener=function(e){(v(e)||b(e))&&g()},x(l),c&&c<1&&(c=1),!r&&c&&d(c).then(function(){return y(m)})},T=t.force=function(e,t){var n=e.type,s=void 0===n?5:n,a=e.text,c=e.buttonText,i=void 0===c?"OK":c;u(),g();var r=document.createElement("div"),l=f();r.id=l;var d=document.createElement("div");d.classList.add(o.classes.textbox),d.classList.add(o.classes.backgroundInfo),d.innerHTML='
'+a+"
";var m=document.createElement("div");m.classList.add(o.classes.button),m.classList.add(p[s]),m.innerHTML=i,m.onclick=function(){y(l),h(),t&&t()},r.appendChild(d),r.appendChild(m),r.listener=function(e){v(e)&&m.click()},x(r),L()},E=t.confirm=function(e,t,n){var s=e.text,a=e.yesText,c=void 0===a?"Yes":a,i=e.noText,r=void 0===i?"Cancel":i;u(),g();var l=document.createElement("div"),d=f();l.id=d;var p=document.createElement("div");p.classList.add(o.classes.textbox),p.classList.add(o.classes.backgroundInfo),p.innerHTML='
'+s+"
";var m=document.createElement("div");m.classList.add(o.classes.button),m.classList.add(o.classes.elementHalf),m.classList.add(o.classes.backgroundSuccess),m.innerHTML=c,m.onclick=function(){y(d),h(),t&&t()};var k=document.createElement("div");k.classList.add(o.classes.button),k.classList.add(o.classes.elementHalf),k.classList.add(o.classes.backgroundError),k.innerHTML=r,k.onclick=function(){y(d),h(),n&&n()},l.appendChild(p),l.appendChild(m),l.appendChild(k),l.listener=function(e){v(e)?m.click():b(e)&&k.click()},x(l),L(l)},C=function(e,t,n){var c=e.text,i=e.submitText,r=void 0===i?"Submit":i,l=e.cancelText,d=void 0===l?"Cancel":l,p=s(e,["text","submitText","cancelText"]);u(),g();var m=document.createElement("div"),k=f();m.id=k;var T=document.createElement("div");T.classList.add(o.classes.textbox),T.classList.add(o.classes.backgroundInfo),T.innerHTML='
'+c+"
";var E=document.createElement("input");E.classList.add(o.classes.inputField),E.setAttribute("autocapitalize",p.autocapitalize||"none"),E.setAttribute("autocomplete",p.autocomplete||"off"),E.setAttribute("autocorrect",p.autocorrect||"off"),E.setAttribute("autofocus",p.autofocus||"true"),E.setAttribute("inputmode",p.inputmode||"verbatim"),E.setAttribute("max",p.max||""),E.setAttribute("maxlength",p.maxlength||""),E.setAttribute("min",p.min||""),E.setAttribute("minlength",p.minlength||""),E.setAttribute("placeholder",p.placeholder||""),E.setAttribute("spellcheck",p.spellcheck||"default"),E.setAttribute("step",p.step||"any"),E.setAttribute("type",p.type||"text"),E.value=p.value||"",p.allowed&&(E.oninput=function(){var e=void 0;if(Array.isArray(p.allowed)){for(var t="",n=p.allowed,s=0;s'+t+"",i.appendChild(l),a.forEach(function(e,t){var n=e.type,s=void 0===n?1:n,l=e.text,d=e.handler,u=document.createElement("div");u.classList.add(p[s]),u.classList.add(o.classes.button),u.classList.add(o.classes.selectChoice);var f=a[t+1];f&&!f.type&&(f.type=1),f&&f.type===s&&u.classList.add(o.classes.selectChoiceRepeated),u.innerHTML=l,u.onclick=function(){y(r,c),h(),d()},i.appendChild(u)});var d=document.createElement("div");d.classList.add(o.classes.backgroundNeutral),d.classList.add(o.classes.button),d.innerHTML=s,d.onclick=function(){y(r,c),h()},i.appendChild(d),i.listener=function(e){b(e)&&d.click()},x(i,c),L(i,c)},H=t.date=function(e,t,n){var s=e.value,a=void 0===s?new Date:s,c=e.submitText,i=void 0===c?"OK":c,r=e.cancelText,l=void 0===r?"Cancel":r;u(),g();var d="▾",p=document.createElement("div"),m=f();p.id=m;var k=document.createElement("div");k.classList.add(o.classes.backgroundInfo);var T=document.createElement("div");T.classList.add(o.classes.dateSelectorInner);var E=document.createElement("div");E.classList.add(o.classes.button),E.classList.add(o.classes.elementThird),E.classList.add(o.classes.dateSelectorUp),E.innerHTML=d;var C=document.createElement("div");C.classList.add(o.classes.button),C.classList.add(o.classes.elementThird),C.classList.add(o.classes.dateSelectorUp),C.innerHTML=d;var M=document.createElement("div");M.classList.add(o.classes.button),M.classList.add(o.classes.elementThird),M.classList.add(o.classes.dateSelectorUp),M.innerHTML=d;var H=document.createElement("div");H.classList.add(o.classes.element),H.classList.add(o.classes.elementThird),H.innerHTML=o.dateMonths[a.getMonth()];var S=document.createElement("div");S.classList.add(o.classes.element),S.classList.add(o.classes.elementThird),S.innerHTML=a.getDate();var O=document.createElement("div");O.classList.add(o.classes.element),O.classList.add(o.classes.elementThird),O.innerHTML=a.getFullYear();var w=document.createElement("div");w.classList.add(o.classes.button),w.classList.add(o.classes.elementThird),w.innerHTML=d;var A=document.createElement("div");A.classList.add(o.classes.button),A.classList.add(o.classes.elementThird),A.innerHTML=d;var I=document.createElement("div");I.classList.add(o.classes.button),I.classList.add(o.classes.elementThird),I.innerHTML=d;var j=function(e){H.innerHTML=o.dateMonths[e.getMonth()],S.innerHTML=e.getDate(),O.innerHTML=e.getFullYear()};E.onclick=function(){a.setMonth(a.getMonth()-1),j(a)},C.onclick=function(){a.setDate(a.getDate()-1),j(a)},M.onclick=function(){a.setFullYear(a.getFullYear()-1),j(a)},w.onclick=function(){a.setMonth(a.getMonth()+1),j(a)},A.onclick=function(){a.setDate(a.getDate()+1),j(a)},I.onclick=function(){a.setFullYear(a.getFullYear()+1),j(a)};var D=document.createElement("div");D.classList.add(o.classes.button),D.classList.add(o.classes.elementHalf),D.classList.add(o.classes.backgroundSuccess),D.innerHTML=i,D.onclick=function(){y(m),h(),t&&t(a)};var P=document.createElement("div");P.classList.add(o.classes.button),P.classList.add(o.classes.elementHalf),P.classList.add(o.classes.backgroundError),P.innerHTML=l,P.onclick=function(){y(m),h(),n&&n(a)},T.appendChild(E),T.appendChild(C),T.appendChild(M),T.appendChild(H),T.appendChild(S),T.appendChild(O),T.appendChild(w),T.appendChild(A),T.appendChild(I),k.appendChild(T),p.appendChild(k),p.appendChild(D),p.appendChild(P),p.listener=function(e){v(e)?D.click():b(e)&&P.click()},x(p),L(p)};t.default={alert:k,force:T,confirm:E,input:C,select:M,date:H,setOptions:r,hideAlerts:g}}])})}).call(t,n(0)(e))}])}); \ No newline at end of file +!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.notie=t():e.notie=t()}(this,function(){return function(e){function t(s){if(n[s])return n[s].exports;var a=n[s]={i:s,l:!1,exports:{}};return e[s].call(a.exports,a,a.exports,t),a.l=!0,a.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,s){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:s})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=1)}([function(e,t){e.exports=function(e){return e.webpackPolyfill||(e.deprecate=function(){},e.paths=[],e.children||(e.children=[]),Object.defineProperty(e,"loaded",{enumerable:!0,get:function(){return e.l}}),Object.defineProperty(e,"id",{enumerable:!0,get:function(){return e.i}}),e.webpackPolyfill=1),e}},function(e,t,n){"use strict";(function(e){var n,s,a,c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e};!function(i,l){"object"===c(t)&&"object"===c(e)?e.exports=l():(s=[],n=l,a="function"==typeof n?n.apply(t,s):n,!(void 0!==a&&(e.exports=a)))}(void 0,function(){return function(e){function t(s){if(n[s])return n[s].exports;var a=n[s]={i:s,l:!1,exports:{}};return e[s].call(a.exports,a,a.exports,t),a.l=!0,a.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,s){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:s})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,n){function s(e,t){var n={};for(var s in e)t.indexOf(s)>=0||Object.prototype.hasOwnProperty.call(e,s)&&(n[s]=e[s]);return n}Object.defineProperty(t,"__esModule",{value:!0});var a="function"==typeof Symbol&&"symbol"===c(Symbol.iterator)?function(e){return"undefined"==typeof e?"undefined":c(e)}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":"undefined"==typeof e?"undefined":c(e)},i=Object.assign||function(e){for(var t=1;t1&&void 0!==arguments[1]?arguments[1]:"top";e.classList.add(l.classes.container),e.style[t]="-10000px",document.body.appendChild(e),e.style[t]="-"+e.offsetHeight+"px",e.listener&&window.addEventListener("keydown",e.listener),r().then(function(){e.style.transition=m,e.style[t]=0})},y=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"top",n=document.getElementById(e);n&&(n.style[t]="-"+n.offsetHeight+"px",n.listener&&window.removeEventListener("keydown",n.listener),d(l.transitionDuration).then(function(){n.parentNode&&n.parentNode.removeChild(n)}))},L=function(e,t){var n=document.createElement("div");n.id=l.ids.overlay,n.classList.add(l.classes.overlay),n.classList.add(l.classes.backgroundOverlay),n.style.opacity=0,e&&l.overlayClickDismiss&&(n.onclick=function(){y(e.id,t),h()}),document.body.appendChild(n),r().then(function(){n.style.transition=m,n.style.opacity=l.overlayOpacity})},h=function(){var e=document.getElementById(l.ids.overlay);e.style.opacity=0,d(l.transitionDuration).then(function(){e.parentNode&&e.parentNode.removeChild(e)})},k=t.hideAlerts=function(e){var t=document.getElementsByClassName(l.classes.alert);if(t.length){for(var n=0;n'+s+"",r.onclick=function(){return y(m)},r.listener=function(e){(v(e)||b(e))&&k()},x(r),c&&c<1&&(c=1),!o&&c&&d(c).then(function(){return y(m)})},C=t.force=function(e,t){var n=e.type,s=void 0===n?5:n,a=e.text,c=e.buttonText,i=void 0===c?"OK":c,o=e.callback;u(),k();var r=document.createElement("div"),d=f();r.id=d;var m=document.createElement("div");m.classList.add(l.classes.textbox),m.classList.add(l.classes.backgroundInfo),m.innerHTML='
'+a+"
";var b=document.createElement("div");b.classList.add(l.classes.button),b.classList.add(p[s]),b.innerHTML=i,b.onclick=function(){y(d),h(),o?o():t&&t()},r.appendChild(m),r.appendChild(b),r.listener=function(e){v(e)&&b.click()},x(r),L()},T=t.confirm=function(e,t,n){var s=e.text,a=e.submitText,c=void 0===a?"Yes":a,i=e.cancelText,o=void 0===i?"Cancel":i,r=e.submitCallback,d=e.cancelCallback;u(),k();var p=document.createElement("div"),m=f();p.id=m;var g=document.createElement("div");g.classList.add(l.classes.textbox),g.classList.add(l.classes.backgroundInfo),g.innerHTML='
'+s+"
";var C=document.createElement("div");C.classList.add(l.classes.button),C.classList.add(l.classes.elementHalf),C.classList.add(l.classes.backgroundSuccess),C.innerHTML=c,C.onclick=function(){y(m),h(),r?r():t&&t()};var T=document.createElement("div");T.classList.add(l.classes.button),T.classList.add(l.classes.elementHalf),T.classList.add(l.classes.backgroundError),T.innerHTML=o,T.onclick=function(){y(m),h(),d?d():n&&n()},p.appendChild(g),p.appendChild(C),p.appendChild(T),p.listener=function(e){v(e)?C.click():b(e)&&T.click()},x(p),L(p)},E=function(e,t,n){var c=e.text,i=e.submitText,o=void 0===i?"Submit":i,r=e.cancelText,d=void 0===r?"Cancel":r,p=e.submitCallback,m=e.cancelCallback,g=s(e,["text","submitText","cancelText","submitCallback","cancelCallback"]);u(),k();var C=document.createElement("div"),T=f();C.id=T;var E=document.createElement("div");E.classList.add(l.classes.textbox),E.classList.add(l.classes.backgroundInfo),E.innerHTML='
'+c+"
";var M=document.createElement("input");M.classList.add(l.classes.inputField),M.setAttribute("autocapitalize",g.autocapitalize||"none"),M.setAttribute("autocomplete",g.autocomplete||"off"),M.setAttribute("autocorrect",g.autocorrect||"off"),M.setAttribute("autofocus",g.autofocus||"true"),M.setAttribute("inputmode",g.inputmode||"verbatim"),M.setAttribute("max",g.max||""),M.setAttribute("maxlength",g.maxlength||""),M.setAttribute("min",g.min||""),M.setAttribute("minlength",g.minlength||""),M.setAttribute("placeholder",g.placeholder||""),M.setAttribute("spellcheck",g.spellcheck||"default"),M.setAttribute("step",g.step||"any"),M.setAttribute("type",g.type||"text"),M.value=g.value||"",g.allowed&&(M.oninput=function(){var e=void 0;if(Array.isArray(g.allowed)){for(var t="",n=g.allowed,s=0;s'+n+"",r.appendChild(m),i.forEach(function(e,t){var n=e.type,s=void 0===n?1:n,a=e.text,c=e.handler,u=document.createElement("div");u.classList.add(p[s]),u.classList.add(l.classes.button),u.classList.add(l.classes.selectChoice);var f=i[t+1];f&&!f.type&&(f.type=1),f&&f.type===s&&u.classList.add(l.classes.selectChoiceRepeated),u.innerHTML=a,u.onclick=function(){y(d,o),h(),c()},r.appendChild(u)});var v=document.createElement("div");v.classList.add(l.classes.backgroundNeutral),v.classList.add(l.classes.button),v.innerHTML=a,v.onclick=function(){y(d,o),h(),c?c():t&&t()},r.appendChild(v),r.listener=function(e){b(e)&&v.click()},x(r,o),L(r,o)},H=t.date=function(e,t,n){var s=e.value,a=void 0===s?new Date:s,c=e.submitText,i=void 0===c?"OK":c,o=e.cancelText,r=void 0===o?"Cancel":o,d=e.submitCallback,p=e.cancelCallback;u(),k();var m="▾",g=document.createElement("div"),C=f();g.id=C;var T=document.createElement("div");T.classList.add(l.classes.backgroundInfo);var E=document.createElement("div");E.classList.add(l.classes.dateSelectorInner);var M=document.createElement("div");M.classList.add(l.classes.button),M.classList.add(l.classes.elementThird),M.classList.add(l.classes.dateSelectorUp),M.innerHTML=m;var H=document.createElement("div");H.classList.add(l.classes.button),H.classList.add(l.classes.elementThird),H.classList.add(l.classes.dateSelectorUp),H.innerHTML=m;var S=document.createElement("div");S.classList.add(l.classes.button),S.classList.add(l.classes.elementThird),S.classList.add(l.classes.dateSelectorUp),S.innerHTML=m;var O=document.createElement("div");O.classList.add(l.classes.element),O.classList.add(l.classes.elementThird),O.innerHTML=l.dateMonths[a.getMonth()];var w=document.createElement("div");w.classList.add(l.classes.element),w.classList.add(l.classes.elementThird),w.innerHTML=a.getDate();var A=document.createElement("div");A.classList.add(l.classes.element),A.classList.add(l.classes.elementThird),A.innerHTML=a.getFullYear();var I=document.createElement("div");I.classList.add(l.classes.button),I.classList.add(l.classes.elementThird),I.innerHTML=m;var j=document.createElement("div");j.classList.add(l.classes.button),j.classList.add(l.classes.elementThird),j.innerHTML=m;var D=document.createElement("div");D.classList.add(l.classes.button),D.classList.add(l.classes.elementThird),D.innerHTML=m;var P=function(e){O.innerHTML=l.dateMonths[e.getMonth()],w.innerHTML=e.getDate(),A.innerHTML=e.getFullYear()};M.onclick=function(){a.setMonth(a.getMonth()-1),P(a)},H.onclick=function(){a.setDate(a.getDate()-1),P(a)},S.onclick=function(){a.setFullYear(a.getFullYear()-1),P(a)},I.onclick=function(){a.setMonth(a.getMonth()+1),P(a)},j.onclick=function(){a.setDate(a.getDate()+1),P(a)},D.onclick=function(){a.setFullYear(a.getFullYear()+1),P(a)};var N=document.createElement("div");N.classList.add(l.classes.button),N.classList.add(l.classes.elementHalf),N.classList.add(l.classes.backgroundSuccess),N.innerHTML=i,N.onclick=function(){y(C),h(),d?d(a):t&&t(a)};var F=document.createElement("div");F.classList.add(l.classes.button),F.classList.add(l.classes.elementHalf),F.classList.add(l.classes.backgroundError),F.innerHTML=r,F.onclick=function(){y(C),h(),p?p(a):n&&n(a)},E.appendChild(M),E.appendChild(H),E.appendChild(S),E.appendChild(O),E.appendChild(w),E.appendChild(A),E.appendChild(I),E.appendChild(j),E.appendChild(D),T.appendChild(E),g.appendChild(T),g.appendChild(N),g.appendChild(F),g.listener=function(e){v(e)?N.click():b(e)&&F.click()},x(g),L(g)};t.default={alert:g,force:C,confirm:T,input:E,select:M,date:H,setOptions:o,hideAlerts:k}}])})}).call(t,n(0)(e))}])}); \ No newline at end of file diff --git a/src/notie.js b/src/notie.js index 2547de8..cb5dcd7 100644 --- a/src/notie.js +++ b/src/notie.js @@ -4,7 +4,8 @@ let options = { alertTime: 3, - dateMonths: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'], + dateMonths: ['January', 'February', 'March', 'April', 'May', 'June', + 'July', 'August', 'September', 'October', 'November', 'December'], overlayClickDismiss: true, overlayOpacity: 0.75, transitionCurve: 'ease', @@ -79,9 +80,7 @@ const typeToClassLookup = { neutral: options.classes.backgroundNeutral } -const getTransitionStyle = () => ( - `${options.transitionSelector} ${options.transitionDuration}s ${options.transitionCurve}` -) +const transitionFull = `${options.transitionSelector} ${options.transitionDuration}s ${options.transitionCurve}` const enterClicked = event => event.keyCode === 13 const escapeClicked = event => event.keyCode === 27 @@ -95,7 +94,7 @@ const addToDocument = (element, from = 'top') => { if (element.listener) window.addEventListener('keydown', element.listener) tick().then(() => { - element.style.transition = getTransitionStyle() + element.style.transition = transitionFull element.style[from] = 0 }) } @@ -128,7 +127,7 @@ const addOverlayToDocument = (owner, from) => { document.body.appendChild(element) tick().then(() => { - element.style.transition = getTransitionStyle() + element.style.transition = transitionFull element.style.opacity = options.overlayOpacity }) } @@ -156,7 +155,12 @@ export const hideAlerts = callback => { // exports // ==================== -export const alert = ({ type = 4, text, time = options.alertTime, stay = false }) => { +export const alert = ({ + type = 4, + text, + time = options.alertTime, + stay = false +}) => { blur() hideAlerts() @@ -179,7 +183,12 @@ export const alert = ({ type = 4, text, time = options.alertTime, stay = false } if (!stay && time) wait(time).then(() => removeFromDocument(id)) } -export const force = ({ type = 5, text, buttonText = 'OK' }, callback) => { +export const force = ({ + type = 5, + text, + buttonText = 'OK', + callback +}, callbackArg) => { blur() hideAlerts() @@ -187,10 +196,10 @@ export const force = ({ type = 5, text, buttonText = 'OK' }, callback) => { const id = generateRandomId() element.id = id - const elementMessage = document.createElement('div') - elementMessage.classList.add(options.classes.textbox) - elementMessage.classList.add(options.classes.backgroundInfo) - elementMessage.innerHTML = `
${text}
` + const elementText = document.createElement('div') + elementText.classList.add(options.classes.textbox) + elementText.classList.add(options.classes.backgroundInfo) + elementText.innerHTML = `
${text}
` const elementButton = document.createElement('div') elementButton.classList.add(options.classes.button) @@ -200,9 +209,10 @@ export const force = ({ type = 5, text, buttonText = 'OK' }, callback) => { removeFromDocument(id) removeOverlayFromDocument() if (callback) callback() + else if (callbackArg) callbackArg() } - element.appendChild(elementMessage) + element.appendChild(elementText) element.appendChild(elementButton) element.listener = event => { @@ -214,7 +224,13 @@ export const force = ({ type = 5, text, buttonText = 'OK' }, callback) => { addOverlayToDocument() } -export const confirm = ({ text, yesText = 'Yes', noText = 'Cancel' }, yesCallback, noCallback) => { +export const confirm = ({ + text, + submitText = 'Yes', + cancelText = 'Cancel', + submitCallback, + cancelCallback +}, submitCallbackArg, cancelCallbackArg) => { blur() hideAlerts() @@ -222,34 +238,36 @@ export const confirm = ({ text, yesText = 'Yes', noText = 'Cancel' }, yesCallbac const id = generateRandomId() element.id = id - const elementMessage = document.createElement('div') - elementMessage.classList.add(options.classes.textbox) - elementMessage.classList.add(options.classes.backgroundInfo) - elementMessage.innerHTML = `
${text}
` + const elementText = document.createElement('div') + elementText.classList.add(options.classes.textbox) + elementText.classList.add(options.classes.backgroundInfo) + elementText.innerHTML = `
${text}
` const elementButtonLeft = document.createElement('div') elementButtonLeft.classList.add(options.classes.button) elementButtonLeft.classList.add(options.classes.elementHalf) elementButtonLeft.classList.add(options.classes.backgroundSuccess) - elementButtonLeft.innerHTML = yesText + elementButtonLeft.innerHTML = submitText elementButtonLeft.onclick = () => { removeFromDocument(id) removeOverlayFromDocument() - if (yesCallback) yesCallback() + if (submitCallback) submitCallback() + else if (submitCallbackArg) submitCallbackArg() } const elementButtonRight = document.createElement('div') elementButtonRight.classList.add(options.classes.button) elementButtonRight.classList.add(options.classes.elementHalf) elementButtonRight.classList.add(options.classes.backgroundError) - elementButtonRight.innerHTML = noText + elementButtonRight.innerHTML = cancelText elementButtonRight.onclick = () => { removeFromDocument(id) removeOverlayFromDocument() - if (noCallback) noCallback() + if (cancelCallback) cancelCallback() + else if (cancelCallbackArg) cancelCallbackArg() } - element.appendChild(elementMessage) + element.appendChild(elementText) element.appendChild(elementButtonLeft) element.appendChild(elementButtonRight) @@ -263,7 +281,14 @@ export const confirm = ({ text, yesText = 'Yes', noText = 'Cancel' }, yesCallbac addOverlayToDocument(element) } -export const input = ({ text, submitText = 'Submit', cancelText = 'Cancel', ...settings }, submitCallback, cancelCallback) => { +export const input = ({ + text, + submitText = 'Submit', + cancelText = 'Cancel', + submitCallback, + cancelCallback, + ...settings +}, submitCallbackArg, cancelCallbackArg) => { blur() hideAlerts() @@ -271,10 +296,10 @@ export const input = ({ text, submitText = 'Submit', cancelText = 'Cancel', ...s const id = generateRandomId() element.id = id - const elementMessage = document.createElement('div') - elementMessage.classList.add(options.classes.textbox) - elementMessage.classList.add(options.classes.backgroundInfo) - elementMessage.innerHTML = `
${text}
` + const elementText = document.createElement('div') + elementText.classList.add(options.classes.textbox) + elementText.classList.add(options.classes.backgroundInfo) + elementText.innerHTML = `
${text}
` const elementInput = document.createElement('input') elementInput.classList.add(options.classes.inputField) @@ -325,6 +350,7 @@ export const input = ({ text, submitText = 'Submit', cancelText = 'Cancel', ...s removeFromDocument(id) removeOverlayFromDocument() if (submitCallback) submitCallback(elementInput.value) + else if (submitCallbackArg) submitCallbackArg(elementInput.value) } const elementButtonRight = document.createElement('div') @@ -336,9 +362,10 @@ export const input = ({ text, submitText = 'Submit', cancelText = 'Cancel', ...s removeFromDocument(id) removeOverlayFromDocument() if (cancelCallback) cancelCallback(elementInput.value) + else if (cancelCallbackArg) cancelCallbackArg(elementInput.value) } - element.appendChild(elementMessage) + element.appendChild(elementText) element.appendChild(elementInput) element.appendChild(elementButtonLeft) element.appendChild(elementButtonRight) @@ -355,7 +382,12 @@ export const input = ({ text, submitText = 'Submit', cancelText = 'Cancel', ...s addOverlayToDocument(element) } -export const select = ({ text, cancelText = 'Cancel', choices }) => { +export const select = ({ + text, + cancelText = 'Cancel', + cancelCallback, + choices +}, cancelCallbackArg) => { blur() hideAlerts() @@ -365,12 +397,12 @@ export const select = ({ text, cancelText = 'Cancel', choices }) => { const id = generateRandomId() element.id = id - const elementMessage = document.createElement('div') - elementMessage.classList.add(options.classes.textbox) - elementMessage.classList.add(options.classes.backgroundInfo) - elementMessage.innerHTML = `
${text}
` + const elementText = document.createElement('div') + elementText.classList.add(options.classes.textbox) + elementText.classList.add(options.classes.backgroundInfo) + elementText.innerHTML = `
${text}
` - element.appendChild(elementMessage) + element.appendChild(elementText) choices.forEach(({ type = 1, text, handler }, index) => { const elementChoice = document.createElement('div') @@ -401,6 +433,8 @@ export const select = ({ text, cancelText = 'Cancel', choices }) => { elementCancel.onclick = () => { removeFromDocument(id, from) removeOverlayFromDocument() + if (cancelCallback) cancelCallback() + else if (cancelCallbackArg) cancelCallbackArg() } element.appendChild(elementCancel) @@ -414,7 +448,13 @@ export const select = ({ text, cancelText = 'Cancel', choices }) => { addOverlayToDocument(element, from) } -export const date = ({ value = new Date(), submitText = 'OK', cancelText = 'Cancel' }, submitCallback, cancelCallback) => { +export const date = ({ + value = new Date(), + submitText = 'OK', + cancelText = 'Cancel', + submitCallback, + cancelCallback +}, submitCallbackArg, cancelCallbackArg) => { blur() hideAlerts() @@ -523,6 +563,7 @@ export const date = ({ value = new Date(), submitText = 'OK', cancelText = 'Canc removeFromDocument(id) removeOverlayFromDocument() if (submitCallback) submitCallback(value) + else if (submitCallbackArg) submitCallbackArg(value) } const elementButtonRight = document.createElement('div') @@ -534,6 +575,7 @@ export const date = ({ value = new Date(), submitText = 'OK', cancelText = 'Canc removeFromDocument(id) removeOverlayFromDocument() if (cancelCallback) cancelCallback(value) + else if (cancelCallbackArg) cancelCallbackArg(value) } elementDateSelectorInner.appendChild(elementDateUpMonth) diff --git a/test.html b/test.html index 51956f1..e26754e 100644 --- a/test.html +++ b/test.html @@ -103,62 +103,75 @@ } function force () { - notie.force({ text: 'You cannot do that, sending you back.' }, function () { - notie.alert({ type: 3, text: 'Maybe when you\'re older...', time: 2 }) + notie.force({ + type: 3, + text: 'You cannot do that, sending you back.', + buttonText: 'OK', + callback: function () { + notie.alert({ type: 3, text: 'Maybe when you\'re older...' }) + } }) } function confirm () { notie.confirm({ - text: 'Are you sure you want to do that?
That\'s a bold move...' - }, function () { - notie.alert({ type: 1, text: 'Good choice! :D', time: 2 }) - }, function () { - notie.alert({ type: 3, text: 'Aw, why not? :(', time: 2 }) + text: 'Are you sure you want to do that?
That\'s a bold move...', + cancelCallback: function () { + notie.alert({ type: 3, text: 'Aw, why not? :(', time: 2 }) + }, + submitCallback: function () { + notie.alert({ type: 1, text: 'Good choice! :D', time: 2 }) + } }) } function input() { notie.input({ text: 'Please enter your email address:', + cancelCallback: function (value) { + notie.alert({ type: 3, text: 'You cancelled with this value: ' + value, time: 2 }) + }, + submitCallback: function (value) { + notie.alert({ type: 1, text: 'You entered: ' + value, time: 2 }) + }, type: 'text', placeholder: 'name@example.com', spellcheck: 'false' - }, function (value) { - notie.alert({ type: 1, text: 'You entered: ' + value, time: 2 }) - }, function (value) { - notie.alert({ type: 3, text: 'You cancelled with this value: ' + value, time: 2 }) }) } function select() { notie.select({ text: 'Demo item #1, owner is Jane Smith', + cancelText: 'Close', + cancelCallback: function () { + notie.alert({ type: 5, text: 'Cancel!' }) + }, choices: [ { text: 'Share', handler: function () { - notie.alert({ type: 1, text: 'Share item!', time: 3 }) + notie.alert({ type: 1, text: 'Share item!' }) } }, { text: 'Open', handler: function () { - notie.alert({ type: 1, text: 'Open item!', time: 3 }) + notie.alert({ type: 1, text: 'Open item!' }) } }, { type: 2, text: 'Edit', handler: function () { - notie.alert({ type: 2, text: 'Edit item!', time: 3 }) + notie.alert({ type: 2, text: 'Edit item!' }) } }, { type: 3, text: 'Delete', handler: function () { - notie.alert({ type: 3, text: 'Delete item!', time: 3 }) + notie.alert({ type: 3, text: 'Delete item!' }) } } ] @@ -167,11 +180,13 @@ function date() { notie.date({ - value: new Date(2015, 8, 27) - }, function (date) { - notie.alert({ type: 1, text: 'You selected: ' + date.toISOString() }) - }, function (date) { - notie.alert({ type: 3, text: 'You cancelled: ' + date.toISOString() }) + value: new Date(2015, 8, 27), + cancelCallback: function (date) { + notie.alert({ type: 3, text: 'You cancelled: ' + date.toISOString() }) + }, + submitCallback: function (date) { + notie.alert({ type: 1, text: 'You selected: ' + date.toISOString() }) + } }) }