<?php
/**
 * The form builder.
 *
 * PHP provides only the skeleton and the data. All the dragging and drawing is
 * done by `assets/js/builder.js`, without jQuery and without a single outside
 * library.
 *
 * Copyright (c) 2026 Quantum, Serbia. https://2ranq.com
 *
 * This program is free software: you can redistribute it and change it under
 * the terms of the GNU General Public License as published by the Free Software
 * Foundation, either version 2 of the License, or any later version. The full
 * text is in LICENSE.txt, next to this file.
 *
 * @package Ranq_Forms
 */

defined( 'ABSPATH' ) || exit;

/**
 * Ranq_Forms_Builder
 */
class Ranq_Forms_Builder {

	/**
	 * The name of the save action.
	 */
	const SAVE_ACTION = 'ranq_forms_save_form';

	/**
	 * Hooks up.
	 *
	 * @return void
	 */
	/**
	 * The name of the action that returns a fresh section preview.
	 */
	const SHELL_ACTION = 'ranq_forms_shell';

	public static function hooks() {

		add_action( 'wp_ajax_' . self::SAVE_ACTION, array( __CLASS__, 'save' ) );
		add_action( 'wp_ajax_' . self::SHELL_ACTION, array( __CLASS__, 'shell' ) );
	}

	/**
	 * The data the builder receives.
	 *
	 * @param int $form_id The form id.
	 *
	 * @return array
	 */
	public static function script_data( $form_id ) {

		// The per form settings description is turned into the same shape the Design
		// tab already uses: a list rather than a map, with the key inside the item
		// itself. That way the builder has one way of drawing instead of two.
		$form_settings = array();

		foreach ( Ranq_Forms_Form_Settings::schema() as $group_key => $group ) {

			$list = array();

			foreach ( $group['settings'] as $key => $setting ) {
				$setting['key'] = $key;
				$list[]         = $setting;
			}

			$form_settings[] = array(
				'key'      => $group_key,
				'label'    => $group['label'],
				'help'     => isset( $group['help'] ) ? $group['help'] : '',
				'settings' => $list,
			);
		}

		// The ready made forms go into the first tab, so the builder has to know
		// them. They are sent with their fields, because picking a template changes
		// the fields at once, with no new request to the server.
		$templates = array();

		foreach ( Ranq_Forms_Templates::all() as $key => $template ) {
			$templates[] = array(
				'key'         => $key,
				'name'        => $template['name'],
				'description' => $template['description'],
				'group'       => isset( $template['group'] ) ? $template['group'] : 'start',
				'steps'       => Ranq_Forms_Templates::steps( $template ),
				'count'       => count( $template['fields'] ),
				'fields'      => array_values( $template['fields'] ),
			);
		}

		$available = array();

		foreach ( Ranq_Forms_Fields::all() as $type => $field ) {
			$available[] = array(
				'type'     => $type,
				'label'    => $field->get_label(),
				'icon'     => $field->get_icon(),
				'group'    => $field->get_group(),
				'settings' => $field->get_settings(),
			);
		}

		// The smart phone field is drawn by the builder too, so it needs the same
		// country list that goes to the site. It is sent compressed, only the dialling
		// code and the name, because the preview needs ONE country: the one in the
		// picker. The list is already loaded, since the line above walked every field.
		$phone_countries = array();
		$phone_default   = '';

		if ( class_exists( 'Ranq_Forms_Phone_Countries' ) ) {

			foreach ( Ranq_Forms_Phone_Countries::all() as $code => $country ) {
				$phone_countries[ $code ] = array(
					'dial' => $country['dial'],
					'name' => $country['name'],
				);
			}

			$phone_default = Ranq_Forms_Phone_Countries::DEFAULT_COUNTRY;
		}

		return array(
			'templates'      => $templates,
			'templateGroups' => Ranq_Forms_Templates::groups(),
			'settings'       => Ranq_Forms_Form_Settings::get( $form_id ),
			'settingsSchema' => $form_settings,
			'settingsInherit' => Ranq_Forms_Form_Settings::inherited( $form_id ),
			'widget'         => Ranq_Forms_Widget::get( $form_id ),
			'widgetId'       => Ranq_Forms_Widget::existing_id( $form_id ),
			'widgetLayouts'  => Ranq_Forms_Widget::layouts(),
			'widgetGroups'   => array_merge(
				array( 'none' => __( 'Start here', '2ranq-forms' ) ),
				Ranq_Forms_Business::purposes()
			),
			'widgetShells'   => Ranq_Forms_Widget::shells( $form_id ),
			'shellAction'    => self::SHELL_ACTION,
			'shellNonce'     => wp_create_nonce( self::SHELL_ACTION . '_' . absint( $form_id ) ),
			'design'       => Ranq_Forms_Design::get( $form_id ),
			'styles'       => Ranq_Forms_Styles::all(),
			'styleGroups'  => Ranq_Forms_Styles::groups(),
			'operators'    => Ranq_Forms_Conditions::operators(),
			'designSchema' => Ranq_Forms_Design::schema(),
			'formId'    => absint( $form_id ),
			'formTitle' => get_the_title( $form_id ),
			'fields'    => array_values( Ranq_Forms_Fields::get_form_fields( $form_id ) ),
			'available' => $available,
			'phoneCountries' => $phone_countries,
			'phoneDefault'   => $phone_default,
			'ajaxUrl'   => admin_url( 'admin-ajax.php' ),
			'action'    => self::SAVE_ACTION,
			'nonce'     => wp_create_nonce( self::SAVE_ACTION . '_' . absint( $form_id ) ),
			'listUrl'   => admin_url( 'admin.php?page=' . Ranq_Forms_Admin::PAGE ),
			'i18n'      => array(
				'addField'      => __( 'Add a field', '2ranq-forms' ),
				'emptyCanvas'   => __( 'Drag a field here, or click one on the left.', '2ranq-forms' ),
				'basic'         => __( 'Basic', '2ranq-forms' ),
				'advanced'      => __( 'Advanced', '2ranq-forms' ),
				'noSelection'   => __( 'Select a field to change its settings.', '2ranq-forms' ),
				'duplicate'     => __( 'Duplicate', '2ranq-forms' ),
				'remove'        => __( 'Remove', '2ranq-forms' ),
				'moveUp'        => __( 'Move up', '2ranq-forms' ),
				'moveDown'      => __( 'Move down', '2ranq-forms' ),
				'confirmRemove' => __( 'Remove this field? This cannot be undone.', '2ranq-forms' ),
				'saved'         => __( 'Saved.', '2ranq-forms' ),
				'saving'        => __( 'Saving...', '2ranq-forms' ),
				'saveFailed'    => __( 'Could not save. Please try again.', '2ranq-forms' ),
				'unsaved'       => __( 'You have unsaved changes.', '2ranq-forms' ),
				'copyCode'      => __( 'Copy shortcode', '2ranq-forms' ),
				'copied'        => __( 'Copied', '2ranq-forms' ),
				'addOption'     => __( 'Add option', '2ranq-forms' ),
				'tabFields'     => __( 'Fields', '2ranq-forms' ),
				'group_standard' => __( 'Basic', '2ranq-forms' ),
				'group_fancy'    => __( 'Advanced', '2ranq-forms' ),
				'group_layout'   => __( 'Layout', '2ranq-forms' ),

				// The Fields tab. A list of 23 types does not read as 23 rows: the six
				// types a form is really assembled from sit at the top, and a rare type
				// is reached by searching, not by remembering which group it is in.
				'group_common'   => __( 'Most used', '2ranq-forms' ),
				/* translators: %d: number of field types. */
				'paletteSearch'  => __( 'Search %d field types', '2ranq-forms' ),
				'paletteHint'    => __( 'Drag a type onto the form, or press Enter to add it at the end.', '2ranq-forms' ),
				/* translators: 1: number of matching types, 2: number of all types. */
				'paletteMatch'   => __( '%1$d of %2$d types match. Groups with no match are hidden.', '2ranq-forms' ),
				'paletteNone'    => __( 'No field type matches that word.', '2ranq-forms' ),
				'yourForm'       => __( 'Your form', '2ranq-forms' ),
				/* translators: 1: place of the field, 2: number of fields in the form. */
				'fieldOf'        => __( 'field %1$d of %2$d', '2ranq-forms' ),
				/* translators: %s: name of the field type being dragged. */
				'dropHere'       => __( '%s goes here', '2ranq-forms' ),
				'pickField'      => __( 'Pick a field to edit it', '2ranq-forms' ),
				'pickFieldHelp'  => __( 'Click any field in the form, or drag a type from the left.', '2ranq-forms' ),
				'fieldsInForm'   => __( 'Fields in this form', '2ranq-forms' ),
				'removeField'    => __( 'Remove field', '2ranq-forms' ),
				'fieldSettings'  => __( 'Field settings', '2ranq-forms' ),
				'logic'          => __( 'Conditional logic', '2ranq-forms' ),
				'logicNone'      => __( 'Always show this field', '2ranq-forms' ),
				'logicShow'      => __( 'Show this field when', '2ranq-forms' ),
				'logicHide'      => __( 'Hide this field when', '2ranq-forms' ),
				'logicAll'       => __( 'all rules match', '2ranq-forms' ),
				'logicAny'       => __( 'any rule matches', '2ranq-forms' ),
				'logicAddRule'   => __( 'Add rule', '2ranq-forms' ),
				'logicField'     => __( 'Field', '2ranq-forms' ),
				'logicNoFields'  => __( 'Add another field first, so there is something to check.', '2ranq-forms' ),
				'tabDesign'     => __( 'Design', '2ranq-forms' ),
				'tabSettings'   => __( 'Settings', '2ranq-forms' ),
				'tabWidget'     => __( 'Full Widgets', '2ranq-forms' ),
				'tabTemplates'  => __( 'Templates', '2ranq-forms' ),
				'tplIntro'      => __( 'A whole form, ready to use. Pick one and change anything afterwards. Forms marked with steps split into pages, so a long form never looks long.', '2ranq-forms' ),
				'tplUse'        => __( 'Use this form', '2ranq-forms' ),
				'tplCurrent'    => __( 'In use', '2ranq-forms' ),
				'tplSteps'      => __( 'steps', '2ranq-forms' ),
				'tplFields'     => __( 'fields', '2ranq-forms' ),
				'tplReplace'    => __( 'This replaces every field in the form. Carry on?', '2ranq-forms' ),

				// The Ready made forms tab. The screen is a list of JOBS, not a wall of
				// tiles: every name is visible at once, the drawing only for the open job.
				'tplTitle'      => __( 'Start from a ready form', '2ranq-forms' ),
				/* translators: 1: number of groups, 2: number of forms, 3: number of forms with steps. */
				'tplStats'      => __( '%1$d kinds of job, %2$d forms, %3$d of them split into steps.', '2ranq-forms' ),
				/* translators: %d: number of ready forms. */
				'tplSearch'     => __( 'Search %d forms by name or by what they do', '2ranq-forms' ),
				/* translators: %d: number of ready forms. */
				'tplAll'        => __( 'All %d', '2ranq-forms' ),
				/* translators: %d: number of forms split into steps. */
				'tplWithSteps'  => __( 'With steps %d', '2ranq-forms' ),
				/* translators: %d: number of forms that ask for a file. */
				'tplWithFile'   => __( 'With file upload %d', '2ranq-forms' ),
				/* translators: 1: number of matching forms, 2: number of all forms. */
				'tplFound'      => __( '%1$d of %2$d forms', '2ranq-forms' ),
				'tplNoMatch'    => __( 'No ready form matches that word.', '2ranq-forms' ),
				'tplFeatured'   => __( 'Most sites start here', '2ranq-forms' ),
				'tplBlankUse'   => __( 'Start blank', '2ranq-forms' ),
				'tplNothing'    => __( 'Nothing yet', '2ranq-forms' ),
				/* translators: %d: number of forms in this group. */
				'tplGroupCount' => __( '%d forms', '2ranq-forms' ),
				/* translators: %d: number of forms in this group, all of them split into steps. */
				'tplGroupSteps' => __( '%d forms, all in steps', '2ranq-forms' ),
				/* translators: 1: form name, 2: number of fields it has now. */
				'tplWarn'       => __( '%1$s already has %2$d fields.', '2ranq-forms' ),
				'tplWarnMore'   => __( 'A ready form replaces every one of them, and that cannot be undone. Each form asks you here before it does it. Nothing changes until you answer.', '2ranq-forms' ),
				'tplAskTitle'   => __( 'This wipes the form you have', '2ranq-forms' ),
				/* translators: 1: number of fields now, 2: form name, 3: number of fields of the ready form, 4: name of the ready form. */
				'tplAskText'    => __( 'The %1$d fields in %2$s are deleted and the %3$d of %4$s take their place. Settings, design and entries stay.', '2ranq-forms' ),
				/* translators: 1: number of fields now, 2: form name. */
				'tplAskBlank'   => __( 'The %1$d fields in %2$s are deleted and nothing takes their place. Settings, design and entries stay.', '2ranq-forms' ),
				'tplAskYes'     => __( 'Replace my fields', '2ranq-forms' ),
				'tplAskNo'      => __( 'Keep mine', '2ranq-forms' ),
				/* translators: 1: number of fields lost. */
				'tplLose'       => __( '− %d fields', '2ranq-forms' ),
				/* translators: 1: number of fields gained. */
				'tplGain'       => __( '+ %d fields', '2ranq-forms' ),

				// The group subheading says the JOB those forms do, because a person
				// first knows what they need, and only then what it is called.
				'tplNotes'      => array(
					'contact'      => __( 'Someone wants to ask you something', '2ranq-forms' ),
					'booking'      => __( 'Someone wants a time slot', '2ranq-forms' ),
					'quote'        => __( 'Someone wants a price', '2ranq-forms' ),
					'application'  => __( 'Someone is applying', '2ranq-forms' ),
					'verification' => __( 'Someone proves who they are, with files', '2ranq-forms' ),
					'support'      => __( 'Something is not working', '2ranq-forms' ),
					'signup'       => __( 'Someone leaves an email address', '2ranq-forms' ),
					'feedback'     => __( 'Someone tells you what they think', '2ranq-forms' ),
				),
				'deviceDesktop' => __( 'Desktop', '2ranq-forms' ),
				'deviceTablet'  => __( 'Tablet', '2ranq-forms' ),
				'devicePhone'   => __( 'Phone', '2ranq-forms' ),
				'deviceHelp'    => __( 'Check the section on every screen. The layout really changes, it is not a picture.', '2ranq-forms' ),
				'widgetIntro'   => __( 'A ready made look AROUND this form: heading, text, phone, address and a photo. It does not touch the form itself, so the same look works around any form you have.', '2ranq-forms' ),
				'widgetPreview' => __( 'This is the whole widget, with your real form inside. Everything you change shows here at once.', '2ranq-forms' ),
				'widgetChoose'  => __( 'Pick a look', '2ranq-forms' ),
				'widgetEdit'    => __( 'Change what is around the form', '2ranq-forms' ),
				'widgetHeading' => __( 'Heading', '2ranq-forms' ),
				'widgetLead'    => __( 'Text under the heading', '2ranq-forms' ),
				'widgetImage'   => __( 'Photo', '2ranq-forms' ),
				'widgetBg'      => __( 'Background', '2ranq-forms' ),
				'widgetText'    => __( 'Text colour', '2ranq-forms' ),
				'widgetRows'    => __( 'Which details to show', '2ranq-forms' ),
				'widgetDetailsEdit' => __( 'Details', '2ranq-forms' ),
				'widgetPhone'   => __( 'Phone', '2ranq-forms' ),
				'widgetEmail'   => __( 'Email', '2ranq-forms' ),
				'widgetStreet'  => __( 'Street address', '2ranq-forms' ),
				'widgetCity'    => __( 'City, state and ZIP', '2ranq-forms' ),
				'widgetHours'   => __( 'Opening hours', '2ranq-forms' ),
				'widgetFromGlobal' => __( 'Leave empty and the value from Settings, tab Your details, is used.', '2ranq-forms' ),
				'clickToEdit'   => __( 'Click anything in the preview to edit it.', '2ranq-forms' ),
				'widgetColors'  => __( 'Colours', '2ranq-forms' ),
				'widgetAgain'   => __( 'Pick a different look', '2ranq-forms' ),
				/* translators: %s: name of another setting, for example Telegram username. */
				'widgetNeeds'   => __( 'This shows on the section once %s is filled in.', '2ranq-forms' ),
				/* translators: %s: name of the form style, for example Night Lime. */
				'styleMatch'    => __( 'The form uses %s, the style that came with this section. Open the Design tab if you want to take it over and change it.', '2ranq-forms' ),
				/* translators: %s: name of the form style, for example Night Lime. */
				'styleMine'     => __( 'This section came with %s, but the look of the form is yours now. Change it in the Design tab.', '2ranq-forms' ),

				// The Design tab when the form design is held by a section. The two
				// exclude each other, so nothing changes quietly, it asks, with two ways out.
				'hoAsk'         => __( 'This form uses the look that came with your Full Widget. Do you want to take it over and change it here?', '2ranq-forms' ),
				'hoNote'        => __( 'Take it over and every style and setting on this tab is yours to change. The section keeps its heading, text, colours and photo either way.', '2ranq-forms' ),
				'hoStyle'       => __( 'The look that came with the section', '2ranq-forms' ),
				'hoTake'        => __( 'Take it over and edit here', '2ranq-forms' ),
				'hoBack'        => __( 'Back to Full Widgets', '2ranq-forms' ),
				'wgYourForm'    => __( 'Your form, the one a section goes around', '2ranq-forms' ),
				'rowPhone'      => __( 'Phone', '2ranq-forms' ),
				'rowMail'       => __( 'Email', '2ranq-forms' ),
				'rowPin'        => __( 'Address', '2ranq-forms' ),
				'rowClock'      => __( 'Opening hours', '2ranq-forms' ),
				'widgetDetails' => __( 'The phone, email and address come from Settings, tab Your details, so you write them once for the whole site.', '2ranq-forms' ),
				'widgetCode'    => __( 'Put the whole widget on a page with this:', '2ranq-forms' ),
				'widgetCodeNew' => __( 'Save once and the widget gets its own number, separate from the form.', '2ranq-forms' ),
				'formCode'      => __( 'Just the form, without anything around it:', '2ranq-forms' ),
				'settingsHelp'  => __( 'These apply to this form only. Leave a field empty and the site wide setting is used.', '2ranq-forms' ),

				// The Form settings tab. The screen is READ, not filled in, so
				// every setting has a value even when that value comes from
				// somewhere else. An empty field does not exist.
				'fsetLegend'    => __( 'A grey value is already working. It comes from your plugin settings or from WordPress itself, and it is what your visitors get today. Type over one and it belongs to this form alone.', '2ranq-forms' ),
				'fsetLegendTag' => __( 'grey value', '2ranq-forms' ),
				'fsetFromSite'  => __( 'Plugin settings', '2ranq-forms' ),
				'fsetFromWp'    => __( 'WordPress', '2ranq-forms' ),
				'fsetFromBuilt' => __( 'Built in', '2ranq-forms' ),
				'fsetMine'      => __( 'Yours', '2ranq-forms' ),
				'fsetRevert'    => __( 'Use the inherited one', '2ranq-forms' ),
				/* translators: 1: number of settings this form sets itself, 2: number of settings that come from elsewhere. */
				'fsetCount'     => __( '%1$d yours, %2$d come from elsewhere', '2ranq-forms' ),
				/* translators: 1: email address entries are sent to, 2: what the visitor sees after sending, 3: who may send the form. */
				'fsetNow'       => __( 'Right now: every entry emails %1$s, the visitor gets %2$s, and %3$s can send it.', '2ranq-forms' ),
				'fsetNowNoMail' => __( 'no email at all', '2ranq-forms' ),
				'fsetNowMsg'    => __( 'a thank you message in place of the form', '2ranq-forms' ),
				'fsetNowGo'     => __( 'sent to another page', '2ranq-forms' ),
				'fsetNowAll'    => __( 'anybody', '2ranq-forms' ),
				'fsetNowIn'     => __( 'only logged in visitors', '2ranq-forms' ),
				'fsetOn'        => __( 'On', '2ranq-forms' ),
				'fsetOff'       => __( 'Off', '2ranq-forms' ),
				'fsetNotifyOn'  => __( 'Sending on every entry', '2ranq-forms' ),
				'fsetNotifyOff' => __( 'Nothing is sent', '2ranq-forms' ),
				'fsetAccessAll' => __( 'Open to everyone, no limits', '2ranq-forms' ),
				/* translators: %d: number of rules that are set. */
				'fsetAccessSet' => __( '%d rules set', '2ranq-forms' ),
				'fsetNoPass'    => __( 'No password', '2ranq-forms' ),
				'fsetNow2'      => __( 'Right away', '2ranq-forms' ),
				'fsetNever'     => __( 'Never', '2ranq-forms' ),
				'fsetNoLimit'   => __( 'No limit', '2ranq-forms' ),
				'fsetDead'      => __( 'Appears when the switch above is on', '2ranq-forms' ),
				/* translators: %s: name of this form. */
				'fsetFoot'      => __( 'These settings belong to %s alone. Every other form keeps its own.', '2ranq-forms' ),
				'fsetFootLink'  => __( 'Open plugin settings', '2ranq-forms' ),
				'fsetConnOff'   => __( 'All three are off. Turn one on and it opens the two fields it needs, here.', '2ranq-forms' ),

				// The Design tab. This screen is our only real difference from
				// WPForms, so it has to show off what it actually has.
				'dsStart'       => __( 'Start with these', '2ranq-forms' ),

				// The same three settings also sit in their own group, where the
				// group heading explains them. At the top there is no such
				// heading, so "Background" would mean nothing. Hence the full name.
				'dsFirstNames'  => array(
					'button_bg'    => __( 'Button colour', '2ranq-forms' ),
					'field_radius' => __( 'Corner radius', '2ranq-forms' ),
					'field_gap'    => __( 'Space between fields', '2ranq-forms' ),
				),
				'dsStartHelp'   => __( 'Three settings carry most of the look. Everything else is below.', '2ranq-forms' ),
				'dsSearch'      => __( 'Search styles by name', '2ranq-forms' ),
				'dsOn'          => __( 'On the form now', '2ranq-forms' ),
				/* translators: %d: number of settings changed after the style was picked. */
				'dsChanged'     => __( '%d changed since', '2ranq-forms' ),
				'dsNoMatch'     => __( 'No style matches that word.', '2ranq-forms' ),
				'dsCompare'     => __( 'Hold to compare', '2ranq-forms' ),
				'dsCompareHelp' => __( 'Hold this and the form goes back to the look it had when you opened this tab.', '2ranq-forms' ),
				'dsPaperLight'  => __( 'Light page', '2ranq-forms' ),
				'dsPaperDark'   => __( 'Dark page', '2ranq-forms' ),
				'dsPaperHelp'   => __( 'This changes the page under the form, never the form. Some styles are written for a dark page.', '2ranq-forms' ),
				/* translators: %d: number of settings in this group. */
				'dsGroupCount'  => __( '%d settings', '2ranq-forms' ),
				'dsTouched'     => __( 'changed', '2ranq-forms' ),
				'dsAll'         => __( 'All', '2ranq-forms' ),
				'dsAnything'    => __( 'Change anything', '2ranq-forms' ),
				/* translators: %s: name of the style the form started from. */
				'dsBack'        => __( 'Back to %s', '2ranq-forms' ),
				'dsNoStyle'     => __( 'Your own mix', '2ranq-forms' ),

				// The Full Widgets tab, second step. A person looks at a picture and changes
				// parts of that picture, so the list on the left reads as the section's PARTS.
				'wgParts'       => __( 'Parts of this section', '2ranq-forms' ),
				'wgSays'        => __( 'What it says', '2ranq-forms' ),
				'wgLooks'       => __( 'How it looks', '2ranq-forms' ),
				'wgFormLocked'  => __( 'The form itself', '2ranq-forms' ),
				'wgFromTpl'     => __( 'template', '2ranq-forms' ),
				'wgFromSite'    => __( 'From Settings, tab Your details', '2ranq-forms' ),
				'wgFormGo'      => __( 'Change it in the Fields tab', '2ranq-forms' ),
				/* translators: %d: how much the preview is scaled down, in percent. */
				'wgZoom'        => __( '%d%%', '2ranq-forms' ),
				'wgEmpty'       => __( 'empty', '2ranq-forms' ),
				/* translators: %d: number of detail rows that are shown. */
				'wgRowsOn'      => __( '%d rows shown', '2ranq-forms' ),
				'resetGroup'    => __( 'Reset this group', '2ranq-forms' ),
				'livePreview'   => __( 'This is your real form, with your real fields. Colours and spacing live in the Design tab, so this view always looks the same.', '2ranq-forms' ),
				'styles'        => __( 'Ready made styles', '2ranq-forms' ),
				'stylesHelp'    => __( 'Pick one, then change anything below. Nothing is locked.', '2ranq-forms' ),
				'chooseImage'   => __( 'Choose image', '2ranq-forms' ),
				'changeImage'   => __( 'Change image', '2ranq-forms' ),
				'noImage'       => __( 'No image', '2ranq-forms' ),
				'opacity'       => __( 'Opacity', '2ranq-forms' ),
				'clearColor'    => __( 'Remove this colour', '2ranq-forms' ),
				'clearImage'    => __( 'Remove', '2ranq-forms' ),
				'imageHelp'     => __( 'Paste a URL, or pick from your media library.', '2ranq-forms' ),
				'submit'        => __( 'Submit', '2ranq-forms' ),
				'chooseFile'    => __( 'Choose a file, or drop it here', '2ranq-forms' ),
				'hiddenLabel'   => __( 'Hidden', '2ranq-forms' ),
				'chooseOne'     => __( 'Choose one', '2ranq-forms' ),
				'partFirst'     => __( 'First', '2ranq-forms' ),
				'partLast'      => __( 'Last', '2ranq-forms' ),
				'partStreet'    => __( 'Street address', '2ranq-forms' ),
				'partLine2'     => __( 'Apartment, suite, floor', '2ranq-forms' ),
				'partCity'      => __( 'City', '2ranq-forms' ),
				'partRegion'    => __( 'Region', '2ranq-forms' ),
				'partPostal'    => __( 'Postal code', '2ranq-forms' ),
				'partCountry'   => __( 'Country', '2ranq-forms' ),
				'optionLabel'   => __( 'Label', '2ranq-forms' ),
				'optionValue'   => __( 'Value', '2ranq-forms' ),
				'pickMeta'      => __( 'Small line, for example: 4 seats', '2ranq-forms' ),
				'pickOff'       => __( 'Unavailable', '2ranq-forms' ),
				'signHint'      => __( 'Sign here with a finger or mouse', '2ranq-forms' ),
				'clear'         => __( 'Clear', '2ranq-forms' ),

				// The step bar in the preview. The same words the form shows a visitor,
				// because the preview is what the visitor sees.
				'stepNext'      => __( 'Next', '2ranq-forms' ),
				'stepBack'      => __( 'Back', '2ranq-forms' ),
				/* translators: 1: number of the step being shown, 2: number of steps in the form. */
				'stepOf'        => __( 'Step %1$d of %2$d', '2ranq-forms' ),
			),
		);
	}

	/**
	 * The skeleton of the builder. Three columns.
	 *
	 * @param int $form_id The form id.
	 *
	 * @return void
	 */
	public static function render( $form_id ) {

		$form = get_post( $form_id );

		if ( ! $form instanceof WP_Post || Ranq_Forms_Post_Type::POST_TYPE !== $form->post_type ) {
			wp_die( esc_html__( 'That form does not exist.', '2ranq-forms' ) );
		}
		?>
		<div class="wrap ranq-admin ranq-builder-wrap">
			<div class="ranq-builder__bar">
				<a class="ranq-builder__back" href="<?php echo esc_url( admin_url( 'admin.php?page=' . Ranq_Forms_Admin::PAGE ) ); ?>">
					<?php esc_html_e( 'All forms', '2ranq-forms' ); ?>
				</a>

				<label class="screen-reader-text" for="ranq-form-title"><?php esc_html_e( 'Form name', '2ranq-forms' ); ?></label>
				<input
					type="text"
					id="ranq-form-title"
					class="ranq-builder__title"
					value="<?php echo esc_attr( get_the_title( $form ) ); ?>"
				/>

				<?php
				// A shortcode is COPIED, not read. That is why it is a button and not
				// a `<code>`: one click and it is on the clipboard. `builder.js` copies it.
				?>
				<button
					type="button"
					class="ranq-builder__shortcode"
					aria-label="<?php esc_attr_e( 'Copy shortcode', '2ranq-forms' ); ?>"
					title="<?php esc_attr_e( 'Copy shortcode', '2ranq-forms' ); ?>"
				>
					<span class="ranq-builder__shortcode-text">[2ranq_form id="<?php echo esc_html( (string) absint( $form_id ) ); ?>"]</span>
					<span class="ranq-builder__shortcode-icon" aria-hidden="true">
						<svg width="12" height="12" viewBox="0 0 16 16" focusable="false" aria-hidden="true">
							<rect x="5.5" y="5.5" width="8" height="8" rx="1.5" fill="none" stroke="currentColor" stroke-width="1.4" />
							<path d="M10.5 3.5H3.5a1 1 0 0 0-1 1v7" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" />
						</svg>
					</span>
				</button>

				<span class="ranq-builder__status" role="status" aria-live="polite"></span>

				<button type="button" class="button button-primary ranq-builder__save">
					<?php esc_html_e( 'Save', '2ranq-forms' ); ?>
				</button>
			</div>

			<div class="ranq-builder" id="ranq-builder">
				<div class="ranq-builder__loading"><?php esc_html_e( 'Loading the builder...', '2ranq-forms' ); ?></div>
			</div>
		</div>
		<?php
	}

	/**
	 * Returns a fresh preview of one section.
	 *
	 * @return void
	 */
	public static function shell() {

		$form_id = isset( $_POST['form_id'] ) ? absint( wp_unslash( $_POST['form_id'] ) ) : 0;
		$nonce   = isset( $_POST['nonce'] ) ? sanitize_text_field( wp_unslash( $_POST['nonce'] ) ) : '';

		if ( ! $form_id || ! wp_verify_nonce( $nonce, self::SHELL_ACTION . '_' . $form_id ) ) {
			wp_send_json_error( array(), 403 );
		}

		if ( ! current_user_can( 'manage_options' ) ) {
			wp_send_json_error( array(), 403 );
		}

		$layout = isset( $_POST['layout'] ) ? sanitize_key( wp_unslash( $_POST['layout'] ) ) : 'none';

		// phpcs:ignore WordPress.Security.ValidatedSanitizedInput.InputNotSanitized -- this is JSON, `sanitize_text_field` would break it. It is cleaned after decoding, field by field.
		$raw    = isset( $_POST['widget'] ) ? wp_unslash( $_POST['widget'] ) : '';
		$config = json_decode( is_string( $raw ) ? $raw : '', true );

		wp_send_json_success(
			array( 'html' => Ranq_Forms_Widget::shell_for( $layout, is_array( $config ) ? $config : array() ) )
		);
	}

	/**
	 * Saves the form.
	 *
	 * Everything that arrives is cleaned again here. Whatever went through
	 * JavaScript is not trusted, because this point can be reached without it.
	 *
	 * @return void
	 */
	public static function save() {

		$form_id = isset( $_POST['form_id'] ) ? absint( wp_unslash( $_POST['form_id'] ) ) : 0;
		$nonce   = isset( $_POST['nonce'] ) ? sanitize_text_field( wp_unslash( $_POST['nonce'] ) ) : '';

		if ( ! $form_id || ! wp_verify_nonce( $nonce, self::SAVE_ACTION . '_' . $form_id ) ) {
			wp_send_json_error( array( 'message' => __( 'That page has expired. Please reload and try again.', '2ranq-forms' ) ), 403 );
		}

		if ( ! current_user_can( 'manage_options' ) ) {
			wp_send_json_error( array( 'message' => __( 'You do not have permission to do that.', '2ranq-forms' ) ), 403 );
		}

		$form = get_post( $form_id );

		if ( ! $form instanceof WP_Post || Ranq_Forms_Post_Type::POST_TYPE !== $form->post_type ) {
			wp_send_json_error( array( 'message' => __( 'That form does not exist.', '2ranq-forms' ) ), 404 );
		}

		$title = isset( $_POST['title'] ) ? sanitize_text_field( wp_unslash( $_POST['title'] ) ) : '';

		if ( '' !== $title && $title !== $form->post_title ) {
			wp_update_post(
				array(
					'ID'         => $form_id,
					'post_title' => $title,
				)
			);
		}

		// phpcs:ignore WordPress.Security.ValidatedSanitizedInput.InputNotSanitized -- this is JSON, `sanitize_text_field` would break it. It is cleaned after decoding, field by field.
		$raw = isset( $_POST['fields'] ) ? wp_unslash( $_POST['fields'] ) : '';

		// phpcs:ignore WordPress.PHP.NoSilencedErrors.Discouraged -- invalid JSON is caught by the check below.
		$decoded = json_decode( is_string( $raw ) ? $raw : '', true );

		if ( ! is_array( $decoded ) ) {
			wp_send_json_error( array( 'message' => __( 'The form could not be read.', '2ranq-forms' ) ), 400 );
		}

		update_post_meta( $form_id, '_ranq_forms_fields', self::sanitize_fields( $decoded ) );

		// The design is saved together with the form, but cleaned by its own path.
		// phpcs:ignore WordPress.Security.ValidatedSanitizedInput.InputNotSanitized -- this is JSON, `sanitize_text_field` would break it. It is cleaned after decoding, field by field.
		$raw_design = isset( $_POST['design'] ) ? wp_unslash( $_POST['design'] ) : '';
		$design     = json_decode( is_string( $raw_design ) ? $raw_design : '', true );

		if ( is_array( $design ) ) {
			update_post_meta( $form_id, Ranq_Forms_Design::META_KEY, Ranq_Forms_Design::sanitize( $design ) );
		}

		// The per form settings.
		// phpcs:ignore WordPress.Security.ValidatedSanitizedInput.InputNotSanitized -- this is JSON, `sanitize_text_field` would break it. It is cleaned after decoding, field by field.
		$raw_settings = isset( $_POST['settings'] ) ? wp_unslash( $_POST['settings'] ) : '';
		$settings     = json_decode( is_string( $raw_settings ) ? $raw_settings : '', true );

		if ( is_array( $settings ) ) {
			Ranq_Forms_Form_Settings::save( $form_id, $settings );
		}

		// The contact widget. The widget number comes back, because it is handed out
		// only once a look is chosen, so the builder does not know it before the first save.
		// phpcs:ignore WordPress.Security.ValidatedSanitizedInput.InputNotSanitized -- this is JSON, `sanitize_text_field` would break it. It is cleaned after decoding, field by field.
		$raw_widget = isset( $_POST['widget'] ) ? wp_unslash( $_POST['widget'] ) : '';
		$widget     = json_decode( is_string( $raw_widget ) ? $raw_widget : '', true );
		$widget_id  = Ranq_Forms_Widget::existing_id( $form_id );

		if ( is_array( $widget ) ) {
			$saved     = Ranq_Forms_Widget::save( $form_id, $widget );
			$widget_id = $saved['widgetId'];
		}

		wp_send_json_success(
			array(
				'message'  => __( 'Saved.', '2ranq-forms' ),
				'widgetId' => absint( $widget_id ),
			)
		);
	}

	/**
	 * Cleans the whole form definition.
	 *
	 * @param array $fields The raw definition.
	 *
	 * @return array
	 */
	private static function sanitize_fields( $fields ) {

		$clean = array();
		$seen  = array();

		foreach ( $fields as $field ) {

			if ( ! is_array( $field ) ) {
				continue;
			}

			$type   = isset( $field['type'] ) ? sanitize_key( $field['type'] ) : '';
			$object = Ranq_Forms_Fields::get( $type );

			// An unknown field type does not get into the form.
			if ( ! $object instanceof Ranq_Forms_Field ) {
				continue;
			}

			$id = isset( $field['id'] ) ? sanitize_key( $field['id'] ) : '';

			if ( '' === $id || isset( $seen[ $id ] ) ) {
				$id = self::unique_id( $type, $seen );
			}

			$seen[ $id ] = true;

			$item = array(
				'id'   => $id,
				'type' => $type,
			);

			foreach ( $object->get_settings() as $group ) {

				foreach ( $group as $setting ) {

					$key = isset( $setting['key'] ) ? sanitize_key( $setting['key'] ) : '';

					if ( '' === $key || ! isset( $field[ $key ] ) ) {
						continue;
					}

					$item[ $key ] = self::sanitize_setting( $setting['type'], $field[ $key ] );
				}
			}

			$clean[] = $item;
		}

		return $clean;
	}

	/**
	 * Cleans one setting value, by its type.
	 *
	 * @param string $type  The type of the setting.
	 * @param mixed  $value The value.
	 *
	 * @return mixed
	 */
	private static function sanitize_setting( $type, $value ) {

		switch ( $type ) {

			case 'toggle':
				return (bool) $value;

			case 'number':
				if ( '' === $value || null === $value || ! is_numeric( $value ) ) {
					return '';
				}

				// A whole number stays whole. Otherwise "4" would become "4.0" and
				// come back into the builder like that, which looks like a bug.
				$number = (float) $value;

				return floor( $number ) === $number ? (int) $number : $number;

			case 'textarea':
				return sanitize_textarea_field( is_scalar( $value ) ? (string) $value : '' );

			case 'choices':
				return self::sanitize_choices( $value );

			case 'conditional':
				return Ranq_Forms_Conditions::sanitize( $value );

			case 'width':
				$width = sanitize_key( $value );

				return in_array( $width, array( 'full', 'half', 'third' ), true ) ? $width : 'full';

			case 'text':
			default:
				return sanitize_text_field( is_scalar( $value ) ? (string) $value : '' );
		}
	}

	/**
	 * Cleans the list of choices.
	 *
	 * @param mixed $choices The raw choices.
	 *
	 * @return array
	 */
	private static function sanitize_choices( $choices ) {

		if ( ! is_array( $choices ) ) {
			return array();
		}

		$clean = array();

		foreach ( $choices as $choice ) {

			if ( ! is_array( $choice ) ) {
				continue;
			}

			$label = isset( $choice['label'] ) ? sanitize_text_field( (string) $choice['label'] ) : '';
			$value = isset( $choice['value'] ) ? sanitize_text_field( (string) $choice['value'] ) : '';

			if ( '' === $label && '' === $value ) {
				continue;
			}

			$one = array(
				'label'   => '' === $label ? $value : $label,
				'value'   => '' === $value ? $label : $value,
				'default' => ! empty( $choice['default'] ),
			);

			// The image choice field carries three more things per option. Without this
			// they would show in the builder and vanish on save, since the rest is dropped.
			if ( isset( $choice['image'] ) || isset( $choice['meta'] ) || isset( $choice['disabled'] ) ) {
				$one['image']    = isset( $choice['image'] ) ? esc_url_raw( (string) $choice['image'] ) : '';
				$one['meta']     = isset( $choice['meta'] ) ? sanitize_text_field( (string) $choice['meta'] ) : '';
				$one['disabled'] = ! empty( $choice['disabled'] );
			}

			$clean[] = $one;
		}

		return $clean;
	}

	/**
	 * Builds a unique field key inside the form.
	 *
	 * @param string $type The field type.
	 * @param array  $seen The keys already taken.
	 *
	 * @return string
	 */
	private static function unique_id( $type, $seen ) {

		$index = 1;

		do {
			$id = $type . '_' . $index;
			++$index;
		} while ( isset( $seen[ $id ] ) );

		return $id;
	}
}