https://www.pequenosleitoresapp.com.br/themes/default/js/jquery.msgBox.js

1/*
2jQuery.msgBox plugin
3Version: 0.1.1 (trying to follow http://semver.org/)
4Code repository: https://github.com/dotCtor/jQuery.msgBox
5
6Copyright (c) 2011-2013 Halil Ä°brahim Kalyoncu and Oliver Kopp
7All rights reserved.
8
9Redistribution and use in source and binary forms, with or without
10modification, are permitted provided that the following conditions are met:
11
121. Redistributions of source code must retain the above copyright notice, this
13   list of conditions and the following disclaimer.
142. Redistributions in binary form must reproduce the above copyright notice,
15   this list of conditions and the following disclaimer in the documentation
16   and/or other materials provided with the distribution.
17
18THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
19ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
20WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
21DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR
22ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
23(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
24LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
25ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
26(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
27SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
28
29*/
30
31// users may change this variable to fit their needs
32var msgBoxImagePath = "../img/";
33
34jQuery.msgBox = msg;
35function msg (options) {
36    var isShown = false;
37    var typeOfValue = typeof options;
38    var defaults = {
39        content: (typeOfValue == "string" ? options : "Message"),
40        title: "Warning",
41        type: "alert",
42        autoClose: false,
43        timeOut: 0,
44        modal: false,
45        showButtons: true,
46        buttons: [{ value: "Ok"}],
47        inputs: [{ type: "text", name:"userName", header: "User Name" }, { type: "password",name:"password", header: "Password"}],
48        success: function (result) { },
49        beforeShow: function () { },
50        afterShow: function () { },
51        beforeClose: function () { },
52        afterClose: function () { },
53        opacity: 0.1
54    };
55    options = typeOfValue == "string" ? defaults : options;
56    if (options.type != null) {
57        switch (options.type) {
58            case "alert":
59                options.title = options.title == null ? "Warning" : options.title;
60                break;
61            case "info":
62                options.title = options.title == null ? "Information" : options.title;
63                break;
64            case "error":
65                options.title = options.title == null ? "Error" : options.title;
66                break;
67            case "confirm":
68                options.title = options.title == null ? "Confirmation" : options.title;
69                options.buttons = options.buttons == null ? [{ value: "Yes" }, { value: "No" }, { value: "Cancel"}] : options.buttons;
70                break;
71            case "prompt":
72                options.title = options.title == null ? "Log In" : options.title;
73                options.buttons = options.buttons == null ? [{ value: "Login" }, { value: "Cancel"}] : options.buttons;
74                break;
75            default:
76                image = "alert.png";
77        }
78    }
79    options.timeOut = options.timeOut == null ? (options.content == null ? 500 : options.content.length * 70) : options.timeOut;
80    options = $.extend({}, defaults, options);
81    if (options.autoClose) {
82        setTimeout(hide, options.timeOut);
83    }
84    var image = "";
85    switch (options.type) {
86        case "alert":
87            image = "alert.png";
88            break;
89        case "info":
90            image = "info.png";
91            break;
92        case "error":
93            image = "error.png";
94            break;
95        case "confirm":
96            image = "confirm.png";
97            break;
98        default:
99            image = "alert.png";
100    }
101    
102    var divId = "msgBox" + new Date().getTime();
103    
104    /* i was testing with ($.browser.msie  && parseInt($.browser.version, 10) === 7) but $.browser.msie is not working with jQuery 1.9.0 :S. Alternative method: */

105    if ( navigator.userAgent.match(/msie 7/i) !== null) { var divMsgBoxContentClass = "msgBoxContentIEOld"; } else { var divMsgBoxContentClass = "msgBoxContent";}
106    
107    var divMsgBoxId = divId; 
108    var divMsgBoxContentId = divId+"Content"; 
109    var divMsgBoxImageId = divId+"Image";
110    var divMsgBoxButtonsId = divId+"Buttons";
111    var divMsgBoxBackGroundId = divId+"BackGround";
112	var firstButtonId = divId+"FirstButton";
113    
114    var buttons = "";
115	var isFirstButton = true;
116    $(options.buttons).each(function (index, button) {
117        var add = "";
118        if (isFirstButton) {
119            add = ' id="' + firstButtonId + '"';
120            isFirstButton = false;
121        }
122        buttons += "<input class=\"msgButton\" type=\"button\" name=\"" + button.value + "\" value=\"" + button.value + "\"" + add + "/>";
123    });
124
125    var inputs = "";
126    $(options.inputs).each(function (index, input) {
127        var type = input.type;
128        if (type=="checkbox" || type =="radiobutton") {
129            inputs += "<div class=\"msgInput\">" +
130            "<input type=\"" + input.type + "\" name=\"" + input.name + "\" "+(input.checked == null ? "" : "checked ='"+input.checked+"'")+" value=\"" + (typeof input.value == "undefined" ? "" : input.value) + "\" />" +
131            "<text>"+input.header +"</text>"+
132            "</div>";
133        }
134        else {
135            inputs += "<div class=\"msgInput\">" +
136            "<span class=\"msgInputHeader\">" + input.header + "</span>" +
137            "<input type=\"" + input.type + "\" name=\"" + input.name + "\" value=\"" + (typeof input.value == "undefined" ? "" : input.value) + "\" "+
138            (typeof input.size!==undefined?" size='"+input.size+"' ":"")+
139            (typeof input.maxlength!==undefined?" maxlength='"+input.maxlength+"' ":"")+
140            " />" +
141            "</div>";
142        }
143    });
144
145    var divBackGround = "<div id=\"" + divMsgBoxBackGroundId + "\" class=\"msgBoxBackGround\"></div>";
146    var divTitle = "<div class=\"msgBoxTitle\">" + options.title + "</div>";
147    var divContainer = "<div class=\"msgBoxContainer\"><div id=\"" + divMsgBoxImageId + "\" class=\"msgBoxImage\"><img src=\"" + msgBoxImagePath + image + "\"/></div><div id=\"" + divMsgBoxContentId + "\" class=\"" + divMsgBoxContentClass + "\"><p><span>" + options.content + "</span></p></div></div>";
148    var divButtons = "<div id=\"" + divMsgBoxButtonsId + "\" class=\"msgBoxButtons\">" + buttons + "</div>";
149    var divInputs = "<div class=\"msgBoxInputs\">" + inputs + "</div>";
150
151    var divMsgBox; 
152    var divMsgBoxContent; 
153    var divMsgBoxImage;
154    var divMsgBoxButtons;
155    var divMsgBoxBackGround;
156    
157    if (options.type == "prompt") {
158        $("body").append(divBackGround + "<div id=\"" + divMsgBoxId + "\" class=\"msgBox\">" + divTitle + "<div>" + divContainer + (options.showButtons ? divButtons + "</div>" : "</div>") + "</div>");
159        divMsgBox = $("#"+divMsgBoxId); 
160        divMsgBoxContent = $("#"+divMsgBoxContentId); 
161        divMsgBoxImage = $("#"+divMsgBoxImageId);
162        divMsgBoxButtons = $("#"+divMsgBoxButtonsId);
163        divMsgBoxBackGround = $("#"+divMsgBoxBackGroundId);
164
165        divMsgBoxImage.remove();
166        divMsgBoxButtons.css({"text-align":"center","margin-top":"5px"});
167        divMsgBoxContent.css({"width":"100%","height":"100%"});
168        divMsgBoxContent.html(divInputs);
169    }
170    else {
171        $("body").append(divBackGround + "<div id=\"" + divMsgBoxId + "\" class=\"msgBox\">" + divTitle + "<div>" + divContainer + (options.showButtons ? divButtons + "</div>" : "</div>") + "</div>");
172        divMsgBox= $("#"+divMsgBoxId); 
173        divMsgBoxContent = $("#"+divMsgBoxContentId); 
174        divMsgBoxImage = $("#"+divMsgBoxImageId);
175        divMsgBoxButtons = $("#"+divMsgBoxButtonsId);
176        divMsgBoxBackGround = $("#"+divMsgBoxBackGroundId);
177    }
178    divMsgBoxContent.height('auto');
179
180    var width = divMsgBox.width();
181    var height = divMsgBox.height();
182    var windowHeight = $(window).height();
183    var windowWidth = $(window).width();
184
185    var top = windowHeight / 2 - height / 2;
186    var left = windowWidth / 2 - width / 2;
187
188    show();
189
190    function show() {
191        if (isShown) {
192            return;
193        }

194        divMsgBox.css({ opacity: 0, top: top - 50, left: left });
195        divMsgBox.css("background-image", "url('"+msgBoxImagePath+"msgBoxBackGround.png')");
196        divMsgBoxBackGround.css({ opacity: options.opacity });
197        options.beforeShow();
198        divMsgBoxBackGround.css({ "width": $(document).width(), "height": getDocHeight() });
199        $(divMsgBoxId+","+divMsgBoxBackGroundId).fadeIn(0);
200        divMsgBox.animate({ opacity: 1, "top": top, "left": left }, 200);
201        setTimeout(options.afterShow, 200);
202        $("#" + firstButtonId).focus();
203        isShown = true;
204        $(window).bind("resize", function (e) {
205            var width = divMsgBox.width();
206            var height = divMsgBox.height();
207            var windowHeight = $(window).height();
208            var windowWidth = $(window).width();
209
210            var top = windowHeight / 2 - height / 2;
211            var left = windowWidth / 2 - width / 2;
212
213            divMsgBox.css({ "top": top, "left": left });
214            divMsgBoxBackGround.css({"width": "100%", "height": "100%"});
215        });
216    }
217
218    function hide() {
219        if (!isShown) {
220            return;
221        }
222        options.beforeClose();
223        divMsgBox.animate({ opacity: 0, "top": top - 50, "left": left }, 200);
224        divMsgBoxBackGround.fadeOut(300);
225        setTimeout(function () { divMsgBox.remove(); divMsgBoxBackGround.remove(); }, 300);
226        setTimeout(options.afterClose, 300);
227        $(window).unbind("resize");
228        isShown = false;
229    }
230
231    function getDocHeight() {
232        var D = document;
233        return Math.max(
234        Math.max(D.body.scrollHeight, D.documentElement.scrollHeight),
235        Math.max(D.body.offsetHeight, D.documentElement.offsetHeight),
236        Math.max(D.body.clientHeight, D.documentElement.clientHeight));
237    }
238
239    function getFocus() {
240    	divMsgBox.fadeOut(200).fadeIn(200);
241    }
242
243    $("input.msgButton").click(function (e) {
244        e.preventDefault();
245        var value = $(this).val();
246        if (options.type != "prompt") {
247            options.success(value);
248        }
249        else {
250            var inputValues = [];
251            $("div.msgInput input").each(function (index, domEle) {
252                var name = $(this).attr("name");
253                var value = $(this).val();
254                var type = $(this).attr("type");
255                if (type == "checkbox" || type == "radiobutton") {
256                    inputValues.push({ name: name, value: value,checked: $(this).attr("checked")});
257                }
258                else {
259                    inputValues.push({ name: name, value: value });
260                }
261            });
262            options.success(value,inputValues);
263        }
264        hide();
265    });
266
267    divMsgBoxBackGround.click(function (e) {
268        if ( options.modal )
269            return;
270        if (!options.showButtons || (options.showButtons && options.buttons.length<2) || options.autoClose) {
271            hide();
272        }
273        else {
274            getFocus();
275        }
276    });
277};