|
7 | 7 | Modaal jQuery Plugin : Accessible Modals |
8 | 8 |
|
9 | 9 | ==== General Options === |
10 | | - type (string) : ajax, inline, image, iframe, confirm. Defaults to 'inline' |
11 | | - animation (string) : Fade, expand, down, up. Defaults to 'fade' |
12 | | - after_callback_delay (integer) : Specify a delay value for the after open callbacks. This is necessary because with the bundled animations |
13 | | - have a set duration in the bundled CSS. Specify a delay of the same amount as the animation duration in so |
14 | | - more accurately fire the after open/close callbacks. Defaults 350, does not apply if animation is 'none', |
15 | | - after open callbacks are dispatched immediately |
| 10 | + type (string) : ajax, inline, image, iframe, confirm. Defaults to 'inline' |
| 11 | + animation (string) : Fade, expand, down, up. Defaults to 'fade' |
| 12 | + after_callback_delay (integer) : Specify a delay value for the after open callbacks. This is necessary because with the bundled animations |
| 13 | + have a set duration in the bundled CSS. Specify a delay of the same amount as the animation duration in so |
| 14 | + more accurately fire the after open/close callbacks. Defaults 350, does not apply if animation is 'none', |
| 15 | + after open callbacks are dispatched immediately |
16 | 16 |
|
17 | | - is_locked (boolean) : Set this to true to disable closing the modal via keypress or clicking the background. Beware that if |
18 | | - type != 'confirm' there will be no interface to dismiss the modal if is_locked = true, you'd have to |
19 | | - programmatically arrange to dismiss the modal. Confirm modals are always locked regardless of this option |
20 | | - Defaults to false |
| 17 | + is_locked (boolean) : Set this to true to disable closing the modal via keypress or clicking the background. Beware that if |
| 18 | + type != 'confirm' there will be no interface to dismiss the modal if is_locked = true, you'd have to |
| 19 | + programmatically arrange to dismiss the modal. Confirm modals are always locked regardless of this option |
| 20 | + Defaults to false |
21 | 21 |
|
22 | | - hide_close (boolean) : Set this to true to hide the close modal button. Key press and overlay click will still close the modal. |
23 | | - This method is best used when you want to put a custom close button inside the modal container space. |
| 22 | + hide_close (boolean) : Set this to true to hide the close modal button. Key press and overlay click will still close the modal. |
| 23 | + This method is best used when you want to put a custom close button inside the modal container space. |
24 | 24 |
|
25 | | - background (string) : Background overlay style. Defaults to '#000' |
26 | | - overlay_opacity (float) : Background overlay transparency. Defaults to 0.8 |
27 | | - overlay_close (boolean) : Set this to false if you want to disable click to close on overlay background. |
| 25 | + background (string) : Background overlay style. Defaults to '#000' |
| 26 | + overlay_opacity (float) : Background overlay transparency. Defaults to 0.8 |
| 27 | + overlay_close (boolean) : Set this to false if you want to disable click to close on overlay background. |
28 | 28 |
|
29 | | - accessible_title (string) : Accessible title. Default 'Dialog Window' |
30 | | - start_open (boolean) : Set this to true to launch the Modaal window immediately on page open |
31 | | - fullscreen (boolean) : Set this to true to make the modaal fill the entire screen, false will default to own width/height attributes. |
32 | | - custom_class (string) : Fill in this string with a custom class that will be applied to the outer most modal wrapper. |
| 29 | + accessible_title (string) : Accessible title. Default 'Dialog Window' |
| 30 | + start_open (boolean) : Set this to true to launch the Modaal window immediately on page open |
| 31 | + fullscreen (boolean) : Set this to true to make the modaal fill the entire screen, false will default to own width/height attributes. |
| 32 | + custom_class (string) : Fill in this string with a custom class that will be applied to the outer most modal wrapper. |
33 | 33 |
|
34 | | - width (integer) : Desired width of the modal. Required for iframe type. Defaults to undefined //TODO |
35 | | - height (integer) : Desired height of the modal. Required for iframe type. Defaults to undefined //TODO |
| 34 | + width (integer) : Desired width of the modal. Required for iframe type. Defaults to undefined //TODO |
| 35 | + height (integer) : Desired height of the modal. Required for iframe type. Defaults to undefined //TODO |
36 | 36 |
|
37 | 37 |
|
38 | 38 | === Events === |
39 | | - before_open (function) : Callback function executed before modal is opened |
40 | | - after_open (function) : Callback function executed after modal is opened |
41 | | - before_close (function) : Callback function executed before modal is closed |
42 | | - after_close (function) : Callback function executed after modal is closed |
| 39 | + before_open (function) : Callback function executed before modal is opened |
| 40 | + after_open (function) : Callback function executed after modal is opened |
| 41 | + before_close (function) : Callback function executed before modal is closed |
| 42 | + after_close (function) : Callback function executed after modal is closed |
43 | 43 | source (function(element, src)) : Callback function executed on the default source, it is intended to transform the |
44 | | - source (href in an AJAX modal or iframe). The function passes in the triggering element |
45 | | - as well as the default source depending of the modal type. The default output of the |
46 | | - function is an untransformed default source. |
| 44 | + source (href in an AJAX modal or iframe). The function passes in the triggering element |
| 45 | + as well as the default source depending of the modal type. The default output of the |
| 46 | + function is an untransformed default source. |
47 | 47 |
|
48 | 48 |
|
49 | 49 | === Confirm Options & Events === |
50 | | - confirm_button_text (string) : Text on the confirm button. Defaults to 'Confirm' |
51 | | - confirm_cancel_button_text (string): Text on the confirm modal cancel button. Defaults to 'Cancel' |
52 | | - confirm_title (string) : Title for confirm modal. Default 'Confirm Title' |
53 | | - confirm_content (string) : HTML content for confirm message |
54 | | - confirm_callback (function) : Callback function for when the confirm button is pressed as opposed to cancel |
| 50 | + confirm_button_text (string) : Text on the confirm button. Defaults to 'Confirm' |
| 51 | + confirm_cancel_button_text (string) : Text on the confirm modal cancel button. Defaults to 'Cancel' |
| 52 | + confirm_title (string) : Title for confirm modal. Default 'Confirm Title' |
| 53 | + confirm_content (string) : HTML content for confirm message |
| 54 | + confirm_callback (function) : Callback function for when the confirm button is pressed as opposed to cancel |
55 | 55 |
|
56 | 56 |
|
57 | 57 | === Gallery Options & Events === |
58 | | - gallery_active_class (string) : Active class applied to the currently active image or image slide in a gallery 'gallery_active_item' |
59 | | - before_image_change (function) : Callback function executed before the image slide changes in a gallery modal. Default function( current_item, incoming_item ) |
60 | | - after_image_change (function) : Callback function executed after the image slide changes in a gallery modal. Default function ( current_item ) |
| 58 | + gallery_active_class (string) : Active class applied to the currently active image or image slide in a gallery 'gallery_active_item' |
| 59 | + before_image_change (function) : Callback function executed before the image slide changes in a gallery modal. Default function( current_item, incoming_item ) |
| 60 | + after_image_change (function) : Callback function executed after the image slide changes in a gallery modal. Default function ( current_item ) |
61 | 61 |
|
62 | 62 |
|
63 | 63 | === AJAX Options & Events === |
64 | | - loading_content (string) : HTML content for loading message. Default 'Loading …' |
65 | | - loading_class (string) : Class name to be applied while content is loaded via AJAX. Default 'is_loading' |
66 | | - ajax_error_class (string) : Class name to be applied when content has failed to load. Default is 'modaal-error' |
67 | | - ajax_success (function) : Callback for when AJAX content is loaded in |
| 64 | + loading_content (string) : HTML content for loading message. Default 'Loading …' |
| 65 | + loading_class (string) : Class name to be applied while content is loaded via AJAX. Default 'is_loading' |
| 66 | + ajax_error_class (string) : Class name to be applied when content has failed to load. Default is 'modaal-error' |
| 67 | + ajax_success (function) : Callback for when AJAX content is loaded in |
68 | 68 |
|
69 | 69 |
|
70 | 70 | === SOCIAL CONTENT === |
71 | | - instagram_id (string) : Unique photo ID for an Instagram photo. |
| 71 | + instagram_id (string) : Unique photo ID for an Instagram photo. |
72 | 72 |
|
73 | 73 | */ |
74 | 74 | ( function( $ ) { |
|
944 | 944 | // option: after_callback_delay |
945 | 945 | if ( self.attr('data-modaal-locked') ) { |
946 | 946 | inline_options = true; |
947 | | - options.is_locked = (self.attr('data-modaal-locked') == 'true' || true ? true : false); |
| 947 | + options.is_locked = (self.attr('data-modaal-locked') === 'true' ? true : false); |
948 | 948 | } |
949 | 949 |
|
950 | 950 | // option: hide_close |
951 | 951 | if ( self.attr('data-modaal-hide-close') ) { |
952 | 952 | inline_options = true; |
953 | | - options.hide_close = (self.attr('data-modaal-hide-close') == 'true' || true ? true : false); |
| 953 | + options.hide_close = (self.attr('data-modaal-hide-close') === 'true' ? true : false); |
954 | 954 | } |
955 | 955 |
|
956 | 956 | // option: background |
|
968 | 968 | // option: overlay_close |
969 | 969 | if ( self.attr('data-modaal-overlay-close') ) { |
970 | 970 | inline_options = true; |
971 | | - options.overlay_close = (self.attr('data-modaal-overlay-close') == 'false' || false ? false : true); |
| 971 | + options.overlay_close = (self.attr('data-modaal-overlay-close') === 'false' ? false : true); |
972 | 972 | } |
973 | 973 |
|
974 | 974 | // option: accessible_title |
|
980 | 980 | // option: start_open |
981 | 981 | if ( self.attr('data-modaal-start-open') ) { |
982 | 982 | inline_options = true; |
983 | | - options.start_open = (self.attr('data-modaal-start-open') == 'true' || true ? true : false); |
| 983 | + options.start_open = (self.attr('data-modaal-start-open') === 'true' ? true : false); |
984 | 984 | } |
985 | 985 |
|
986 | 986 | // option: fullscreen |
987 | 987 | if ( self.attr('data-modaal-fullscreen') ) { |
988 | 988 | inline_options = true; |
989 | | - options.fullscreen = (self.attr('data-modaal-fullscreen') == 'true' || true ? true : false); |
| 989 | + options.fullscreen = (self.attr('data-modaal-fullscreen') === 'true' ? true : false); |
990 | 990 | } |
991 | 991 |
|
992 | | - // option: fullscreen |
| 992 | + // option: custom_class |
993 | 993 | if ( self.attr('data-modaal-custom-class') ) { |
994 | 994 | inline_options = true; |
995 | 995 | options.custom_class = self.attr('data-modaal-custom-class'); |
996 | 996 | } |
997 | 997 |
|
998 | | - // option: fullscreen |
| 998 | + // option: background_scroll |
999 | 999 | if ( self.attr('data-modaal-background-scroll') ) { |
1000 | 1000 | inline_options = true; |
1001 | | - options.custom_class = (self.attr('data-modaal-background-scroll') == 'true' || true ? true : false); |
| 1001 | + options.background_scroll = (self.attr('data-modaal-background-scroll') === 'true' ? true : false); |
1002 | 1002 | } |
1003 | 1003 |
|
1004 | 1004 | // option: width |
|
1115 | 1115 | start_open: false, |
1116 | 1116 | fullscreen: false, |
1117 | 1117 | custom_class: '', |
1118 | | - background_scroll: false, |
| 1118 | + background_scroll: false, // TODO: this property isn't described in the header |
1119 | 1119 |
|
1120 | 1120 | width: null, |
1121 | 1121 | height: null, |
|
0 commit comments