Skip to content

Jeremy Groot / stellervista-Intranet

Go to a project
Toggle navigation
Toggle navigation pinning
ee3abc03 by Jeff Balicki
Options

ninja form 

Signed-off-by: Jeff <jeff@gotenzing.com>
1 parent 2f0c6d54
Expand all
Inline Side-by-side
Showing 804 changed files with 4775 additions and 0 deletions
1 # OS Stuff
2 .DS_Store
3
4 # Node Stuff
5 node_modules
6 package-lock.json
7
8 # IDE Stuff
9
10 ## phpStorm
11 .idea
12
13 ## SublimeText
14 *.sublime-workspace
15 *.sublime-project
16
17 # Project Stuff
18 .wakatime-project
19 deploy.sh
1 {
2 "name": "wpninjas/ninja-forms-layout-styles"
3 }
...\ No newline at end of file ...\ No newline at end of file
1 .wp-color-picker{width:80px}.wp-picker-container .hidden{display:none}.wp-color-result{background-color:#f9f9f9;border:1px solid #bbb;border-radius:2px;cursor:pointer;display:inline-block;height:22px;margin:0 6px 6px 0;position:relative;top:1px;user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;vertical-align:bottom;display:inline-block;padding-left:30px}.wp-color-result:after{background:#f3f3f3;background-image:-webkit-gradient(linear,left top,left bottom,from(#fefefe),to(#f4f4f4));background-image:-webkit-linear-gradient(top,#fefefe,#f4f4f4);background-image:-moz-linear-gradient(top,#fefefe,#f4f4f4);background-image:-o-linear-gradient(top,#fefefe,#f4f4f4);background-image:linear-gradient(to bottom,#fefefe,#f4f4f4);color:#333;text-shadow:0 1px 0 #fff;border-radius:0 1px 1px 0;border-left:1px solid #bbb;content:attr(title);display:block;font-size:11px;line-height:22px;padding:0 6px;position:relative;right:0;text-align:center;top:0}.wp-color-result:hover{border-color:#aaa;-webkit-box-shadow:0 1px 2px rgba(0,0,0,0.2);box-shadow:0 1px 1px rgba(0,0,0,0.1)}.wp-color-result:hover:after{color:#222;border-color:#aaa;border-left:1px solid #999}.wp-color-result.wp-picker-open{top:0}.wp-color-result.wp-picker-open:after{content:attr(data-current)}.wp-picker-container,.wp-picker-container:active{display:inline-block;outline:0}.wp-color-result:focus{border-color:#888;-webkit-box-shadow:0 1px 2px rgba(0,0,0,0.2);box-shadow:0 1px 2px rgba(0,0,0,0.2)}.wp-color-result:focus:after{border-color:#888}.wp-picker-open+.wp-picker-input-wrap{display:inline-block;vertical-align:top}.wp-picker-container .button{margin-left:6px}.wp-picker-container .iris-square-slider .ui-slider-handle:focus{background-color:#555}.wp-picker-container .iris-picker{border-color:#dfdfdf;margin-top:6px}input[type="text"].iris-error{background-color:#ffebe8;border-color:#c00;color:#000}
...\ No newline at end of file ...\ No newline at end of file
1 .style-handle {
2 cursor: move;
3 }
4 .hidden {
5 display: none;
6 }
7 .style-layout {
8 width: 450px;
9 float: left;
10 }
11
12 #ninja-forms-style-viewport {
13 max-width: 425px;
14 min-height: 250px;
15 position: relative;
16 overflow: hidden;
17 }
18 #ninja-forms-style-mp-pagination {
19 clear: both;
20 float: none;
21 list-style: none;
22 margin: 20px 0 0;
23 width: 100%;
24 overflow: hidden;
25 }
26 #ninja-forms-style-mp-pagination li{
27 background: #f1f1f1;
28 border: 1px solid #999;
29 border-radius: 3px;
30 cursor: pointer;
31 float: left;
32 margin-right: 3px;
33 padding: 3px 8px;
34 }
35 #ninja-forms-style-mp-pagination li.active{
36 background-color: #278AB7;
37 background-image: -webkit-gradient(linear,left top,left bottom,from(#2E9FD2),to(#21759B));
38 background-image: -webkit-linear-gradient(top,#2E9FD2,#21759B);
39 background-image: -moz-linear-gradient(top,#2E9FD2,#21759B);
40 background-image: -ms-linear-gradient(top,#2E9FD2,#21759B);
41 background-image: -o-linear-gradient(top,#2E9FD2,#21759B);
42 background-image: linear-gradient(to bottom,#2E9FD2,#21759B);
43 border-color: #1B607F;
44 -webkit-box-shadow: inset 0 1px 0 rgba(120, 200, 230, 0.6);
45 box-shadow: inset 0 1px 0 rgba(120, 200, 230, 0.6);
46 color: white;
47 text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
48 }
49 #ninja-forms-style-mp-pagination li.drop-hover{
50 background-color: #278AB7;
51 background-image: -webkit-gradient(linear,left top,left bottom,from(#2E9FD2),to(#21759B));
52 background-image: -webkit-linear-gradient(top,#2E9FD2,#21759B);
53 background-image: -moz-linear-gradient(top,#2E9FD2,#21759B);
54 background-image: -ms-linear-gradient(top,#2E9FD2,#21759B);
55 background-image: -o-linear-gradient(top,#2E9FD2,#21759B);
56 background-image: linear-gradient(to bottom,#2E9FD2,#21759B);
57 border-color: #1B607F;
58 -webkit-box-shadow: inset 0 1px 0 rgba(120, 200, 230, 0.6);
59 box-shadow: inset 0 1px 0 rgba(120, 200, 230, 0.6);
60 color: white;
61 text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
62 }
63 #ninja-forms-style-slide {
64 margin-left: 0;
65 width: 9999px;
66 position: relative;
67 }
68 #ninja-forms-style-slide:after {
69 content: "";
70 display: table;
71 clear: both;
72 }
73 .ninja-forms-style-placeholder {
74 background: red;
75 }
76 .sortable.cols-1 {
77 width: 150px;
78 }
79
80 .sortable.cols-2 {
81 width: 250px;
82 }
83
84 .sortable.cols-3 {
85 width: 350px;
86 }
87
88 .sortable.cols-4 {
89 width: 450px;
90 }
91
92 .sortable li {
93 margin: 1px 1px 1px 0;
94 padding: 1px;
95 float: left;
96 font-size: 2em;
97 text-align: center;
98 }
99
100 .sortable li.span-1 {
101 width: 100px;
102 }
103 .sortable li.span-2 {
104 width: 205px;
105 }
106
107 .sortable li.span-3 {
108 width: 309px;
109 }
110
111 .sortable li.span-4 {
112 width: 415px;
113 }
114
115 .sortable li a {
116 font-size: 0.5em;
117 cursor: pointer;
118 }
119 /*
120 .form-table th {
121 width: auto;
122 }
123 */
124 .ninja-forms-style-sortable li {
125 background: #f1f1f1;
126 border-radius: 3px;
127 }
128 .ninja-forms-style-sortable li span {
129 background: #999;
130 border-top-left-radius: 3px;
131 border-top-right-radius: 3px;
132 color: #fff;
133 display: block;
134 margin: -2px -2px 2px;
135 font-size: 12px;
136 padding: 2px;
137 }
138 .ninja-forms-style-button {
139 background: #f3f3f3;
140 background-image: -webkit-gradient(linear,left top,left bottom,from(#fefefe),to(#f4f4f4));
141 background-image: -webkit-linear-gradient(top,#fefefe,#f4f4f4);
142 background-image: -moz-linear-gradient(top,#fefefe,#f4f4f4);
143 background-image: -o-linear-gradient(top,#fefefe,#f4f4f4);
144 background-image: linear-gradient(to bottom,#fefefe,#f4f4f4);
145 border-color: #bbb;
146 color: #333;
147 text-shadow: 0 1px 0 #fff;
148 display: inline-block;
149 text-decoration: none;
150 font-size: 12px;
151 line-height: 22px;
152 height: 24px;
153 margin: 2px 0;
154 padding: 0 10px;
155 cursor: pointer;
156 border-width: 1px;
157 border-style: solid;
158 -webkit-border-radius: 3px;
159 -webkit-appearance: none;
160 border-radius: 3px;
161 white-space: nowrap;
162 -webkit-box-sizing: border-box;
163 -moz-box-sizing: border-box;
164 box-sizing: border-box;
165 }
166 .ninja-forms-style-button:hover {
167 border-color: #999;
168 }
169 .ninja-custom-css {
170 width: 100%;
171 height: 150px;
172 }
173
174 .layout-error {
175 background: #dd3d36 !important;
176 border: 1px solid #dd3d36 !important;
177 height: 96px;
178 position: relative;
179 }
180 .layout-error-msg {
181 color: #fff;
182 font-size: 14px;
183 padding: 10px;
184 }
1 [class*='ninja-col-'] {
2 float: left;
3 padding: 0 5px;
4 }
5
6 /*[class*='ninja-col-']:last-of-type {
7 padding-right: 0;
8 }*/
9
10 .ninja-col-1-2 { width: 50%; }
11 .ninja-col-2-2 { width: 100%; }
12
13 .ninja-col-1-3 { width: 33.33%; }
14 .ninja-col-2-3 { width: 66.66%; }
15 .ninja-col-3-3 { width: 100%; }
16
17 .ninja-col-1-4 { width: 25%; }
18 .ninja-col-2-4 { width: 50%; }
19 .ninja-col-3-4 { width: 75%; }
20 .ninja-col-4-4 { width: 100%; }
21
22 .ninja-row { width: auto; margin: 0 auto; padding: 0; }
23
24 .ninja-row:after {
25 content: "";
26 display: table;
27 clear: both;
28 }
29
30 .nf-2col-list-checkbox-wrap li,
31 .nf-2col-list-radio-wrap li {
32 float: left;
33 padding: 0 5px;
34 width: 50%;
35 }
36
37 .nf-3col-list-checkbox-wrap li,
38 .nf-3col-list-radio-wrap li {
39 float: left;
40 padding: 0 5px;
41 width: 33.33%;
42 }
43
44 .nf-4col-list-checkbox-wrap li,
45 .nf-4col-list-radio-wrap li {
46 float: left;
47 padding: 0 5px;
48 width: 25%;
49 }
50
51 /*.ninja-row > [class*='ninja-col-']:last-of-type {
52 padding-right: 5px;
53 }*/
54
55 /* =Responsive Structure
56 ----------------------------------------------- */
57
58 @media only screen and (max-width: 600px) {
59 .ninja-row [class*='ninja-col-'],
60 .nf-2col-list-checkbox-wrap li,
61 .nf-2col-list-radio-wrap li,
62 .nf-3col-list-checkbox-wrap li,
63 .nf-3col-list-radio-wrap li,
64 .nf-4col-list-checkbox-wrap li,
65 .nf-4col-list-radio-wrap li {
66 width: 100%;
67 margin-right: 0;
68 }
69 }
1 <?php
2
3 //Add Styling to the admin menu
4 add_action( 'admin_menu', 'ninja_forms_add_style_menu', 99 );
5 function ninja_forms_add_style_menu(){
6
7 $capabilities = 'administrator';
8 $capabilities = apply_filters( 'ninja_forms_admin_menu_capabilities', $capabilities );
9
10 $style = add_submenu_page( 'ninja-forms', __( 'Ninja Forms - Layout & Styles', 'ninja-forms-style' ), __( 'Styling', 'ninja-forms-style' ), $capabilities, 'ninja-forms-style', 'ninja_forms_admin' );
11 add_action('admin_print_styles-' . $style, 'ninja_forms_admin_js');
12 add_action('admin_print_styles-' . $style, 'ninja_forms_style_admin_js');
13 add_action('admin_print_styles-' . $style, 'ninja_forms_admin_css');
14 add_action('admin_print_styles-' . $style, 'ninja_forms_style_admin_css');
15 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 add_action('wp_ajax_ninja_forms_style_field_styling', 'ninja_forms_style_field_styling');
4 function ninja_forms_style_field_styling(){
5 global $ninja_forms_style_metaboxes;
6 $field_id = $_REQUEST['field_id'];
7 $field_row = ninja_forms_get_field_by_id( $field_id );
8 $field_type = $field_row['type'];
9
10 ?>
11 <input type="hidden" name="field_id" value="<?php echo $field_id;?>">
12 <?php
13 ninja_forms_style_advanced_checkbox_display();
14
15 do_action( 'ninja_forms_style_field_metaboxes', $field_id );
16
17 if( is_array( $ninja_forms_style_metaboxes['page']['field'] ) ){
18 foreach( $ninja_forms_style_metaboxes['page']['field'] as $key=>$args ){
19 ninja_forms_output_tab_metabox('', $args['slug'], $args);
20 }
21 }
22
23 if( isset( $ninja_forms_style_metaboxes['field'][$field_type] ) AND is_array( $ninja_forms_style_metaboxes['field'][$field_type] ) ){
24 foreach( $ninja_forms_style_metaboxes['field'][$field_type] as $key=>$args ){
25 ninja_forms_output_tab_metabox('', $args['slug'], $args);
26 }
27 }
28
29 die();
30 }
31
32 function ninja_forms_style_field_metabox_output( $metabox ){
33 $field_id = $_REQUEST['field_id'];
34 $metabox['field_id'] = $field_id;
35 ninja_forms_style_metabox_output( $metabox );
36 }
37
38 add_action('wp_ajax_ninja_forms_style_field_styling_save', 'ninja_forms_style_field_styling_save');
39 function ninja_forms_style_field_styling_save(){
40 $data = $_REQUEST['data'];
41
42 $advanced = $data['advanced'];
43 unset( $data['advanced'] );
44 $field_id = $data['field_id'];
45 unset( $data['field_id'] );
46
47 $field_row = ninja_forms_get_field_by_id( $field_id );
48 $field_data = $field_row['data'];
49
50 $tmp_array = array();
51 foreach( $data as $group => $d ){
52 $field_data['style']['groups'][$group] = $d;
53 }
54
55 $field_data = serialize( $field_data );
56
57 $args = array(
58 'update_array' => array(
59 'data' => $field_data,
60 ),
61 'where' => array(
62 'id' => $field_id,
63 ),
64 );
65 ninja_forms_update_field( $args );
66
67 $plugin_settings = get_option( 'ninja_forms_settings' );
68
69 $plugin_settings['style']['advanced'] = $advanced;
70
71 update_option( 'ninja_forms_settings', $plugin_settings);
72
73 die();
74 }
75
76 add_action('wp_ajax_ninja_forms_style_form_styling_save', 'ninja_forms_style_form_styling_save');
77 function ninja_forms_style_form_styling_save(){
78 $data = $_REQUEST['data'];
79
80 $advanced = $data['advanced'];
81 unset( $data['advanced'] );
82 $form_id = $data['form_id'];
83 unset( $data['form_id'] );
84
85 $form_row = ninja_forms_get_form_by_id( $form_id );
86 $form_data = $form_row['data'];
87
88 if( isset( $data['container'] ) ){
89 $form_data['style']['groups']['container'] = $data['container'];
90 }
91
92 if( isset( $data['title'] ) ){
93 $form_data['style']['groups']['title'] = $data['title'];
94 }
95
96 if( isset( $data['row'] ) ){
97 $form_data['style']['groups']['row'] = $data['row'];
98 }
99
100 if( isset( $data['row-odd'] ) ){
101 $form_data['style']['groups']['row-odd'] = $data['row-odd'];
102 }
103
104 if( isset( $data['success-msg'] ) ){
105 $form_data['style']['groups']['success-msg'] = $data['success-msg'];
106 }
107
108 if( isset( $data['error_msg'] ) ){
109 $form_data['style']['groups']['error_msg'] = $data['error_msg'];
110 }
111
112 if ( is_array( $form_data ) ) {
113 foreach ( $form_data as $key => $val ) {
114 Ninja_Forms()->form( $form_id )->update_setting( $key, $val );
115 }
116 }
117
118 Ninja_Forms()->form( $form_id )->dump_cache();
119
120 $plugin_settings = get_option( 'ninja_forms_settings' );
121
122 $plugin_settings['style']['advanced'] = $advanced;
123
124 update_option( 'ninja_forms_settings', $plugin_settings);
125
126 die();
127 }
1 <?php
2
3 add_action( 'init', 'ninja_forms_register_tab_impexp_style', 11 );
4 function ninja_forms_register_tab_impexp_style(){
5 $args = array(
6 'name' => __( 'Styles', 'ninja-forms-style' ),
7 'page' => 'ninja-forms-impexp',
8 'display_function' => '',
9 'save_function' => 'ninja_forms_save_impexp_style',
10 'show_save' => false,
11 );
12 if( function_exists( 'ninja_forms_register_tab' ) ){
13 ninja_forms_register_tab( 'impexp_style', $args );
14 }
15 }
16
17 add_action( 'init', 'ninja_forms_register_imp_style_metabox' );
18 function ninja_forms_register_imp_style_metabox(){
19 $args = array(
20 'page' => 'ninja-forms-impexp',
21 'tab' => 'impexp_style',
22 'slug' => 'imp_style',
23 'title' => __( 'Import Default Styles', 'ninja-forms-style' ),
24 'settings' => array(
25 array(
26 'name' => 'userfile',
27 'type' => 'file',
28 'label' => __( 'Select a file', 'ninja-forms-style' ),
29 'desc' => '',
30 'max_file_size' => 5000000,
31 'help_text' => '',
32 ),
33 array(
34 'name' => 'submit',
35 'type' => 'submit',
36 'label' => __( 'Import Styles', 'ninja-forms-style' ),
37 'class' => 'button-secondary',
38 ),
39 ),
40 );
41 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
42 ninja_forms_register_tab_metabox($args);
43 }
44 }
45
46 add_action('init', 'ninja_forms_register_exp_style_metabox');
47 function ninja_forms_register_exp_style_metabox(){
48
49 $args = array(
50 'page' => 'ninja-forms-impexp',
51 'tab' => 'impexp_style',
52 'slug' => 'exp_style',
53 'title' => __( 'Export Styles', 'ninja-forms-style' ),
54 'settings' => array(
55 array(
56 'name' => 'submit',
57 'type' => 'submit',
58 'label' => __( 'Export Styles', 'ninja-forms-style' ),
59 'class' => 'button-secondary',
60 ),
61 ),
62 );
63 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
64 ninja_forms_register_tab_metabox($args);
65 }
66 }
67
68 function ninja_forms_save_impexp_style( $data ){
69 if( isset( $data['submit'] ) ){
70 switch( $data['submit'] ){
71 case __( 'Import Styles', 'ninja-forms-style' ):
72 if( $_FILES['userfile']['error'] == UPLOAD_ERR_OK AND is_uploaded_file( $_FILES['userfile']['tmp_name'] ) ){
73 $plugin_settings = get_option( 'ninja_forms_settings' );
74 $file = file_get_contents($_FILES['userfile']['tmp_name']);
75 $style = unserialize( $file );
76 $plugin_settings['style'] = $style;
77 update_option( 'ninja_forms_settings', $plugin_settings );
78 $update_msg = __( 'Styles Imported', 'ninja-forms-style' );
79 return $update_msg;
80 }
81 break;
82 case __( 'Export Styles', 'ninja-forms-style' ):
83 $download = ninja_forms_export_style();
84 $update_msg = __( 'Styles Exported Successfully', 'ninja-forms-style' );
85 if( $download == 1 ){
86 $update_msg = __( 'No Styles Found', 'ninja-forms-style' );
87 }
88 return $update_msg;
89 break;
90 }
91 }
92 }
93
94 function ninja_forms_export_style(){
95 $plugin_settings = get_option( 'ninja_forms_settings' );
96 if( isset( $plugin_settings['style'] ) ){
97 $style = $plugin_settings['style'];
98 }else{
99 $style = '';
100 }
101
102 if( $style == '' ){
103 return 1;
104 }else{
105
106 if(isset($plugin_settings['date_format'])){
107 $date_format = $plugin_settings['date_format'];
108 }else{
109 $date_format = 'm/d/Y';
110 }
111
112 $current_time = current_time('timestamp');
113 $today = date($date_format, $current_time);
114
115 $style = serialize( $style );
116 header("Content-type: application/csv");
117 header("Content-Disposition: attachment; filename=ninja-forms-styles-".$today.".nfs");
118 header("Pragma: no-cache");
119 header("Expires: 0");
120 echo $style;
121 die();
122 }
123 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 add_action( 'init', 'ninja_forms_register_tab_style_datepicker_settings' );
4 function ninja_forms_register_tab_style_datepicker_settings(){
5 $args = array(
6 'name' => __( 'DatePicker Styles', 'ninja-forms-style' ),
7 'page' => 'ninja-forms-style',
8 'display_function' => 'ninja_forms_style_advanced_checkbox_display',
9 'save_function' => 'ninja_forms_save_style_datepicker_settings',
10 );
11 if( function_exists( 'ninja_forms_register_tab' ) ){
12 ninja_forms_register_tab( 'datepicker_settings', $args );
13 }
14 }
15
16 add_action( 'init', 'ninja_forms_register_style_datepicker_settings_metaboxes' );
17 function ninja_forms_register_style_datepicker_settings_metaboxes(){
18 $args = array(
19 'page' => 'ninja-forms-style',
20 'tab' => 'datepicker_settings',
21 'slug' => 'datepicker_container',
22 'title' => __( 'DatePicker Container', 'ninja-forms-style' ),
23 'state' => 'closed',
24 'display_function' => 'ninja_forms_style_metabox_output',
25 'save_page' => 'form_settings',
26 'css_selector' => 'div#ui-datepicker-div',
27 'css_exclude' => array( 'float', 'padding', 'margin' ),
28 );
29
30 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
31 ninja_forms_register_tab_metabox($args);
32 }
33
34 $args = array(
35 'page' => 'ninja-forms-style',
36 'tab' => 'datepicker_settings',
37 'slug' => 'datepicker_header',
38 'title' => __( 'DatePicker Header', 'ninja-forms-style' ),
39 'state' => 'closed',
40 'display_function' => 'ninja_forms_style_metabox_output',
41 'save_page' => 'form_settings',
42 'css_selector' => 'div#ui-datepicker-div .ui-datepicker-header',
43 'css_exclude' => array( 'float', 'margin' ),
44 );
45
46 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
47 ninja_forms_register_tab_metabox($args);
48 }
49
50 $args = array(
51 'page' => 'ninja-forms-style',
52 'tab' => 'datepicker_settings',
53 'slug' => 'datepicker_week',
54 'title' => __( 'DatePicker Week Days', 'ninja-forms-style' ),
55 'state' => 'closed',
56 'display_function' => 'ninja_forms_style_metabox_output',
57 'save_page' => 'form_settings',
58 'css_selector' => 'div#ui-datepicker-div .ui-datepicker-calendar th',
59 'css_exclude' => array( 'float', 'margin' ),
60 );
61
62 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
63 ninja_forms_register_tab_metabox($args);
64 }
65
66 $args = array(
67 'page' => 'ninja-forms-style',
68 'tab' => 'datepicker_settings',
69 'slug' => 'datepicker_days',
70 'title' => __( 'DatePicker Days', 'ninja-forms-style' ),
71 'state' => 'closed',
72 'display_function' => 'ninja_forms_style_metabox_output',
73 'save_page' => 'form_settings',
74 'css_selector' => 'div#ui-datepicker-div .ui-datepicker-calendar td',
75 'css_exclude' => array( 'float', 'margin' ),
76 );
77
78 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
79 ninja_forms_register_tab_metabox($args);
80 }
81
82 $args = array(
83 'page' => 'ninja-forms-style',
84 'tab' => 'datepicker_settings',
85 'slug' => 'datepicker_prev',
86 'title' => __( 'DatePicker Prev Link', 'ninja-forms-style' ),
87 'state' => 'closed',
88 'display_function' => 'ninja_forms_style_metabox_output',
89 'save_page' => 'form_settings',
90 'css_selector' => 'div#ui-datepicker-div .ui-datepicker-prev',
91 'css_exclude' => array( 'float', 'margin' ),
92 );
93
94 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
95 ninja_forms_register_tab_metabox($args);
96 }
97
98 $args = array(
99 'page' => 'ninja-forms-style',
100 'tab' => 'datepicker_settings',
101 'slug' => 'datepicker_next',
102 'title' => __( 'DatePicker Next Link', 'ninja-forms-style' ),
103 'state' => 'closed',
104 'display_function' => 'ninja_forms_style_metabox_output',
105 'save_page' => 'form_settings',
106 'css_selector' => 'div#ui-datepicker-div .ui-datepicker-next',
107 'css_exclude' => array( 'float', 'margin' ),
108 );
109
110 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
111 ninja_forms_register_tab_metabox($args);
112 }
113
114 }
115
116 function ninja_forms_save_style_datepicker_settings( $data ){
117 $plugin_settings = get_option( 'ninja_forms_settings' );
118
119 $plugin_settings['style']['form_settings']['datepicker_container'] = $data['datepicker_container'];
120 $plugin_settings['style']['form_settings']['datepicker_header'] = $data['datepicker_header'];
121 $plugin_settings['style']['form_settings']['datepicker_week'] = $data['datepicker_week'];
122 $plugin_settings['style']['form_settings']['datepicker_days'] = $data['datepicker_days'];
123 $plugin_settings['style']['form_settings']['datepicker_prev'] = $data['datepicker_prev'];
124 $plugin_settings['style']['form_settings']['datepicker_next'] = $data['datepicker_next'];
125
126 update_option( 'ninja_forms_settings', $plugin_settings);
127 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 add_action( 'init', 'ninja_forms_register_tab_style_error_settings' );
4 function ninja_forms_register_tab_style_error_settings(){
5 $args = array(
6 'name' => __( 'Error Styles', 'ninja-forms-style' ),
7 'page' => 'ninja-forms-style',
8 'display_function' => 'ninja_forms_style_advanced_checkbox_display',
9 'save_function' => 'ninja_forms_save_style_error_settings',
10 );
11 if( function_exists( 'ninja_forms_register_tab' ) ){
12 ninja_forms_register_tab( 'error_settings', $args );
13 }
14 }
15
16 add_action( 'init', 'ninja_forms_register_style_error_settings_metaboxes' );
17 function ninja_forms_register_style_error_settings_metaboxes(){
18 $args = array(
19 'page' => 'ninja-forms-style',
20 'tab' => 'error_settings',
21 'slug' => 'error_msg',
22 'title' => __( 'Error Message Main Wrap Styles', 'ninja-forms-style' ),
23 'state' => 'closed',
24 'display_function' => 'ninja_forms_style_metabox_output',
25 'save_page' => 'form_settings',
26 'css_selector' => 'div.ninja-forms-error-msg',
27 'css_exclude' => array( 'float' ),
28 );
29
30 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
31 ninja_forms_register_tab_metabox($args);
32 }
33
34 $args = array(
35 'page' => 'ninja-forms-style',
36 'tab' => 'error_settings',
37 'slug' => 'field_error_wrap',
38 'title' => __( 'Error Field Wrap Styles', 'ninja-forms-style' ),
39 'state' => 'closed',
40 'display_function' => 'ninja_forms_style_metabox_output',
41 'save_page' => 'form_settings',
42 'css_selector' => 'div.ninja-forms-error',
43 'css_exclude' => array( 'float' ),
44 );
45
46 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
47 ninja_forms_register_tab_metabox($args);
48 }
49
50 $args = array(
51 'page' => 'ninja-forms-style',
52 'tab' => 'error_settings',
53 'slug' => 'field_error_label',
54 'title' => __( 'Error Label Styles', 'ninja-forms-style' ),
55 'state' => 'closed',
56 'display_function' => 'ninja_forms_style_metabox_output',
57 'save_page' => 'form_settings',
58 'css_selector' => 'div.ninja-forms-error label',
59 'css_exclude' => array( 'float' ),
60 );
61
62 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
63 ninja_forms_register_tab_metabox($args);
64 }
65
66 $args = array(
67 'page' => 'ninja-forms-style',
68 'tab' => 'error_settings',
69 'slug' => 'field_error_element',
70 'title' => __( 'Error Element Styles', 'ninja-forms-style' ),
71 'state' => 'closed',
72 'display_function' => 'ninja_forms_style_metabox_output',
73 'save_page' => 'form_settings',
74 'css_selector' => 'div.ninja-forms-error .ninja-forms-field',
75 'css_exclude' => array( 'float' ),
76 );
77
78 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
79 ninja_forms_register_tab_metabox($args);
80 }
81
82 $args = array(
83 'page' => 'ninja-forms-style',
84 'tab' => 'error_settings',
85 'slug' => 'field_error_msg',
86 'title' => __( 'Error Message Styles', 'ninja-forms-style' ),
87 'state' => 'closed',
88 'display_function' => 'ninja_forms_style_metabox_output',
89 'save_page' => 'form_settings',
90 'css_selector' => 'div.ninja-forms-error div.ninja-forms-field-error',
91 'css_exclude' => array( 'float' ),
92 );
93
94 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
95 ninja_forms_register_tab_metabox($args);
96 }
97
98 }
99
100 function ninja_forms_save_style_error_settings( $data ){
101 $plugin_settings = get_option( 'ninja_forms_settings' );
102
103 $plugin_settings['style']['form_settings']['error_msg'] = $data['error_msg'];
104 $plugin_settings['style']['form_settings']['field_error_wrap'] = $data['field_error_wrap'];
105 $plugin_settings['style']['form_settings']['field_error_label'] = $data['field_error_label'];
106 $plugin_settings['style']['form_settings']['field_error_element'] = $data['field_error_element'];
107 $plugin_settings['style']['form_settings']['field_error_element'] = $data['field_error_element'];
108 $plugin_settings['style']['form_settings']['field_error_msg'] = $data['field_error_msg'];
109
110 update_option( 'ninja_forms_settings', $plugin_settings);
111 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 add_action( 'init', 'ninja_forms_register_tab_style_field_settings' );
4 function ninja_forms_register_tab_style_field_settings(){
5 $args = array(
6 'name' => __( 'Default Field Styles', 'ninja-forms-style' ),
7 'page' => 'ninja-forms-style',
8 'display_function' => 'ninja_forms_style_advanced_checkbox_display',
9 'save_function' => 'ninja_forms_save_style_field_settings',
10 );
11 if( function_exists( 'ninja_forms_register_tab' ) ){
12 ninja_forms_register_tab( 'field_settings', $args );
13 }
14 }
15
16 add_action( 'init', 'ninja_forms_register_style_field_settings_metaboxes' );
17
18 function ninja_forms_register_style_field_settings_metaboxes(){
19 $args = array(
20 'page' => 'ninja-forms-style',
21 'tab' => 'field_settings',
22 'slug' => 'wrap',
23 'title' => __( 'Wrap Styles', 'ninja-forms-style' ),
24 'state' => 'closed',
25 'display_function' => 'ninja_forms_style_metabox_output',
26 'save_page' => 'field_settings',
27 'css_selector' => 'div.field-wrap',
28 );
29
30 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
31 ninja_forms_register_tab_metabox($args);
32 }
33
34 $args = array(
35 'page' => 'ninja-forms-style',
36 'tab' => 'field_settings',
37 'slug' => 'label',
38 'title' => __( 'Label Styles', 'ninja-forms-style'),
39 'state' => 'closed',
40 'display_function' => 'ninja_forms_style_metabox_output',
41 'save_page' => 'field_settings',
42 'css_selector' => 'div.field-wrap label',
43 );
44
45 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
46 ninja_forms_register_tab_metabox($args);
47 }
48
49 $args = array(
50 'page' => 'ninja-forms-style',
51 'tab' => 'field_settings',
52 'slug' => 'field',
53 'title' => __( 'Element Styles', 'ninja-forms-style' ),
54 'state' => 'closed',
55 'display_function' => 'ninja_forms_style_metabox_output',
56 'save_page' => 'field_settings',
57 'css_selector' => '.ninja-forms-field',
58 'css_exclude' => array( 'width', 'height', 'etc' ),
59 );
60
61 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
62 ninja_forms_register_tab_metabox($args);
63 }
64
65 }
66
67 function ninja_forms_save_style_field_settings( $data ){
68 $plugin_settings = get_option( 'ninja_forms_settings' );
69
70 $plugin_settings['style']['advanced'] = $data['advanced'];
71
72 $plugin_settings['style']['field_settings']['wrap'] = $data['wrap'];
73 $plugin_settings['style']['field_settings']['label'] = $data['label'];
74 $plugin_settings['style']['field_settings']['field'] = $data['field'];
75
76 update_option( 'ninja_forms_settings', $plugin_settings);
77 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 add_action( 'admin_init', 'ninja_forms_register_style_sidebar_select_field' );
4 function ninja_forms_register_style_sidebar_select_field(){
5 $args = array(
6 'name' => __( 'Select A Field Type', 'ninja-forms-style' ),
7 'page' => 'ninja-forms-style',
8 'tab' => 'field_type_settings',
9 'display_function' => 'ninja_forms_style_sidebar_select_field_display',
10 'save_function' => '',
11 );
12
13 if( function_exists( 'ninja_forms_register_sidebar' ) ){
14 ninja_forms_register_sidebar('select_subs', $args);
15 }
16
17 }
18
19 function ninja_forms_style_sidebar_select_field_display(){
20 global $ninja_forms_fields;
21 $ninja_forms_fields['_list']['type_dropdown_function'] = 'ninja_forms_list_field_type_dropdown';
22 $args = array();
23 if( isset( $_REQUEST['field_type'] ) ){
24 $args['selected'] = $_REQUEST['field_type'];
25 }
26 ninja_forms_field_type_dropdown( $args );
27 }
28
29 /*
30 *
31 * Function that outputs select options for our "list" field type, since it has sub-types.
32 *
33 * @since 1.0.3
34 * @returns string $output
35 */
36
37 function ninja_forms_list_field_type_dropdown( $selected ){
38 $output = '<option value="" disabled>' . __( 'List', 'ninja-forms-style' ) . '</option>';
39
40 if ( $selected == '_list-dropdown' ) {
41 $select = 'selected="selected"';
42 } else {
43 $select = '';
44 }
45 $output .= '<option value="_list-dropdown" '.$select.'>&nbsp;&nbsp;&nbsp;&nbsp;' . __( 'Dropdown (Select)', 'ninja-forms-style' ) . '</option>';
46
47 if ( $selected == '_list-radio' ) {
48 $select = 'selected="selected"';
49 } else {
50 $select = '';
51 }
52 $output .= '<option value="_list-radio" '.$select.'>&nbsp;&nbsp;&nbsp;&nbsp;' . __( 'Radio', 'ninja-forms-style' ) . '</option>';
53
54 if ( $selected == '_list-checkbox' ) {
55 $select = 'selected="selected"';
56 } else {
57 $select = '';
58 }
59 $output .= '<option value="_list-checkbox" '.$select.'>&nbsp;&nbsp;&nbsp;&nbsp;' . __( 'Checkboxes', 'ninja-forms-style' ) . '</option>';
60
61 if ( $selected == '_list-multi' ) {
62 $select = 'selected="selected"';
63 } else {
64 $select = '';
65 }
66 $output .= '<option value="_list-multi" '.$select.'>&nbsp;&nbsp;&nbsp;&nbsp;' . __( 'Multi-Select', 'ninja-forms-style' ) . '</option>';
67
68 return $output;
69 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 add_action( 'init', 'ninja_forms_register_tab_style_form_settings' );
4 function ninja_forms_register_tab_style_form_settings(){
5 $args = array(
6 'name' => __( 'Form Styles', 'ninja-forms-style' ),
7 'page' => 'ninja-forms-style',
8 'display_function' => 'ninja_forms_style_advanced_checkbox_display',
9 'save_function' => 'ninja_forms_save_style_form_settings',
10 );
11 if( function_exists( 'ninja_forms_register_tab' ) ){
12 ninja_forms_register_tab( 'form_settings', $args );
13 }
14 }
15
16 add_action( 'init', 'ninja_forms_register_style_form_settings_metaboxes' );
17 function ninja_forms_register_style_form_settings_metaboxes(){
18 $args = array(
19 'page' => 'ninja-forms-style',
20 'tab' => 'form_settings',
21 'slug' => 'container',
22 'title' => __( 'Container Styles', 'ninja-forms-style' ),
23 'state' => 'closed',
24 'display_function' => 'ninja_forms_style_metabox_output',
25 'save_page' => 'form_settings',
26 'css_selector' => 'div.ninja-forms-form-wrap',
27 'css_exclude' => '',
28 );
29
30 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
31 ninja_forms_register_tab_metabox($args);
32 }
33
34 $args = array(
35 'page' => 'ninja-forms-style',
36 'tab' => 'form_settings',
37 'slug' => 'title',
38 'title' => __( 'Title Styles', 'ninja-forms-style' ),
39 'state' => 'closed',
40 'display_function' => 'ninja_forms_style_metabox_output',
41 'save_page' => 'form_settings',
42 'css_selector' => 'h2.ninja-forms-form-title',
43 'css_exclude' => '',
44 );
45
46 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
47 ninja_forms_register_tab_metabox($args);
48 }
49
50 $args = array(
51 'page' => 'ninja-forms-style',
52 'tab' => 'form_settings',
53 'slug' => 'required-message',
54 'title' => __( 'Required Message Styles', 'ninja-forms-style' ),
55 'state' => 'closed',
56 'display_function' => 'ninja_forms_style_metabox_output',
57 'save_page' => 'form_settings',
58 'css_selector' => '.ninja-forms-required-items',
59 'css_exclude' => '',
60 );
61
62 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
63 ninja_forms_register_tab_metabox($args);
64 }
65
66 $args = array(
67 'page' => 'ninja-forms-style',
68 'tab' => 'form_settings',
69 'slug' => 'row',
70 'title' => __( 'Row Styles', 'ninja-forms-style' ),
71 'state' => 'closed',
72 'display_function' => 'ninja_forms_style_metabox_output',
73 'save_page' => 'form_settings',
74 'css_selector' => 'div.ninja-row',
75 'css_exclude' => array( 'float' ),
76 );
77
78 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
79 ninja_forms_register_tab_metabox($args);
80 }
81
82 $args = array(
83 'page' => 'ninja-forms-style',
84 'tab' => 'form_settings',
85 'slug' => 'row-odd',
86 'title' => __( 'Odd Row Styles', 'ninja-forms-style' ),
87 'state' => 'closed',
88 'display_function' => 'ninja_forms_style_metabox_output',
89 'save_page' => 'form_settings',
90 'css_selector' => 'div.ninja-row:nth-child(odd)',
91 'css_exclude' => array( 'float' ),
92 );
93
94 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
95 ninja_forms_register_tab_metabox($args);
96 }
97
98 $args = array(
99 'page' => 'ninja-forms-style',
100 'tab' => 'form_settings',
101 'slug' => 'success-msg',
102 'title' => __( 'Success Response Message Styles', 'ninja-forms-style' ),
103 'state' => 'closed',
104 'display_function' => 'ninja_forms_style_metabox_output',
105 'save_page' => 'form_settings',
106 'css_selector' => 'div.ninja-forms-success-msg',
107 'css_exclude' => array( 'float' ),
108 );
109
110 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
111 ninja_forms_register_tab_metabox($args);
112 }
113 }
114
115 function ninja_forms_save_style_form_settings( $data ){
116 $plugin_settings = get_option( 'ninja_forms_settings' );
117
118 $plugin_settings['style']['advanced'] = $data['advanced'];
119 $plugin_settings['style']['form_settings']['container'] = $data['container'];
120 $plugin_settings['style']['form_settings']['title'] = $data['title'];
121 $plugin_settings['style']['form_settings']['required-message'] = $data['required-message'];
122 $plugin_settings['style']['form_settings']['row'] = $data['row'];
123 $plugin_settings['style']['form_settings']['row-odd'] = $data['row-odd'];
124 $plugin_settings['style']['form_settings']['success-msg'] = $data['success-msg'];
125
126 update_option( 'ninja_forms_settings', $plugin_settings);
127 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 add_action( 'init', 'ninja_forms_register_tab_style_mp_settings' );
4 function ninja_forms_register_tab_style_mp_settings(){
5 $args = array(
6 'name' => __( 'Multi-Part Styles', 'ninja-forms-style' ),
7 'page' => 'ninja-forms-style',
8 'display_function' => 'ninja_forms_style_advanced_checkbox_display',
9 'save_function' => 'ninja_forms_save_style_mp_settings',
10 );
11 if( function_exists( 'ninja_forms_register_tab' ) && function_exists( 'ninja_forms_mp_load_translations' ) ){
12 ninja_forms_register_tab( 'mp_settings', $args );
13 }
14 }
15
16 add_action( 'init', 'ninja_forms_register_style_mp_settings_metaboxes' );
17 function ninja_forms_register_style_mp_settings_metaboxes(){
18
19 $args = array(
20 'page' => 'ninja-forms-style',
21 'tab' => 'mp_settings',
22 'slug' => 'mp_page',
23 'title' => __( 'Form Page', 'ninja-forms-style' ),
24 'state' => 'closed',
25 'display_function' => 'ninja_forms_style_metabox_output',
26 'save_page' => 'form_settings',
27 'css_selector' => 'div .ninja-forms-mp-page',
28 //'css_exclude' => array( 'float' ),
29 );
30
31 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
32 ninja_forms_register_tab_metabox($args);
33 }
34
35 $args = array(
36 'page' => 'ninja-forms-style',
37 'tab' => 'mp_settings',
38 'slug' => 'mp_breadcrumb_container',
39 'title' => __( 'Breadcrumb Container', 'ninja-forms-style' ),
40 'state' => 'closed',
41 'display_function' => 'ninja_forms_style_metabox_output',
42 'save_page' => 'form_settings',
43 'css_selector' => '.ninja-forms-form ul.ninja-forms-mp-breadcrumbs',
44 //'css_exclude' => array( 'float', 'padding', 'margin' ),
45 );
46
47 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
48 ninja_forms_register_tab_metabox($args);
49 }
50
51 $args = array(
52 'page' => 'ninja-forms-style',
53 'tab' => 'mp_settings',
54 'slug' => 'mp_breadcrumb_buttons',
55 'title' => __( 'Breadcrumb Buttons', 'ninja-forms-style' ),
56 'state' => 'closed',
57 'display_function' => 'ninja_forms_style_metabox_output',
58 'save_page' => 'form_settings',
59 'css_selector' => '.ninja-forms-form ul.ninja-forms-mp-breadcrumbs li input[type=submit]',
60 //'css_exclude' => array( 'float', 'margin' ),
61 );
62
63 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
64 ninja_forms_register_tab_metabox($args);
65 }
66
67 $args = array(
68 'page' => 'ninja-forms-style',
69 'tab' => 'mp_settings',
70 'slug' => 'mp_breadcrumb_hover',
71 'title' => __( 'Breadcrumb Button Hover', 'ninja-forms-style' ),
72 'state' => 'closed',
73 'display_function' => 'ninja_forms_style_metabox_output',
74 'save_page' => 'form_settings',
75 'css_selector' => '.ninja-forms-form ul.ninja-forms-mp-breadcrumbs li input[type=submit]:hover',
76 'css_exclude' => array( 'float', 'margin' ),
77 );
78
79 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
80 ninja_forms_register_tab_metabox($args);
81 }
82
83 $args = array(
84 'page' => 'ninja-forms-style',
85 'tab' => 'mp_settings',
86 'slug' => 'mp_breadcrumb_active',
87 'title' => __( 'Breadcrumb Active Button', 'ninja-forms-style' ),
88 'state' => 'closed',
89 'display_function' => 'ninja_forms_style_metabox_output',
90 'save_page' => 'form_settings',
91 'css_selector' => '.ninja-forms-form ul.ninja-forms-mp-breadcrumbs li input[type=submit].ninja-forms-mp-breadcrumb-active',
92 'css_exclude' => array( 'float', 'margin' ),
93 );
94
95 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
96 ninja_forms_register_tab_metabox($args);
97 }
98
99 $args = array(
100 'page' => 'ninja-forms-style',
101 'tab' => 'mp_settings',
102 'slug' => 'mp_progress_container',
103 'title' => __( 'Progress Bar Container', 'ninja-forms-style' ),
104 'state' => 'closed',
105 'display_function' => 'ninja_forms_style_metabox_output',
106 'save_page' => 'form_settings',
107 'css_selector' => 'div.meter',
108 'css_exclude' => array( 'float' ),
109 );
110
111 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
112 ninja_forms_register_tab_metabox($args);
113 }
114
115 $args = array(
116 'page' => 'ninja-forms-style',
117 'tab' => 'mp_settings',
118 'slug' => 'mp_progressbar_fill',
119 'title' => __( 'Progress Bar Fill', 'ninja-forms-style' ),
120 'state' => 'closed',
121 'display_function' => 'ninja_forms_style_metabox_output',
122 'save_page' => 'form_settings',
123 'css_selector' => 'div.meter > span',
124 'css_exclude' => array( 'float', 'margin' ),
125 );
126
127 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
128 ninja_forms_register_tab_metabox($args);
129 }
130
131 $args = array(
132 'page' => 'ninja-forms-style',
133 'tab' => 'mp_settings',
134 'slug' => 'mp_page_title',
135 'title' => __( 'Page Titles', 'ninja-forms-style' ),
136 'state' => 'closed',
137 'display_function' => 'ninja_forms_style_metabox_output',
138 'save_page' => 'form_settings',
139 'css_selector' => 'h3.ninja-forms-mp-page-title',
140 //'css_exclude' => array( 'float' ),
141 );
142
143 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
144 ninja_forms_register_tab_metabox($args);
145 }
146
147 $args = array(
148 'page' => 'ninja-forms-style',
149 'tab' => 'mp_settings',
150 'slug' => 'mp_prevnext_container',
151 'title' => __( 'Prev/Next Container', 'ninja-forms-style' ),
152 'state' => 'closed',
153 'display_function' => 'ninja_forms_style_metabox_output',
154 'save_page' => 'form_settings',
155 'css_selector' => 'div.ninja-forms-mp-nav-wrap',
156 'css_exclude' => array( 'float' ),
157 );
158
159 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
160 ninja_forms_register_tab_metabox($args);
161 }
162
163 $args = array(
164 'page' => 'ninja-forms-style',
165 'tab' => 'mp_settings',
166 'slug' => 'mp_prev',
167 'title' => __( 'Previous Button', 'ninja-forms-style' ),
168 'state' => 'closed',
169 'display_function' => 'ninja_forms_style_metabox_output',
170 'save_page' => 'form_settings',
171 'css_selector' => 'form.ninja-forms-form div.ninja-forms-mp-nav-wrap .ninja-forms-mp-prev',
172 //'css_exclude' => array( 'float' ),
173 );
174
175 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
176 ninja_forms_register_tab_metabox($args);
177 }
178
179 $args = array(
180 'page' => 'ninja-forms-style',
181 'tab' => 'mp_settings',
182 'slug' => 'mp_next',
183 'title' => __( 'Next Button', 'ninja-forms-style' ),
184 'state' => 'closed',
185 'display_function' => 'ninja_forms_style_metabox_output',
186 'save_page' => 'form_settings',
187 'css_selector' => 'form.ninja-forms-form div.ninja-forms-mp-nav-wrap .ninja-forms-mp-next',
188 //'css_exclude' => array( 'float' ),
189 );
190
191 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
192 ninja_forms_register_tab_metabox($args);
193 }
194
195 $args = array(
196 'page' => 'ninja-forms-style',
197 'tab' => 'mp_settings',
198 'slug' => 'mp_button_hover',
199 'title' => __( 'Prev / Next Button Hover', 'ninja-forms-style' ),
200 'state' => 'closed',
201 'display_function' => 'ninja_forms_style_metabox_output',
202 'save_page' => 'form_settings',
203 'css_selector' => 'form.ninja-forms-form div.ninja-forms-mp-nav-wrap .ninja-forms-mp-nav:hover',
204 //'css_exclude' => array( 'float' ),
205 );
206
207 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
208 ninja_forms_register_tab_metabox($args);
209 }
210 }
211
212 function ninja_forms_save_style_mp_settings( $data ){
213 $plugin_settings = get_option( 'ninja_forms_settings' );
214
215 $plugin_settings['style']['form_settings']['mp_breadcrumb_container'] = $data['mp_breadcrumb_container'];
216 $plugin_settings['style']['form_settings']['mp_breadcrumb_buttons'] = $data['mp_breadcrumb_buttons'];
217 $plugin_settings['style']['form_settings']['mp_breadcrumb_active'] = $data['mp_breadcrumb_active'];
218 $plugin_settings['style']['form_settings']['mp_breadcrumb_hover'] = $data['mp_breadcrumb_hover'];
219 $plugin_settings['style']['form_settings']['mp_progress_container'] = $data['mp_progress_container'];
220 $plugin_settings['style']['form_settings']['mp_progressbar_fill'] = $data['mp_progressbar_fill'];
221 $plugin_settings['style']['form_settings']['mp_page_title'] = $data['mp_page_title'];
222 $plugin_settings['style']['form_settings']['mp_prevnext_container'] = $data['mp_prevnext_container'];
223 $plugin_settings['style']['form_settings']['mp_prev'] = $data['mp_prev'];
224 $plugin_settings['style']['form_settings']['mp_next'] = $data['mp_next'];
225 $plugin_settings['style']['form_settings']['mp_button_hover'] = $data['mp_button_hover'];
226 $plugin_settings['style']['form_settings']['mp_page'] = $data['mp_page'];
227
228 update_option( 'ninja_forms_settings', $plugin_settings);
229 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 add_action( 'init', 'ninja_forms_register_tab_style_theme_settings' );
4 function ninja_forms_register_tab_style_theme_settings(){
5 $args = array(
6 'name' => 'Themes',
7 'page' => 'ninja-forms-style',
8 //'display_function' => 'ninja_forms_style_theme_display',
9 'save_function' => 'ninja_forms_save_style_theme_settings',
10 );
11 if( function_exists( 'ninja_forms_register_tab' ) ){
12 ninja_forms_register_tab( 'theme_settings', $args );
13 }
14 }
15
16 add_action( 'init', 'ninja_forms_register_theme_settings_metabox');
17 function ninja_forms_register_theme_settings_metabox(){
18
19 $plugin_settings = get_option( 'ninja_forms_settings' );
20 if( isset( $plugin_settings['style'] ) ){
21 $style_settings = $plugin_settings['style'];
22 }else{
23 $style_settings = '';
24 }
25
26 if( isset( $style_settings['default_theme'] ) ){
27 $default_theme = $style_settings['default_theme'];
28 }else{
29 $default_theme = 'none';
30 }
31
32 $args = array(
33 'page' => 'ninja-forms-style',
34 'tab' => 'theme_settings',
35 'slug' => 'set_theme',
36 'title' => __('Default Theme', 'ninja-forms'),
37 'settings' => array(
38 array(
39 'name' => 'default_theme',
40 'type' => 'select',
41 'options' => $themes,
42 'default_value' => $default_theme,
43 'label' => __( 'Default Theme', 'ninja-forms' ),
44 'desc' => '',
45 ),
46 ),
47 );
48 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
49 ninja_forms_register_tab_metabox($args);
50 }
51
52 $args = array(
53 'page' => 'ninja-forms-style',
54 'tab' => 'theme_settings',
55 'slug' => 'edit_themes',
56 'title' => __('Edit Themes', 'ninja-forms'),
57 'settings' => array(
58 array(
59 'name' => 'select_theme',
60 'type' => 'select',
61 'options' => $themes,
62 'default_value' => $selected_theme,
63 'label' => __( 'Select a Theme', 'ninja-forms' ),
64 'desc' => '',
65 ),
66 array(
67 'name' => 'theme_name',
68 'type' => 'text',
69 'label' => __( 'Theme Name (Save Theme As)', 'ninja-forms' ),
70 'desc' => 'Save this theme and changes with a new name',
71 ),
72 array(
73 'name' => 'theme_css',
74 'type' => 'textarea',
75 'label' => __( 'Theme CSS', 'ninja-forms' ),
76 'desc' => '',
77 ),
78 ),
79 );
80 if( function_exists( 'ninja_forms_register_tab_metabox' ) ){
81 ninja_forms_register_tab_metabox($args);
82 }
83 }
84
85
86 function ninja_forms_style_theme_display() {
87 ?>
88 <select>
89 <option>Theme One</option>
90 <option>Theme Two</option>
91 <option>Theme Three </option>
92 </select>
93 <?php
94 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 add_action( 'init', 'ninja_forms_style_default_metaboxes' );
4 function ninja_forms_style_default_metaboxes(){
5 $args = array(
6 'page' => 'field',
7 'tab' => 'form_layout',
8 'slug' => 'wrap',
9 'title' => __( 'Wrap Styles', 'ninja-forms-style' ),
10 'state' => 'closed',
11 'display_function' => 'ninja_forms_style_field_metabox_output',
12 'save_page' => 'field',
13 'css_selector' => '#ninja_forms_field_[field_id]_div_wrap',
14 'css_exclude' => array( 'float', 'padding', 'margin' ),
15 );
16 ninja_forms_register_style_metabox( 'wrap', $args );
17
18 $args = array(
19 'page' => 'field',
20 'tab' => 'form_layout',
21 'slug' => 'label',
22 'title' => __( 'Label Styles', 'ninja-forms-style' ),
23 'state' => 'closed',
24 'display_function' => 'ninja_forms_style_field_metabox_output',
25 'save_page' => 'field',
26 'css_selector' => '#ninja_forms_field_[field_id]_label',
27 'css_exclude' => array( 'float', 'padding', 'margin' ),
28 );
29 ninja_forms_register_style_metabox( 'label', $args );
30
31 $args = array(
32 'page' => 'field',
33 'tab' => 'form_layout',
34 'slug' => 'field',
35 'title' => __( 'Element Styles', 'ninja-forms-style' ),
36 'state' => 'closed',
37 'display_function' => 'ninja_forms_style_field_metabox_output',
38 'save_page' => 'field',
39 'css_selector' => '#ninja_forms_field_[field_id]',
40 'css_exclude' => array( 'float', 'padding', 'margin' ),
41 );
42 ninja_forms_register_style_metabox( 'field', $args );
43
44 }
45
46 add_action( 'init', 'ninja_forms_style_submit_metaboxes' );
47 function ninja_forms_style_submit_metaboxes(){
48 add_action( 'ninja_forms_style_field_metaboxes', 'ninja_forms_style_modify_submit_metaboxes', 10, 1 );
49 }
50
51 function ninja_forms_style_submit_front_end( $field_id ){
52 ninja_forms_style_modify_submit_metaboxes( $field_id );
53 }
54
55 add_action( 'ninja_forms_display_after_field', 'ninja_forms_style_submit_front_end' );
56
57
58 function ninja_forms_style_modify_submit_metaboxes( $field_id ){
59 $field_row = ninja_forms_get_field_by_id( $field_id );
60 $field_type = $field_row['type'];
61 if( $field_type == '_submit' ){
62 ninja_forms_style_add_submit_metaboxes();
63 }
64 }
65
66 function ninja_forms_style_add_submit_metaboxes(){
67
68 $args = array(
69 'page' => 'field',
70 'tab' => 'form_layout',
71 'slug' => 'submit_element_hover',
72 'field_type' => '_submit',
73 'title' => __( 'Element Hover', 'ninja-forms-style' ),
74 'state' => 'closed',
75 'display_function' => 'ninja_forms_style_field_metabox_output',
76 'save_page' => 'field',
77 'css_selector' => '#ninja_forms_field_[field_id]_div_wrap .ninja-forms-field:hover',
78 );
79
80 ninja_forms_register_style_metabox( 'submit_element_hover', $args );
81 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 add_action( 'init', 'ninja_forms_register_style_layout_tab_div' );
4 function ninja_forms_register_style_layout_tab_div(){
5 add_action( 'ninja_forms_style_layout_tab_div', 'ninja_forms_style_layout_tab_div' );
6 }
7
8 function ninja_forms_style_layout_tab_div( $form_id ){
9 if( $form_id != '' ){
10
11 $form_row = ninja_forms_get_form_by_id( $form_id );
12 $form_data = $form_row['data'];
13
14 if( isset( $form_data['style']['cols'] ) ){
15 $cols = $form_data['style']['cols'];
16 }else{
17 $cols = 1;
18 }
19
20 if ( !is_numeric( $cols ) OR $cols == 0 ) {
21 $cols = 1;
22 }
23
24 $all_fields = ninja_forms_get_fields_by_form_id( $form_id );
25 ?>
26 <br />
27 <div>
28 <?php _e( 'Columns', 'ninja-forms-style' ); ?>:
29 <select name="cols" id="cols">
30 <option value="1" <?php selected( $cols, 1 );?>>1</option>
31 <option value="2" <?php selected( $cols, 2 );?>>2</option>
32 <option value="3" <?php selected( $cols, 3 );?>>3</option>
33 <option value="4" <?php selected( $cols, 4 );?>>4</option>
34 </select>
35 </div>
36 <input type="hidden" name="order" id="order" value="">
37 <div id="col_fields">
38 <?php
39
40 for ($x=1; $x <= $cols; $x++) {
41 ?>
42 <input type="hidden" name="col_<?php echo $x;?>" id="col_<?php echo $x;?>" value="">
43 <?php
44 }
45
46 ?>
47 </div>
48 <div class="layout">
49 <?php
50 ninja_forms_style_output_layout_ul( $form_id, $cols );
51 ?>
52 </div><!-- End demo -->
53
54 <?php
55 }
56 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 add_action( 'init', 'ninja_forms_register_style_layout_tab_mp_div' );
4 function ninja_forms_register_style_layout_tab_mp_div(){
5 if( isset( $_REQUEST['form_id'] ) ){
6 $form_id = $_REQUEST['form_id'];
7 }else{
8 $form_id = '';
9 }
10
11 $enabled = false;
12 if ( function_exists( 'nf_mp_get_page_count' ) ) {
13 if ( nf_mp_get_page_count( $form_id ) > 1 ) {
14 $enabled = true;
15 }
16 } else if ( function_exists( 'ninja_forms_get_form_by_id' ) ) {
17 $form_row = ninja_forms_get_form_by_id( $form_id );
18 $form_data = $form_row['data'];
19 if( isset( $form_data['multi_part'] ) AND $form_data['multi_part'] == 1 ){
20 $enabled = true;
21 }
22 }
23
24 if( $form_id != '' ){
25 if ( $enabled ) {
26 remove_action( 'ninja_forms_style_layout_tab_div', 'ninja_forms_style_layout_tab_div' );
27 add_action( 'ninja_forms_style_layout_tab_div', 'ninja_forms_style_layout_tab_mp_div' );
28 }
29 }
30 }
31
32 function ninja_forms_style_layout_tab_mp_div( $form_id ){
33 global $ninja_forms_fields;
34
35 if ( ! function_exists( 'ninja_forms_get_form_by_id' ) )
36 return false;
37
38 $form_row = ninja_forms_get_form_by_id( $form_id );
39 $form_data = $form_row['data'];
40 $all_fields = ninja_forms_get_fields_by_form_id( $form_id );
41 $pages = array();
42 if( is_array( $all_fields ) AND !empty( $all_fields ) ){
43 $pages = array();
44 $this_page = array();
45 $x = 0;
46 foreach( $all_fields as $field ){
47 if ( ! isset ( $ninja_forms_fields[ $field['type'] ] ) )
48 continue;
49 if( $field['type'] == '_page_divider' ){
50 $x++;
51 }
52 $pages[$x][] = $field['id'];
53 }
54 }
55 $page_count = count($pages);
56 if( isset( $_REQUEST['mp_page'] ) ){
57 $current_page = $_REQUEST['mp_page'];
58 }else{
59 $current_page = 1;
60 }
61
62 if( $current_page > $page_count ){
63 $current_page = $page_count;
64 }
65
66 $tmp = $current_page - 1;
67
68 $offset = $tmp * -450;
69
70 ?>
71 <input type="hidden" id="mp_form" value="1">
72 <input type="hidden" id="mp_page" name="mp_page" value="<?php echo $current_page;?>">
73 <div id="ninja-forms-style-viewport">
74
75 <ul id="ninja-forms-style-mp-pagination">
76 <li class="style-mp-subtract">-</li>
77 <span id="style-mp-page-list">
78 <?php
79 if( is_array( $pages ) AND !empty( $pages ) ){
80 foreach( $pages as $page => $field_id ){
81 if( $page == $current_page ){
82 $active = 'active';
83 ?>
84 <input type="hidden" id="_current_page" name="_current_page" value="<?php echo $current_page;?>">
85 <?php
86 }else{
87 $active = '';
88 }
89 ?>
90 <li class="<?php echo $active;?> style-mp-page" title="<?php echo $page;?>" id="ninja_forms_style_mp_page_<?php echo $page;?>"><?php echo $page;?></li>
91 <?php
92 }
93 }
94 ?>
95 </span>
96 <li class="style-mp-add">+</li>
97 <span class="spinner" style="float:left;display:none;"></span>
98 </ul>
99 <div id="ninja-forms-slide" style="left: <?php echo $offset;?>px;">
100 <?php
101 if( is_array( $pages ) AND !empty( $pages ) ){
102 foreach( $pages as $page => $fields ){
103 if( isset( $form_data['style']['mp'][$page]['cols'] ) ){
104 $cols = $form_data['style']['mp'][$page]['cols'];
105 }else{
106 $cols = 1;
107 }
108
109 ?>
110 <div id="ninja_forms_style_mp_<?php echo $page;?>" class="style-layout">
111 <div>
112 <?php _e( 'Columns', 'ninja-forms-style' ); ?>:
113 <select name="cols_<?php echo $page;?>" id="cols_<?php echo $page;?>" class="ninja-forms-style-col">
114 <option value="1" <?php selected( $cols, 1 );?>>1</option>
115 <option value="2" <?php selected( $cols, 2 );?>>2</option>
116 <option value="3" <?php selected( $cols, 3 );?>>3</option>
117 <option value="4" <?php selected( $cols, 4 );?>>4</option>
118 </select>
119 </div>
120 <input type="hidden" name="order_<?php echo $page;?>" id="order_<?php echo $page;?>" value="" class="field-order">
121 <div id="col_fields_<?php echo $page;?>">
122 <?php
123 for ($x=1; $x <= $cols; $x++) {
124 ?>
125 <input type="hidden" name="col_<?php echo $x;?>_<?php echo $page;?>" id="col_<?php echo $x;?>_<?php echo $page;?>" value="" class="col-fields">
126 <?php
127 }
128 ?>
129 </div>
130
131 <?php
132 ninja_forms_style_output_layout_ul( $form_id, $cols, $fields, $page );
133 ?>
134
135 </div>
136 <?php
137 }
138 }
139 ?>
140 </div>
141 </div>
142 <?php
143 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 function ninja_forms_style_output_layout_ul( $form_id, $cols, $fields = '', $page = '' ){
4 global $ninja_forms_fields;
5
6 if( $fields == '' ){
7 $all_fields = ninja_forms_get_fields_by_form_id( $form_id );
8 }else{
9 foreach( $fields as $field_id ){
10 $all_fields[] = ninja_forms_get_field_by_id( $field_id );
11 }
12 }
13
14 if( $page != '' ){
15 $ul_id = 'ninja_forms_style_list_'.$page;
16 }else{
17 $ul_id = '';
18 }
19
20 $all_fields = apply_filters( 'ninja_forms_style_all_fields', $all_fields, $form_id );
21
22 ?>
23 <ul id="<?php echo $ul_id;?>" class="sortable ninja-forms-style-sortable cols-<?php echo $cols;?>" rel="<?php echo $cols;?>">
24 <?php
25 if( !empty( $all_fields ) ){
26 foreach( $all_fields as $field ){
27 $type = $field['type'];
28 if( isset( $ninja_forms_fields[$type]['display_function'] ) ){
29 $display_function = $ninja_forms_fields[$type]['display_function'];
30 }else{
31 $display_function = '';
32 }
33 if( isset( $field['data']['label'] ) ){
34 $label = $field['data']['label'];
35 }else{
36 $label = '';
37 }
38 $label = strip_tags( $label );
39 if( $label == '' AND isset( $ninja_forms_fields[$type]['name'] ) ){
40 $label = $ninja_forms_fields[$type]['name'];
41 }
42 if( strlen( $label ) > 13 ){
43 $label = substr( $label, 0, 10 )."...";
44 }
45
46 if( isset( $field['data']['style']['colspan'] ) ){
47 $colspan = $field['data']['style']['colspan'];
48 }else{
49 $colspan = 1;
50 }
51 if( $display_function != '' ){
52 ?>
53 <li class="ui-state-default span-<?php echo $colspan;?>" rel="<?php echo $colspan;?>" id="ninja_forms_field_<?php echo $field['id'];?>_li"><span class="style-handle"><?php echo $label;?><br /><?php _e( 'Field ID', 'ninja-forms-style' ); ?>: <?php echo $field['id'];?></span>
54 <a href="#" class="ninja-forms-style-expand ninja-forms-style-button"><?php _e( 'resize', 'ninja-forms-style' ); ?></a><br /><a href="#TB_inline?height=750&width=600&height=600&inlineId=ninja_forms_field_style_div&modal=true" class="thickbox field-styling ninja-forms-style-button" id="styling_<?php echo $field['id'];?>"><?php _e( 'styling', 'ninja-forms-style' ); ?></a>
55 </li>
56 <input type="hidden" name="colspan[<?php echo $field['id'];?>]" id="ninja_forms_field_<?php echo $field['id'];?>_colspan" value="<?php echo $colspan;?>">
57 <?php
58 }else{
59 ?>
60 <li class="ui-disabled" style="display:none;" id="ninja_forms_field_<?php echo $field['id'];?>"></li>
61 <?php
62 }
63 }
64 }
65 ?>
66 </ul>
67 <?php
68 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 function ninja_forms_register_tab_form_style(){
4 $args = array(
5 'name' => __( 'Layout & Styles', 'ninja-forms-style' ),
6 'page' => 'ninja-forms',
7 'display_function' => 'ninja_forms_form_style_tab',
8 'save_function' => 'ninja_forms_save_form_style',
9 'show_save' => false,
10 'disable_no_form_id' => true,
11 );
12 if( function_exists( 'ninja_forms_register_tab' ) ){
13 ninja_forms_register_tab( 'form_layout', $args );
14 }
15 }
16
17 add_action( 'admin_init', 'ninja_forms_register_tab_form_style', 12 );
18
19 function ninja_forms_form_style_tab(){
20 global $ninja_forms_fields;
21
22 if( isset( $_REQUEST['form_id'] ) ){
23 $form_id = $_REQUEST['form_id'];
24 }else{
25 $form_id = '';
26 }
27 ?>
28 <input class="button-primary menu-save ninja-forms-save-data" id="ninja_forms_save_data_top" type="submit" value="<?php _e( 'Save Layout', 'ninja-forms-style' ); ?>" />
29 <a href="#TB_inline?height=750&width=600&height=600&inlineId=ninja_forms_form_style_div&modal=true" class="thickbox button-secondary"><?php _e( 'Modify Form Styles', 'ninja-forms-style' );?></a>
30 <br />
31 <br />
32 <?php
33
34 do_action( 'ninja_forms_style_layout_tab_div', $form_id );
35
36 ?>
37 <div style="clear: both">
38 <br />
39 <br />
40
41 <?php add_thickbox(); ?>
42 <div id="ninja_forms_field_style_div" style="display:none;">
43 <br />
44 <input type="button" class="save-field-styling button-secondary" value="<?php _e( 'Save', 'ninja-forms-style' );?>">
45 <input type="button" class="cancel-field-styling button-secondary" value="<?php _e( 'Cancel', 'ninja-forms-style' );?>">
46 <span class="spinner" style="float:left;display:none;" id="loading_style"></span>
47 <br />
48 <br />
49
50 <div id="ninja_forms_field_styling">
51 </div>
52 </div>
53
54 <div id="ninja_forms_form_style_div" style="display:none;">
55 <br />
56 <input type="button" class="save-form-styling button-secondary" value="<?php _e( 'Save', 'ninja-forms-style' );?>">
57 <input type="button" class="cancel-form-styling button-secondary" value="<?php _e( 'Cancel', 'ninja-forms-style' );?>">
58 <!-- <span class="spinner" style="float:left;display:none;" id="loading_style"></span> -->
59 <br />
60 <br />
61 <div id="ninja_forms_form_style_inputs">
62 <input type="hidden" name="form_id" value="<?php echo $form_id;?>">
63 <?php
64 ninja_forms_style_advanced_checkbox_display();
65 $args = array(
66 'page' => 'ninja-forms-style',
67 'tab' => 'form_settings',
68 'slug' => 'container',
69 'title' => __( 'Container Styles', 'ninja-forms-style' ),
70 'state' => 'closed',
71 'display_function' => 'ninja_forms_style_form_metabox_output',
72 'save_page' => 'form',
73 'css_selector' => 'div.ninja-forms-form-wrap',
74 'css_exclude' => '',
75 );
76
77 if( function_exists( 'ninja_forms_output_tab_metabox' ) ){
78 ninja_forms_output_tab_metabox('', 'container', $args);
79 }
80
81 $args = array(
82 'page' => 'ninja-forms-style',
83 'tab' => 'form_settings',
84 'slug' => 'title',
85 'title' => __( 'Title Styles', 'ninja-forms-style' ),
86 'state' => 'closed',
87 'display_function' => 'ninja_forms_style_form_metabox_output',
88 'save_page' => 'form',
89 'css_selector' => 'div.ninja-forms-form-wrap .ninja-forms-form-title',
90 'css_exclude' => '',
91 );
92
93 if( function_exists( 'ninja_forms_output_tab_metabox' ) ){
94 ninja_forms_output_tab_metabox('', 'container', $args);
95 }
96
97 $args = array(
98 'page' => 'ninja-forms-style',
99 'tab' => 'form_settings',
100 'slug' => 'row',
101 'title' => __( 'Row Styles', 'ninja-forms-style' ),
102 'state' => 'closed',
103 'display_function' => 'ninja_forms_style_form_metabox_output',
104 'save_page' => 'form',
105 'css_selector' => 'div.ninja-row',
106 'css_exclude' => array( 'float' ),
107 );
108
109 if( function_exists( 'ninja_forms_output_tab_metabox' ) ){
110 ninja_forms_output_tab_metabox('', 'row', $args);
111 }
112
113 $args = array(
114 'page' => 'ninja-forms-style',
115 'tab' => 'form_settings',
116 'slug' => 'row-odd',
117 'title' => __( 'Odd Row Styles', 'ninja-forms-style' ),
118 'state' => 'closed',
119 'display_function' => 'ninja_forms_style_form_metabox_output',
120 'save_page' => 'form',
121 'css_selector' => 'div.ninja-row:nth-child(odd)',
122 'css_exclude' => array( 'float' ),
123 );
124
125 if( function_exists( 'ninja_forms_output_tab_metabox' ) ){
126 ninja_forms_output_tab_metabox('', 'row-odd', $args);
127 }
128
129 $args = array(
130 'page' => 'ninja-forms-style',
131 'tab' => 'form_settings',
132 'slug' => 'success-msg',
133 'title' => __( 'Success Response Message Styles', 'ninja-forms-style' ),
134 'state' => 'closed',
135 'display_function' => 'ninja_forms_style_form_metabox_output',
136 'save_page' => 'form',
137 'css_selector' => 'div.ninja-forms-success-msg',
138 'css_exclude' => array( 'float' ),
139 );
140
141 if( function_exists( 'ninja_forms_output_tab_metabox' ) ){
142 ninja_forms_output_tab_metabox('', 'success-msg', $args);
143 }
144 $args = array(
145 'page' => 'ninja-forms-style',
146 'tab' => 'form_settings',
147 'slug' => 'error_msg',
148 'title' => __( 'Error Response Message Styles', 'ninja-forms-style' ),
149 'state' => 'closed',
150 'display_function' => 'ninja_forms_style_form_metabox_output',
151 'save_page' => 'form',
152 'css_selector' => 'div.ninja-forms-error-msg',
153 'css_exclude' => array( 'float' ),
154 );
155
156 if( function_exists( 'ninja_forms_output_tab_metabox' ) ){
157 ninja_forms_output_tab_metabox('', 'error_msg', $args);
158 }
159
160 ?>
161 </div>
162 </div>
163 </div>
164
165 <style>
166 #ninja_forms_admin_metaboxes {
167 display: none;
168 }
169 .postbox h3, .metabox-holder h3 {
170 font-size: 15px;
171 font-weight: normal;
172 padding: 7px 10px;
173 margin: 0;
174 line-height: 1;
175 }
176 </style>
177 <?php
178
179 }
180
181 function ninja_forms_style_form_metabox_output( $metabox ){
182 $form_id = $_REQUEST['form_id'];
183 $metabox['form_id'] = $form_id;
184 ninja_forms_style_metabox_output( $metabox );
185 }
186
187 function ninja_forms_save_form_style( $form_id, $data ){
188 global $wpdb, $ninja_forms_admin_update_message;
189
190 $order = '';
191 $cols = array();
192 if( isset( $data['order'] ) ){
193 $order = $data['order'];
194 }else{
195 $all_fields = ninja_forms_get_fields_by_form_id( $form_id );
196 $pages = array();
197 if( is_array( $all_fields ) AND !empty( $all_fields ) ){
198 $pages = array();
199 $this_page = array();
200 $x = 0;
201 foreach( $all_fields as $field ){
202 if( $field['type'] == '_page_divider' ){
203 $x++;
204 }
205 $pages[$x][] = $field['id'];
206 }
207 }
208 $page_count = count($pages);
209
210 for ($i=1; $i <= $page_count; $i++) {
211 if( isset( $data['order_'.$i] ) ){
212 if( $order == '' ){
213 $order = $data['order_'.$i];
214 }else{
215 $order .= ','.$data['order_'.$i];
216 }
217 }
218 }
219 }
220
221 if( $order != '' ){
222 $order = str_replace( 'ninja_forms_field_', '', $order );
223 $order = str_replace( '_li', '', $order );
224 $order = explode( ',', $order );
225 if( is_array( $order ) AND !empty( $order ) ){
226 foreach( $order as $key => $val ){
227 $wpdb->update( NINJA_FORMS_FIELDS_TABLE_NAME, array( 'order' => $key ), array( 'id' => $val ));
228 }
229 }
230 }
231
232 $form_row = ninja_forms_get_form_by_id( $form_id );
233 $form_data = $form_row['data'];
234
235 if( isset( $data['container'] ) ){
236 $form_data['style']['groups']['container'] = $data['container'];
237 }
238
239 if( isset( $data['title'] ) ){
240 $form_data['style']['groups']['title'] = $data['title'];
241 }
242
243 if( isset( $data['row'] ) ){
244 $form_data['style']['groups']['row'] = $data['row'];
245 }
246
247 if( isset( $data['row-odd'] ) ){
248 $form_data['style']['groups']['row-odd'] = $data['row-odd'];
249 }
250
251 if( isset( $data['success-msg'] ) ){
252 $form_data['style']['groups']['success-msg'] = $data['success-msg'];
253 }
254
255 if( isset( $data['error_msg'] ) ){
256 $form_data['style']['groups']['error_msg'] = $data['error_msg'];
257 }
258
259 $mp_enabled = false;
260 if ( function_exists( 'nf_mp_get_page_count' ) ) {
261 if ( nf_mp_get_page_count( $form_id ) > 1 ) {
262 $mp_enabled = true;
263 }
264 } else {
265 $form_row = ninja_forms_get_form_by_id( $form_id );
266 $form_data = $form_row['data'];
267 if( isset( $form_data['multi_part'] ) AND $form_data['multi_part'] == 1 ){
268 $mp_enabled = true;
269 }
270 }
271
272 if( $mp_enabled ){
273 $form_data['style']['cols'] = $cols;
274 unset( $form_data['style']['mp'] );
275 for ($i=1; $i <= $page_count; $i++) {
276 $form_data['style']['mp'][$i]['cols'] = $data['cols_'.$i];
277 }
278 }else{
279 $form_data['style']['cols'] = $data['cols'];
280 }
281
282 $args = array(
283 'update_array' => array(
284 'data' => serialize( $form_data ),
285 ),
286 'where' => array(
287 'id' => $form_id,
288 ),
289 );
290
291 ninja_forms_update_form( $args );
292
293 if( !empty( $data['colspan'] ) ){
294 foreach( $data['colspan'] as $field_id => $span ){
295 $field_row = ninja_forms_get_field_by_id( $field_id );
296 $field_data = $field_row['data'];
297 $field_data['style']['colspan'] = $span;
298 $field_data = array('data' => serialize($field_data));
299 $wpdb->update( NINJA_FORMS_FIELDS_TABLE_NAME, $field_data, array( 'id' => $field_id ));
300 }
301 }
302
303 $update_msg = __( 'Form Layout Saved', 'ninja-forms-style' );
304 return $update_msg;
305 }
1 <?php
2
3 add_action( 'init', 'ninja_forms_style_list_metaboxes' );
4 function ninja_forms_style_list_metaboxes(){
5 add_action( 'ninja_forms_style_field_metaboxes', 'ninja_forms_style_modify_list_metaboxes' );
6 //if( is_admin() ){
7 ninja_forms_style_add_list_metaboxes();
8 //}
9 }
10
11 function ninja_forms_style_modify_list_metaboxes( $field_id ){
12
13 $field_row = ninja_forms_get_field_by_id( $field_id );
14 $field_type = $field_row['type'];
15 $field_data = $field_row['data'];
16 if( isset( $field_data['list_type'] ) ){
17 $list_type = $field_data['list_type'];
18 }else{
19 $list_type = '';
20 }
21 if( $field_type == '_list' AND $list_type != 'dropdown' ){
22 ninja_forms_style_add_list_metaboxes();
23 }
24 }
25
26 function ninja_forms_style_add_list_metaboxes(){
27 $args = array(
28 'page' => 'field',
29 'tab' => 'form_layout',
30 'slug' => 'list_item_row_field',
31 'field_type' => '_list',
32 'title' => __( 'List Item Row', 'ninja-forms-style' ),
33 'state' => 'closed',
34 'display_function' => 'ninja_forms_style_field_metabox_output',
35 'save_page' => 'field',
36 'css_selector' => '#ninja_forms_field_[field_id]_div_wrap ul li',
37 //'css_exclude' => array( 'float', 'padding', 'margin' ),
38 );
39
40 ninja_forms_register_style_metabox( 'list_item_row_field', $args );
41
42 $args = array(
43 'page' => 'field',
44 'tab' => 'form_layout',
45 'slug' => 'list_item_label_field',
46 'field_type' => '_list',
47 'title' => __( 'List Item Label', 'ninja-forms-style' ),
48 'state' => 'closed',
49 'display_function' => 'ninja_forms_style_field_metabox_output',
50 'save_page' => 'field',
51 'css_selector' => '#ninja_forms_field_[field_id]_div_wrap ul li label',
52 //'css_exclude' => array( 'float', 'padding', 'margin' ),
53 );
54
55 ninja_forms_register_style_metabox( 'list_item_label_field', $args );
56
57 $args = array(
58 'page' => 'field',
59 'tab' => 'form_layout',
60 'slug' => 'list_item_element_field',
61 'field_type' => '_list',
62 'title' => __( 'List Item Element', 'ninja-forms-style' ),
63 'state' => 'closed',
64 'display_function' => 'ninja_forms_style_field_metabox_output',
65 'save_page' => 'field',
66 'css_selector' => '#ninja_forms_field_[field_id]_div_wrap ul li input',
67 //'css_exclude' => array( 'float', 'padding', 'margin' ),
68 );
69
70 ninja_forms_register_style_metabox( 'list_item_element_field', $args );
71 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 add_action( 'init', 'ninja_forms_style_rating_metaboxes', 9 );
4 function ninja_forms_style_rating_metaboxes(){
5 add_action( 'ninja_forms_style_field_metaboxes', 'ninja_forms_style_modify_rating_metaboxes' );
6 //if( is_admin() ){
7 ninja_forms_style_add_rating_metaboxes();
8 //}
9 }
10
11 function ninja_forms_style_modify_rating_metaboxes( $field_id ){
12 $field_row = ninja_forms_get_field_by_id( $field_id );
13 $field_type = $field_row['type'];
14 $field_data = $field_row['data'];
15 if( $field_type == '_rating' ){
16 $args = array( 'page' => 'field' );
17 // ninja_forms_unregister_style_metabox( 'field', $args );
18 ninja_forms_style_add_rating_metaboxes();
19 }
20
21 }
22
23 function ninja_forms_style_add_rating_metaboxes(){
24
25 $args = array(
26 'page' => 'field',
27 'tab' => 'form_layout',
28 'slug' => 'rating_field_item',
29 'field_type' => '_rating',
30 'title' => __( 'Rating Item', 'ninja-forms-style' ),
31 'state' => 'closed',
32 'display_function' => 'ninja_forms_style_field_metabox_output',
33 'save_page' => 'field',
34 'css_selector' => '#ninja_forms_field_[field_id]_div_wrap div.ninja-forms-star-rating a',
35 //'css_exclude' => array( 'float', 'padding', 'margin' ),
36 );
37
38 ninja_forms_register_style_metabox( 'rating_field_item', $args );
39
40 $args = array(
41 'page' => 'field',
42 'tab' => 'form_layout',
43 'slug' => 'rating_field_hover',
44 'field_type' => '_rating',
45 'title' => __( 'Rating Item Hover', 'ninja-forms-style' ),
46 'state' => 'closed',
47 'display_function' => 'ninja_forms_style_field_metabox_output',
48 'save_page' => 'field',
49 'css_selector' => '#ninja_forms_field_[field_id]_div_wrap div.ninja-forms-star-rating-hover a',
50 //'css_exclude' => array( 'float', 'padding', 'margin' ),
51 );
52
53 ninja_forms_register_style_metabox( 'rating_field_hover', $args );
54
55 $args = array(
56 'page' => 'field',
57 'tab' => 'form_layout',
58 'slug' => 'rating_field_selected',
59 'field_type' => '_rating',
60 'title' => __( 'Rating Item Selected', 'ninja-forms-style' ),
61 'state' => 'closed',
62 'display_function' => 'ninja_forms_style_field_metabox_output',
63 'save_page' => 'field',
64 'css_selector' => '#ninja_forms_field_[field_id]_div_wrap div.ninja-forms-star-rating-on a',
65 //'css_exclude' => array( 'float', 'padding', 'margin' ),
66 );
67
68 ninja_forms_register_style_metabox( 'rating_field_selected', $args );
69
70 $args = array(
71 'page' => 'field',
72 'tab' => 'form_layout',
73 'slug' => 'rating_field_cancel',
74 'field_type' => '_rating',
75 'title' => __( 'Cancel Ratings', 'ninja-forms-style' ),
76 'state' => 'closed',
77 'display_function' => 'ninja_forms_style_field_metabox_output',
78 'save_page' => 'field',
79 'css_selector' => '#ninja_forms_field_[field_id]_div_wrap div.rating-cancel a',
80 //'css_exclude' => array( 'float', 'padding', 'margin' ),
81 );
82
83 ninja_forms_register_style_metabox( 'rating_field_cancel', $args );
84
85 $args = array(
86 'page' => 'field',
87 'tab' => 'form_layout',
88 'slug' => 'rating_field_cancel_hover',
89 'field_type' => '_rating',
90 'title' => __( 'Cancel Ratings Hover', 'ninja-forms-style' ),
91 'state' => 'closed',
92 'display_function' => 'ninja_forms_style_field_metabox_output',
93 'save_page' => 'field',
94 'css_selector' => '#ninja_forms_field_[field_id]_div_wrap div.rating-cancel a:hover',
95 //'css_exclude' => array( 'float', 'padding', 'margin' ),
96 );
97
98 ninja_forms_register_style_metabox( 'rating_field_cancel_hover', $args );
99
100 }
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 function ninja_forms_register_css_option( $slug, $args ){
4 global $ninja_forms_css_options;
5
6 if( is_array( $args ) AND !empty( $args ) ){
7 foreach( $args as $key => $val ){
8 $ninja_forms_css_options[$slug][$key] = $val;
9 }
10 }
11 }
12
13 function ninja_forms_register_style_metabox( $slug, $args ){
14 global $ninja_forms_style_metaboxes;
15
16 if( isset( $args['field_type'] ) AND $args['field_type'] != '' ){
17 $field_type = $args['field_type'];
18 $ninja_forms_style_metaboxes['field'][$field_type][$slug] = $args;
19 }else{
20 $page = $args['page'];
21 $ninja_forms_style_metaboxes['page'][$page][$slug] = $args;
22 }
23 }
24
25 function ninja_forms_unregister_style_metabox( $slug, $args ){
26 global $ninja_forms_style_metaboxes;
27
28 if( isset( $args['field_type'] ) AND $args['field_type'] != '' ){
29 $field_type = $args['field_type'];
30 unset( $ninja_forms_style_metaboxes['field'][$field_type][$slug] );
31 }else{
32 $page = $args['page'];
33 unset( $ninja_forms_style_metaboxes['page'][$page][$slug] );
34 }
35 }
36
37 function ninja_forms_register_css_options( $args ){
38 global $ninja_forms_css_options;
39
40 if( is_array( $args ) AND !empty( $args ) ){
41
42 if( !isset( $args['css_property'] ) ){
43 $args['css_property'] = '';
44 }
45
46 if( !isset( $args['group'] ) OR $args['group'] == '' ){
47 $args['group'] = 'basic';
48 }
49
50 foreach( $args as $arg ){
51 if( is_array( $arg ) ){
52 foreach( $arg as $key => $val ){
53 if( $key == 'name' ){
54 $name = $val;
55 }else{
56 $ninja_forms_css_options[$name][$key] = $val;
57 }
58 }
59 }
60 }
61 }
62 }
63
64 add_action( 'init', 'ninja_forms_css_options', 9 );
65 function ninja_forms_css_options(){
66 $args = array(
67 array(
68 'name' => 'background-color',
69 'type' => 'text',
70 'label' => __( 'Background Color', 'ninja-forms-style' ),
71 'desc' => '',
72 'class' => 'color-picker',
73 'group' => 'basic',
74 'css_property' => 'background',
75 ),
76 array(
77 'name' => 'border',
78 'type' => 'text',
79 'label' => __( 'Border Width', 'ninja-forms-style' ),
80 'group' => 'basic',
81 'css_property' => 'border-width',
82 ),
83 array(
84 'name' => 'border-style',
85 'type' => 'select',
86 'options' => array(
87 array( 'name' => __( '- None', 'ninja-forms-style' ), 'value' => '' ),
88 array( 'name' => __( 'Solid', 'ninja-forms-style' ), 'value' => 'solid' ),
89 array( 'name' => __( 'Dashed', 'ninja-forms-style' ), 'value' => 'dashed' ),
90 array( 'name' => __( 'Dotted', 'ninja-forms-style' ), 'value' => 'dotted' ),
91 ),
92 'label' => __( 'Border Style', 'ninja-forms-style' ),
93 'desc' => '',
94 'group' => 'basic',
95 'css_property' => 'border-style',
96 ),
97 array(
98 'name' => 'border-color',
99 'type' => 'text',
100 'label' => __( 'Border Color', 'ninja-forms-style' ),
101 'desc' => '',
102 'class' => 'color-picker',
103 'group' => 'basic',
104 'css_property' => 'border-color',
105 ),
106 array(
107 'name' => 'color',
108 'type' => 'text',
109 'label' => __( 'Text Color', 'ninja-forms-style' ),
110 'class' => 'color-picker',
111 'group' => 'basic',
112 'css_property' => 'color',
113 ),
114 array(
115 'name' => 'height',
116 'type' => 'text',
117 'label' => __( 'Height', 'ninja-forms-style' ),
118 'group' => 'basic',
119 'css_property' => 'height',
120 ),
121 array(
122 'name' => 'width',
123 'type' => 'text',
124 'label' => __( 'Width', 'ninja-forms-style' ),
125 'group' => 'basic',
126 'css_property' => 'width',
127 ),
128 array(
129 'name' => 'display',
130 'type' => 'select',
131 'options' => array(
132 array( 'name' => __( '- Default', 'ninja-forms-style' ), 'value' => '' ),
133 array( 'name' => __( 'Block', 'ninja-forms-style' ), 'value' => 'block' ),
134 array( 'name' => __( 'Inline', 'ninja-forms-style' ), 'value' => 'inline' ),
135 array( 'name' => __( 'Inline Block', 'ninja-forms-style' ), 'value' => 'inline-block' ),
136 ),
137 'label' => __( 'Display', 'ninja-forms-style' ),
138 'desc' => '',
139 'group' => 'advanced',
140 'css_property' => 'display',
141 ),
142 array(
143 'name' => 'float',
144 'type' => 'text',
145 'label' => __( 'Float', 'ninja-forms-style' ),
146 'group' => 'advanced',
147 'css_property' => 'float',
148 ),
149 array(
150 'name' => 'font-size',
151 'type' => 'text',
152 'label' => __( 'Font Size', 'ninja-forms-style' ),
153 'group' => 'basic',
154 'css_property' => 'font-size',
155 ),
156 array(
157 'name' => 'margin',
158 'type' => 'text',
159 'label' => __( 'Margin', 'ninja-forms-style' ),
160 'group' => 'basic',
161 'css_property' => 'margin',
162 ),
163 array(
164 'name' => 'padding',
165 'type' => 'text',
166 'label' => __( 'Padding', 'ninja-forms-style' ),
167 'group' => 'basic',
168 'css_property' => 'padding',
169 ),
170 array(
171 'name' => 'advanced',
172 'type' => 'textarea',
173 'label' => __( 'Advanced CSS', 'ninja-forms-style' ),
174 'group' => 'advanced',
175 'class' => 'ninja-custom-css',
176 'css_property' => '',
177 ),
178 );
179 ninja_forms_register_css_options( $args );
180 }
1 <?php
2
3 add_action( 'admin_init', 'ninja_forms_style_admin_js' );
4 function ninja_forms_style_admin_js(){
5
6 if ( defined( 'NINJA_FORMS_JS_DEBUG' ) && NINJA_FORMS_JS_DEBUG ) {
7 $suffix = '';
8 $src = 'dev';
9 } else {
10 $suffix = '.min';
11 $src = 'min';
12 }
13
14 if( isset( $_REQUEST['page'] ) AND ( $_REQUEST['page'] == 'ninja-forms-style' OR ( $_REQUEST['page'] == 'ninja-forms' AND ( isset( $_REQUEST['tab'] ) AND $_REQUEST['tab'] == 'form_layout' ) ) ) ){
15 wp_enqueue_script( 'wp-color-picker' );
16 wp_enqueue_script( 'ninja-forms-style-admin',
17 NINJA_FORMS_STYLE_URL .'/js/' . $src .'/ninja-forms-style-admin' . $suffix . '.js?nf_ver=' . NINJA_FORMS_STYLE_VERSION,
18 array( 'jquery', 'jquery-ui-dialog', 'jquery-ui-sortable' ) );
19 wp_localize_script( 'ninja-forms-style-admin', 'nf_style', array( 'layout_error' => __( 'There is an error with your layout. Please ensure that all columns are fully spanned. See the error(s) below.', 'ninja-forms-style' ) ) );
20 }
21 }
22
23 add_action( 'admin_init', 'ninja_forms_style_admin_css' );
24 function ninja_forms_style_admin_css(){
25
26 if( isset( $_REQUEST['page'] ) AND ( $_REQUEST['page'] == 'ninja-forms' OR $_REQUEST['page'] == 'ninja-forms-style' ) ){
27 wp_enqueue_style( 'wp-color-picker' );
28 wp_enqueue_style( 'wp-jquery-ui-dialog' );
29 wp_enqueue_style( 'ninja-forms-style-admin',
30 NINJA_FORMS_STYLE_URL.'/css/ninja-forms-style-admin.css?nf_ver=' . NINJA_FORMS_STYLE_VERSION );
31 }
32
33 }
1 <?php
2
3 function ninja_forms_style_ul_open( $field_id, $data ){
4 global $ninja_forms_style_row_col, $ninja_forms_loading, $ninja_forms_processing;
5
6 if ( isset ( $ninja_forms_loading ) ) {
7 $form_id = $ninja_forms_loading->get_form_ID();
8 $form_data = $ninja_forms_loading->get_all_form_settings();
9 $pages = $ninja_forms_loading->get_form_setting( 'mp_pages' );
10 $field_row = $ninja_forms_loading->get_field_settings( $field_id );
11 } else {
12 $form_id = $ninja_forms_processing->get_form_ID();
13 $form_data = $ninja_forms_processing->get_all_form_settings();
14 $pages = $ninja_forms_processing->get_form_setting( 'mp_pages' );
15 $field_row = $ninja_forms_processing->get_field_settings( $field_id );
16 }
17
18 if( isset( $form_data['ajax'] ) ){
19 $ajax = $form_data['ajax'];
20 }else{
21 $ajax = 0;
22 }
23
24 $mp_enabled = false;
25 if ( function_exists( 'nf_mp_get_page_count' ) ) {
26 if ( nf_mp_get_page_count( $form_id ) > 1 ) {
27 $mp_enabled = true;
28 }
29 } else {
30 $form_row = ninja_forms_get_form_by_id( $form_id );
31 $form_data = $form_row['data'];
32 if( isset( $form_data['multi_part'] ) AND $form_data['multi_part'] == 1 ){
33 $mp_enabled = true;
34 }
35 }
36
37 if ( $mp_enabled ) {
38
39 $current_page = $field_row['data']['page'];
40
41 if( isset( $form_data['style']['mp'][$current_page]['cols'] ) ){
42 $cols = $form_data['style']['mp'][$current_page]['cols'];
43 }else{
44 $cols = 1;
45 }
46 }else{
47 if( isset( $form_data['style']['cols'] ) ){
48 $cols = $form_data['style']['cols'];
49 }else{
50 $cols = 1;
51 }
52 }
53
54 $field_data = $field_row['data'];
55 if( isset( $field_data['style']['colspan'] ) ){
56 $colspan = $field_data['style']['colspan'];
57 }else{
58 $colspan = 1;
59 }
60
61 if( $cols > 1 ){
62 if( !isset( $ninja_forms_style_row_col ) ){
63 $ninja_forms_style_row_col = 0;
64 }
65 if( $ninja_forms_style_row_col == 0 ){
66 ?>
67 <div class="ninja-row">
68 <?php
69 }
70 ?>
71 <div class="ninja-col-<?php echo $colspan;?>-<?php echo $cols;?>">
72
73 <?php
74 }
75 }
76
77 add_action( 'ninja_forms_display_before_field', 'ninja_forms_style_ul_open', 11, 2);
78
79 function ninja_forms_style_ul_close( $field_id, $data ){
80 global $ninja_forms_style_row_col, $ninja_forms_loading, $ninja_forms_processing;
81
82 if ( isset ( $ninja_forms_loading ) ) {
83 $form_id = $ninja_forms_loading->get_form_ID();
84 $form_data = $ninja_forms_loading->get_all_form_settings();
85 $pages = $ninja_forms_loading->get_form_setting( 'mp_pages' );
86 $field_row = $ninja_forms_loading->get_field_settings( $field_id );
87 } else {
88 $form_id = $ninja_forms_processing->get_form_ID();
89 $form_data = $ninja_forms_processing->get_all_form_settings();
90 $pages = $ninja_forms_processing->get_form_setting( 'mp_pages' );
91 $field_row = $ninja_forms_processing->get_field_settings( $field_id );
92 }
93
94 if( isset( $form_data['ajax'] ) ){
95 $ajax = $form_data['ajax'];
96 }else{
97 $ajax = 0;
98 }
99
100 $mp_enabled = false;
101 if ( function_exists( 'nf_mp_get_page_count' ) ) {
102 if ( nf_mp_get_page_count( $form_id ) > 1 ) {
103 $mp_enabled = true;
104 }
105 } else {
106 $form_row = ninja_forms_get_form_by_id( $form_id );
107 $form_data = $form_row['data'];
108 if( isset( $form_data['multi_part'] ) AND $form_data['multi_part'] == 1 ){
109 $mp_enabled = true;
110 }
111 }
112
113 if( $mp_enabled ){
114
115 $current_page = $field_row['data']['page'];
116
117 if( isset( $form_data['style']['mp'][$current_page]['cols'] ) ){
118 $cols = $form_data['style']['mp'][$current_page]['cols'];
119 }else{
120 $cols = 1;
121 }
122 }else{
123 if( isset( $form_data['style']['cols'] ) ){
124 $cols = $form_data['style']['cols'];
125 }else{
126 $cols = 1;
127 }
128 }
129
130 $field_data = $field_row['data'];
131 if( isset( $field_data['style']['colspan'] ) ){
132 $colspan = $field_data['style']['colspan'];
133 }else{
134 $colspan = 1;
135 }
136
137 if( $cols > 1 ){
138 ?>
139 </div>
140 <?php
141 $ninja_forms_style_row_col = $ninja_forms_style_row_col + $colspan;
142 if( ( $ninja_forms_style_row_col ) >= $cols ){
143 ?>
144 </div>
145 <?php
146 $ninja_forms_style_row_col = 0;
147 }
148 }
149 }
150
151 add_action( 'ninja_forms_display_after_field', 'ninja_forms_style_ul_close', 9, 2 );
1 <?php
2
3 add_action( 'init', 'ninja_forms_register_style_display_css' );
4 function ninja_forms_register_style_display_css(){
5 add_action( 'ninja_forms_before_form_display', 'ninja_forms_style_display_css' );
6 }
7
8 function ninja_forms_style_display_css( $form_id ){
9 global $ninja_forms_tabs_metaboxes, $ninja_forms_tabs, $ninja_forms_css_options, $ninja_forms_style_metaboxes;
10
11 $all_fields = ninja_forms_get_fields_by_form_id( $form_id );
12
13 wp_enqueue_style( 'ninja-forms-style-display',
14 NINJA_FORMS_STYLE_URL.'/css/ninja-forms-style-display.css' );
15
16 $plugin_settings = get_option( 'ninja_forms_settings' );
17
18 if( isset( $plugin_settings['style']['field_type'] ) ){
19 $field_type_css = $plugin_settings['style']['field_type'];
20 }else{
21 $field_type_css = '';
22 }
23
24 $form_row = ninja_forms_get_form_by_id( $form_id );
25 $form_data = $form_row['data'];
26
27
28 ?>
29 <style type="text/css" media="screen">
30 <?php
31
32 //Output default settings CSS
33 foreach( $ninja_forms_tabs['ninja-forms-style'] as $slug => $tab ){
34 if( $slug != 'field_type_settings' ){
35 if( isset( $ninja_forms_tabs_metaboxes['ninja-forms-style'][$slug] ) ){
36 foreach( $ninja_forms_tabs_metaboxes['ninja-forms-style'][$slug] as $metabox ){
37
38 $save_page = $metabox['save_page'];
39 $group = $metabox['slug'];
40
41 $output = false;
42 if( isset( $plugin_settings['style'][$save_page][$group] ) ){
43 foreach( $plugin_settings['style'][$save_page][$group] as $prop => $val ){
44 if( $val != '' ){
45 $output = true;
46 break;
47 }
48 }
49 }
50
51 if( $output ){
52 echo $metabox['css_selector'].'{';
53 if( isset( $plugin_settings['style'][$save_page][$group] ) ){
54 foreach( $plugin_settings['style'][$save_page][$group] as $group => $val ){
55 if( $val != '' ){
56 if( isset( $ninja_forms_css_options[$group]['css_property'] ) ){
57 $css_property = $ninja_forms_css_options[$group]['css_property'];
58
59 if( $css_property != '' ){
60 echo $css_property.': '.$val.';';
61 }else{
62 echo $val;
63 }
64 }
65 }
66 }
67 }
68 echo '}';
69 }
70
71 }
72 }
73 }
74 }
75
76 //Output field-type CSS
77 if( is_array( $field_type_css ) ){
78 foreach( $field_type_css as $field_type => $groups ){
79 $output = array();
80 //Check to make sure that all of the css values aren't empty.
81 foreach( $groups as $group => $props ){
82 $output[$group] = false;
83 if( is_array( $props ) AND !empty( $props ) ){
84 foreach( $props as $k => $val ){
85 if( $val != '' ){
86 $output[$group] = true;
87 break;
88 }
89 }
90 }
91 }
92
93 if(strpos($field_type, "_") === 0){
94 $type_slug = substr($field_type, 1);
95 }
96
97 foreach( $groups as $group => $props ){
98 if( $output[$group] ){
99 if( isset( $ninja_forms_tabs_metaboxes['ninja-forms-style']['field_type_settings'][$group] ) ){
100 $css_selector = $ninja_forms_tabs_metaboxes['ninja-forms-style']['field_type_settings'][$group]['css_selector'];
101 $css_selector = str_replace( '[type_slug]', $type_slug, $css_selector );
102 $css_selector = apply_filters( 'ninja_forms_style_field_type_css_selector', $css_selector, $type_slug );
103 if( is_array( $props ) AND !empty( $props ) ){
104 echo $css_selector.'{';
105 foreach( $props as $prop => $value ){
106 if( $value != '' ){
107 if( isset( $ninja_forms_css_options[$prop]['css_property'] ) ){
108 $css_property = $ninja_forms_css_options[$prop]['css_property'];
109 if( $css_property != '' ){
110 echo $css_property.': '.$value.';';
111 }else{
112 echo $value;
113 }
114 }
115 }
116 }
117 echo '}';
118 }
119 }
120 }
121 }
122 }
123 }
124
125 //Output form-specific CSS
126 if( isset( $form_data['style']['groups'] ) AND is_array( $form_data['style']['groups'] ) ){
127 foreach( $form_data['style']['groups'] as $group => $props ){
128 $output = false;
129 foreach( $props as $prop => $value ){
130 if( $value != '' ){
131 $output = true;
132 break;
133 }
134 }
135 if( $output ){
136 switch( $group ){
137 case 'container':
138 echo '#ninja_forms_form_'.$form_id.'_wrap {';
139 break;
140 case 'title':
141 echo '#ninja_forms_form_'.$form_id.'_wrap h2.ninja-forms-form-title {';
142 break;
143 case 'row':
144 echo '#ninja_forms_form_'.$form_id.'_wrap div.ninja-row {';
145 break;
146 case 'row-odd':
147 echo '#ninja_forms_form_'.$form_id.'_wrap div.ninja-row:nth-child(odd) {';
148 break;
149 case 'success-msg':
150 echo '#ninja_forms_form_'.$form_id.'_wrap div.ninja-forms-success-msg {';
151 break;
152 case 'error_msg':
153 echo '#ninja_forms_form_'.$form_id.'_wrap div.ninja-forms-error-msg {';
154 break;
155 }
156
157 foreach( $props as $prop => $value ){
158 if( $value != '' ){
159 if( isset( $ninja_forms_css_options[$prop]['css_property'] ) ){
160 $css_property = $ninja_forms_css_options[$prop]['css_property'];
161 if( $css_property != '' ){
162 echo $css_property.': '.$value.';';
163 }else{
164 echo $value;
165 }
166 }
167 }
168 }
169 echo '}';
170 }
171 }
172 }
173
174 //Output field-specific CSS
175 if( !empty( $all_fields ) ){
176 foreach( $all_fields as $field ){
177 $field_id = $field['id'];
178 do_action( 'ninja_forms_style_field_metaboxes', $field_id );
179
180 $field_type = $field['type'];
181 if( isset( $field['data']['style']['groups'] ) AND is_array( $field['data']['style']['groups'] ) ){
182 foreach( $field['data']['style']['groups'] as $group => $props ){
183
184 $output = false;
185 foreach( $props as $prop => $value ){
186 if( $value != '' ){
187 $output = true;
188 break;
189 }
190 }
191 if( $output ){
192 if( isset( $ninja_forms_style_metaboxes['field'][$field_type][$group] ) ){
193 $css_selector = $ninja_forms_style_metaboxes['field'][$field_type][$group]['css_selector'];
194 $css_selector = str_replace( '[field_id]', $field_id, $css_selector );
195 }else if( isset( $ninja_forms_style_metaboxes['page']['field'][$group] ) ){
196 $css_selector = $ninja_forms_style_metaboxes['page']['field'][$group]['css_selector'];
197 $css_selector = str_replace( '[field_id]', $field_id, $css_selector );
198 }
199
200 echo $css_selector."{";
201 foreach( $props as $prop => $value ){
202 if( $value != '' ){
203 if( isset( $ninja_forms_css_options[$prop]['css_property'] ) ){
204 $css_property = $ninja_forms_css_options[$prop]['css_property'];
205 if( $css_property != '' ){
206 echo $css_property.': '.$value.';';
207 }else{
208 echo $value;
209 }
210 }
211 }
212 }
213 echo '}';
214 }
215 }
216 }
217 }
218 }
219
220
221 ?>
222 </style>
223 <?php
224
225 }
1 <?php
2 if ( !function_exists( 'ninja_forms_field_type_dropdown' ) ) {
3 function ninja_forms_field_type_dropdown( $args = '' ){
4 global $ninja_forms_fields, $ninja_forms_field_type_groups;
5 if( isset( $args['echo'] ) ){
6 $echo = $args['echo'];
7 }else{
8 $echo = true;
9 }
10
11 if( isset( $args['selected'] ) ){
12 $selected = $args['selected'];
13 }else{
14 $selected = '';
15 }
16
17 $groups = $ninja_forms_field_type_groups;
18 ksort( $groups );
19
20 $output = '<select name="field_type" id="field_type">
21 <option value="">' . __( '- Field Type', 'ninja-forms-style' ) . '</option>';
22 foreach( $groups as $gslug => $group ){
23 $group_name = $group['name'];
24 $output .= '<optgroup label="'.$group_name.'">';
25 foreach( $ninja_forms_fields as $fslug => $field ){
26 if( isset( $field['group'] ) AND $field['group'] == $gslug ){
27 if( isset( $field['type_dropdown_function'] ) AND $field['type_dropdown_function'] != '' ){
28 $dropdown_function = $field['type_dropdown_function'];
29 $arguments['selected'] = $selected;
30 $output .= call_user_func_array( $dropdown_function, $arguments );
31 }else{
32 if( $fslug == $selected ){
33 $select = 'selected="selected"';
34 }else{
35 $select = '';
36 }
37 $output .= '<option value="'.$fslug.'" '.$select.'>'.$field['name'].'</option>';
38 }
39 }
40 }
41 $output .= '</optgroup>';
42 }
43
44 $output .= '</select>';
45
46 if( $echo ){
47 echo $output;
48 }else{
49 return $output;
50 }
51 }
52 }
53
54
55 function ninja_forms_style_filter_submit_css_selecter( $css_selector, $field_type ) {
56
57 if ( $css_selector == 'submit_hover' ) {
58 $css_selector = '.ninja-forms-form-wrap .ninja-forms-form input[type=submit]:hover';
59 } elseif ( $field_type == 'submit' ) {
60 $css_selector = '.ninja-forms-form-wrap .ninja-forms-form input[type=submit]';
61 }
62
63 return $css_selector;
64 }
65 add_filter( 'ninja_forms_style_field_type_css_selector', 'ninja_forms_style_filter_submit_css_selecter', 10, 2 );
...\ No newline at end of file ...\ No newline at end of file
1 <?php
2
3 if( ! function_exists( 'ninja_forms_style_setup_license' ) ) {
4 function ninja_forms_style_setup_license()
5 {
6 if (class_exists('NF_Extension_Updater')) {
7 $NF_Extension_Updater = new NF_Extension_Updater('Layout and Styles', NINJA_FORMS_STYLE_VERSION, 'WP Ninjas', __FILE__, 'style');
8 }
9 }
10 }
11
12 add_action( 'admin_init', 'ninja_forms_style_setup_license' );
13
14
15 /**
16 * Load translations for add-on.
17 * First, look in WP_LANG_DIR subfolder, then fallback to add-on plugin folder.
18 */
19 if( ! function_exists( 'ninja_forms_style_load_translations' ) ) {
20 function ninja_forms_style_load_translations()
21 {
22
23 /** Set our unique textdomain string */
24 $textdomain = 'ninja-forms-style';
25
26 /** The 'plugin_locale' filter is also used by default in load_plugin_textdomain() */
27 $locale = apply_filters('plugin_locale', get_locale(), $textdomain);
28
29 /** Set filter for WordPress languages directory */
30 $wp_lang_dir = apply_filters(
31 'ninja_forms_style_wp_lang_dir',
32 trailingslashit(WP_LANG_DIR) . 'ninja-forms-style/' . $textdomain . '-' . $locale . '.mo'
33 );
34
35 /** Translations: First, look in WordPress' "languages" folder = custom & update-secure! */
36 load_textdomain($textdomain, $wp_lang_dir);
37
38 /** Translations: Secondly, look in plugin's "lang" folder = default */
39 $plugin_dir = trailingslashit(basename(dirname(__FILE__)));
40 $lang_dir = apply_filters('ninja_forms_style_lang_dir', $plugin_dir . 'lang/');
41 load_plugin_textdomain($textdomain, FALSE, $lang_dir);
42
43 }
44 }
45 add_action( 'plugins_loaded', 'ninja_forms_style_load_translations' );
46
47
48 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/admin.php");
49 require_once(NINJA_FORMS_STYLE_DIR."/includes/functions.php");
50 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms-style/tabs/form-settings/form-settings.php");
51 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms-style/tabs/field-settings/field-settings.php");
52 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms-style/tabs/field-type-settings/field-type-settings.php");
53 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms-style/tabs/field-type-settings/sidebars/select-field.php");
54 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms-style/tabs/error-settings/error-settings.php");
55 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms-style/tabs/datepicker-settings/datepicker-settings.php");
56 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms-style/tabs/multipart-settings/multipart-settings.php");
57
58 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms/tabs/form-layout/form-layout.php");
59 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms/tabs/form-layout/form-layout-div.php");
60 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms/tabs/form-layout/form-layout-mp-div.php");
61 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms/tabs/form-layout/form-layout-output-ul.php");
62 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms/tabs/form-layout/default-field-metaboxes.php");
63 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms/tabs/form-layout/list-field-metaboxes.php");
64 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms/tabs/form-layout/rating-field-metaboxes.php");
65
66 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/pages/ninja-forms-impexp/tabs/style/impexp-style.php");
67
68 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/ajax.php");
69 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/register.php");
70 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/scripts.php");
71 require_once(NINJA_FORMS_STYLE_DIR."/includes/admin/style-metabox-output.php");
72
73 require_once(NINJA_FORMS_STYLE_DIR."/includes/display/div-output.php");
74 require_once(NINJA_FORMS_STYLE_DIR."/includes/display/scripts.php");
...\ No newline at end of file ...\ No newline at end of file
1 .layouts #nf-main-content {
2 /*max-width: 100%;*/ }
3
4 .layouts.few #nf-main-content {
5 max-width: 900px; }
6
7 .layouts.several #nf-main-content {
8 max-width: 1200px; }
9
10 .layouts.many #nf-main-content {
11 max-width: 100%; }
12
13 .layouts-row {
14 display: -webkit-box;
15 display: -ms-flexbox;
16 display: flex;
17 -ms-flex-line-pack: stretch;
18 align-content: stretch;
19 /*border: 2px dashed darkblue;*/ }
20
21 .layouts-row .gutter {
22 border: 0;
23 cursor: ew-resize; }
24
25 .layouts-row:hover .gutter.nf-fields-sortable-placeholder, .layouts-row.dragging .gutter.nf-fields-sortable-placeholder {
26 margin: 0;
27 background: #84CC1E !important; }
28
29 .layouts-row:hover .gutter, .layouts-row.hovered .gutter {
30 background: #ccc; }
31
32 .layouts-row:hover .gutter:first-child, .layouts-row:hover .gutter:last-child {
33 background: #fff; }
34
35 .layouts-row:hover .gutter:first-child {
36 border: 1px solid #ccc;
37 background: #fff;
38 cursor: ns-resize !important;
39 position: relative; }
40
41 .layouts-row:hover .gutter:first-child::after {
42 content: "";
43 border: 1px solid #ddd;
44 position: absolute;
45 right: 3px;
46 top: 5px;
47 bottom: 5px; }
48
49 .layouts-row.dragging .gutter {
50 background: #1EA9EA !important; }
51
52 .layouts-row::after {
53 clear: both;
54 content: "";
55 display: block; }
56
57 .layouts-cell {
58 float: left;
59 overflow: hidden;
60 padding-left: 4px;
61 padding-right: 4px;
62 /*border: 1px solid orange;*/
63 margin: 10px 0; }
64
65 .layouts-cell .nf-fields-sortable-placeholder {
66 margin: 0; }
67
68 .layouts-cell .nf-fields-sortable-placeholder + .nf-field-wrap {
69 margin-top: 12px; }
70
71 .layouts-cell .nf-field-wrap + .nf-fields-sortable-placeholder {
72 margin-top: -6px; }
73
74 .layouts-cell .nf-field-wrap + .nf-fields-sortable-placeholder + .nf-field-wrap {
75 margin-top: 12px; }
76
77 /*.layouts-cell .nf-field-wrap {
78 margin: 12px 0;
79 }*/
80 .nf-field-wrap:last-child {
81 margin-bottom: 0; }
82
83 .layouts-cell .nf-field-wrap:last-child {
84 margin-bottom: 0; }
85
86 .layouts-dragging .layouts-cell {
87 margin: 0; }
88
89 .layouts-handle {
90 background: green;
91 -ms-flex-item-align: stretch;
92 -ms-grid-row-align: stretch;
93 align-self: stretch;
94 float: left;
95 width: 10px; }
96
97 .no-fields {
98 color: #888;
99 margin: 10px 0;
100 padding: 15px 10px;
101 text-align: center; }
102
103 .no-fields .nf-button {
104 padding: 4px 6px;
105 text-align: center; }
106
107 .layouts-row-collection > .nf-fields-sortable-placeholder {
108 margin-bottom: -8px;
109 margin-top: 0; }
110
111 .layouts-row-collection > .nf-fields-sortable-placeholder + .layout-row {
112 margin: 6px; }
113
114 .layouts-row-collection .layouts-row + .nf-fields-sortable-placeholder {
115 margin-top: -8px; }
116
117 .layouts-dragging .layouts-row {
118 padding: 6px;
119 margin: 8px 0; }
120
121 .layouts-dragging .layouts-cell .nf-field-wrap {
122 /*margin: 30px 0;*/ }
123
124 .layouts-dragging .gutter {
125 width: 20px !important;
126 -webkit-transition: width 0.5s ease;
127 transition: width 0.5s ease; }
128
129 .layouts-row.multi-cell .nf-field-wrap {
130 margin: 20px 0; }
131
132 .layouts-row.multi-cell .nf-fields-sortable-placeholder {
133 margin: 6px 0; }
134
135 .layouts-row.multi-cell .gutter.nf-fields-sortable-placeholder {
136 margin: 0; }
137
138 .layouts-row.multi-cell .nf-fields-sortable-placeholder + .nf-field-wrap {
139 margin-top: 0; }
140
141 .layouts-row.multi-cell .nf-field-wrap + .nf-fields-sortable-placeholder {
142 margin-top: -14px; }
143
144 .layouts-row.multi-cell .nf-field-wrap + .nf-fields-sortable-placeholder + .nf-field-wrap {
145 margin-top: 6px; }
146
147 .gutter {
148 position: relative; }
149 .gutter span {
150 color: #aaa;
151 font-size: 12px;
152 position: absolute;
153 top: -5px; }
154 .gutter .percent-left {
155 right: 20px; }
156 .gutter .percent-right {
157 left: 20px; }
158
159 @media only screen and (max-width: 1285px) {
160 .layouts.many.nf-drawer-opened .layouts-row,
161 .layouts.several.nf-drawer-opened .layouts-row {
162 /*border-bottom: 2px solid #424242;*/
163 display: block !important; }
164 .layouts.many.nf-drawer-opened .layouts-cell,
165 .layouts.several.nf-drawer-opened .layouts-cell {
166 width: 100% !important; }
167 .layouts.many.nf-drawer-opened .multi-cell .layouts-cell,
168 .layouts.several.nf-drawer-opened .multi-cell .layouts-cell {
169 border-bottom: 1px solid red;
170 padding-bottom: 20px; }
171 .layouts.many.nf-drawer-opened.layouts-dragging .multi-cell .layouts-cell,
172 .layouts.several.nf-drawer-opened.layouts-dragging .multi-cell .layouts-cell {
173 padding-bottom: 0; }
174 .layouts.many.nf-drawer-opened .gutter,
175 .layouts.several.nf-drawer-opened .gutter {
176 display: none; } }
177
178 /*# sourceMappingURL=builder.css.map */
1 {"version":3,"sources":["builder.scss"],"names":[],"mappings":"AAAA;EACI,oBAAoB,EAEvB;;AAED;EACI,iBAAiB,EACpB;;AACD;EACI,kBAAkB,EACrB;;AACD;EACI,gBAAgB,EACnB;;AAED;EACI,qBAAc;EAAd,qBAAc;EAAd,cAAc;EACd,4BAAuB;MAAvB,uBAAuB;EACvB,gCAAgC,EAEnC;;AACD;EACI,UAAU;EACV,kBAAkB,EACrB;;AACD;EACI,UAAU;EACV,+BAA+B,EAClC;;AACD;EACI,iBAAiB,EACpB;;AACD;EACI,iBAAiB,EACpB;;AACD;EACI,uBAAuB;EACvB,iBAAiB;EACjB,6BAA6B;EAC7B,mBAAmB,EACtB;;AACD;EACI,YAAY;EACZ,uBAAuB;EACvB,mBAAmB;EACnB,WAAW;EACX,SAAS;EACT,YAAY,EACf;;AACD;EACI,+BAA+B,EAClC;;AACD;EACI,YAAY;EACZ,YAAY;EACZ,eAAe,EAClB;;AACD;EACI,YAAY;EACZ,iBAAiB;EACjB,kBAAkB;EAClB,mBAAmB;EACnB,6BAA6B;EAC7B,eAAe,EAClB;;AAED;EACI,UAAU,EACb;;AACD;EACI,iBAAiB,EACpB;;AACD;EACI,iBAAiB,EACpB;;AACD;EACI,iBAAiB,EACpB;;AACD;;GAEG;AACH;EACI,iBAAiB,EACpB;;AACD;EACI,iBAAiB,EACpB;;AAED;EACI,UAAU,EACb;;AAED;EACI,kBAAkB;EAClB,6BAAoB;MAApB,4BAAoB;MAApB,oBAAoB;EACpB,YAAY;EACZ,YAAY,EACf;;AACD;EACI,YAAY;EACZ,eAAe;EACf,mBAAmB;EACnB,mBAAmB,EACtB;;AACD;EACI,iBAAiB;EACjB,mBAAmB,EACtB;;AAKD;EACI,oBAAoB;EACpB,cAAc,EACjB;;AAED;EACI,YAAY,EACf;;AAED;EACI,iBAAiB,EACpB;;AAKD;EACI,aAAa;EACb,cAAc,EAEjB;;AAED;EACI,mBAAmB,EACtB;;AACD;EACI,uBAAuB;EACvB,oCAA4B;EAA5B,4BAA4B,EAC/B;;AAED;EACI,eAAe,EAClB;;AACD;EACI,cAAc,EACjB;;AACD;EACI,UACH,EAAC;;AACF;EACI,cAAc,EACjB;;AACD;EACI,kBAAkB,EACrB;;AACD;EACI,gBAAgB,EACnB;;AAED;EACI,mBAAmB,EAatB;EAdD;IAGQ,YAAY;IACZ,gBAAgB;IAChB,mBAAmB;IACnB,UAAU,EACb;EAPL;IASQ,YAAY,EACf;EAVL;IAYQ,WAAW,EACd;;AAIL;EACI;;IAEI,qCAAqC;IACrC,0BAA0B,EAC7B;EACD;;IAEI,uBAAuB,EAC1B;EACD;;IAEI,6BAA6B;IAC7B,qBAAqB,EACxB;EACD;;IAEI,kBAAkB,EACrB;EACD;;IAEI,cAAc,EACjB,EAAA","file":"builder.css","sourcesContent":[".layouts #nf-main-content {\n /*max-width: 100%;*/\n //margin-top: 30px;\n}\n\n.layouts.few #nf-main-content {\n max-width: 900px;\n}\n.layouts.several #nf-main-content {\n max-width: 1200px;\n}\n.layouts.many #nf-main-content {\n max-width: 100%;\n}\n\n.layouts-row {\n display: flex;\n align-content: stretch;\n /*border: 2px dashed darkblue;*/\n\n}\n.layouts-row .gutter {\n border: 0;\n cursor: ew-resize;\n}\n.layouts-row:hover .gutter.nf-fields-sortable-placeholder, .layouts-row.dragging .gutter.nf-fields-sortable-placeholder {\n margin: 0;\n background: #84CC1E !important;\n}\n.layouts-row:hover .gutter, .layouts-row.hovered .gutter {\n background: #ccc;\n}\n.layouts-row:hover .gutter:first-child, .layouts-row:hover .gutter:last-child {\n background: #fff;\n}\n.layouts-row:hover .gutter:first-child {\n border: 1px solid #ccc;\n background: #fff;\n cursor: ns-resize !important;\n position: relative;\n}\n.layouts-row:hover .gutter:first-child::after {\n content: \"\";\n border: 1px solid #ddd;\n position: absolute;\n right: 3px;\n top: 5px;\n bottom: 5px;\n}\n.layouts-row.dragging .gutter {\n background: #1EA9EA !important;\n}\n.layouts-row::after {\n clear: both;\n content: \"\";\n display: block;\n}\n.layouts-cell {\n float: left;\n overflow: hidden;\n padding-left: 4px;\n padding-right: 4px;\n /*border: 1px solid orange;*/\n margin: 10px 0;\n}\n\n.layouts-cell .nf-fields-sortable-placeholder {\n margin: 0;\n}\n.layouts-cell .nf-fields-sortable-placeholder + .nf-field-wrap {\n margin-top: 12px;\n}\n.layouts-cell .nf-field-wrap + .nf-fields-sortable-placeholder {\n margin-top: -6px;\n}\n.layouts-cell .nf-field-wrap + .nf-fields-sortable-placeholder + .nf-field-wrap {\n margin-top: 12px;\n}\n/*.layouts-cell .nf-field-wrap {\n margin: 12px 0;\n}*/\n.nf-field-wrap:last-child {\n margin-bottom: 0;\n}\n.layouts-cell .nf-field-wrap:last-child {\n margin-bottom: 0;\n}\n\n.layouts-dragging .layouts-cell {\n margin: 0;\n}\n\n.layouts-handle {\n background: green;\n align-self: stretch;\n float: left;\n width: 10px;\n}\n.no-fields {\n color: #888;\n margin: 10px 0;\n padding: 15px 10px;\n text-align: center;\n}\n.no-fields .nf-button {\n padding: 4px 6px;\n text-align: center;\n}\n// .layouts-row-collection + .nf-fields-sortable-placeholder {\n// margin-top: 50px !important;\n// }\n\n.layouts-row-collection > .nf-fields-sortable-placeholder {\n margin-bottom: -8px;\n margin-top: 0;\n}\n\n.layouts-row-collection > .nf-fields-sortable-placeholder + .layout-row {\n margin: 6px;\n}\n\n.layouts-row-collection .layouts-row + .nf-fields-sortable-placeholder {\n margin-top: -8px;\n}\n// .layouts-row-collection .nf-fields-sortable-placeholder + .layouts-row {\n// margin-top: -8px;\n// }\n\n.layouts-dragging .layouts-row {\n padding: 6px;\n margin: 8px 0;\n //transition: all 0.5s ease;\n}\n\n.layouts-dragging .layouts-cell .nf-field-wrap {\n /*margin: 30px 0;*/\n}\n.layouts-dragging .gutter {\n width: 20px !important;\n transition: width 0.5s ease;\n}\n\n.layouts-row.multi-cell .nf-field-wrap {\n margin: 20px 0;\n}\n.layouts-row.multi-cell .nf-fields-sortable-placeholder {\n margin: 6px 0;\n}\n.layouts-row.multi-cell .gutter.nf-fields-sortable-placeholder {\n margin: 0\n}\n.layouts-row.multi-cell .nf-fields-sortable-placeholder + .nf-field-wrap {\n margin-top: 0;\n}\n.layouts-row.multi-cell .nf-field-wrap + .nf-fields-sortable-placeholder {\n margin-top: -14px;\n}\n.layouts-row.multi-cell .nf-field-wrap + .nf-fields-sortable-placeholder + .nf-field-wrap {\n margin-top: 6px;\n}\n\n.gutter {\n position: relative;\n span {\n color: #aaa;\n font-size: 12px;\n position: absolute;\n top: -5px;\n }\n .percent-left {\n right: 20px;\n }\n .percent-right {\n left: 20px;\n }\n}\n\n\n@media only screen and (max-width: 1285px) {\n .layouts.many.nf-drawer-opened .layouts-row,\n .layouts.several.nf-drawer-opened .layouts-row {\n /*border-bottom: 2px solid #424242;*/\n display: block !important;\n }\n .layouts.many.nf-drawer-opened .layouts-cell,\n .layouts.several.nf-drawer-opened .layouts-cell {\n width: 100% !important;\n }\n .layouts.many.nf-drawer-opened .multi-cell .layouts-cell,\n .layouts.several.nf-drawer-opened .multi-cell .layouts-cell {\n border-bottom: 1px solid red;\n padding-bottom: 20px;\n }\n .layouts.many.nf-drawer-opened.layouts-dragging .multi-cell .layouts-cell,\n .layouts.several.nf-drawer-opened.layouts-dragging .multi-cell .layouts-cell {\n padding-bottom: 0;\n }\n .layouts.many.nf-drawer-opened .gutter,\n .layouts.several.nf-drawer-opened .gutter {\n display: none;\n }\n}\n"]}
...\ No newline at end of file ...\ No newline at end of file
1 .nf-multi-cell .nf-row::after {
2 clear: both;
3 content: "";
4 display: block; }
5
6 .nf-multi-cell .nf-cell {
7 float: left;
8 padding: 0 5px; }
9
10 .nf-multi-cell .five-sixths,
11 .nf-multi-cell .four-sixths,
12 .nf-multi-cell .one-fourth,
13 .nf-multi-cell .one-half,
14 .nf-multi-cell .one-sixth,
15 .nf-multi-cell .one-third,
16 .nf-multi-cell .three-fourths,
17 .nf-multi-cell .three-sixths,
18 .nf-multi-cell .two-fourths,
19 .nf-multi-cell .two-sixths,
20 .nf-multi-cell .two-thirds {
21 float: none;
22 margin-left: 0;
23 width: 100%; }
24 .nf-multi-cell .five-sixths .inside,
25 .nf-multi-cell .four-sixths .inside,
26 .nf-multi-cell .one-fourth .inside,
27 .nf-multi-cell .one-half .inside,
28 .nf-multi-cell .one-sixth .inside,
29 .nf-multi-cell .one-third .inside,
30 .nf-multi-cell .three-fourths .inside,
31 .nf-multi-cell .three-sixths .inside,
32 .nf-multi-cell .two-fourths .inside,
33 .nf-multi-cell .two-sixths .inside,
34 .nf-multi-cell .two-thirds .inside {
35 padding: 20px; }
36 .nf-multi-cell .five-sixths::after,
37 .nf-multi-cell .four-sixths::after,
38 .nf-multi-cell .one-fourth::after,
39 .nf-multi-cell .one-half::after,
40 .nf-multi-cell .one-sixth::after,
41 .nf-multi-cell .one-third::after,
42 .nf-multi-cell .three-fourths::after,
43 .nf-multi-cell .three-sixths::after,
44 .nf-multi-cell .two-fourths::after,
45 .nf-multi-cell .two-sixths::after,
46 .nf-multi-cell .two-thirds::after {
47 clear: both;
48 content: "";
49 display: block; }
50
51 @media only screen and (max-width: 600px) {
52 .nf-cell {
53 width: 100% !important; } }
54
55 /*# sourceMappingURL=display-structure.css.map */
1 {"version":3,"sources":["display-structure.scss"],"names":[],"mappings":"AAYA;EAGY,YAAY;EACZ,YAAY;EACZ,eAAe,EAClB;;AANT;EASQ,YAAY;EACZ,eAAe,EAClB;;AAXL;;;;;;;;;;;EAuBQ,YAAY;EACZ,eAAe;EACf,YAAY,EASf;EAlCL;;;;;;;;;;;IA2BY,cAAc,EACjB;EA5BT;;;;;;;;;;;IA8BY,YAAY;IACZ,YAAY;IACZ,eAAe,EAClB;;AAIT;EACI;IACI,uBAAuB,EAC1B,EAAA","file":"display-structure.css","sourcesContent":["\n// .nf-row {\n// &::after {\n// clear: both;\n// content: \"\";\n// display: block;\n// }\n// }\n// .nf-cell {\n// float: left;\n// padding: 0 5px;\n// }\n.nf-multi-cell {\n .nf-row {\n &::after {\n clear: both;\n content: \"\";\n display: block;\n }\n }\n .nf-cell {\n float: left;\n padding: 0 5px;\n }\n .five-sixths,\n .four-sixths,\n .one-fourth,\n .one-half,\n .one-sixth,\n .one-third,\n .three-fourths,\n .three-sixths,\n .two-fourths,\n .two-sixths,\n .two-thirds {\n float: none;\n margin-left: 0;\n width: 100%;\n .inside {\n padding: 20px;\n }\n &::after {\n clear: both;\n content: \"\";\n display: block;\n }\n }\n}\n\n@media only screen and (max-width: 600px) {\n .nf-cell {\n width: 100% !important;\n }\n}\n"]}
...\ No newline at end of file ...\ No newline at end of file
1 .nf-cell {
2 float: left;
3 padding: 5px;
4 }
...\ No newline at end of file ...\ No newline at end of file
1 define( [], function() {
2 var controller = Marionette.Object.extend( {
3 initialize: function() {
4 var fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );
5 fieldCollection.on( 'add', this.maybeAddRow, this );
6
7 this.listenTo( nfRadio.channel( 'drawer-addField' ), 'startDrag:type', this.startDragging );
8 this.listenTo( nfRadio.channel( 'drawer-addField' ), 'stopDrag:type', this.stopDragging );
9
10 this.listenTo( nfRadio.channel( 'drawer-addField' ), 'startDrag:fieldStaging', this.startDragging );
11 this.listenTo( nfRadio.channel( 'drawer-addField' ), 'stopDrag:fieldStaging', this.stopDragging );
12 },
13
14 maybeAddRow: function( model ) {
15 if ( ! model.get( 'cellcid' ) ) {
16 var order = ( ! model.get( 'order' ) || 999 == model.get( 'order' ) ) ? null : model.get( 'order' );
17 nfRadio.channel( 'layouts' ).request( 'add:row', null, { order: order, field: model } );
18 }
19 },
20
21 startDragging: function( ui ) {
22 jQuery( '.layouts-row' ).addClass( 'dragging' );
23 jQuery( '#nf-builder' ).addClass( 'layouts-dragging' );
24 },
25
26 stopDragging: function( ui ) {
27 jQuery( '.layouts-row' ).removeClass( 'dragging' );
28 jQuery( '#nf-builder' ).removeClass( 'layouts-dragging' );
29 }
30
31 });
32
33 return controller;
34 } );
1 define( [ 'models/rowCollection' ], function( RowCollection ) {
2 var controller = Marionette.Object.extend( {
3 overSortable: false,
4 outFired: false,
5 overCell: false,
6 overRows: false,
7
8 initialize: function() {
9 // Respond to requests to add a row to our collection.
10 nfRadio.channel( 'layouts' ).reply( 'add:row', this.addRow, this );
11 },
12
13 addRow: function( rowCollection, data ) {
14
15 if ( ! rowCollection ) {
16 /*
17 * In the RC for Ninja Forms, 'formContentData' was 'fieldContentsData'.
18 * In 3.0, we changed it to 'formContentData', so this line checks for that old setting name if the new one doesn't exist.
19 * This is for backwards compatibility and can be removed in the future.
20 *
21 * TODO: Remove the || portion of this ternary.
22 */
23 rowCollection = nfRadio.channel( 'settings' ).request( 'get:setting', 'formContentData' ) || nfRadio.channel( 'settings' ).request( 'get:setting', 'fieldContentsData' );
24 if ( false === rowCollection instanceof RowCollection ) return false;
25 }
26
27 if ( 'undefined' == typeof data.order || null == data.order ) {
28 /*
29 * Get the order of the last item in our row collection.
30 */
31 rowOrder = rowCollection.pluck( 'order' );
32 data.order = ( 0 < rowOrder.length ) ? _.max( rowOrder ) + 1 : 1;
33 }
34
35 var rowModel = rowCollection.add( {
36 order: data.order,
37 cells: [
38 {
39 order: 0,
40 fields: [ data.field ],
41 width: '100'
42 }
43 ]
44 } );
45
46 return rowModel;
47 },
48
49 updateOverSortable: function( val ) {
50 this.overSortable = val;
51 },
52
53 getOverSortable: function() {
54 return this.overSortable;
55 },
56
57 updateOutFired: function( val ) {
58 this.outFired = val;
59 },
60
61 getOutFired: function() {
62 return this.outFired;
63 },
64
65 updateOverCell: function( val ) {
66 this.overCell = val;
67 },
68
69 getOverCell: function() {
70 return this.overCell;
71 }
72 });
73
74 return controller;
75 } );
...\ No newline at end of file ...\ No newline at end of file
1 define( ['views/rowCollection', 'controllers/loadControllers', 'models/rowCollection'], function( RowCollectionView, LoadControllers, RowCollection ) {
2 var controller = Marionette.Object.extend( {
3 initialize: function() {
4 this.listenTo( nfRadio.channel( 'app' ), 'after:loadControllers', this.loadControllers );
5 },
6
7 loadControllers: function() {
8 new LoadControllers();
9
10 nfRadio.channel( 'formContent' ).request( 'add:viewFilter', this.getFormContentView, 4, this );
11 nfRadio.channel( 'formContent' ).request( 'add:saveFilter', this.formContentSave, 4, this );
12 nfRadio.channel( 'formContent' ).request( 'add:loadFilter', this.formContentLoad, 4, this );
13
14 /*
15 * In the RC for Ninja Forms, the 'formContent' channel was called 'fieldContents'.
16 * This was changed in version 3.0. These radio messages are here to make sure nothing breaks.
17 *
18 * TODO: Remove this backwards compatibility radio calls.
19 */
20 nfRadio.channel( 'fieldContents' ).request( 'add:viewFilter', this.getFormContentView, 4, this );
21 nfRadio.channel( 'fieldContents' ).request( 'add:saveFilter', this.formContentSave, 4, this );
22 nfRadio.channel( 'fieldContents' ).request( 'add:loadFilter', this.formContentLoad, 4, this );
23 },
24
25 getFormContentView: function( collection ) {
26 return RowCollectionView;
27 },
28
29 /**
30 * When we update our database, set the form setting value of 'formContentData' to our row collection.
31 * To do this, we have to break our row collection down into an object, then remove all the extra field settings
32 * so that we're left with just the field IDs.
33 *
34 * @since 3.0
35 * @return array
36 */
37 formContentSave: function( rowCollection ) {
38 var rows = JSON.parse( JSON.stringify( rowCollection ) );
39 _.each( rows, function( row, rowIndex ) {
40 _.each( row.cells, function( cell, cellIndex ) {
41 _.each( cell.fields, function( field, fieldIndex ) {
42 if ( field.key ) {
43 rows[ rowIndex ].cells[ cellIndex].fields[ fieldIndex ] = field.key;
44 }
45 } );
46 } );
47 } );
48
49 return rows;
50 },
51
52 /**
53 * When we load our builder view, we filter the formContentData.
54 * This turns the saved object into a Backbone Collection.
55 *
56 * If we aren't passed any data, then this form hasn't been modified with layouts yet,
57 * so we default to the nfLayouts.rows global variable that is localised for us.
58 *
59 * @since 3.0
60 * @param array formContentData current value of our formContentData.
61 * @param bool empty is this a purposefully empty collection?
62 * @param array fields fields array to be turned into rows. This is only passed if MP is also active.
63 * @return Backbone.Collection
64 */
65 formContentLoad: function( formContentData, empty, fields ) {
66 if ( true === formContentData instanceof RowCollection ) return formContentData;
67
68 empty = empty || false;
69 fields = fields || false;
70 var rowArray = [];
71
72 var formContentLoadFilters = nfRadio.channel( 'formContent' ).request( 'get:loadFilters' );
73
74 /*
75 * TODO: Bandaid fix for making sure that we interpret fields correclty when Multi-Part is active.
76 * Basically, if MP is active, we don't want to ever use the nfLayouts.rows.
77 */
78 var mpEnabled = ( 'undefined' != typeof formContentLoadFilters[1] ) ? true : false;
79
80 /*
81 * TODO: Bandaid fix for making sure that Layouts can interpret Multi-Part data if Multi-Part is disabled.
82 */
83 if ( ! mpEnabled && _.isArray( formContentData ) && 0 != _.isArray( formContentData ).length && 'undefined' != typeof _.first( formContentData ) && 'part' == _.first( formContentData ).type ) {
84 /*
85 * Get our layout data from inside MP
86 */
87
88 formContentData = _.flatten( _.pluck( formContentData, 'formContentData' ) );
89 _.each( formContentData, function( row, index ) {
90 row.order = index + 1;
91 }, this );
92 }
93
94 if ( _.isArray( formContentData ) && 0 != formContentData.length && 'undefined' == typeof formContentData[0].cells ) {
95 _.each( formContentData, function( key, index ) {
96 rowArray.push( {
97 order: index,
98 cells: [ {
99 order: 0,
100 fields: [ key ],
101 width: '100'
102 } ]
103 } );
104
105 } );
106 } else if ( _.isEmpty( formContentData ) && 'undefined' != typeof nfLayouts && ! mpEnabled ) {
107 rowArray = nfLayouts.rows;
108 } else {
109 rowArray = formContentData;
110 }
111
112 /*
113 * Ensure that our rows don't have any empty fields
114 */
115 rowArray = _.filter( rowArray, function( row ) {
116 /*
117 * Check to see if any of our row's cells have a field.
118 * If it does, return true and move on.
119 */
120 return _.some( row.cells, function( cell ) {
121 return 1 <= cell.fields.length;
122 } );
123 } );
124
125 return new RowCollection( rowArray );
126 }
127 });
128
129 return controller;
130 } );
...\ No newline at end of file ...\ No newline at end of file
1 define(
2 [
3 'controllers/data',
4 'controllers/maxCols',
5 'controllers/addField',
6 'controllers/cellSortable',
7 'controllers/gutterDroppable',
8 'controllers/rowsSortable',
9 'controllers/undo',
10 'controllers/updateFieldOrder'
11 ],
12 function
13 (
14 Data,
15 MaxCols,
16 AddField,
17 CellSortable,
18 GutterDroppable,
19 RowsSortable,
20 Undo,
21 UpdateFieldOrder
22 )
23 {
24 var controller = Marionette.Object.extend( {
25 initialize: function() {
26 new MaxCols();
27 new Data();
28 new AddField();
29 new CellSortable();
30 new GutterDroppable();
31 new RowsSortable();
32 new Undo();
33 new UpdateFieldOrder();
34 }
35
36 });
37
38 return controller;
39 } );
...\ No newline at end of file ...\ No newline at end of file
1 define( [], function() {
2 var controller = Marionette.Object.extend( {
3 initialize: function() {
4 nfRadio.channel( 'layouts' ).reply( 'update:colClass', this.updateColClass );
5 },
6
7 updateColClass: function( num ) {
8 var builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );
9 jQuery( builderEl ).removeClass( 'few several many' );
10
11 if ( num == 3 ) {
12 var builderClass = 'few';
13 } else if ( num >= 4 && num <= 5 ) {
14 var builderClass = 'several';
15 } else if ( num >= 6 ) {
16 var builderClass = 'many';
17 } else {
18 var builderClass = '';
19 }
20
21 jQuery( builderEl ).addClass( builderClass );
22
23 }
24
25 });
26
27 return controller;
28 } );
1 /**
2 * Recalculates our field order attribute.
3 * This isn't the attribute used by Layouts but the one used by core.
4 *
5 * @since 3.0
6 */
7 define( [], function() {
8 var controller = Marionette.Object.extend( {
9 initialize: function() {
10 nfRadio.channel( 'layouts' ).reply( 'update:fieldOrder', this.updateFieldOrder );
11 },
12
13 updateFieldOrder: function( rowCollection ) {
14 var order = 1;
15 /*
16 * Loop over our row collection and set the order attribute for any fields we find inside the cells.
17 */
18 _.each( rowCollection.models, function( rowModel, rowIndex ) {
19 /*
20 * Loop over our cells and update our field models 'order' attribute.
21 */
22 _.each( rowModel.get( 'cells' ).models, function( cellModel, cellIndex ) {
23 /*
24 * Loop over every field in our cell model and update its 'order' attribute.
25 */
26 _.each( cellModel.get( 'fields' ).models, function( fieldModel, fieldIndex ) {
27 fieldModel.set( 'order', order, { silent: true } );
28 order++;
29 } );
30 } );
31 } );
32 }
33
34 });
35
36 return controller;
37 } );
1 var nfRadio = Backbone.Radio;
2 require( ['controllers/loadContent'], function( LoadContent ) {
3
4 var NFLayouts = Marionette.Application.extend( {
5
6 initialize: function( options ) {
7 this.listenTo( nfRadio.channel( 'app' ), 'after:appStart', this.afterNFLoad );
8 },
9
10 onStart: function() {
11 new LoadContent();
12 },
13
14 afterNFLoad: function( app ) {
15 var builderEl = nfRadio.channel( 'app' ).request( 'get:builderEl' );
16 jQuery( builderEl ).addClass( 'layouts' );
17 }
18 } );
19
20 var nfLayouts = new NFLayouts();
21 nfLayouts.start();
22 } );
...\ No newline at end of file ...\ No newline at end of file
1 /**
2 * Holds all of our cell models.
3 *
4 * @package Ninja Forms Layouts
5 * @subpackage Fields
6 * @copyright (c) 2016 WP Ninjas
7 * @since 3.0
8 */
9 define( ['models/cellModel'], function( cellModel ) {
10 var collection = Backbone.Collection.extend( {
11 model: cellModel,
12 comparator: 'order',
13
14 initialize: function( models, options ) {
15 this.options = options;
16 this.on( 'change:fields', this.updateRowModel, this );
17 this.on( 'add', this.addCell, this );
18 this.on( 'remove', this.updateCellWidths, this );
19 },
20
21 addCell: function() {
22 this.updateCellWidths();
23 this.updateRowModel();
24 this.options.rowModel.trigger( 'add:cell', this.options.rowModel );
25 },
26
27 updateRowModel: function() {
28 this.options.rowModel.set( 'cells', this );
29 this.options.rowModel.trigger( 'change:cells', this.options.rowModel );
30 },
31
32 /**
33 * Update our cell widths.
34 * This is called whenever we add or remove a cell from our cell collection.
35 *
36 * @since 3.0
37 * @param Backbone.Model cellModel
38 * @return void
39 */
40 updateCellWidths: function( cellModel ) {
41 // Calculate a new width for our cells.
42 var width = Math.round( 100 / this.models.length );
43
44 if ( 100 < width * this.models.length ) {
45 width = Math.floor( 100 / this.models.length );
46 }
47
48 // Set our width for each cell.
49 _.each( this.models, function( cell ) {
50 cell.set( 'width', width );
51 } );
52
53 this.sort();
54 }
55 } );
56 return collection;
57 } );
...\ No newline at end of file ...\ No newline at end of file
1 /**
2 * Holds all of our cell field models.
3 *
4 * @package Ninja Forms Layouts
5 * @subpackage Fields
6 * @copyright (c) 2016 WP Ninjas
7 * @since 3.0
8 */
9 define( [], function( ) {
10 var collection = Backbone.Collection.extend( {
11 comparator: 'cellOrder',
12
13 initialize: function( models, options ) {
14 this.options = options;
15
16 // Listen to requests to remove a field from a collection.
17 this.listenTo( nfRadio.channel( 'layouts-cell' ), 'remove:field', this.removeField );
18 // We've been passed the cellModel to which this collection belongs.
19 // this.options.cellModel = options.cellModel;
20 _.each( models, function( model ) {
21 if ( 'undefined' == typeof model ) return;
22 model.set( 'cellcid', this.options.cellModel.cid, { silent: true } );
23 }, this );
24
25 // When we add or remove a field from this collection, update our cellModel.
26 this.on( 'add', this.addField, this );
27 this.on( 'remove', this.updateCellModel, this );
28 var fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );
29
30 // When we remove a model from our main field collection, make sure it's removed from this collection as well.
31 fieldCollection.on( 'remove', this.removeModel, this );
32
33 // When we add a model to our main field collection, add it to this collection if its cid matches
34 fieldCollection.on( 'add', this.addModel, this );
35
36 },
37
38 /**
39 * Add a field to our cell collection
40 * @since 3.0
41 */
42 addField: function( model ) {
43 model.set( 'cellcid', this.options.cellModel.cid, { silent: true } );
44 if ( 1 == this.options.cellModel.collection.length ) {
45 var order = this.options.cellModel.collection.options.rowModel.get( 'order' );
46 this.remove( model );
47 nfRadio.channel( 'layouts' ).request( 'add:row', this.options.cellModel.collection.options.rowModel.collection, { order: order, field: model } );
48 }
49 this.updateCellModel();
50 },
51
52
53 /**
54 * Update our cellModel.
55 * @since 3.0
56 */
57 updateCellModel: function() {
58 this.options.cellModel.set( 'fields', this );
59 this.options.cellModel.trigger( 'change:fields', this.options.cellModel );
60 },
61
62 /**
63 * Respond to requests to remove a field from a collection.
64 * @since 3.0
65 * @param string id field ID
66 * @return void
67 */
68 removeField: function( id ) {
69 if ( this.get( id ) ) {
70 this.remove( this.get( id ) );
71 }
72 },
73
74 removeModel: function( model ) {
75 this.remove( model );
76 },
77
78 addModel: function( model ) {
79 if ( 'undefined' != typeof this.options.cellModel && this.options.cellModel.cid == model.get( 'cellcid' ) ) {
80 this.add( model );
81 }
82 }
83 } );
84 return collection;
85 } );
...\ No newline at end of file ...\ No newline at end of file
1 /**
2 * Model that holds our cell information
3 *
4 * @package Ninja Forms Layouts
5 * @subpackage Layouts
6 * @copyright (c) 2016 WP Ninjas
7 * @since 3.0
8 */
9 define( ['models/cellFieldCollection'], function( CellFieldCollection) {
10 var model = Backbone.Model.extend( {
11 initialize: function() {
12 var fieldCollection = nfRadio.channel( 'fields' ).request( 'get:collection' );
13 var fieldModels = [];
14
15 _.each( this.get( 'fields' ), function( search ) {
16 if ( 'undefined' == typeof fieldCollection.get( search ) ) {
17 var findField = fieldCollection.findWhere( { key: search } );
18 if ( 'undefined' != typeof findField ) {
19 fieldModels.push( findField );
20 }
21 } else {
22 fieldModels.push( fieldCollection.get( search ) );
23 }
24 } );
25
26 if ( false === this.get( 'fields' ) instanceof Backbone.Collection ) {
27 this.set( 'fields', new CellFieldCollection( fieldModels, { cellModel: this } ) );
28 }
29 this.set( 'order', Number( this.get( 'order' ) ) );
30 }
31
32 } );
33
34 return model;
35 } );
...\ No newline at end of file ...\ No newline at end of file
1 /**
2 * Holds all of our row models.
3 *
4 * @package Ninja Forms Layouts
5 * @subpackage Fields
6 * @copyright (c) 2016 WP Ninjas
7 * @since 3.0
8 */
9 define( ['models/rowModel'], function( rowModel ) {
10 var collection = Backbone.Collection.extend( {
11 model: rowModel,
12 comparator: 'order',
13
14 initialize: function( models ) {
15 this.updateMaxCols( models );
16 this.on( 'add:cell', this.updateMaxCols, this );
17 this.on( 'destroy:cell', this.updateMaxCols, this );
18 this.on( 'remove:cell', this.updateMaxCols, this );
19 this.on( 'destroy', this.updateMaxCols, this );
20
21 this.on( 'add:field', this.addField, this );
22 this.on( 'append:field', this.appendField, this );
23 this.on( 'remove:field', this.removeField, this );
24 },
25
26 updateMaxCols: function( models ) {
27 var maxCols = 1;
28 if ( true === models instanceof Backbone.Model ) {
29 models = this.models
30 }
31 _.each( models, function( row ) {
32 if ( 'undefined' != typeof row.cells ) {
33 if ( maxCols < row.cells.length ) {
34 maxCols = row.cells.length;
35 }
36 } else if ( true === row instanceof Backbone.Model ) {
37 if ( maxCols < row.get( 'cells' ).length ) {
38 maxCols = row.get( 'cells' ).length;
39 }
40 }
41
42 } );
43
44 nfRadio.channel( 'layouts' ).request( 'update:colClass', maxCols );
45 },
46
47 addField: function( fieldModel ) {
48 if ( ! fieldModel.get( 'oldCellcid' ) ) {
49 this.appendField( fieldModel );
50 return false;
51 }
52
53 var cellModel = false;
54 this.every( function( rowModel ) {
55 if ( rowModel.get( 'cells' ).get( { cid: fieldModel.get( 'oldCellcid' ) } ) ) {
56 cellModel = rowModel.get( 'cells' ).get( { cid: fieldModel.get( 'oldCellcid' ) } );
57 return false;
58 }
59 return true;
60 } );
61
62 if ( cellModel ) {
63 cellModel.get( 'fields' ).add( fieldModel );
64 cellModel.collection.sort();
65 } else {
66 this.appendField( fieldModel );
67 }
68
69 fieldModel.set( 'oldCellcid', false );
70 },
71
72 removeField: function( fieldModel ) {
73 if ( ! fieldModel.get( 'oldCellcid' ) ) {
74 fieldModel.set( 'oldCellcid', fieldModel.get( 'cellcid' ) );
75 }
76 nfRadio.channel( 'layouts-cell' ).trigger( 'remove:field', fieldModel.get( 'id' ) );
77 },
78
79 appendField: function( fieldModel ) {
80 nfRadio.channel( 'layouts' ).request( 'add:row', this, { field: fieldModel.get( 'key' ) } );
81 }
82 } );
83 return collection;
84 } );
...\ No newline at end of file ...\ No newline at end of file
1 /**
2 * Model that holds our row information
3 *
4 * @package Ninja Forms Layouts
5 * @subpackage Fields
6 * @copyright (c) 2016 WP Ninjas
7 * @since 3.0
8 */
9 define( ['models/cellCollection'], function( CellCollection ) {
10 var model = Backbone.Model.extend( {
11
12 initialize: function( models, options ) {
13 this.options = options;
14 this.set( 'cells', new CellCollection( this.get( 'cells' ), { rowModel: this } ) );
15 this.on( 'change:cells', this.checkEmptyCells, this );
16 this.set( 'order', Number( this.get( 'order' ) ) );
17 },
18
19 checkEmptyCells: function( model ) {
20 /*
21 * Check to see if all our cells are empty. If they are, self destruct.
22 */
23 var remove = true;
24 _.each( this.get( 'cells' ).models, function( cell ) {
25 if ( 0 != cell.get( 'fields' ).length ) {
26 remove = false;
27 }
28 } );
29
30 if ( remove && 'undefined' != typeof this.collection ) {
31 this.collection.remove( this );
32 return false;
33 }
34
35 return true;
36 }
37 } );
38
39 return model;
40 } );
...\ No newline at end of file ...\ No newline at end of file
1 /**
2 * Individual cell view.
3 *
4 */
5 define( ['views/emptyCell'], function( EmptyCell ) {
6 var view = Marionette.CollectionView.extend( {
7 tagname: 'div',
8 className: 'layouts-cell',
9 emptyView: EmptyCell,
10 dropping: false,
11
12 initialize: function( options ) {
13 // Set our collection to the fields within this cell
14 this.collection = this.model.get( 'fields' );
15 // Get our field view from Ninja Forms core.
16 this.childView = nfRadio.channel( 'views' ).request( 'get:fieldItem' );
17 // Get the collection to which this cell belongs.
18 this.cellCollection = options.cellCollection;
19 },
20
21 /**
22 * When we render we need to:
23 * 1) Set a data attribute on our cell element representing width.
24 * 2) Set a data attribute on our cell element representing the cell model.
25 * 3) Set classes on our cell element based upon how many fields it contains.
26 * 4) Make our cell sortable droppable if we have more than one cell in the collection.
27 * 5) Init our sortable.
28 *
29 * @since version
30 * @return {[type]} [description]
31 */
32 onRender: function() {
33 jQuery( this.el ).data( 'width', this.model.get( 'width' ) );
34 jQuery( this.el ).data( 'model', this.model );
35 // Used during troubleshooting to add a class to the cell element.
36 // jQuery( this.el ).addClass( this.model.cid );
37
38 // if ( 1 < this.cellCollection.length ) {
39 // jQuery( this.el ).addClass( 'layouts-droppable nf-fields-sortable' );
40 // } else { // we want a draggable.
41
42 // }
43
44 // Set a class based upon how many fields are in our cell.
45 if ( this.collection.models.length == 1 ) {
46 jQuery( this.el ).addClass( 'single-field' );
47 jQuery( this.el ).removeClass( 'multi-field' );
48 } else {
49 jQuery( this.el ).addClass( 'multi-field' );
50 jQuery( this.el ).removeClass( 'single-field' );
51 }
52
53 // Make this cell droppable if we have more than one field.
54 if ( 1 < this.cellCollection.length ) {
55 jQuery( this.el ).addClass( 'layouts-droppable' );
56 // If we have multiple cells in this row, make this cell droppable for new fields
57 jQuery( this.el ).addClass( 'nf-field-type-droppable' );
58 } else {
59 jQuery( this.el ).removeClass( 'nf-field-type-droppable' );
60 jQuery( this.el ).removeClass( 'layouts-droppable' );
61 }
62
63 // Init our sortable.
64 this.initSortable();
65 },
66
67 /**
68 * Initialize our sortable.
69 * Sends out radio messages when there are sortable events.
70 *
71 * @since 3.0
72 * @return void
73 */
74 initSortable: function() {
75 var that = this;
76 jQuery( this.el ).sortable( {
77 // Don't let the item controls be used as a handle.
78 cancel: '.nf-item-controls',
79 // Class name of our placeholder. Adds the green highlight.
80 placeholder: 'nf-fields-sortable-placeholder',
81 // Opacity of the draggable
82 opacity: 0.95,
83 // Acceptable items.
84 items: '.nf-field-wrap, .nf-stage',
85 // We care about the pointer, not an intersection.
86 tolerance: 'pointer',
87 // Allows us to drop items from this sortable into others.
88 connectWith: '.layouts-droppable',
89 // Update droppable areas as we drag. Important because of the "swell" effect on the builder.
90 refreshPositions: true,
91 appendTo: '#nf-main',
92
93 /**
94 * Return a helper that will be used for the drag event of the sortable.
95 *
96 * @since 3.0
97 * @param object e event object
98 * @return object drag element
99 */
100 helper: function( e ) {
101 var element = nfRadio.channel( 'layouts' ).request( 'getHelper:cellSortable', e, that, this );
102 return element;
103 },
104
105 /**
106 * When we hover over our sortable while dragging, send out a radio message.
107 *
108 * @since 3.0
109 * @param object e event object
110 * @param object ui jQuery UI object
111 * @return void
112 */
113 over: function( e, ui ) {
114 nfRadio.channel( 'layouts' ).trigger( 'over:cellSortable', e, ui, that, this );
115 },
116
117 /**
118 * When we hover over out of our sortable while dragging, send out a radio message.
119 *
120 * @since 3.0
121 * @param object e event object
122 * @param object ui jQuery UI object
123 * @return void
124 */
125 out: function( e, ui ) {
126 nfRadio.channel( 'layouts' ).trigger( 'out:cellSortable', e, ui, that, this );
127 },
128
129 /**
130 * When we sort our sortable while dragging, send out a radio message.
131 *
132 * @since 3.0
133 * @param object e event object
134 * @param object ui jQuery UI object
135 * @return void
136 */
137 sort: function( e, ui) {
138 nfRadio.channel( 'layouts' ).trigger( 'sort:cellSortable', e, ui, that, this );
139 },
140
141 /**
142 * When we receive an item, send out a radio message.
143 *
144 * @since 3.0
145 * @param object e event object
146 * @param object ui jQuery UI object
147 * @return void
148 */
149 receive: function( e, ui ) {
150 if ( ui.item.dropping ) return;
151 nfRadio.channel( 'layouts' ).trigger( 'receive:cellSortable', e, ui, that, this );
152 },
153
154 /**
155 * When we start dragging, send out a radio message.
156 *
157 * @since 3.0
158 * @param object e event object
159 * @param object ui jQuery UI object
160 * @return void
161 */
162 start: function( e, ui ) {
163
164 nfRadio.channel( 'layouts' ).trigger( 'start:cellSortable', e, ui, that, this );
165 },
166
167 /**
168 * When we stop dragging, send out a radio message.
169 *
170 * @since 3.0
171 * @param object e event object
172 * @param object ui jQuery UI object
173 * @return void
174 */
175 stop: function( e, ui ) {
176 nfRadio.channel( 'layouts' ).trigger( 'stop:cellSortable', e, ui, that, this );
177 },
178
179 /**
180 * When we update our sortable order, send out a radio message.
181 *
182 * @since 3.0
183 * @param object e event object
184 * @param object ui jQuery UI object
185 * @return void
186 */
187 update: function( e, ui ) {
188 nfRadio.channel( 'layouts' ).trigger( 'update:cellSortable', e, ui, that, this );
189 }
190 } );
191 },
192
193 /**
194 * Template helper functions
195 *
196 * @since 3.0
197 * @return void
198 */
199 templateHelpers: function() {
200 return {
201 renderHandleBefore: function() {
202 return '<div class="layouts-handle"></div>';
203 },
204
205 renderHandleAfter: function() {
206 return '<div class="layouts-handle"></div>';
207 }
208 };
209 },
210
211 /**
212 * View events
213 *
214 * @type {Object}
215 */
216 events: {
217 'click .delete': 'clickDeleteCell'
218 },
219
220 /**
221 * When the user clicks to delete a cell, remove the model.
222 *
223 * @since 3.0
224 * @param {Object} e event object
225 * @return void
226 */
227 clickDeleteCell: function( e ) {
228 nfRadio.channel( 'layouts' ).trigger( 'click:deleteCell', e, this );
229 }
230 } );
231
232 return view;
233 } );
...\ No newline at end of file ...\ No newline at end of file
1 /*
2 * View that is rendered if we have no fields within a cell.
3 */
4 define( [], function() {
5 var view = Marionette.ItemView.extend( {
6 tagname: 'div',
7 template: '#nf-tmpl-empty-cell'
8 } );
9
10 return view;
11 } );
...\ No newline at end of file ...\ No newline at end of file
1 /**
2 * Row collection (sortable) view.
3 */
4 define( ['views/rowItem'], function( RowItemView ) {
5 var view = Marionette.CollectionView.extend( {
6 tagname: 'div',
7 className: 'layouts-row-collection layouts-droppable nf-field-type-droppable nf-fields-sortable',
8 childView: RowItemView,
9 reorderOnSort: true,
10
11 getEmptyView: function() {
12 return nfRadio.channel( 'views' ).request( 'get:mainContentEmpty' );
13 },
14
15 initialize: function() {
16 this.collection.on( 'add', this.maybeInitSortable, this );
17 },
18
19 onBeforeDestroy: function() {
20 this.collection.off( 'add', this.maybeInitSortable );
21 },
22
23 /**
24 * Remove any rows that are completely empty.
25 *
26 * @since 3.0
27 * @param {Backbone.Model} rowModel
28 * @param {int} index
29 * @param {Backbone.Collection} rowCollection [description]
30 * @return {bool} Should this row be output in the collection view?
31 */
32 filter: function( rowModel, index, rowCollection ) {
33 var show = false;
34 _.each( rowModel.get( 'cells' ).models, function( cell ) {
35 if ( 0 != cell.get( 'fields' ).length ) {
36 show = true;
37 }
38 } );
39
40 return show;
41 },
42
43 /**
44 * When we render this view, init our rows collection sortable.
45 *
46 * @since 3.0
47 * @return void
48 */
49 onRender: function() {
50 this.maybeInitSortable();
51 },
52
53 maybeInitSortable: function() {
54 if ( 0 < this.collection.models.length ) {
55 this.initSortable();
56 }
57 },
58
59 initSortable: function() {
60 var that = this;
61 // Init our sortable.
62 jQuery( this.el ).sortable( {
63 helper: 'clone',
64 handle: '.gutter:first',
65 items: '.layouts-row',
66 cancel: '.layouts-cell',
67 tolerance: 'pointer',
68 placeholder: 'nf-fields-sortable-placeholder',
69 appendTo: '#nf-main',
70 grid: [ 5, 5 ],
71
72 /**
73 * When we start dragging an item, trigger an event.
74 *
75 * @since 3.0
76 * @param object e event
77 * @param object ui jQuery UI element
78 * @return void
79 */
80 start: function( e, ui ) {
81 nfRadio.channel( 'layouts' ).trigger( 'start:rowsSortable', e, ui, that, this );
82 },
83
84 /**
85 * When we stop dragging an item, trigger an event.
86 *
87 * @since 3.0
88 * @param object e event
89 * @param object ui jQuery UI element
90 * @return void
91 */
92 stop: function( e, ui ) {
93 nfRadio.channel( 'layouts' ).trigger( 'stop:rowsSortable', e, ui, that, this );
94 },
95
96 /**
97 * When we drag an item over our sortable, trigger an event.
98 *
99 * @since 3.0
100 * @param object e event
101 * @param object ui jQuery UI element
102 * @return void
103 */
104 over: function( e, ui ) {
105 nfRadio.channel( 'layouts' ).trigger( 'over:rowsSortable', e, ui, that, this );
106 },
107
108 /**
109 * When we move an item off of our sortable, trigger an event.
110 *
111 * @since 3.0
112 * @param object e event
113 * @param object ui jQuery UI element
114 * @return void
115 */
116 out: function( e, ui ) {
117 nfRadio.channel( 'layouts' ).trigger( 'out:rowsSortable', e, ui, that, this );
118 },
119
120 /**
121 * When we drop an item on the sortable, trigger an event.
122 *
123 * @since 3.0
124 * @param object e event
125 * @param object ui jQuery UI element
126 * @return void
127 */
128 receive: function( e, ui ) {
129 if ( ui.item.dropping ) return;
130 nfRadio.channel( 'layouts' ).trigger( 'receive:rowsSortable', e, ui, that, this );
131 },
132
133 /**
134 * When we drop an item onto our sortable that changes our item order, trigger an event.
135 *
136 * @since 3.0
137 * @param object e event
138 * @param object ui jQuery UI element
139 * @return void
140 */
141 update: function( e, ui ) {
142 nfRadio.channel( 'layouts' ).trigger( 'update:rowsSortable', e, ui, that, this );
143 }
144 } );
145 }
146 } );
147
148 return view;
149 } );
...\ No newline at end of file ...\ No newline at end of file
1 /**
2 * Single row view
3 */
4 define( ['views/cellItem', 'models/cellFieldCollection'], function( CellItemView, CellFieldCollection ) {
5 var view = Marionette.CollectionView.extend( {
6 tagname: 'div',
7 className: 'layouts-row',
8 childView: CellItemView,
9 reorderOnSort: true,
10
11 initialize: function() {
12 // Set our collection to our cells.
13 this.collection = this.model.get( 'cells' );
14 /*
15 * Set our childViewOptions.
16 * As the variable name suggests, this will be accessible within our child views.
17 */
18 this.childViewOptions = {
19 cellCollection: this.collection
20 };
21 // Respond to requests to update our gutter/divider positions
22 nfRadio.channel( 'layouts' ).reply( 'update:gutters', this.updateGutters, this );
23
24 /*
25 * Bind listeners to row model events.
26 */
27 // this.model.on( 'destroy:cell', this.render, this );
28 this.collection.on( 'sort', this.render, this );
29
30 /*
31 * Bind listeners to our nf-builder so that we can track when the user is dragging rather than just mouse over.
32 * Because our gutter/divider is a droppable that is very close to a sortable, sometimes the "drop" event will fire when we are just mousing over.
33 * Tracking that state of the mouse lets us prevent this later.
34 *
35 */
36 jQuery( '#nf-builder' ).on( 'mousedown', function() {
37 jQuery( this ).data( 'mousedown', true );
38 } );
39
40 jQuery( '#nf-builder' ).on( 'mouseup', function() {
41 jQuery( this ).data( 'mousedown', false );
42 } );
43 },
44
45 /**
46 * Before we destroy this view, unbind our model change listeners.
47 * If we don't do this, we'll get JS errors.
48 *
49 * @since 3.0
50 * @return void
51 */
52 onBeforeDestroy: function() {
53 // this.model.off( 'add:cell', this.render );
54 // this.model.off( 'destroy:cell', this.render );
55 this.collection.off( 'sort', this.maybeRender );
56 },
57
58 maybeRender: function() {
59 if ( 1 < this.collection.models.length ) {
60 this.render();
61 }
62 },
63
64 /**
65 * When we render:
66 * 1) Set our el id to the model cid
67 * 2) Add a class based upon the number of cells in the row
68 * 3) Remove any old gutters
69 * 4) Update our gutters/dividers
70 * 5) Init our gutters/dividers as droppables
71 *
72 * @since version
73 * @return {[type]} [description]
74 */
75 onRender: function() {
76 // Set el ID
77 jQuery( this.el ).prop( 'id', this.model.cid );
78 // Add class based upon number of cells
79 if ( this.collection.models.length == 1 ) {
80 jQuery( this.el ).addClass( 'single-cell' );
81 jQuery( this.el ).removeClass( 'multi-cell' );
82 } else {
83 jQuery( this.el ).addClass( 'multi-cell' );
84 jQuery( this.el ).removeClass( 'single-cell' );
85 }
86
87 // Remove any gutters. This prevents extra HTML markup from appearing.
88 jQuery( this.el ).find( '.gutter' ).remove();
89 // Update our gutters/dividers
90 this.updateGutters();
91 // We want to access our rowView object later
92 var rowView = this;
93 // Init our droppables.
94 jQuery( this.el ).find( '.gutter' ).droppable( {
95 // Activate by pointer
96 tolerance: 'pointer',
97 // Class added when we're dragging over
98 hoverClass: 'nf-fields-sortable-placeholder',
99 // Which elements do we want to accept?
100 accept: '.nf-field-type-draggable, .nf-field-wrap, .nf-stage',
101
102 /**
103 * When we drag over this droppable, trigger a radio event.
104 *
105 * @since 3.0
106 * @param object e event
107 * @param object ui jQuery UI element
108 * @return void
109 */
110 over: function( e, ui ) {
111 nfRadio.channel( 'layouts' ).trigger( 'over:gutterDroppable', e, ui, rowView, this );
112 },
113
114 /**
115 * When we drag out of this droppable, trigger a radio event.
116 *
117 * @since 3.0
118 * @param object e event
119 * @param object ui jQuery UI element
120 * @return void
121 */
122 out: function( e, ui ) {
123 nfRadio.channel( 'layouts' ).trigger( 'out:gutterDroppable', e, ui, rowView, this );
124 },
125
126 /**
127 * When we drop on this droppable, trigger a radio event.
128 *
129 * @since 3.0
130 * @param object e event
131 * @param object ui jQuery UI element
132 * @return void
133 */
134 drop: function( e, ui ) {
135 nfRadio.channel( 'layouts' ).trigger( 'drop:gutterDroppable', e, ui, rowView, this );
136 }
137 } );
138 },
139
140 /**
141 * Check for gutters in our row and activate them as sliders.
142 *
143 * @since 3.0
144 * @return void
145 */
146 updateGutters: function() {
147 // Get our gutter elements
148 var elements = jQuery( this.el ).find( '.layouts-cell' );
149 var that = this;
150 // Call split.js to create resizable cells.
151 Split( elements, {
152 minSize: 50,
153 cellCollection: that.collection,
154 // When we start resizing our cell, trigger a radio event.
155 onDragStart: function( data ) {
156 nfRadio.channel( 'layouts' ).trigger( 'dragStart:gutterSlider', data, that.collection );
157 },
158 // When we drag/resize our cell, trigger a radio event.
159 onDrag: function( data ) {
160 nfRadio.channel( 'layouts' ).trigger( 'drag:gutterSlider', data, that.collection );
161 },
162 // When we stop resizing our cell, trigger a radio event.
163 onDragEnd: function( data ) {
164 nfRadio.channel( 'layouts' ).trigger( 'dragEnd:gutterSlider', data, that.collection );
165 }
166 } );
167
168 // Set the css width on our gutters
169 _.each( jQuery( elements ), function( cell, index ) {
170 var width = jQuery( cell ).data( 'width' );
171 var gutterWidth = 10;
172 if ( 0 == index || index == jQuery( elements ).length - 1 ) {
173 // gutterWidth = 5;
174 }
175 jQuery( cell ).css( 'width', 'calc(' + width + '% - ' + gutterWidth + 'px)' );
176 } );
177
178 // Add a gutter/divider before our first cell and after our last cell.
179 var html = '<div class="gutter" style="width: 10px; cursor: ew-resize;"></div>';
180 jQuery( this.el ).find( '.layouts-cell:first' ).before( html );
181 jQuery( this.el ).find( '.layouts-cell:last' ).after( html );
182 }
183
184 } );
185
186 return view;
187 } );
...\ No newline at end of file ...\ No newline at end of file
1 define( [ 'views/rowCollection', 'models/rowCollection'], function( RowCollectionView, RowCollection ) {
2 var controller = Marionette.Object.extend( {
3 initialize: function() {
4 nfRadio.channel( 'formContent' ).request( 'add:viewFilter', this.getFormContentView, 4 );
5 nfRadio.channel( 'formContent' ).request( 'add:loadFilter', this.formContentLoad, 4 );
6
7 /*
8 * In the RC for Ninja Forms, the 'formContent' channel was called 'fieldContents'.
9 * This was changed in version 3.0. These radio messages are here to make sure nothing breaks.
10 *
11 * TODO: Remove this backwards compatibility radio calls.
12 */
13 nfRadio.channel( 'fieldContents' ).request( 'add:viewFilter', this.getFormContentView, 4 );
14 nfRadio.channel( 'fieldContents' ).request( 'add:loadFilter', this.formContentLoad, 4 );
15 },
16
17 getFormContentView: function( collection ) {
18 return RowCollectionView;
19 },
20
21 /**
22 * When we load our builder view, we filter the formContentData.
23 * This turns the saved object into a Backbone Collection.
24 *
25 * If we aren't passed any data, then this form hasn't been modified with layouts yet,
26 * so we default to the nfLayouts.rows global variable that is localised for us.
27 *
28 * @since 3.0
29 * @param array formContentData current value of our formContentData.
30 * @return Backbone.Collection
31 */
32 formContentLoad: function( formContentData, formModel, empty, fields ) {
33 if ( true === formContentData instanceof RowCollection ) return formContentData;
34
35 var formContentLoadFilters = nfRadio.channel( 'formContent' ).request( 'get:loadFilters' );
36
37 /*
38 * TODO: This is a bandaid fix to prevent forms with layouts and parts from freaking out of layouts & styles are deactivated.
39 * If Layouts is deactivated, it will send the field keys.
40 */
41 var mpEnabled = ( 'undefined' != typeof formContentLoadFilters[1] ) ? true : false;
42
43 /*
44 * TODO: Bandaid fix for making sure that Layouts can interpret Multi-Part data if Multi-Part is disabled.
45 */
46 if ( ! mpEnabled && _.isArray( formContentData ) && 0 != _.isArray( formContentData ).length && 'undefined' != typeof _.first( formContentData ) && 'part' == _.first( formContentData ).type ) {
47 /*
48 * Get our layout data from inside MP
49 */
50 formContentData = _.flatten( _.pluck( formContentData, 'formContentData' ) );
51 }
52
53 empty = empty || false;
54 fields = fields || false;
55 var rowArray = [];
56
57 if ( _.isArray( formContentData ) && 0 != formContentData.length && 'undefined' == typeof formContentData[0].cells ) {
58 _.each( formContentData, function( key, index ) {
59 rowArray.push( {
60 order: index,
61 cells: [ {
62 order: 0,
63 fields: [ key ],
64 width: '100'
65 } ]
66 } );
67
68 } );
69 } else if ( _.isEmpty( rowArray ) && 'undefined' != typeof nfLayouts && ! mpEnabled ) {
70 rowArray = nfLayouts.rows;
71 } else {
72 rowArray = formContentData;
73 }
74
75 return new RowCollection( rowArray, { formModel: formModel } );
76 }
77 });
78
79 return controller;
80 } );
...\ No newline at end of file ...\ No newline at end of file
1 define(
2 [
3 'controllers/formContentFilters',
4 ],
5 function
6 (
7 FormContentFilters
8 )
9 {
10 var controller = Marionette.Object.extend( {
11 initialize: function() {
12 new FormContentFilters();
13 }
14
15 });
16
17 return controller;
18 } );
...\ No newline at end of file ...\ No newline at end of file
1 var nfRadio = Backbone.Radio;
2 require( ['controllers/loadControllers'], function( LoadControllers ) {
3
4 var NFLayouts = Marionette.Application.extend( {
5
6 initialize: function( options ) {
7 this.listenTo( nfRadio.channel( 'form' ), 'before:filterData', this.loadControllers );
8 },
9
10 loadControllers: function( app ) {
11 new LoadControllers();
12 }
13 } );
14
15 var nfLayouts = new NFLayouts();
16 nfLayouts.start();
17 } );
...\ No newline at end of file ...\ No newline at end of file
1 /**
2 * Holds all of our cell models.
3 *
4 * @package Ninja Forms Layouts
5 * @subpackage Fields
6 * @copyright (c) 2016 WP Ninjas
7 * @since 3.0
8 */
9 define( ['models/cellModel'], function( cellModel ) {
10 var collection = Backbone.Collection.extend( {
11 model: cellModel,
12 comparator: 'order',
13
14 initialize: function( models, options ) {
15 this.rowModel = options.rowModel;
16 this.formModel = options.formModel;
17 }
18 } );
19 return collection;
20 } );
...\ No newline at end of file ...\ No newline at end of file
1 /**
2 * Holds all of our cell field models.
3 *
4 * @package Ninja Forms Layouts
5 * @subpackage Fields
6 * @copyright (c) 2016 WP Ninjas
7 * @since 3.0
8 */
9 define( [], function( ) {
10 var collection = Backbone.Collection.extend( {
11 comparator: 'order',
12
13 initialize: function( models, options ) {
14 // We've been passed the cellModel to which this collection belongs.
15 this.cellModel = options.cellModel;
16 _.each( models, function( model ) {
17 model.set( 'cellcid', this.cellModel.cid, { silent: true } );
18 }, this );
19
20 this.listenTo( this.cellModel.collection.rowModel.collection, 'validate:fields', this.validateFields );
21 this.listenTo( this.cellModel.collection.rowModel.collection, 'show:fields', this.showFields );
22 this.listenTo( this.cellModel.collection.rowModel.collection, 'hide:fields', this.hideFields );
23
24 var fieldCollection = this.cellModel.collection.formModel.get( 'fields' );
25
26 // When we remove a model from our main field collection, make sure it's removed from this collection as well.
27 fieldCollection.on( 'reset', this.resetCollection, this );
28 },
29
30 validateFields: function() {
31 _.each( this.models, function( fieldModel ) {
32 fieldModel.set( 'clean', false ); // @todo remove after this is released in core.
33 nfRadio.channel( 'submit' ).trigger( 'validate:field', fieldModel );
34 }, this );
35 },
36
37 showFields: function() {
38 this.invoke( 'set', { visible: true } );
39 this.invoke( function() {
40 this.trigger( 'change:value', this );
41 });
42 },
43
44 hideFields: function() {
45 this.invoke( 'set', { visible: false } );
46 this.invoke( function() {
47 this.trigger( 'change:value', this );
48 });
49 },
50
51 /**
52 * When we reset our main field collection, we need to reset any of those fields in this collection.
53 *
54 * @since 3.0.12
55 * @param Backbone.Collection collection
56 * @return void
57 */
58 resetCollection: function( collection ) {
59 var fieldModels = [];
60 _.each( this.models, function( fieldModel ) {
61 if ( 'submit' != fieldModel.get( 'type' ) ) {
62 fieldModels.push( collection.findWhere( { key: fieldModel.get( 'key' ) } ) );
63 } else {
64 fieldModels.push( fieldModel );
65 }
66 } );
67 this.reset( fieldModels );
68 }
69
70 } );
71 return collection;
72 } );
1 /**
2 * Model that holds our cell information
3 *
4 * @package Ninja Forms Layouts
5 * @subpackage Layouts
6 * @copyright (c) 2016 WP Ninjas
7 * @since 3.0
8 */
9 define( ['models/cellFieldCollection'], function( CellFieldCollection) {
10 var model = Backbone.Model.extend( {
11 initialize: function() {
12 var fieldCollection = this.collection.formModel.get( 'fields' );
13 var fieldModels = [];
14 _.each( this.get( 'fields' ), function( search ) {
15 if ( 'undefined' == typeof fieldCollection.get( search ) ) {
16 var findField = fieldCollection.findWhere( { key: search } );
17 if ( 'undefined' != typeof findField ) {
18 fieldModels.push( findField );
19 }
20 } else {
21 fieldModels.push( fieldCollection.get( search ) );
22 }
23
24 } );
25 this.set( 'fields', new CellFieldCollection( fieldModels, { cellModel: this } ) );
26 this.set( 'order', Number( this.get( 'order' ) ) );
27 this.listenTo( this.get( 'fields' ), 'change:errors', this.triggerErrors );
28 },
29
30 triggerErrors: function( fieldModel ) {
31 this.collection.trigger( 'change:errors', fieldModel );
32 }
33
34 } );
35
36 return model;
37 } );
...\ No newline at end of file ...\ No newline at end of file
1 /**
2 * Holds all of our row models.
3 *
4 * @package Ninja Forms Layouts
5 * @subpackage Fields
6 * @copyright (c) 2016 WP Ninjas
7 * @since 3.0
8 */
9 define( ['models/rowModel'], function( rowModel ) {
10 var collection = Backbone.Collection.extend( {
11 model: rowModel,
12 comparator: 'order',
13
14 initialize: function( models, options ) {
15 this.formModel = options.formModel;
16 },
17
18 validateFields: function() {
19 /*
20 * Validate the fields in this row collection.
21 */
22 this.trigger( 'validate:fields', this );
23 },
24
25 showFields: function() {
26 this.trigger( 'show:fields', this );
27 },
28
29 hideFields: function() {
30 this.trigger( 'hide:fields', this );
31 }
32 } );
33 return collection;
34 } );
...\ No newline at end of file ...\ No newline at end of file
1 /**
2 * Model that holds our row information
3 *
4 * @package Ninja Forms Layouts
5 * @subpackage Fields
6 * @copyright (c) 2016 WP Ninjas
7 * @since 3.0
8 */
9 define( ['models/cellCollection'], function( CellCollection ) {
10 var model = Backbone.Model.extend( {
11 initialize: function() {
12 this.set( 'cells', new CellCollection( this.get( 'cells' ), { rowModel: this, formModel: this.collection.formModel } ) );
13 this.set( 'order', Number( this.get( 'order' ) ) );
14 this.listenTo( this.get( 'cells' ), 'change:errors', this.triggerErrors );
15 },
16
17 triggerErrors: function( fieldModel ) {
18 this.collection.trigger( 'change:errors', fieldModel );
19 }
20 } );
21
22 return model;
23 } );
...\ No newline at end of file ...\ No newline at end of file
1 define( [], function() {
2 var view = Marionette.CompositeView.extend( {
3 template: '#nf-tmpl-cell',
4 className: 'nf-cell',
5
6 getChildView: function() {
7 return nfRadio.channel( 'views' ).request( 'get:fieldLayout' );
8 },
9
10 initialize: function() {
11 this.collection = this.model.get( 'fields' );
12 // Get our fieldItem view.
13 jQuery( this.el ).css( 'width', this.model.get( 'width' ) + '%' );
14 },
15
16 onRender: function() {
17 if ( 0 == this.collection.length ) {
18 jQuery( this.el ).html( '&nbsp;' );
19 }
20 },
21
22 attachHtml: function( collectionView, childView ) {
23 jQuery( collectionView.el ).find( 'nf-fields' ).append( childView.el );
24 }
25 } );
26
27 return view;
28 } );
...\ No newline at end of file ...\ No newline at end of file
1 define( ['views/rowComposite'], function( rowComposite ) {
2 var view = Marionette.CollectionView.extend({
3 tagName: 'nf-rows-wrap',
4 childView: rowComposite
5
6 });
7
8 return view;
9 } );
...\ No newline at end of file ...\ No newline at end of file
1 define( ['views/cellComposite'], function( cellComposite ) {
2 var view = Marionette.CompositeView.extend( {
3 template: '#nf-tmpl-row',
4 childView: cellComposite,
5 className: 'nf-row',
6
7 initialize: function() {
8 this.collection = this.model.get( 'cells' );
9
10 },
11
12 onAttach: function() {
13 if ( 1 < this.collection.length ) {
14 jQuery( this.el ).closest( '.nf-form-wrap' ).addClass( 'nf-multi-cell' );
15 }
16 },
17
18 attachHtml: function( collectionView, childView ) {
19 jQuery( collectionView.el ).find( 'nf-cells' ).append( childView.el );
20 }
21 } );
22
23 return view;
24 } );
...\ No newline at end of file ...\ No newline at end of file
1 "use strict";(function(){var a=this,b="addEventListener",c="removeEventListener",d="getBoundingClientRect",e=a.attachEvent&&!a[b],f=a.document,g=function(){for(var a,b=["","-webkit-","-moz-","-o-"],c=0;c<b.length;c++)if(a=f.createElement("div"),a.style.cssText="width:"+b[c]+"calc(9px)",a.style.length)return b[c]+"calc"}(),h=function(a){return"string"==typeof a||a instanceof String?f.querySelector(a):a},i=function(i,j){var k,l,m,n,o,p,q,r,s=[];j="undefined"!=typeof j?j:{},j.gutterSize||(j.gutterSize=10),j.minSize||(j.minSize=100),j.snapOffset||(j.snapOffset=30),j.direction||(j.direction="horizontal"),"horizontal"==j.direction?(k="width",m="clientWidth",n="clientX",o="left",p="gutter gutter-horizontal",q="paddingLeft",r="paddingRight",j.cursor||(j.cursor="ew-resize")):"vertical"==j.direction&&(k="height",m="clientHeight",n="clientY",o="top",p="gutter gutter-vertical",q="paddingTop",r="paddingBottom",j.cursor||(j.cursor="ns-resize"));var t=function(c){var d=this,e=d.a,f=d.b;!d.dragging&&j.onDragStart&&j.onDragStart(this),c.preventDefault(),d.dragging=!0,d.move=v.bind(d),d.stop=u.bind(d),a[b]("mouseup",d.stop),a[b]("touchend",d.stop),a[b]("touchcancel",d.stop),d.parent[b]("mousemove",d.move),d.parent[b]("touchmove",d.move),e[b]("selectstart",C),e[b]("dragstart",C),f[b]("selectstart",C),f[b]("dragstart",C),e.style.userSelect="none",e.style.webkitUserSelect="none",e.style.MozUserSelect="none",e.style.pointerEvents="none",f.style.userSelect="none",f.style.webkitUserSelect="none",f.style.MozUserSelect="none",f.style.pointerEvents="none",d.gutter.style.cursor=j.cursor,d.parent.style.cursor=j.cursor,w.call(d)},u=function(){var b=this,d=b.a,e=b.b;b.dragging&&j.onDragEnd&&j.onDragEnd(this),b.dragging=!1,a[c]("mouseup",b.stop),a[c]("touchend",b.stop),a[c]("touchcancel",b.stop),b.parent[c]("mousemove",b.move),b.parent[c]("touchmove",b.move),delete b.stop,delete b.move,d[c]("selectstart",C),d[c]("dragstart",C),e[c]("selectstart",C),e[c]("dragstart",C),d.style.userSelect="",d.style.webkitUserSelect="",d.style.MozUserSelect="",d.style.pointerEvents="",e.style.userSelect="",e.style.webkitUserSelect="",e.style.MozUserSelect="",e.style.pointerEvents="",b.gutter.style.cursor="",b.parent.style.cursor=""},v=function(a){var b;this.dragging&&(b="touches"in a?a.touches[0][n]-this.start:a[n]-this.start,b<=this.aMin+j.snapOffset?b=this.aMin:b>=this.size-this.bMin-j.snapOffset&&(b=this.size-this.bMin),x.call(this,b),j.onDrag&&j.onDrag(this))},w=function(){var b=a.getComputedStyle(this.parent),c=this.parent[m]-parseFloat(b[q])-parseFloat(b[r]);this.size=this.a[d]()[k]+this.b[d]()[k]+this.aGutterSize+this.bGutterSize,this.percentage=Math.min(this.size/c*100,100),this.start=this.a[d]()[o]},x=function(a){2==j.cellCollection.length&&(this.percentage=100);var b=a/this.size*this.percentage,c=this.percentage-a/this.size*this.percentage,d=y.call(this,[b,c],this.percentage);b=d[0],c=d[1],console.log(b),console.log(c);var e=0;if(_.each(j.cellCollection.models,function(a,d){e+=a==jQuery(this.a).data("model")?b:a==jQuery(this.b).data("model")?c:a.get("width")},this),100>e){var f=100-e;b>c?c+=f:c>b&&(b+=f)}this.a.style[k]=g+"("+b+"% - 10px)",this.b.style[k]=g+"("+c+"% - 10px)",jQuery(this.a).data("width",b),jQuery(this.b).data("width",c)},y=function(a,b){var c=b-_.reduce(a,function(a,b){return a+Math.round(b)},0);return _.chain(a).map(function(b,d){return Math.round(b)+(c>d)-(d>=a.length+c)}).value()},z=function(){var a=this,b=a.a,c=a.b;b[d]()[k]<a.aMin?(b.style[k]=a.aMin-a.aGutterSize+"px",c.style[k]=a.size-a.aMin-a.aGutterSize+"px"):c[d]()[k]<a.bMin&&(b.style[k]=a.size-a.bMin-a.bGutterSize+"px",c.style[k]=a.bMin-a.bGutterSize+"px")},A=function(){var a=this,b=a.a,c=a.b;c[d]()[k]<a.bMin?(b.style[k]=a.size-a.bMin-a.bGutterSize+"px",c.style[k]=a.bMin-a.bGutterSize+"px"):b[d]()[k]<a.aMin&&(b.style[k]=a.aMin-a.aGutterSize+"px",c.style[k]=a.size-a.aMin-a.aGutterSize+"px")},B=function(a){for(var b=0;b<a.length;b++)w.call(a[b]),z.call(a[b]);for(b=a.length-1;b>=0;b--)w.call(a[b]),A.call(a[b])},C=function(){return!1},D=h(i[0]).parentNode;if(!j.sizes){var E=100/i.length;for(j.sizes=[],l=0;l<i.length;l++)j.sizes.push(E)}if(!Array.isArray(j.minSize)){var F=[];for(l=0;l<i.length;l++)F.push(j.minSize);j.minSize=F}for(l=0;l<i.length;l++){var J,L,G=h(i[l]),H=1==l,I=l==i.length-1,K=j.gutterSize;if(l>0&&(L={a:h(i[l-1]),b:G,aMin:j.minSize[l-1],bMin:j.minSize[l],dragging:!1,parent:D,isFirst:H,isLast:I,direction:j.direction},L.aGutterSize=j.gutterSize,L.bGutterSize=j.gutterSize,H&&(L.aGutterSize=j.gutterSize/2),I&&(L.bGutterSize=j.gutterSize/2)),e)J="string"==typeof j.sizes[l]||j.sizes[l]instanceof String?j.sizes[l]:j.sizes[l]+"%";else{if(l>0){var M=f.createElement("div");M.className=p,M.style[k]=j.gutterSize+"px",M[b]("mousedown",t.bind(L)),M[b]("touchstart",t.bind(L)),D.insertBefore(M,G),L.gutter=M}0!==l&&l!=i.length-1||(K=j.gutterSize/2),J="string"==typeof j.sizes[l]||j.sizes[l]instanceof String?j.sizes[l]:g+"("+j.sizes[l]+"% - "+K+"px)"}G.style[k]=J,l>0&&s.push(L)}B(s)};"undefined"!=typeof exports?("undefined"!=typeof module&&module.exports&&(exports=module.exports=i),exports.Split=i):a.Split=i}).call(window);
...\ No newline at end of file ...\ No newline at end of file
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.