EditProfile
5 years ago
Login
3 years ago
MemberDirectory
7 months ago
PasswordReset
5 years ago
Registration
3 years ago
UserProfile
1 year ago
AbstractBuildScratch.php
7 months ago
AbstractMemberDirectoryTheme.php
4 months ago
AbstractTheme.php
11 months ago
FieldListing.php
7 months ago
MemberDirectoryListing.php
2 months ago
MemberDirectoryTrait.php
1 year ago
ProfileFieldListing.php
2 months ago
ThemeInterface.php
5 years ago
ThemesRepository.php
1 year ago
index.php
5 years ago
AbstractBuildScratch.php
858 lines
| 1 | <?php |
| 2 | |
| 3 | namespace ProfilePress\Core\Themes\DragDrop; |
| 4 | |
| 5 | use ProfilePress\Core\Admin\SettingsPages\DragDropBuilder\FieldBase; |
| 6 | use ProfilePress\Core\Classes\FormRepository as FR; |
| 7 | |
| 8 | abstract class AbstractBuildScratch extends AbstractTheme |
| 9 | { |
| 10 | public function __construct($form_id, $form_type) |
| 11 | { |
| 12 | parent::__construct($form_id, $form_type); |
| 13 | |
| 14 | add_filter('ppress_form_builder_field_settings', [$this, 'add_field_properties'], 10, 2); |
| 15 | |
| 16 | add_filter('ppress_form_after_field_listing', [$this, 'add_field_icon'], 10, 2); |
| 17 | } |
| 18 | |
| 19 | public function add_field_icon($output, $raw_field_setting) |
| 20 | { |
| 21 | if (isset($raw_field_setting['password_visibility_icon']) && $raw_field_setting['password_visibility_icon'] === true) { |
| 22 | $raw_field_setting['icon'] = 'visibility'; |
| 23 | } |
| 24 | |
| 25 | if (isset($raw_field_setting['icon']) && ! empty($raw_field_setting['icon'])) { |
| 26 | $output .= sprintf('<i class="pp-form-material-icons">%s</i>', $raw_field_setting['icon']); |
| 27 | } |
| 28 | |
| 29 | return $output; |
| 30 | } |
| 31 | |
| 32 | /** |
| 33 | * @param $field |
| 34 | * @param FieldBase $fieldBaseInstance |
| 35 | * |
| 36 | * @return mixed |
| 37 | */ |
| 38 | public function add_field_properties($field, $fieldBaseInstance) |
| 39 | { |
| 40 | $field_type = $fieldBaseInstance->field_type(); |
| 41 | |
| 42 | if ( ! in_array($fieldBaseInstance->field_type(), $this->disallowed_settings_fields())) { |
| 43 | |
| 44 | if (isset($field[FieldBase::GENERAL_TAB])) { |
| 45 | |
| 46 | $column_fields = []; |
| 47 | |
| 48 | if ( ! isset($field[FieldBase::GENERAL_TAB]['label'])) { |
| 49 | $column_fields['label'] = [ |
| 50 | 'label' => esc_html__('Label', 'wp-user-avatar'), |
| 51 | 'field' => FieldBase::INPUT_FIELD, |
| 52 | ]; |
| 53 | } else { |
| 54 | $column_fields['label'] = $field[FieldBase::GENERAL_TAB]['label']; |
| 55 | unset($field[FieldBase::GENERAL_TAB]['label']); |
| 56 | } |
| 57 | |
| 58 | if (isset($field[FieldBase::GENERAL_TAB]['placeholder'])) { |
| 59 | $column_fields['placeholder'] = $field[FieldBase::GENERAL_TAB]['placeholder']; |
| 60 | unset($field[FieldBase::GENERAL_TAB]['placeholder']); |
| 61 | } |
| 62 | |
| 63 | $field[FieldBase::GENERAL_TAB] = array_merge( |
| 64 | [FieldBase::COLUMN_SETTINGS => $column_fields], |
| 65 | $field[FieldBase::GENERAL_TAB] |
| 66 | ); |
| 67 | |
| 68 | $field[FieldBase::GENERAL_TAB]['description'] = [ |
| 69 | 'label' => esc_html__('Description', 'wp-user-avatar'), |
| 70 | 'field' => FieldBase::TEXTAREA_FIELD, |
| 71 | ]; |
| 72 | } |
| 73 | |
| 74 | if (isset($field[FieldBase::STYLE_TAB])) { |
| 75 | |
| 76 | $class_settings = $field[FieldBase::STYLE_TAB]['class']; |
| 77 | |
| 78 | unset($field[FieldBase::STYLE_TAB]['class']); |
| 79 | |
| 80 | $field[FieldBase::STYLE_TAB][FieldBase::COLUMN_SETTINGS] = []; |
| 81 | |
| 82 | $field[FieldBase::STYLE_TAB][FieldBase::COLUMN_SETTINGS]['field_width'] = [ |
| 83 | 'label' => esc_html__('Width', 'wp-user-avatar'), |
| 84 | 'options' => [ |
| 85 | 'full' => esc_html__('Full', 'wp-user-avatar'), |
| 86 | 'half' => esc_html__('Half', 'wp-user-avatar'), |
| 87 | 'third' => esc_html__('One Third', 'wp-user-avatar'), |
| 88 | ], |
| 89 | 'field' => FieldBase::SELECT_FIELD, |
| 90 | ]; |
| 91 | |
| 92 | // the str_replace sorcery/ritual checks if field type does not contains any of the strings https://stackoverflow.com/a/42311760/2648410 |
| 93 | if (str_replace(['-select-role', '-select-dropdown', '-checkbox-list', '-radio-buttons', '-single-checkbox', '-country', '-cpf-agreeable', '-cpf-checkbox', '-cpf-radio', '-cpf-select'], '', $field_type) == $field_type) { |
| 94 | $field[FieldBase::STYLE_TAB][FieldBase::COLUMN_SETTINGS]['icon'] = [ |
| 95 | 'label' => esc_html__('Icon', 'wp-user-avatar'), |
| 96 | 'field' => FieldBase::ICON_PICKER_FIELD, |
| 97 | ]; |
| 98 | } |
| 99 | |
| 100 | // if not password meter and password related field |
| 101 | if (str_replace(['-password-meter'], '', $field_type) == $field_type && str_replace(['-password'], '', $field_type) != $field_type) { |
| 102 | |
| 103 | $field[FieldBase::STYLE_TAB]['password_visibility_icon'] = [ |
| 104 | 'label' => esc_html__('Enable Password Visibility Icon', 'wp-user-avatar'), |
| 105 | 'description' => esc_html__('Check to enable visibility icon which when clicked, hides or shows a password.', 'wp-user-avatar'), |
| 106 | 'type' => 'checkbox', |
| 107 | 'field' => FieldBase::INPUT_FIELD, |
| 108 | ]; |
| 109 | } |
| 110 | |
| 111 | if (str_replace(['-checkbox', '-radio', '-country', '-select'], '', $field_type) == $field_type) { |
| 112 | $field[FieldBase::STYLE_TAB][FieldBase::COLUMN_2_SETTINGS]['label_display'] = [ |
| 113 | 'label' => esc_html__('Label Display', 'wp-user-avatar'), |
| 114 | 'options' => [ |
| 115 | 'above' => esc_html__('Above', 'wp-user-avatar'), |
| 116 | 'inside' => esc_html__('Inside', 'wp-user-avatar') |
| 117 | ], |
| 118 | 'field' => FieldBase::SELECT_FIELD, |
| 119 | ]; |
| 120 | } |
| 121 | |
| 122 | $field[FieldBase::STYLE_TAB][FieldBase::COLUMN_2_SETTINGS]['description_appearance'] = [ |
| 123 | 'label' => esc_html__('Description Appearance', 'wp-user-avatar'), |
| 124 | 'options' => [ |
| 125 | 'standard' => esc_html__('Standard', 'wp-user-avatar'), |
| 126 | 'reveal' => esc_html__('Reveal on Focus', 'wp-user-avatar'), |
| 127 | 'tooltip' => esc_html__('Tooltip', 'wp-user-avatar'), |
| 128 | ], |
| 129 | 'field' => FieldBase::SELECT_FIELD, |
| 130 | ]; |
| 131 | |
| 132 | $field[FieldBase::STYLE_TAB]['class'] = $class_settings; |
| 133 | } |
| 134 | } |
| 135 | |
| 136 | return $field; |
| 137 | } |
| 138 | |
| 139 | public function social_login_buttons() |
| 140 | { |
| 141 | $html = ''; |
| 142 | |
| 143 | if ( ! $this->is_show_social_login()) return $html; |
| 144 | |
| 145 | $active_social_logins = array_filter($this->get_meta('buildscratch_form_social_buttons')); |
| 146 | |
| 147 | foreach ($active_social_logins as $active_social_login) { |
| 148 | $html .= "[pp-social-button type=$active_social_login]"; |
| 149 | } |
| 150 | |
| 151 | return $html; |
| 152 | } |
| 153 | |
| 154 | public function default_metabox_settings() |
| 155 | { |
| 156 | $default_headline = esc_html__('Create an Account', 'wp-user-avatar'); |
| 157 | |
| 158 | switch ($this->form_type) { |
| 159 | case FR::LOGIN_TYPE: |
| 160 | $default_headline = esc_html__('Sign in to Your Account', 'wp-user-avatar'); |
| 161 | break; |
| 162 | case FR::PASSWORD_RESET_TYPE: |
| 163 | $default_headline = esc_html__('Reset Your Password', 'wp-user-avatar'); |
| 164 | break; |
| 165 | case FR::EDIT_PROFILE_TYPE: |
| 166 | $default_headline = esc_html__('Edit Your Profile', 'wp-user-avatar'); |
| 167 | break; |
| 168 | } |
| 169 | |
| 170 | $data = parent::default_metabox_settings(); |
| 171 | $data['buildscratch_form_width'] = '400px'; |
| 172 | $data['buildscratch_form_font_family'] = 'Merriweather'; |
| 173 | $data['buildscratch_remove_form_frame'] = 'false'; |
| 174 | $data['buildscratch_hide_required_asterisk'] = 'false'; |
| 175 | $data['buildscratch_form_bg_color'] = '#ffffff'; |
| 176 | $data['buildscratch_form_social_buttons'] = ['facebook', 'twitter', 'google']; |
| 177 | $data['buildscratch_form_headline'] = $default_headline; |
| 178 | $data['buildscratch_forgot_password_label'] = esc_html__('Lost your password?', 'wp-user-avatar'); |
| 179 | $data['buildscratch_signup_label'] = esc_html__('Register', 'wp-user-avatar'); |
| 180 | $data['buildscratch_login_label'] = esc_html__('Login', 'wp-user-avatar'); |
| 181 | if ($this->form_type == FR::REGISTRATION_TYPE) { |
| 182 | $data['buildscratch_login_label'] = esc_html__("Have an account? Login", 'wp-user-avatar'); |
| 183 | } |
| 184 | |
| 185 | if ($this->form_type == FR::PASSWORD_RESET_TYPE) { |
| 186 | $data['buildscratch_login_label'] = esc_html__("Return to Login", 'wp-user-avatar'); |
| 187 | } |
| 188 | |
| 189 | $data['buildscratch_field_layout'] = 'round'; |
| 190 | $data['buildscratch_label_field_size'] = 'small'; |
| 191 | $data['buildscratch_label_field_icon_alignment'] = 'right'; |
| 192 | $data['buildscratch_field_icon_color'] = '#666666'; |
| 193 | $data['buildscratch_field_border_color'] = '#dbdbdb'; |
| 194 | $data['buildscratch_field_border_focus_color'] = '#999999'; |
| 195 | $data['buildscratch_field_bg_color'] = '#ffffff'; |
| 196 | $data['buildscratch_field_bg_focus_color'] = '#ffffff'; |
| 197 | |
| 198 | $data['buildscratch_label_color'] = '#444444'; |
| 199 | $data['buildscratch_label_font_size'] = '14'; |
| 200 | $data['buildscratch_label_font_weight'] = 'bold'; |
| 201 | $data['buildscratch_description_color'] = '#666666'; |
| 202 | $data['buildscratch_description_alignment'] = 'left'; |
| 203 | $data['buildscratch_field_value_font_size'] = '14'; |
| 204 | $data['buildscratch_field_value_color'] = '#69717a'; |
| 205 | $data['buildscratch_field_placeholder_color'] = '#999999'; |
| 206 | |
| 207 | $data['buildscratch_submit_button_layout'] = 'round'; |
| 208 | $data['buildscratch_submit_button_width'] = 'auto'; |
| 209 | $data['buildscratch_submit_button_font_size'] = '16'; |
| 210 | $data['buildscratch_submit_button_font_weight'] = 'bold'; |
| 211 | $data['buildscratch_submit_button_bg_color'] = '#000000'; |
| 212 | $data['buildscratch_submit_button_text_color'] = '#ffffff'; |
| 213 | $data['buildscratch_submit_button_bg_focus_color'] = '#dbdbdb'; |
| 214 | $data['buildscratch_submit_button_text_focus_color'] = '#000000'; |
| 215 | |
| 216 | return $data; |
| 217 | } |
| 218 | |
| 219 | public function appearance_settings($settings) |
| 220 | { |
| 221 | $settings[] = [ |
| 222 | 'id' => 'buildscratch_form_width', |
| 223 | 'type' => 'text', |
| 224 | 'label' => esc_html__('Width', 'wp-user-avatar'), |
| 225 | 'priority' => 10 |
| 226 | ]; |
| 227 | |
| 228 | $settings[] = [ |
| 229 | 'id' => 'buildscratch_form_bg_color', |
| 230 | 'type' => 'color', |
| 231 | 'label' => esc_html__('Background', 'wp-user-avatar'), |
| 232 | 'priority' => 20 |
| 233 | ]; |
| 234 | |
| 235 | $settings[] = [ |
| 236 | 'id' => 'buildscratch_form_font_family', |
| 237 | 'type' => 'font_family', |
| 238 | 'label' => esc_html__('Font Family', 'wp-user-avatar'), |
| 239 | 'priority' => 30 |
| 240 | ]; |
| 241 | |
| 242 | $settings[] = [ |
| 243 | 'id' => 'buildscratch_form_headline', |
| 244 | 'type' => 'text', |
| 245 | 'label' => esc_html__('Headline', 'wp-user-avatar'), |
| 246 | 'priority' => 35 |
| 247 | ]; |
| 248 | |
| 249 | if (in_array($this->form_type, [FR::LOGIN_TYPE])) { |
| 250 | $settings[] = [ |
| 251 | 'id' => 'buildscratch_forgot_password_label', |
| 252 | 'type' => 'text', |
| 253 | 'label' => esc_html__('Forgot Password Label', 'wp-user-avatar'), |
| 254 | 'priority' => 37 |
| 255 | ]; |
| 256 | } |
| 257 | |
| 258 | |
| 259 | if (in_array($this->form_type, [FR::LOGIN_TYPE])) { |
| 260 | $settings[] = [ |
| 261 | 'id' => 'buildscratch_signup_label', |
| 262 | 'type' => 'text', |
| 263 | 'label' => esc_html__('Sign Up Label', 'wp-user-avatar'), |
| 264 | 'priority' => 39 |
| 265 | ]; |
| 266 | } |
| 267 | |
| 268 | |
| 269 | if (in_array($this->form_type, [FR::REGISTRATION_TYPE, FR::PASSWORD_RESET_TYPE])) { |
| 270 | $settings[] = [ |
| 271 | 'id' => 'buildscratch_login_label', |
| 272 | 'type' => 'text', |
| 273 | 'label' => esc_html__('Login Label', 'wp-user-avatar'), |
| 274 | 'priority' => 39 |
| 275 | ]; |
| 276 | } |
| 277 | |
| 278 | if ($this->is_show_social_login()) { |
| 279 | |
| 280 | $settings[] = [ |
| 281 | 'id' => 'buildscratch_form_social_buttons', |
| 282 | 'type' => 'select2', |
| 283 | 'options' => ppress_social_login_networks(), |
| 284 | 'label' => esc_html__('Social Login Buttons', 'wp-user-avatar'), |
| 285 | 'priority' => 40 |
| 286 | ]; |
| 287 | } |
| 288 | |
| 289 | $settings[] = [ |
| 290 | 'id' => 'buildscratch_remove_form_frame', |
| 291 | 'type' => 'checkbox', |
| 292 | 'label' => esc_html__('Remove Form Frame', 'wp-user-avatar'), |
| 293 | 'checkbox_label' => esc_html__('Check to remove'), |
| 294 | 'priority' => 50 |
| 295 | ]; |
| 296 | |
| 297 | $settings[] = [ |
| 298 | 'id' => 'buildscratch_hide_required_asterisk', |
| 299 | 'type' => 'checkbox', |
| 300 | 'label' => sprintf(esc_html__('Hide Required %s'), '<span style="color:red">*</span>'), |
| 301 | 'checkbox_label' => esc_html__('Check to hide', 'wp-user-avatar'), |
| 302 | 'priority' => 60 |
| 303 | ]; |
| 304 | |
| 305 | return $settings; |
| 306 | } |
| 307 | |
| 308 | public function metabox_settings($settings, $form_type, $DragDropBuilderInstance) |
| 309 | { |
| 310 | $submit_button_settings = $settings['submit_button']; |
| 311 | unset($settings['submit_button']); |
| 312 | |
| 313 | $settings['buildscratch_field_styling'] = [ |
| 314 | 'tab_title' => esc_html__('Field & Styling', 'wp-user-avatar'), |
| 315 | [ |
| 316 | 'id' => 'buildscratch_field_layout', |
| 317 | 'type' => 'tab_radio', |
| 318 | 'options' => [ |
| 319 | 'round' => esc_html__('Round', 'wp-user-avatar'), |
| 320 | 'square' => esc_html__('Square', 'wp-user-avatar'), |
| 321 | 'pill' => esc_html__('Pill', 'wp-user-avatar'), |
| 322 | 'material' => esc_html__('Material', 'wp-user-avatar'), |
| 323 | 'flat' => esc_html__('Flat', 'wp-user-avatar'), |
| 324 | ], |
| 325 | 'tab_description' => $this->field_layout_description(), |
| 326 | 'label' => esc_html__('Layout', 'wp-user-avatar'), |
| 327 | 'priority' => 20 |
| 328 | ], |
| 329 | [ |
| 330 | 'id' => 'buildscratch_label_field_size', |
| 331 | 'type' => 'select', |
| 332 | 'options' => [ |
| 333 | 'small' => esc_html__('Small', 'wp-user-avatar'), |
| 334 | 'medium' => esc_html__('Medium', 'wp-user-avatar'), |
| 335 | 'large' => esc_html__('Large', 'wp-user-avatar'), |
| 336 | ], |
| 337 | 'label' => esc_html__('Field Size', 'wp-user-avatar'), |
| 338 | 'description' => esc_html__('Select the size (in height) of input and textarea form fields.', 'wp-user-avatar') |
| 339 | ], |
| 340 | [ |
| 341 | 'id' => 'buildscratch_field_icon_color', |
| 342 | 'type' => 'color', |
| 343 | 'label' => esc_html__('Icon', 'wp-user-avatar') |
| 344 | ], |
| 345 | [ |
| 346 | 'id' => 'buildscratch_label_field_icon_alignment', |
| 347 | 'type' => 'tab_radio', |
| 348 | 'options' => [ |
| 349 | 'left' => esc_html__('Left', 'wp-user-avatar'), |
| 350 | 'right' => esc_html__('Right', 'wp-user-avatar'), |
| 351 | ], |
| 352 | 'label' => esc_html__('Icon Alignment', 'wp-user-avatar') |
| 353 | ], |
| 354 | [ |
| 355 | 'id' => 'buildscratch_field_border_color', |
| 356 | 'type' => 'color', |
| 357 | 'label' => esc_html__('Border', 'wp-user-avatar') |
| 358 | ], |
| 359 | [ |
| 360 | 'id' => 'buildscratch_field_border_focus_color', |
| 361 | 'type' => 'color', |
| 362 | 'label' => esc_html__('Border on Focus', 'wp-user-avatar') |
| 363 | ], |
| 364 | [ |
| 365 | 'id' => 'buildscratch_field_bg_color', |
| 366 | 'type' => 'color', |
| 367 | 'label' => esc_html__('Background', 'wp-user-avatar') |
| 368 | ], |
| 369 | [ |
| 370 | 'id' => 'buildscratch_field_bg_focus_color', |
| 371 | 'type' => 'color', |
| 372 | 'label' => esc_html__('Background on Focus', 'wp-user-avatar') |
| 373 | ] |
| 374 | ]; |
| 375 | |
| 376 | $settings['buildscratch_labels_text'] = [ |
| 377 | // calling label title here in case in future when there is membership and the heading will have the same styling as label |
| 378 | // and any additional text will have same styling as description. |
| 379 | 'tab_title' => esc_html__('Labels & Text', 'wp-user-avatar'), |
| 380 | [ |
| 381 | 'id' => 'buildscratch_label_color', |
| 382 | 'type' => 'color', |
| 383 | 'label' => esc_html__('Title', 'wp-user-avatar') |
| 384 | ], |
| 385 | [ |
| 386 | 'id' => 'buildscratch_label_font_size', |
| 387 | 'type' => 'number', |
| 388 | 'label' => esc_html__('Title Font Size (px)', 'wp-user-avatar') |
| 389 | ], |
| 390 | [ |
| 391 | 'id' => 'buildscratch_label_font_weight', |
| 392 | 'type' => 'select', |
| 393 | 'options' => [ |
| 394 | 'normal' => esc_html__('Normal', 'wp-user-avatar'), |
| 395 | 'bold' => esc_html__('Bold', 'wp-user-avatar'), |
| 396 | ], |
| 397 | 'label' => esc_html__('Title Font Weight', 'wp-user-avatar') |
| 398 | ], |
| 399 | [ |
| 400 | 'id' => 'buildscratch_description_color', |
| 401 | 'type' => 'color', |
| 402 | 'label' => esc_html__('Description', 'wp-user-avatar') |
| 403 | ], |
| 404 | [ |
| 405 | 'id' => 'buildscratch_description_alignment', |
| 406 | 'type' => 'select', |
| 407 | 'options' => [ |
| 408 | 'left' => esc_html__('Left', 'wp-user-avatar'), |
| 409 | 'center' => esc_html__('Center', 'wp-user-avatar'), |
| 410 | 'right' => esc_html__('Right', 'wp-user-avatar'), |
| 411 | ], |
| 412 | 'label' => esc_html__('Description Alignment', 'wp-user-avatar') |
| 413 | ], |
| 414 | [ |
| 415 | 'id' => 'buildscratch_field_value_font_size', |
| 416 | 'type' => 'number', |
| 417 | 'label' => esc_html__('Value / Text Font Size', 'wp-user-avatar'), |
| 418 | 'description' => esc_html__('Font size in pixel (px) of field values and text on form.') |
| 419 | ], |
| 420 | [ |
| 421 | 'id' => 'buildscratch_field_value_color', |
| 422 | 'type' => 'color', |
| 423 | 'label' => esc_html__('Value / Text', 'wp-user-avatar'), |
| 424 | 'description' => esc_html__('Color of the value of a field and text on the form.') |
| 425 | ], |
| 426 | [ |
| 427 | 'id' => 'buildscratch_field_placeholder_color', |
| 428 | 'type' => 'color', |
| 429 | 'label' => esc_html__('Placeholder', 'wp-user-avatar') |
| 430 | ], |
| 431 | ]; |
| 432 | |
| 433 | $settings['submit_button'] = $submit_button_settings; |
| 434 | |
| 435 | return $settings; |
| 436 | } |
| 437 | |
| 438 | public function field_layout_description() |
| 439 | { |
| 440 | $placeholder = esc_html__('Name', 'wp-user-avatar'); |
| 441 | ob_start(); |
| 442 | ?> |
| 443 | <div class="ppmb-tab"><input type="text" placeholder="<?= $placeholder ?>" class="ppfl ppfl-round" readonly> |
| 444 | </div> |
| 445 | <div class="ppmb-tab"><input type="text" placeholder="<?= $placeholder ?>" class="ppfl ppfl-square" readonly> |
| 446 | </div> |
| 447 | <div class="ppmb-tab"><input type="text" placeholder="<?= $placeholder ?>" class="ppfl ppfl-pill" readonly> |
| 448 | </div> |
| 449 | <div class="ppmb-tab"><input type="text" placeholder="<?= $placeholder ?>" class="ppfl ppfl-material" readonly> |
| 450 | </div> |
| 451 | <div class="ppmb-tab"><input type="text" placeholder="<?= $placeholder ?>" class="ppfl ppfl-flat" readonly> |
| 452 | </div> |
| 453 | <?php |
| 454 | return ob_get_clean(); |
| 455 | } |
| 456 | |
| 457 | public function submit_button_layout_description() |
| 458 | { |
| 459 | $label = esc_html__('Submit', 'wp-user-avatar'); |
| 460 | ob_start(); |
| 461 | ?> |
| 462 | <div class="ppmb-tab"><input type="button" value="<?= $label ?>" class="ppfl ppfl-round" disabled=""></div> |
| 463 | <div class="ppmb-tab"><input type="button" value="<?= $label ?>" class="ppfl ppfl-square" disabled></div> |
| 464 | <div class="ppmb-tab"><input type="button" value="<?= $label ?>" class="ppfl ppfl-pill" disabled></div> |
| 465 | <div class="ppmb-tab"><input type="button" value="<?= $label ?>" class="ppfl ppfl-flat" disabled></div> |
| 466 | <?php |
| 467 | return ob_get_clean(); |
| 468 | } |
| 469 | |
| 470 | public function submit_button_settings($settings) |
| 471 | { |
| 472 | $settings[] = [ |
| 473 | 'id' => 'buildscratch_submit_button_layout', |
| 474 | 'type' => 'tab_radio', |
| 475 | 'options' => [ |
| 476 | 'round' => esc_html__('Round', 'wp-user-avatar'), |
| 477 | 'square' => esc_html__('Square', 'wp-user-avatar'), |
| 478 | 'pill' => esc_html__('Pill', 'wp-user-avatar') |
| 479 | ], |
| 480 | 'tab_description' => $this->submit_button_layout_description(), |
| 481 | 'label' => esc_html__('Layout', 'wp-user-avatar') |
| 482 | ]; |
| 483 | |
| 484 | $settings[] = [ |
| 485 | 'id' => 'buildscratch_submit_button_width', |
| 486 | 'type' => 'select', |
| 487 | 'options' => [ |
| 488 | 'auto' => esc_html__('Auto (Default)', 'wp-user-avatar'), |
| 489 | 'wide' => esc_html__('Wide', 'wp-user-avatar'), |
| 490 | 'full-width' => esc_html__('Full Stretched Width', 'wp-user-avatar') |
| 491 | ], |
| 492 | 'label' => esc_html__('Width', 'wp-user-avatar'), |
| 493 | ]; |
| 494 | |
| 495 | $settings[] = [ |
| 496 | 'id' => 'buildscratch_submit_button_font_size', |
| 497 | 'type' => 'number', |
| 498 | 'label' => esc_html__('Font Size (px)', 'wp-user-avatar') |
| 499 | ]; |
| 500 | |
| 501 | $settings[] = [ |
| 502 | 'id' => 'buildscratch_submit_button_font_weight', |
| 503 | 'type' => 'select', |
| 504 | 'options' => [ |
| 505 | 'normal' => esc_html__('Normal', 'wp-user-avatar'), |
| 506 | 'bold' => esc_html__('Bold', 'wp-user-avatar'), |
| 507 | ], |
| 508 | 'label' => esc_html__('Font Weight', 'wp-user-avatar') |
| 509 | ]; |
| 510 | |
| 511 | $settings[] = [ |
| 512 | 'id' => 'buildscratch_submit_button_bg_color', |
| 513 | 'type' => 'color', |
| 514 | 'label' => esc_html__('Background', 'wp-user-avatar') |
| 515 | ]; |
| 516 | |
| 517 | $settings[] = [ |
| 518 | 'id' => 'buildscratch_submit_button_bg_focus_color', |
| 519 | 'type' => 'color', |
| 520 | 'label' => esc_html__('Background on Focus', 'wp-user-avatar') |
| 521 | ]; |
| 522 | |
| 523 | $settings[] = [ |
| 524 | 'id' => 'buildscratch_submit_button_text_color', |
| 525 | 'type' => 'color', |
| 526 | 'label' => esc_html__('Text', 'wp-user-avatar') |
| 527 | ]; |
| 528 | |
| 529 | $settings[] = [ |
| 530 | 'id' => 'buildscratch_submit_button_text_focus_color', |
| 531 | 'type' => 'color', |
| 532 | 'label' => esc_html__('Text Focused', 'wp-user-avatar') |
| 533 | ]; |
| 534 | |
| 535 | return $settings; |
| 536 | } |
| 537 | |
| 538 | public function form_structure() |
| 539 | { |
| 540 | $headline = ''; |
| 541 | $saved_headline = $this->get_meta('buildscratch_form_headline'); |
| 542 | if ( ! empty($saved_headline)) { |
| 543 | $headline = '<div class="ppbs-headline">' . wp_kses_post($saved_headline) . '</div>'; |
| 544 | } |
| 545 | |
| 546 | $social_login_buttons = $this->social_login_buttons(); |
| 547 | |
| 548 | $fields = (new FieldListing($this->form_id, $this->form_type, true)) |
| 549 | ->defaults($this->default_fields_settings()) |
| 550 | ->shortcode_field_wrap_start('<div class="pp-form-field-input-textarea-wrap">') |
| 551 | ->shortcode_field_wrap_end('</div>') |
| 552 | ->forge(); |
| 553 | |
| 554 | $button = $this->form_submit_button(); |
| 555 | |
| 556 | $fl = 'ppfl-' . esc_attr($this->get_meta('buildscratch_field_layout')); |
| 557 | $rf = $this->get_meta('buildscratch_remove_form_frame') == 'true' ? ' ppf-remove-frame' : ''; |
| 558 | $hra = $this->get_meta('buildscratch_hide_required_asterisk') == 'true' ? ' ppf-hide-asterisk' : ''; |
| 559 | |
| 560 | $fs = ' ppfs-' . esc_attr($this->get_meta('buildscratch_label_field_size')); |
| 561 | $fia = ' ppfia-' . esc_attr($this->get_meta('buildscratch_label_field_icon_alignment')); |
| 562 | |
| 563 | $sbl = ' ppsbl-' . esc_attr($this->get_meta('buildscratch_submit_button_layout')); |
| 564 | $sbw = ' ppsbw-' . esc_attr($this->get_meta('buildscratch_submit_button_width')); |
| 565 | |
| 566 | $form_link = $this->form_links(); |
| 567 | |
| 568 | return <<<HTML |
| 569 | [pp-form-wrapper class="ppBuildScratch {$fl}{$sbl}{$sbw}{$rf}{$hra}{$fs}{$fia}"] |
| 570 | $headline |
| 571 | $social_login_buttons |
| 572 | $fields |
| 573 | <div class="pp-form-submit-button-wrap"> |
| 574 | $button |
| 575 | </div> |
| 576 | [/pp-form-wrapper] |
| 577 | $form_link |
| 578 | HTML; |
| 579 | } |
| 580 | |
| 581 | public function form_links() |
| 582 | { |
| 583 | $forgot_password_link = ppress_password_reset_url(); |
| 584 | $signup_link = apply_filters('ppress_build_scratch_theme_registration_url', ppress_registration_url(), $this->form_id, $this->form_type); |
| 585 | $login_link = apply_filters('ppress_build_scratch_theme_login_url', ppress_login_url(), $this->form_id, $this->form_type); |
| 586 | $forgot_password_label = wp_kses_post($this->get_meta('buildscratch_forgot_password_label')); |
| 587 | $signup_label = wp_kses_post($this->get_meta('buildscratch_signup_label')); |
| 588 | $login_label = wp_kses_post($this->get_meta('buildscratch_login_label')); |
| 589 | |
| 590 | $login_form_link = $password_reset_form_link = $signup_form_link = ''; |
| 591 | |
| 592 | if ( ! empty($forgot_password_label) || ! empty($signup_label)) { |
| 593 | |
| 594 | $login_form_pipe = ! empty($forgot_password_label) && ! empty($signup_label) ? ' | ' : ''; |
| 595 | |
| 596 | $login_form_link = <<<HTML |
| 597 | <div class="ppress-form-bottom-links"> |
| 598 | <a href="$signup_link">$signup_label</a>$login_form_pipe<a href="$forgot_password_link">$forgot_password_label</a> |
| 599 | </div> |
| 600 | HTML; |
| 601 | } |
| 602 | |
| 603 | if ( ! empty($login_label)) { |
| 604 | $signup_form_link = <<<HTML |
| 605 | <div class="ppress-form-bottom-links"> |
| 606 | <a href="$login_link">$login_label</a> |
| 607 | </div> |
| 608 | HTML; |
| 609 | } |
| 610 | |
| 611 | if ( ! empty($login_label)) { |
| 612 | $password_reset_form_link = <<<HTML |
| 613 | <div class="ppress-form-bottom-links"> |
| 614 | <a href="$login_link">$login_label</a> |
| 615 | </div> |
| 616 | HTML; |
| 617 | } |
| 618 | |
| 619 | if ($this->form_type == FR::LOGIN_TYPE) return $login_form_link; |
| 620 | if ($this->form_type == FR::REGISTRATION_TYPE) return $signup_form_link; |
| 621 | if ($this->form_type == FR::PASSWORD_RESET_TYPE) return $password_reset_form_link; |
| 622 | |
| 623 | return ''; |
| 624 | |
| 625 | } |
| 626 | |
| 627 | public function form_css() |
| 628 | { |
| 629 | $form_id = $this->form_id; |
| 630 | $form_type = $this->form_type; |
| 631 | |
| 632 | $width = esc_html($this->get_meta('buildscratch_form_width')); |
| 633 | $form_bg_color = esc_html($this->get_meta('buildscratch_form_bg_color')); |
| 634 | $form_font_family = esc_html($this->get_meta('buildscratch_form_font_family')); |
| 635 | $form_font_family_plus_to_space = str_replace('+', ' ', $form_font_family); |
| 636 | $value_font_size = esc_html($this->get_meta('buildscratch_field_value_font_size')); |
| 637 | $field_icon_color = esc_html($this->get_meta('buildscratch_field_icon_color')); |
| 638 | $field_border_color = esc_html($this->get_meta('buildscratch_field_border_color')); |
| 639 | $field_border_focus_color = esc_html($this->get_meta('buildscratch_field_border_focus_color')); |
| 640 | $field_bg_color = esc_html($this->get_meta('buildscratch_field_bg_color')); |
| 641 | $field_bg_focus_color = esc_html($this->get_meta('buildscratch_field_bg_focus_color')); |
| 642 | $field_value_color = esc_html($this->get_meta('buildscratch_field_value_color')); |
| 643 | $field_placeholder_color = esc_html($this->get_meta('buildscratch_field_placeholder_color')); |
| 644 | $field_label_color = esc_html($this->get_meta('buildscratch_label_color')); |
| 645 | $field_label_font_size = esc_html($this->get_meta('buildscratch_label_font_size')); |
| 646 | $field_label_font_weight = esc_html($this->get_meta('buildscratch_label_font_weight')); |
| 647 | |
| 648 | $description_color = esc_html($this->get_meta('buildscratch_description_color')); |
| 649 | $description_alignment = esc_html($this->get_meta('buildscratch_description_alignment')); |
| 650 | |
| 651 | $submit_button_font_size = esc_html($this->get_meta('buildscratch_submit_button_font_size')); |
| 652 | $submit_button_font_weight = esc_html($this->get_meta('buildscratch_submit_button_font_weight')); |
| 653 | $submit_button_bg_color = esc_html($this->get_meta('buildscratch_submit_button_bg_color')); |
| 654 | $submit_button_bg_focus_color = esc_html($this->get_meta('buildscratch_submit_button_bg_focus_color')); |
| 655 | $submit_button_text_color = esc_html($this->get_meta('buildscratch_submit_button_text_color')); |
| 656 | $submit_button_text_focus_color = esc_html($this->get_meta('buildscratch_submit_button_text_focus_color')); |
| 657 | |
| 658 | $status_class = '.profilepress-reg-status'; |
| 659 | switch ($this->form_type) { |
| 660 | case FR::LOGIN_TYPE : |
| 661 | $status_class = '.profilepress-login-status'; |
| 662 | break; |
| 663 | case FR::PASSWORD_RESET_TYPE : |
| 664 | $status_class = '.profilepress-reset-status'; |
| 665 | break; |
| 666 | case FR::EDIT_PROFILE_TYPE : |
| 667 | $status_class = '.profilepress-edit-profile-status'; |
| 668 | break; |
| 669 | } |
| 670 | |
| 671 | $google_font = apply_filters('ppress_disable_google_fonts', false) || in_array($form_font_family, ['Arial', 'Lucida'], true) ? '' : |
| 672 | "@import url('https://fonts.googleapis.com/css?family={$form_font_family}:300,400,600,700&display=swap');"; |
| 673 | |
| 674 | return <<<CSS |
| 675 | $google_font |
| 676 | |
| 677 | #pp-$form_type-$form_id-wrap $status_class { |
| 678 | border-radius: 5px; |
| 679 | font-size: 16px; |
| 680 | line-height: 1.471; |
| 681 | padding: 10px; |
| 682 | background-color: #e74c3c; |
| 683 | color: #ffffff; |
| 684 | font-weight: normal; |
| 685 | text-align: center; |
| 686 | vertical-align: middle; |
| 687 | margin: 10px 0; |
| 688 | -webkit-box-sizing: border-box; |
| 689 | -moz-box-sizing: border-box; |
| 690 | box-sizing: border-box; |
| 691 | max-width: 100%; |
| 692 | } |
| 693 | |
| 694 | #pp-$form_type-$form_id-wrap $status_class.success { |
| 695 | background-color: #2ecc71; |
| 696 | color: #ffffff; |
| 697 | } |
| 698 | |
| 699 | #pp-$form_type-$form_id-wrap $status_class a { |
| 700 | color: #fff; |
| 701 | text-decoration: underline; |
| 702 | } |
| 703 | |
| 704 | /* settings CSS */ |
| 705 | #pp-$form_type-$form_id-wrap.pp-form-container { |
| 706 | max-width: $width !important; |
| 707 | width: 100%; |
| 708 | margin: 0 auto; |
| 709 | } |
| 710 | |
| 711 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch { |
| 712 | background: $form_bg_color; |
| 713 | color: $field_value_color; |
| 714 | font-size: {$value_font_size}px; |
| 715 | } |
| 716 | |
| 717 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap .pp-form-field-input-textarea-wrap { |
| 718 | position: relative; |
| 719 | } |
| 720 | |
| 721 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch, |
| 722 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch * { |
| 723 | font-family: '$form_font_family_plus_to_space',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif; |
| 724 | } |
| 725 | |
| 726 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap input, |
| 727 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap select, |
| 728 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap textarea { |
| 729 | font-size: {$value_font_size}px; |
| 730 | border-color: $field_border_color; |
| 731 | background: $field_bg_color; |
| 732 | color :$field_value_color; |
| 733 | } |
| 734 | |
| 735 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap .pp-form-material-icons { |
| 736 | color: $field_icon_color; |
| 737 | } |
| 738 | |
| 739 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-checkbox-wrap label, |
| 740 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-radio-wrap label { |
| 741 | font-size: {$value_font_size}px; |
| 742 | color :$field_value_color; |
| 743 | vertical-align: middle; |
| 744 | } |
| 745 | |
| 746 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap input[type=text]:focus, |
| 747 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap input[type=password]:focus, |
| 748 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap select:focus, |
| 749 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap textarea:focus { |
| 750 | outline: 0; |
| 751 | background: $field_bg_focus_color; |
| 752 | border-color: $field_border_focus_color; |
| 753 | box-shadow: 0 0 0 1px $field_border_focus_color; |
| 754 | } |
| 755 | |
| 756 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap ::placeholder{ |
| 757 | color: $field_placeholder_color; |
| 758 | } |
| 759 | |
| 760 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap ::-webkit-input-placeholder{ |
| 761 | color: $field_placeholder_color; |
| 762 | } |
| 763 | |
| 764 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap ::-moz-placeholder{ |
| 765 | color: $field_placeholder_color; |
| 766 | } |
| 767 | |
| 768 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap :-moz-placeholder{ |
| 769 | color: $field_placeholder_color; |
| 770 | } |
| 771 | |
| 772 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap :-ms-input-placeholder{ |
| 773 | color: $field_placeholder_color; |
| 774 | } |
| 775 | |
| 776 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .ppbs-headline, |
| 777 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch h1, |
| 778 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch h2, |
| 779 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch h3, |
| 780 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch { |
| 781 | color: $field_label_color; |
| 782 | } |
| 783 | |
| 784 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-wrap .pp-form-label-wrap .pp-form-label { |
| 785 | color: $field_label_color; |
| 786 | font-size: {$field_label_font_size}px; |
| 787 | font-weight: $field_label_font_weight; |
| 788 | } |
| 789 | |
| 790 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-field-description { |
| 791 | color: $description_color; |
| 792 | text-align: $description_alignment; |
| 793 | } |
| 794 | |
| 795 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-submit-button-wrap input[type="submit"] { |
| 796 | font-size: {$submit_button_font_size}px; |
| 797 | font-weight: $submit_button_font_weight; |
| 798 | background: $submit_button_bg_color; |
| 799 | color: $submit_button_text_color; |
| 800 | top: auto; |
| 801 | } |
| 802 | |
| 803 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-submit-button-wrap input[type="submit"]:hover, |
| 804 | .pp-form-container #pp-$form_type-$form_id.ppBuildScratch .pp-form-submit-button-wrap input[type="submit"]:focus { |
| 805 | background: $submit_button_bg_focus_color; |
| 806 | color: $submit_button_text_focus_color; |
| 807 | } |
| 808 | |
| 809 | .pp-form-container div#pp-$form_type-$form_id.ppBuildScratch a.pp-button-social-login { |
| 810 | margin-right: 6.387%; |
| 811 | } |
| 812 | |
| 813 | .pp-form-container div#pp-$form_type-$form_id.ppBuildScratch a.pp-button-social-login { |
| 814 | display: block; |
| 815 | height: 3em; |
| 816 | line-height: 3em; |
| 817 | text-decoration: none; |
| 818 | margin-bottom: 10px; |
| 819 | } |
| 820 | |
| 821 | .pp-form-container div#pp-$form_type-$form_id.ppBuildScratch a.pp-button-social-login .ppsc { |
| 822 | width: 3em; |
| 823 | height: 3em; |
| 824 | } |
| 825 | |
| 826 | .pp-form-container div#pp-$form_type-$form_id.ppBuildScratch a.pp-button-social-login span.ppsc-text { |
| 827 | margin-left: 50px; |
| 828 | } |
| 829 | |
| 830 | .pp-form-container div#pp-registration-12.ppBuildScratch a.pp-button-social-login:last-of-type { |
| 831 | margin-bottom: 20px; |
| 832 | } |
| 833 | |
| 834 | .pp-form-container .ppress-form-bottom-links { |
| 835 | padding-top: 15px; |
| 836 | padding-bottom: 15px; |
| 837 | text-align: center; |
| 838 | } |
| 839 | |
| 840 | .pp-form-container .ppress-form-bottom-links a { |
| 841 | line-height: 22px; |
| 842 | font-size: 14px; |
| 843 | color: $field_value_color !important; |
| 844 | display: inline-block; |
| 845 | text-decoration: none!important; |
| 846 | font-weight: 400; |
| 847 | text-align: center; |
| 848 | border-bottom: none!important; |
| 849 | } |
| 850 | |
| 851 | .pp-form-container .ppress-form-bottom-links a:hover { |
| 852 | text-decoration: underline!important; |
| 853 | } |
| 854 | CSS; |
| 855 | |
| 856 | } |
| 857 | } |
| 858 |