codemirror
4 years ago
jquery-tiptip
5 years ago
select2
5 years ago
how-to.js
8 years ago
how-to.min.js
6 years ago
jquery.colorbox.js
8 years ago
jquery.colorbox.min.js
6 years ago
metabox.js
4 years ago
metabox.min.js
4 years ago
multisite-updater.js
6 years ago
multisite-updater.min.js
6 years ago
welcome-modal.js
3 years ago
welcome-modal.min.js
3 years ago
wp-pages.js
4 years ago
wp-pages.min.js
4 years ago
yit-cpt-unlimited.js
6 years ago
yit-cpt-unlimited.min.js
6 years ago
yit-plugin-panel.js
3 years ago
yit-plugin-panel.min.js
3 years ago
yit-wp-pointer.js
5 years ago
yit-wp-pointer.min.js
5 years ago
yith-bh-onboarding.js
3 years ago
yith-bh-onboarding.min.js
3 years ago
yith-colorpicker.min.js
5 years ago
yith-dashboard.js
7 years ago
yith-dashboard.min.js
6 years ago
yith-date-format.js
5 years ago
yith-date-format.min.js
5 years ago
yith-enhanced-select-wc-2.6.js
5 years ago
yith-enhanced-select-wc-2.6.min.js
5 years ago
yith-enhanced-select.js
3 years ago
yith-enhanced-select.min.js
3 years ago
yith-fields.js
4 years ago
yith-fields.min.js
4 years ago
yith-promo.js
7 years ago
yith-promo.min.js
6 years ago
yith-system-info.js
3 years ago
yith-system-info.min.js
3 years ago
yith-ui.js
4 years ago
yith-ui.min.js
4 years ago
yith-update-plugins.js
7 years ago
yith-update-plugins.min.js
6 years ago
yith-ui.js
316 lines
| 1 | /* globals yith_plugin_fw_ui */ |
| 2 | |
| 3 | // Make sure the yith object exists. |
| 4 | window.yith = window.yith || {}; |
| 5 | |
| 6 | ( function ( $, yith ) { |
| 7 | yith.ui = yith.ui || {}; |
| 8 | |
| 9 | var cssClasses = function ( classes ) { |
| 10 | if ( typeof classes === 'string' ) { |
| 11 | return classes; |
| 12 | } else { |
| 13 | var filteredClasses = []; |
| 14 | |
| 15 | for ( var value of classes ) { |
| 16 | if ( value && filteredClasses.indexOf( value ) < 0 ) { |
| 17 | filteredClasses.push( cssClasses( value ) ); |
| 18 | } |
| 19 | } |
| 20 | return filteredClasses.join( ' ' ); |
| 21 | } |
| 22 | }; |
| 23 | |
| 24 | /** |
| 25 | * Confirm window. |
| 26 | */ |
| 27 | yith.ui.confirm = function ( options ) { |
| 28 | var defaults = { |
| 29 | title : false, |
| 30 | message : false, |
| 31 | onCreate : false, |
| 32 | onConfirm : false, |
| 33 | onCancel : false, |
| 34 | onClose : false, |
| 35 | classes : { |
| 36 | wrap : '', |
| 37 | content: '', |
| 38 | title : '', |
| 39 | message: '', |
| 40 | footer : '', |
| 41 | cancel : '', |
| 42 | confirm: '' |
| 43 | }, |
| 44 | confirmButtonType : 'confirm', |
| 45 | cancelButton : yith_plugin_fw_ui.i18n.cancel, |
| 46 | confirmButton : yith_plugin_fw_ui.i18n.confirm, |
| 47 | width : 350, |
| 48 | closeAfterConfirm : true, |
| 49 | allowWpMenu : false, |
| 50 | allowWpMenuInMobile : false, |
| 51 | showClose : true, |
| 52 | closeWhenClickingOnOverlay: false |
| 53 | }, |
| 54 | self = {}; |
| 55 | |
| 56 | options = typeof options !== 'undefined' ? options : {}; |
| 57 | options = $.extend( {}, defaults, options ); |
| 58 | options.classes = $.extend( {}, defaults.classes, options.classes ); |
| 59 | |
| 60 | var classes = { |
| 61 | wrap : cssClasses( ['yith-plugin-fw__confirm__wrap', options.classes.wrap] ), |
| 62 | content: cssClasses( ['yith-plugin-fw__confirm__content', options.classes.content] ), |
| 63 | title : cssClasses( ['yith-plugin-fw__confirm__title', options.classes.title] ), |
| 64 | message: cssClasses( ['yith-plugin-fw__confirm__message', options.classes.message] ), |
| 65 | footer : cssClasses( ['yith-plugin-fw__confirm__footer', options.classes.footer] ), |
| 66 | cancel : cssClasses( ['yith-plugin-fw__confirm__button', 'yith-plugin-fw__confirm__button--cancel', options.classes.cancel] ), |
| 67 | confirm: cssClasses( ['yith-plugin-fw__confirm__button', 'yith-plugin-fw__confirm__button--' + options.confirmButtonType, options.classes.confirm] ) |
| 68 | }, |
| 69 | dom = { |
| 70 | message: false, |
| 71 | footer : false, |
| 72 | cancel : false, |
| 73 | confirm: false |
| 74 | }, |
| 75 | modal = false, |
| 76 | initialize = function () { |
| 77 | create(); |
| 78 | initEvents(); |
| 79 | }, |
| 80 | handleClose = function () { |
| 81 | modal && modal.close(); |
| 82 | modal = false; |
| 83 | }, |
| 84 | create = function () { |
| 85 | dom.message = $( '<div class="' + classes.message + '">' ); |
| 86 | dom.footer = $( '<div class="' + classes.footer + '">' ); |
| 87 | dom.cancel = $( '<span class="' + classes.cancel + '">' + options.cancelButton + '</span>' ); |
| 88 | dom.confirm = $( '<span class="' + classes.confirm + '">' + options.confirmButton + '</span>' ); |
| 89 | |
| 90 | |
| 91 | if ( options.message ) { |
| 92 | dom.message.html( options.message ); |
| 93 | } |
| 94 | |
| 95 | dom.footer.append( dom.cancel ); |
| 96 | dom.footer.append( dom.confirm ); |
| 97 | |
| 98 | modal = yith.ui.modal( |
| 99 | { |
| 100 | classes : { |
| 101 | wrap : classes.wrap, |
| 102 | title : classes.title, |
| 103 | content: classes.content |
| 104 | }, |
| 105 | title : options.title, |
| 106 | content : [dom.message, dom.footer], |
| 107 | width : options.width, |
| 108 | allowWpMenu : options.allowWpMenu, |
| 109 | allowWpMenuInMobile : options.allowWpMenuInMobile, |
| 110 | showClose : options.showClose, |
| 111 | onCreate : options.onCreate, |
| 112 | onClose : options.onClose, |
| 113 | closeWhenClickingOnOverlay: options.closeWhenClickingOnOverlay |
| 114 | } |
| 115 | ); |
| 116 | }, |
| 117 | handleCancel = function () { |
| 118 | if ( typeof options.onCancel === 'function' ) { |
| 119 | options.onCancel(); |
| 120 | } |
| 121 | |
| 122 | handleClose(); |
| 123 | }, |
| 124 | handleConfirm = function () { |
| 125 | if ( typeof options.onConfirm === 'function' ) { |
| 126 | options.onConfirm(); |
| 127 | } |
| 128 | |
| 129 | if ( options.closeAfterConfirm ) { |
| 130 | handleClose(); |
| 131 | } |
| 132 | }, |
| 133 | initEvents = function () { |
| 134 | dom.cancel.on( 'click', handleCancel ); |
| 135 | dom.confirm.on( 'click', handleConfirm ); |
| 136 | }; |
| 137 | |
| 138 | initialize(); |
| 139 | |
| 140 | self.elements = $.extend( {}, dom ); |
| 141 | self.modal = $.extend( {}, modal ); |
| 142 | self.close = handleClose; |
| 143 | self.cancel = handleCancel; |
| 144 | }; |
| 145 | |
| 146 | |
| 147 | /** |
| 148 | * Modal window. |
| 149 | */ |
| 150 | yith.ui.modal = function ( options ) { |
| 151 | var defaults = { |
| 152 | allowWpMenu : true, |
| 153 | allowWpMenuInMobile : false, |
| 154 | title : false, |
| 155 | content : false, |
| 156 | footer : false, |
| 157 | showClose : true, |
| 158 | closeSelector : false, |
| 159 | classes : { |
| 160 | wrap : '', |
| 161 | main : '', |
| 162 | close : '', |
| 163 | title : '', |
| 164 | content: '', |
| 165 | footer : '' |
| 166 | }, |
| 167 | width : 500, |
| 168 | allowClosingWithEsc : true, |
| 169 | closeWhenClickingOnOverlay: false, |
| 170 | scrollContent : true, |
| 171 | onCreate : false, |
| 172 | onClose : false |
| 173 | }, |
| 174 | self = {}; |
| 175 | |
| 176 | options = typeof options !== 'undefined' ? options : {}; |
| 177 | options = $.extend( {}, defaults, options ); |
| 178 | options.classes = $.extend( {}, defaults.classes, options.classes ); |
| 179 | |
| 180 | var container = $( '#wpwrap' ), |
| 181 | classes = { |
| 182 | wrap : ['yith-plugin-ui', 'yith-plugin-fw__modal__wrap', options.classes.wrap], |
| 183 | main : ['yith-plugin-fw__modal__main', options.classes.main], |
| 184 | close : ['yith-plugin-fw__modal__close', 'yith-icon', 'yith-icon-close', options.classes.close], |
| 185 | title : ['yith-plugin-fw__modal__title', options.classes.title], |
| 186 | content: ['yith-plugin-fw__modal__content', options.classes.content], |
| 187 | footer : ['yith-plugin-fw__modal__footer', options.classes.footer] |
| 188 | }, |
| 189 | dom = { |
| 190 | wrap : false, |
| 191 | main : false, |
| 192 | close : false, |
| 193 | title : false, |
| 194 | content: false, |
| 195 | footer : false |
| 196 | }, |
| 197 | initialize = function () { |
| 198 | close(); |
| 199 | |
| 200 | create(); |
| 201 | initEvents(); |
| 202 | }, |
| 203 | close = function () { |
| 204 | $( '.yith-plugin-fw__modal__wrap' ).remove(); |
| 205 | container.removeClass( 'yith-plugin-fw__modal--opened' ); |
| 206 | container.removeClass( 'yith-plugin-fw__modal--allow-wp-menu' ); |
| 207 | container.removeClass( 'yith-plugin-fw__modal--allow-wp-menu-in-mobile' ); |
| 208 | removeEvents(); |
| 209 | }, |
| 210 | handleClose = function () { |
| 211 | close(); |
| 212 | |
| 213 | if ( typeof options.onClose === 'function' ) { |
| 214 | options.onClose(); |
| 215 | } |
| 216 | }, |
| 217 | create = function () { |
| 218 | dom.wrap = $( '<div class="' + cssClasses( classes.wrap ) + '">' ); |
| 219 | dom.main = $( '<div class="' + cssClasses( classes.main ) + '">' ); |
| 220 | dom.close = $( '<span class="' + cssClasses( classes.close ) + '">' ); |
| 221 | dom.title = $( '<div class="' + cssClasses( classes.title ) + '">' ); |
| 222 | dom.content = $( '<div class="' + cssClasses( classes.content ) + '">' ); |
| 223 | dom.footer = $( '<div class="' + cssClasses( classes.footer ) + '">' ); |
| 224 | |
| 225 | dom.main.css( { width: options.width } ); |
| 226 | |
| 227 | if ( options.title ) { |
| 228 | if ( typeof options.title === 'string' ) { |
| 229 | dom.title.html( options.title ); |
| 230 | } else { |
| 231 | dom.title.append( options.title ); |
| 232 | } |
| 233 | } |
| 234 | |
| 235 | if ( options.content ) { |
| 236 | if ( typeof options.content === 'string' ) { |
| 237 | dom.content.html( options.content ); |
| 238 | } else { |
| 239 | dom.content.append( options.content ); |
| 240 | } |
| 241 | } |
| 242 | |
| 243 | if ( options.showClose ) { |
| 244 | dom.main.append( dom.close ); |
| 245 | } |
| 246 | |
| 247 | dom.main.append( dom.title ); |
| 248 | dom.main.append( dom.content ); |
| 249 | |
| 250 | |
| 251 | if ( options.footer ) { |
| 252 | if ( typeof options.footer === 'string' ) { |
| 253 | dom.footer.html( options.footer ); |
| 254 | } else { |
| 255 | dom.footer.append( options.footer ); |
| 256 | } |
| 257 | |
| 258 | dom.main.append( dom.footer ); |
| 259 | } |
| 260 | |
| 261 | |
| 262 | dom.wrap.append( dom.main ); |
| 263 | |
| 264 | if ( options.scrollContent ) { |
| 265 | dom.wrap.addClass( 'yith-plugin-fw__modal__wrap--scroll-content' ); |
| 266 | } |
| 267 | |
| 268 | container.append( dom.wrap ); |
| 269 | container.addClass( 'yith-plugin-fw__modal--opened' ); |
| 270 | if ( options.allowWpMenu ) { |
| 271 | container.addClass( 'yith-plugin-fw__modal--allow-wp-menu' ); |
| 272 | } |
| 273 | |
| 274 | if ( options.allowWpMenuInMobile ) { |
| 275 | container.addClass( 'yith-plugin-fw__modal--allow-wp-menu-in-mobile' ); |
| 276 | } |
| 277 | |
| 278 | if ( typeof options.onCreate === 'function' ) { |
| 279 | options.onCreate(); |
| 280 | } |
| 281 | }, |
| 282 | handleClickOnOverlay = function ( event ) { |
| 283 | var target = $( event.target ); |
| 284 | if ( target.is( dom.wrap ) && options.closeWhenClickingOnOverlay ) { |
| 285 | handleClose(); |
| 286 | } |
| 287 | }, |
| 288 | initEvents = function () { |
| 289 | dom.close.on( 'click', handleClose ); |
| 290 | if ( options.closeSelector ) { |
| 291 | container.on( 'click', options.closeSelector, handleClose ); |
| 292 | } |
| 293 | |
| 294 | dom.wrap.on( 'click', handleClickOnOverlay ); |
| 295 | |
| 296 | $( document ).on( 'keydown', handleKeyboard ); |
| 297 | }, |
| 298 | removeEvents = function () { |
| 299 | $( document ).off( 'keydown', handleKeyboard ); |
| 300 | }, |
| 301 | handleKeyboard = function ( event ) { |
| 302 | if ( options.allowClosingWithEsc && event.keyCode === 27 ) { |
| 303 | handleClose(); |
| 304 | } |
| 305 | }; |
| 306 | |
| 307 | initialize(); |
| 308 | |
| 309 | self.elements = $.extend( {}, dom ); |
| 310 | self.close = handleClose; |
| 311 | |
| 312 | return self; |
| 313 | }; |
| 314 | |
| 315 | } )( window.jQuery, window.yith ); |
| 316 |