├── README.md ├── .gitattributes ├── js ├── scale.fix.js ├── bootstrap-modal.js └── bootstrap-modalmanager.js ├── css ├── bootstrap-modal.css ├── pygment_trac.css └── styles.css ├── params.json ├── index.html └── .gitignore /README.md: -------------------------------------------------------------------------------- 1 | Bootstrap Modal 2 | ============= 3 | 4 | Custom implementation of twitter bootstrap's modal. 5 | 6 | * Responsive 7 | * Stackable 8 | * Load content via AJAX 9 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | 4 | # Custom for Visual Studio 5 | *.cs diff=csharp 6 | *.sln merge=union 7 | *.csproj merge=union 8 | *.vbproj merge=union 9 | *.fsproj merge=union 10 | *.dbproj merge=union 11 | 12 | # Standard to msysgit 13 | *.doc diff=astextplain 14 | *.DOC diff=astextplain 15 | *.docx diff=astextplain 16 | *.DOCX diff=astextplain 17 | *.dot diff=astextplain 18 | *.DOT diff=astextplain 19 | *.pdf diff=astextplain 20 | *.PDF diff=astextplain 21 | *.rtf diff=astextplain 22 | *.RTF diff=astextplain 23 | -------------------------------------------------------------------------------- /js/scale.fix.js: -------------------------------------------------------------------------------- 1 | var metas = document.getElementsByTagName('meta'); 2 | var i; 3 | if (navigator.userAgent.match(/iPhone/i)) { 4 | for (i=0; i` element will link to the contributor's GitHub Profile. For example: In 2007, Chris Wanstrath (@defunkt), PJ Hyett (@pjhyett), and Tom Preston-Werner (@mojombo) founded GitHub.\r\n\r\n### Support or Contact\r\nHaving trouble with Pages? Check out the documentation at http://help.github.com/pages or contact support@github.com and we’ll help you sort it out.","tagline":"Custom implementation of twitter bootstrap's modal class.","note":"Don't delete this file! It's used internally to help with page regeneration.","name":"Bootstrap-modal","google":""} -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Bootstrap-modal by jschr 7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 |
15 | Documentation - Modal 16 |
17 |
18 |
19 |

Responsive

20 | 21 |
22 | 23 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | ################# 2 | ## Eclipse 3 | ################# 4 | 5 | *.pydevproject 6 | .project 7 | .metadata 8 | bin/ 9 | tmp/ 10 | *.tmp 11 | *.bak 12 | *.swp 13 | *~.nib 14 | local.properties 15 | .classpath 16 | .settings/ 17 | .loadpath 18 | 19 | # External tool builders 20 | .externalToolBuilders/ 21 | 22 | # Locally stored "Eclipse launch configurations" 23 | *.launch 24 | 25 | # CDT-specific 26 | .cproject 27 | 28 | # PDT-specific 29 | .buildpath 30 | 31 | 32 | ################# 33 | ## Visual Studio 34 | ################# 35 | 36 | ## Ignore Visual Studio temporary files, build results, and 37 | ## files generated by popular Visual Studio add-ons. 38 | 39 | # User-specific files 40 | *.suo 41 | *.user 42 | *.sln.docstates 43 | 44 | # Build results 45 | [Dd]ebug/ 46 | [Rr]elease/ 47 | *_i.c 48 | *_p.c 49 | *.ilk 50 | *.meta 51 | *.obj 52 | *.pch 53 | *.pdb 54 | *.pgc 55 | *.pgd 56 | *.rsp 57 | *.sbr 58 | *.tlb 59 | *.tli 60 | *.tlh 61 | *.tmp 62 | *.vspscc 63 | .builds 64 | *.dotCover 65 | 66 | ## TODO: If you have NuGet Package Restore enabled, uncomment this 67 | #packages/ 68 | 69 | # Visual C++ cache files 70 | ipch/ 71 | *.aps 72 | *.ncb 73 | *.opensdf 74 | *.sdf 75 | 76 | # Visual Studio profiler 77 | *.psess 78 | *.vsp 79 | 80 | # ReSharper is a .NET coding add-in 81 | _ReSharper* 82 | 83 | # Installshield output folder 84 | [Ee]xpress 85 | 86 | # DocProject is a documentation generator add-in 87 | DocProject/buildhelp/ 88 | DocProject/Help/*.HxT 89 | DocProject/Help/*.HxC 90 | DocProject/Help/*.hhc 91 | DocProject/Help/*.hhk 92 | DocProject/Help/*.hhp 93 | DocProject/Help/Html2 94 | DocProject/Help/html 95 | 96 | # Click-Once directory 97 | publish 98 | 99 | # Others 100 | [Bb]in 101 | [Oo]bj 102 | sql 103 | TestResults 104 | *.Cache 105 | ClientBin 106 | stylecop.* 107 | ~$* 108 | *.dbmdl 109 | Generated_Code #added for RIA/Silverlight projects 110 | 111 | # Backup & report files from converting an old project file to a newer 112 | # Visual Studio version. Backup files are not needed, because we have git ;-) 113 | _UpgradeReport_Files/ 114 | Backup*/ 115 | UpgradeLog*.XML 116 | 117 | 118 | 119 | ############ 120 | ## Windows 121 | ############ 122 | 123 | # Windows image file caches 124 | Thumbs.db 125 | 126 | # Folder config file 127 | Desktop.ini 128 | 129 | 130 | ############# 131 | ## Python 132 | ############# 133 | 134 | *.py[co] 135 | 136 | # Packages 137 | *.egg 138 | *.egg-info 139 | dist 140 | build 141 | eggs 142 | parts 143 | bin 144 | var 145 | sdist 146 | develop-eggs 147 | .installed.cfg 148 | 149 | # Installer logs 150 | pip-log.txt 151 | 152 | # Unit test / coverage reports 153 | .coverage 154 | .tox 155 | 156 | #Translations 157 | *.mo 158 | 159 | #Mr Developer 160 | .mr.developer.cfg 161 | 162 | # Mac crap 163 | .DS_Store 164 | -------------------------------------------------------------------------------- /css/pygment_trac.css: -------------------------------------------------------------------------------- 1 | .highlight { background: #ffffff; } 2 | .highlight .c { color: #999988; font-style: italic } /* Comment */ 3 | .highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */ 4 | .highlight .k { font-weight: bold } /* Keyword */ 5 | .highlight .o { font-weight: bold } /* Operator */ 6 | .highlight .cm { color: #999988; font-style: italic } /* Comment.Multiline */ 7 | .highlight .cp { color: #999999; font-weight: bold } /* Comment.Preproc */ 8 | .highlight .c1 { color: #999988; font-style: italic } /* Comment.Single */ 9 | .highlight .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */ 10 | .highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */ 11 | .highlight .gd .x { color: #000000; background-color: #ffaaaa } /* Generic.Deleted.Specific */ 12 | .highlight .ge { font-style: italic } /* Generic.Emph */ 13 | .highlight .gr { color: #aa0000 } /* Generic.Error */ 14 | .highlight .gh { color: #999999 } /* Generic.Heading */ 15 | .highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */ 16 | .highlight .gi .x { color: #000000; background-color: #aaffaa } /* Generic.Inserted.Specific */ 17 | .highlight .go { color: #888888 } /* Generic.Output */ 18 | .highlight .gp { color: #555555 } /* Generic.Prompt */ 19 | .highlight .gs { font-weight: bold } /* Generic.Strong */ 20 | .highlight .gu { color: #800080; font-weight: bold; } /* Generic.Subheading */ 21 | .highlight .gt { color: #aa0000 } /* Generic.Traceback */ 22 | .highlight .kc { font-weight: bold } /* Keyword.Constant */ 23 | .highlight .kd { font-weight: bold } /* Keyword.Declaration */ 24 | .highlight .kn { font-weight: bold } /* Keyword.Namespace */ 25 | .highlight .kp { font-weight: bold } /* Keyword.Pseudo */ 26 | .highlight .kr { font-weight: bold } /* Keyword.Reserved */ 27 | .highlight .kt { color: #445588; font-weight: bold } /* Keyword.Type */ 28 | .highlight .m { color: #009999 } /* Literal.Number */ 29 | .highlight .s { color: #d14 } /* Literal.String */ 30 | .highlight .na { color: #008080 } /* Name.Attribute */ 31 | .highlight .nb { color: #0086B3 } /* Name.Builtin */ 32 | .highlight .nc { color: #445588; font-weight: bold } /* Name.Class */ 33 | .highlight .no { color: #008080 } /* Name.Constant */ 34 | .highlight .ni { color: #800080 } /* Name.Entity */ 35 | .highlight .ne { color: #990000; font-weight: bold } /* Name.Exception */ 36 | .highlight .nf { color: #990000; font-weight: bold } /* Name.Function */ 37 | .highlight .nn { color: #555555 } /* Name.Namespace */ 38 | .highlight .nt { color: #000080 } /* Name.Tag */ 39 | .highlight .nv { color: #008080 } /* Name.Variable */ 40 | .highlight .ow { font-weight: bold } /* Operator.Word */ 41 | .highlight .w { color: #bbbbbb } /* Text.Whitespace */ 42 | .highlight .mf { color: #009999 } /* Literal.Number.Float */ 43 | .highlight .mh { color: #009999 } /* Literal.Number.Hex */ 44 | .highlight .mi { color: #009999 } /* Literal.Number.Integer */ 45 | .highlight .mo { color: #009999 } /* Literal.Number.Oct */ 46 | .highlight .sb { color: #d14 } /* Literal.String.Backtick */ 47 | .highlight .sc { color: #d14 } /* Literal.String.Char */ 48 | .highlight .sd { color: #d14 } /* Literal.String.Doc */ 49 | .highlight .s2 { color: #d14 } /* Literal.String.Double */ 50 | .highlight .se { color: #d14 } /* Literal.String.Escape */ 51 | .highlight .sh { color: #d14 } /* Literal.String.Heredoc */ 52 | .highlight .si { color: #d14 } /* Literal.String.Interpol */ 53 | .highlight .sx { color: #d14 } /* Literal.String.Other */ 54 | .highlight .sr { color: #009926 } /* Literal.String.Regex */ 55 | .highlight .s1 { color: #d14 } /* Literal.String.Single */ 56 | .highlight .ss { color: #990073 } /* Literal.String.Symbol */ 57 | .highlight .bp { color: #999999 } /* Name.Builtin.Pseudo */ 58 | .highlight .vc { color: #008080 } /* Name.Variable.Class */ 59 | .highlight .vg { color: #008080 } /* Name.Variable.Global */ 60 | .highlight .vi { color: #008080 } /* Name.Variable.Instance */ 61 | .highlight .il { color: #009999 } /* Literal.Number.Integer.Long */ 62 | 63 | .type-csharp .highlight .k { color: #0000FF } 64 | .type-csharp .highlight .kt { color: #0000FF } 65 | .type-csharp .highlight .nf { color: #000000; font-weight: normal } 66 | .type-csharp .highlight .nc { color: #2B91AF } 67 | .type-csharp .highlight .nn { color: #000000 } 68 | .type-csharp .highlight .s { color: #A31515 } 69 | .type-csharp .highlight .sc { color: #A31515 } 70 | -------------------------------------------------------------------------------- /css/styles.css: -------------------------------------------------------------------------------- 1 | @import url(https://fonts.googleapis.com/css?family=Lato:300italic,700italic,300,700); 2 | 3 | body { 4 | padding:50px; 5 | font:14px/1.5 Lato, "Helvetica Neue", Helvetica, Arial, sans-serif; 6 | color:#777; 7 | font-weight:300; 8 | } 9 | 10 | h1, h2, h3, h4, h5, h6 { 11 | color:#222; 12 | margin:0 0 20px; 13 | } 14 | 15 | p, ul, ol, table, pre, dl { 16 | margin:0 0 20px; 17 | } 18 | 19 | h1, h2, h3 { 20 | line-height:1.1; 21 | } 22 | 23 | h1 { 24 | font-size:28px; 25 | } 26 | 27 | h2 { 28 | color:#393939; 29 | } 30 | 31 | h3, h4, h5, h6 { 32 | color:#494949; 33 | } 34 | 35 | a { 36 | color:#39c; 37 | font-weight:400; 38 | text-decoration:none; 39 | } 40 | 41 | a small { 42 | font-size:11px; 43 | color:#777; 44 | margin-top:-0.6em; 45 | display:block; 46 | } 47 | 48 | .wrapper { 49 | width:860px; 50 | margin:0 auto; 51 | } 52 | 53 | blockquote { 54 | border-left:1px solid #e5e5e5; 55 | margin:0; 56 | padding:0 0 0 20px; 57 | font-style:italic; 58 | } 59 | 60 | code, pre { 61 | font-family:Monaco, Bitstream Vera Sans Mono, Lucida Console, Terminal; 62 | color:#333; 63 | font-size:12px; 64 | } 65 | 66 | pre { 67 | padding:8px 15px; 68 | background: #f8f8f8; 69 | border-radius:5px; 70 | border:1px solid #e5e5e5; 71 | overflow-x: auto; 72 | } 73 | 74 | table { 75 | width:100%; 76 | border-collapse:collapse; 77 | } 78 | 79 | th, td { 80 | text-align:left; 81 | padding:5px 10px; 82 | border-bottom:1px solid #e5e5e5; 83 | } 84 | 85 | dt { 86 | color:#444; 87 | font-weight:700; 88 | } 89 | 90 | th { 91 | color:#444; 92 | } 93 | 94 | img { 95 | max-width:100%; 96 | } 97 | 98 | header { 99 | width:270px; 100 | float:left; 101 | position:fixed; 102 | } 103 | 104 | header ul { 105 | list-style:none; 106 | height:40px; 107 | 108 | padding:0; 109 | 110 | background: #eee; 111 | background: -moz-linear-gradient(top, #f8f8f8 0%, #dddddd 100%); 112 | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f8f8), color-stop(100%,#dddddd)); 113 | background: -webkit-linear-gradient(top, #f8f8f8 0%,#dddddd 100%); 114 | background: -o-linear-gradient(top, #f8f8f8 0%,#dddddd 100%); 115 | background: -ms-linear-gradient(top, #f8f8f8 0%,#dddddd 100%); 116 | background: linear-gradient(top, #f8f8f8 0%,#dddddd 100%); 117 | 118 | border-radius:5px; 119 | border:1px solid #d2d2d2; 120 | box-shadow:inset #fff 0 1px 0, inset rgba(0,0,0,0.03) 0 -1px 0; 121 | width:270px; 122 | } 123 | 124 | header li { 125 | width:89px; 126 | float:left; 127 | border-right:1px solid #d2d2d2; 128 | height:40px; 129 | } 130 | 131 | header ul a { 132 | line-height:1; 133 | font-size:11px; 134 | color:#999; 135 | display:block; 136 | text-align:center; 137 | padding-top:6px; 138 | height:40px; 139 | } 140 | 141 | strong { 142 | color:#222; 143 | font-weight:700; 144 | } 145 | 146 | header ul li + li { 147 | width:88px; 148 | border-left:1px solid #fff; 149 | } 150 | 151 | header ul li + li + li { 152 | border-right:none; 153 | width:89px; 154 | } 155 | 156 | header ul a strong { 157 | font-size:14px; 158 | display:block; 159 | color:#222; 160 | } 161 | 162 | section { 163 | width:500px; 164 | float:right; 165 | padding-bottom:50px; 166 | } 167 | 168 | small { 169 | font-size:11px; 170 | } 171 | 172 | hr { 173 | border:0; 174 | background:#e5e5e5; 175 | height:1px; 176 | margin:0 0 20px; 177 | } 178 | 179 | footer { 180 | width:270px; 181 | float:left; 182 | position:fixed; 183 | bottom:50px; 184 | } 185 | 186 | @media print, screen and (max-width: 960px) { 187 | 188 | div.wrapper { 189 | width:auto; 190 | margin:0; 191 | } 192 | 193 | header, section, footer { 194 | float:none; 195 | position:static; 196 | width:auto; 197 | } 198 | 199 | header { 200 | padding-right:320px; 201 | } 202 | 203 | section { 204 | border:1px solid #e5e5e5; 205 | border-width:1px 0; 206 | padding:20px 0; 207 | margin:0 0 20px; 208 | } 209 | 210 | header a small { 211 | display:inline; 212 | } 213 | 214 | header ul { 215 | position:absolute; 216 | right:50px; 217 | top:52px; 218 | } 219 | } 220 | 221 | @media print, screen and (max-width: 720px) { 222 | body { 223 | word-wrap:break-word; 224 | } 225 | 226 | header { 227 | padding:0; 228 | } 229 | 230 | header ul, header p.view { 231 | position:static; 232 | } 233 | 234 | pre, code { 235 | word-wrap:normal; 236 | } 237 | } 238 | 239 | @media print, screen and (max-width: 480px) { 240 | body { 241 | padding:15px; 242 | } 243 | 244 | header ul { 245 | display:none; 246 | } 247 | } 248 | 249 | @media print { 250 | body { 251 | padding:0.4in; 252 | font-size:12pt; 253 | color:#444; 254 | } 255 | } 256 | -------------------------------------------------------------------------------- /js/bootstrap-modal.js: -------------------------------------------------------------------------------- 1 | !function ($) { 2 | 3 | "use strict"; // jshint ;_; 4 | 5 | /* MODAL CLASS DEFINITION 6 | * ====================== */ 7 | 8 | var Modal = function (element, options) { 9 | this.init(element, options); 10 | } 11 | 12 | window.Modal = Modal; 13 | 14 | Modal.prototype = { 15 | 16 | constructor: Modal, 17 | 18 | init: function(element, options){ 19 | this.options = options; 20 | 21 | this.$element = $(element) 22 | .delegate('[data-dismiss="modal"]', 'click.dismiss.modal', $.proxy(this.hide, this)); 23 | 24 | this.options.remote && this.$element.find('.modal-body').load(this.options.remote); 25 | 26 | this.options.manager && this.options.manager.appendModal(this); 27 | }, 28 | 29 | toggle: function () { 30 | return this[!this.isShown ? 'show' : 'hide'](); 31 | }, 32 | 33 | show: function () { 34 | var that = this, 35 | e = $.Event('show'); 36 | 37 | this.$element.triggerHandler(e); 38 | 39 | if (e.isDefaultPrevented()) return; 40 | 41 | if (this.options.width){ 42 | this.$element.css('width', this.options.width); 43 | 44 | var that = this; 45 | this.$element.css('margin-left', function(){ 46 | if (/%/ig.test(that.options.width)){ 47 | return -(parseInt(that.options.width) / 2) + '%'; 48 | } else { 49 | return -($(this).width() / 2) + 'px'; 50 | } 51 | }); 52 | } 53 | 54 | if (this.options.height){ 55 | this.$element.css('height', this.options.height); 56 | } 57 | 58 | this.escape(); 59 | 60 | this.options.loading && this.loading(); 61 | }, 62 | 63 | hide: function (e) { 64 | e && e.preventDefault(); 65 | 66 | var that = this; 67 | 68 | e = $.Event('hide'); 69 | 70 | this.$element.triggerHandler(e); 71 | 72 | if (!this.isShown || e.isDefaultPrevented()) return (this.isShown = false); 73 | 74 | this.isShown = false; 75 | 76 | this.escape(); 77 | 78 | this.isLoading && this.loading(); 79 | 80 | $(document).off('focusin.modal'); 81 | 82 | this.$element 83 | .removeClass('in') 84 | .attr('aria-hidden', true); 85 | 86 | $.support.transition && this.$element.hasClass('fade') ? 87 | this.hideWithTransition() : 88 | this.hideModal(); 89 | }, 90 | 91 | escape: function () { 92 | var that = this; 93 | if (this.isShown && this.options.keyboard) { 94 | if (!this.$element.attr('tabindex')) this.$element.attr('tabindex', -1); 95 | 96 | this.$element.on('keyup.dismiss.modal', function ( e ) { 97 | e.which == 27 && that.hide() 98 | }); 99 | } else if (!this.isShown) { 100 | this.$element.off('keyup.dismiss.modal') 101 | } 102 | }, 103 | 104 | hideWithTransition: function () { 105 | var that = this 106 | , timeout = setTimeout(function () { 107 | that.$element.off($.support.transition.end) 108 | that.hideModal() 109 | }, 500); 110 | 111 | this.$element.one($.support.transition.end, function () { 112 | clearTimeout(timeout) 113 | that.hideModal() 114 | }); 115 | }, 116 | 117 | hideModal: function () { 118 | this.$element 119 | .hide() 120 | .triggerHandler('hidden'); 121 | }, 122 | 123 | removeLoading: function(){ 124 | this.$loading.remove(); 125 | this.$loading = null; 126 | this.isLoading = false; 127 | }, 128 | 129 | loading: function(callback){ 130 | callback = callback || function(){}; 131 | 132 | var animate = this.$element.hasClass('fade') ? 'fade' : ''; 133 | 134 | if (!this.isLoading) { 135 | var doAnimate = $.support.transition && animate; 136 | 137 | var $parent = this.$element.find('.modal-body'); 138 | $parent = $parent.length ? $parent : this.$element; 139 | 140 | this.$loading = $('
') 141 | .append(this.options.spinner) 142 | .appendTo($parent); 143 | 144 | if (doAnimate) this.$loading[0].offsetWidth // force reflow 145 | 146 | this.$loading.addClass('in') 147 | 148 | this.isLoading = true; 149 | 150 | doAnimate ? 151 | this.$loading.one($.support.transition.end, callback) : 152 | callback(); 153 | 154 | } else if (this.isLoading && this.$loading) { 155 | this.$loading.removeClass('in'); 156 | 157 | var that = this; 158 | $.support.transition && this.$element.hasClass('fade')? 159 | this.$loading.one($.support.transition.end, function(){ that.removeLoading() }) : 160 | that.removeLoading(); 161 | 162 | } else if (callback) { 163 | callback(this.isLoading); 164 | } 165 | }, 166 | 167 | toggleLoading: function(callback){ this.loading(callback); }, 168 | 169 | destroy: function(){ 170 | var e = $.Event('destroy'); 171 | this.$element.triggerHandler(e); 172 | if (e.isDefaultPrevented()) return; 173 | 174 | this.teardown(); 175 | }, 176 | 177 | teardown: function(){ 178 | var $parent = this.$parent; 179 | 180 | if (!$parent.length){ 181 | this.$element.remove(); 182 | this.$element = null; 183 | return; 184 | } 185 | 186 | if ($parent !== this.$element.parent()){ 187 | this.$element.appendTo(this.$parent); 188 | } 189 | 190 | this.$element.off('.modal'); 191 | this.$element.removeData('modal'); 192 | this.$element 193 | .removeClass('in') 194 | .attr('aria-hidden', true); 195 | } 196 | } 197 | 198 | 199 | /* MODAL PLUGIN DEFINITION 200 | * ======================= */ 201 | 202 | $.fn.modal = function (option) { 203 | return this.each(function () { 204 | var $this = $(this), 205 | data = $this.data('modal'), 206 | options = $.extend({}, $.fn.modal.defaults, $this.data(), typeof option == 'object' && option); 207 | 208 | if (!data) $this.data('modal', (data = new Modal(this, options))) 209 | if (typeof option == 'string') data[option]() 210 | else if (options.show) data.show() 211 | }) 212 | } 213 | 214 | $.fn.modal.defaults = { 215 | keyboard: true, 216 | backdrop: true, 217 | loading: false, 218 | show: true, 219 | width: null, 220 | manager: GlobalModalManager, 221 | spinner: '' 222 | } 223 | 224 | $.fn.modal.Constructor = Modal 225 | 226 | 227 | /* MODAL DATA-API 228 | * ============== */ 229 | 230 | $(function () { 231 | $('body').off('.modal').on('click.modal.data-api', '[data-toggle="modal"]', function ( e ) { 232 | var $this = $(this), 233 | href = $this.attr('href'), 234 | $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))), //strip for ie7 235 | option = $target.data('modal') ? 'toggle' : $.extend({ remote: !/#/.test(href) && href }, $target.data(), $this.data()); 236 | 237 | e.preventDefault(); 238 | $target 239 | .modal(option) 240 | .one('hide', function () { 241 | $this.focus(); 242 | }) 243 | }); 244 | }); 245 | 246 | }(window.jQuery); -------------------------------------------------------------------------------- /js/bootstrap-modalmanager.js: -------------------------------------------------------------------------------- 1 | !function($){ 2 | 3 | "use strict"; // jshint ;_; 4 | 5 | var $baseModal = $('
').appendTo('body'), 6 | $baseBackdrop = $('
').appendTo('body'), 7 | $baseModalAbs = $('
').appendTo('body'), 8 | $baseBackdropAbs = $('
').appendTo('body'); 9 | 10 | var baseModalzIndex = +$baseModal.css('z-index'), 11 | baseModalAbszIndex = +$baseModalAbs.css('z-index'), 12 | baseBackdropzIndex = +$baseBackdrop.css('z-index'), 13 | baseBackdropAbszIndex = +$baseBackdropAbs.css('z-index'), 14 | zIndexFactor = baseModalzIndex - baseBackdropzIndex; 15 | 16 | $baseModal.remove(); 17 | $baseBackdrop.remove(); 18 | $baseModalAbs.remove(); 19 | $baseBackdropAbs.remove(); 20 | $baseBackdrop = null; 21 | $baseModal = null; 22 | $baseModalAbs = null; 23 | $baseBackdrop = null; 24 | 25 | /* MODAL MANAGER CLASS DEFINITION 26 | * ====================== */ 27 | 28 | var ModalManager = function (element, options) { 29 | this.init(element, options); 30 | } 31 | 32 | window.ModalManager = ModalManager; 33 | 34 | ModalManager.prototype = { 35 | 36 | constructor: ModalManager, 37 | 38 | init: function(element, options){ 39 | this.$element = $(element); 40 | this.options = $.extend({}, $.fn.modalmanager.defaults, this.$element.data(), typeof options == 'object' && options); 41 | this.stack = []; 42 | this.isBody = this.$element[0] === $('body')[0]; 43 | }, 44 | 45 | createModal: function(element, options){ 46 | $(element).modal($.extend({ manager: this }, options)); 47 | }, 48 | 49 | appendModal: function(modal){ 50 | this.stack.push(modal); 51 | 52 | var that = this; 53 | 54 | modal.$element.on('show.modalmanager', function(e){ 55 | modal.isShown = true; 56 | $('body').toggleClass('modal-open', that.hasOpenModal()); 57 | 58 | 59 | var $scrollElement = that.isBody ? $(window) : that.$element; 60 | 61 | modal.$element 62 | .toggleClass('modal-absolute', !that.isBody) 63 | .css('margin-top', $scrollElement.scrollTop()) //TODO: handle container overflow scroll when it is not body 64 | .css('z-index', (!that.isBody ? baseModalAbszIndex : baseModalzIndex) 65 | + (zIndexFactor * that.getIndexOfModal(modal))); 66 | 67 | that.backdrop(modal, function () { 68 | var transition = $.support.transition && modal.$element.hasClass('fade') 69 | 70 | modal.$parent = modal.$element.parent(); 71 | if (!modal.$parent.length || modal.$parent[0] !== that.$element[0]) { 72 | modal.$element.appendTo(that.$element); 73 | } 74 | 75 | modal.$element.show(); 76 | 77 | if (transition) { 78 | modal.$element[0].style.display = 'run-in'; 79 | modal.$element[0].offsetWidth; 80 | modal.$element.one($.support.transition.end, function () { modal.$element[0].style.display = 'block' }); 81 | } 82 | 83 | modal.$element 84 | .addClass('in') 85 | .attr('aria-hidden', false); 86 | 87 | transition ? 88 | modal.$element.one($.support.transition.end, function () { modal.$element.triggerHandler('shown') }) : 89 | modal.$element.triggerHandler('shown'); 90 | }) 91 | 92 | modal.$element.on('shown.modalmanager', function(e){ 93 | that.setFocus(); 94 | }) 95 | 96 | }); 97 | 98 | modal.$element.on('hidden.modalmanager', function(e){ 99 | that.backdrop(modal); 100 | 101 | if (modal.$backdrop){ 102 | $.support.transition && modal.$element.hasClass('fade')? 103 | modal.$backdrop.one($.support.transition.end, function(){ that.destroyModal(modal) }) : 104 | that.destroyModal(modal); 105 | } else { 106 | that.destroyModal(modal); 107 | } 108 | 109 | }); 110 | 111 | modal.$element.on('destroy.modalmanager', function(e){ 112 | that.removeModal(modal); 113 | }); 114 | }, 115 | 116 | destroyModal: function(modal){ 117 | modal.destroy(); 118 | $('body').toggleClass('modal-open', this.hasOpenModal()); 119 | this.setFocus(); 120 | }, 121 | 122 | hasOpenModal: function(){ 123 | for (var i = 0; i < this.stack.length; i++){ 124 | if (this.stack[i].isShown) return true; 125 | } 126 | return false; 127 | }, 128 | 129 | setFocus: function () { 130 | var topModal; 131 | 132 | for (var i = 0; i < this.stack.length; i++){ 133 | if (this.stack[i].isShown) topModal = this.stack[i]; 134 | } 135 | 136 | topModal && topModal.$element.focus(); 137 | }, 138 | 139 | removeModal: function(modal){ 140 | modal.$element.off('.modalmanager'); 141 | if (modal.$backdrop) this.removeBackdrop.call(modal); 142 | this.stack.splice(this.getIndexOfModal(modal), 1); 143 | }, 144 | 145 | getModalAt: function(index){ 146 | return this.stack[index]; 147 | }, 148 | 149 | getIndexOfModal: function(modal){ 150 | for (var i = 0; i < this.stack.length; i++){ 151 | if (modal === this.stack[i]) return i; 152 | } 153 | }, 154 | 155 | removeBackdrop: function (modal) { 156 | modal.$backdrop.remove(); 157 | modal.$backdrop = null; 158 | }, 159 | 160 | createBackdrop: function(animate){ 161 | var $backdrop; 162 | 163 | if (!this.isLoading) { 164 | $backdrop = $('
') 165 | .appendTo(this.$element) 166 | .toggleClass('modal-absolute', !this.isBody); 167 | } else { 168 | $backdrop = this.$loading; 169 | $backdrop.off('.modalmanager'); 170 | this.$spinner.remove(); 171 | this.isLoading = false; 172 | this.$loading = this.$spinner = null; 173 | } 174 | 175 | return $backdrop 176 | }, 177 | 178 | backdrop: function (modal, callback) { 179 | var animate = modal.$element.hasClass('fade') ? 'fade' : '', 180 | showBackdrop = $.extend({}, this.options, modal.options).backdrop; 181 | 182 | if (modal.isShown && showBackdrop) { 183 | var doAnimate = $.support.transition && animate && !this.isLoading; 184 | 185 | 186 | modal.$backdrop = this.createBackdrop(animate); 187 | 188 | modal.$backdrop.css('z-index', 189 | (!this.isBody ? baseBackdropAbszIndex : baseBackdropzIndex) 190 | + (zIndexFactor * this.getIndexOfModal(modal))); 191 | 192 | 193 | if (modal.options.backdrop != 'static') { 194 | modal.$backdrop.on('click.modal', $.proxy(modal.hide, modal)); 195 | } 196 | 197 | if (doAnimate) modal.$backdrop[0].offsetWidth // force reflow 198 | 199 | modal.$backdrop.addClass('in') 200 | 201 | doAnimate ? 202 | modal.$backdrop.one($.support.transition.end, callback) : 203 | callback(); 204 | 205 | } else if (!modal.isShown && modal.$backdrop) { 206 | modal.$backdrop.removeClass('in'); 207 | 208 | var that = this; 209 | $.support.transition && modal.$element.hasClass('fade')? 210 | modal.$backdrop.one($.support.transition.end, function(){ that.removeBackdrop(modal) }) : 211 | that.removeBackdrop(modal); 212 | 213 | } else if (callback) { 214 | callback(); 215 | } 216 | }, 217 | 218 | removeLoading: function(){ 219 | this.$loading.remove(); 220 | this.$loading = null; 221 | this.isLoading = false; 222 | }, 223 | 224 | loading: function(callback){ 225 | callback = callback || function(){ }; 226 | 227 | if (!this.isLoading) { 228 | 229 | this.$loading = this.createBackdrop('fade'); 230 | 231 | this.$loading[0].offsetWidth // force reflow 232 | 233 | this.$loading 234 | .css('z-index', 235 | (!this.isBody ? baseBackdropAbszIndex : baseBackdropzIndex) 236 | + (zIndexFactor * this.stack.length)) 237 | .on('click.modalmanager', $.proxy(this.loading, this)) 238 | .addClass('in'); 239 | 240 | var $scrollElement = this.isBody ? $(window) : that.$element; 241 | 242 | this.$spinner = $('