diff --git a/plugins/wporg-5ftf/assets/css/admin.css b/plugins/wporg-5ftf/assets/css/admin.css index 64f72ac..1298cca 100755 --- a/plugins/wporg-5ftf/assets/css/admin.css +++ b/plugins/wporg-5ftf/assets/css/admin.css @@ -1 +1,37 @@ -/* rounded corners on contributor avatar */ \ No newline at end of file +.pledge-form .form-field { + margin-bottom: 16px; +} + +.pledge-form .form-field label { + margin-bottom: 8px; + display: inline-block; +} + +.pledge-form .form-field input[type=text], +.pledge-form .form-field input[type=url], +.pledge-form .form-field input[type=number], +.pledge-form .form-field input[type=email], +.pledge-form .form-field textarea { + display: block; + width: 100%; + padding: 8px; +} + +.pledge-form .form-field input[type=number] { + max-width: 10em; + height: auto; +} + +.pledge-form .form-field > p { + margin-top: 8px; + font-size: 0.9em; +} + +.pledge-form .form-field__logo input { + padding: 8px 0; + line-height: 1; +} + +.pledge-form .form-field__agree label { + margin-bottom: 0; +} diff --git a/plugins/wporg-5ftf/includes/pledge-form.php b/plugins/wporg-5ftf/includes/pledge-form.php index 9e75ce6..0c69a17 100755 --- a/plugins/wporg-5ftf/includes/pledge-form.php +++ b/plugins/wporg-5ftf/includes/pledge-form.php @@ -1,6 +1,6 @@ [ - 'filter' => FILTER_SANITIZE_STRING, - 'flags' => FILTER_REQUIRE_ARRAY, - ], - 'pledge-agreement' => FILTER_VALIDATE_BOOLEAN, - ) - ); -} - /** * * @@ -166,8 +152,10 @@ function has_existing_pledge( $domain, int $current_pledge_id = 0 ) { 'post_type' => Pledge\CPT_ID, 'post_status' => array( 'pending', 'publish' ), 'meta_query' => array( - 'key' => PledgeMeta\META_PREFIX . 'org-domain', - 'value' => $domain, + array( + 'key' => PledgeMeta\META_PREFIX . 'org-domain', + 'value' => $domain, + ), ), ); diff --git a/plugins/wporg-5ftf/includes/pledge-meta.php b/plugins/wporg-5ftf/includes/pledge-meta.php index 8bf9e61..1c29d22 100755 --- a/plugins/wporg-5ftf/includes/pledge-meta.php +++ b/plugins/wporg-5ftf/includes/pledge-meta.php @@ -13,10 +13,11 @@ defined( 'WPINC' ) || die(); const META_PREFIX = FiveForTheFuture\PREFIX . '_'; -add_action( 'init', __NAMESPACE__ . '\register_pledge_meta' ); -add_action( 'admin_init', __NAMESPACE__ . '\add_meta_boxes' ); -add_action( 'save_post', __NAMESPACE__ . '\save_pledge', 10, 2 ); +add_action( 'init', __NAMESPACE__ . '\register_pledge_meta' ); +add_action( 'admin_init', __NAMESPACE__ . '\add_meta_boxes' ); +add_action( 'save_post', __NAMESPACE__ . '\save_pledge', 10, 2 ); add_action( 'updated_' . Pledge\CPT_ID . '_meta', __NAMESPACE__ . '\update_generated_meta', 10, 4 ); +add_action( 'admin_enqueue_scripts', __NAMESPACE__ . '\enqueue_assets' ); /** * Define pledge meta fields and their properties. @@ -25,30 +26,36 @@ add_action( 'updated_' . Pledge\CPT_ID . '_meta', __NAMESPACE__ . '\update_gener */ function get_pledge_meta_config( $context = '' ) { $user_input = array( - 'org-description' => array( + 'org-description' => array( 'single' => true, 'sanitize_callback' => 'sanitize_text_field', 'show_in_rest' => true, 'php_filter' => FILTER_SANITIZE_STRING, ), - 'org-name' => array( + 'org-name' => array( 'single' => true, 'sanitize_callback' => 'sanitize_text_field', 'show_in_rest' => true, 'php_filter' => FILTER_SANITIZE_STRING, ), - 'org-url' => array( + 'org-url' => array( 'single' => true, 'sanitize_callback' => 'esc_url_raw', 'show_in_rest' => true, 'php_filter' => FILTER_VALIDATE_URL, ), - 'pledge-email' => array( + 'org-pledge-email' => array( 'single' => true, 'sanitize_callback' => 'sanitize_email', 'show_in_rest' => false, 'php_filter' => FILTER_VALIDATE_EMAIL, ), + 'org-number-employees' => array( + 'single' => true, + 'sanitize_callback' => 'absint', + 'show_in_rest' => false, + 'php_filter' => FILTER_VALIDATE_INT, + ), ); $generated = array( @@ -135,17 +142,20 @@ function add_meta_boxes() { * @param array $box */ function render_meta_boxes( $pledge, $box ) { - $editable = current_user_can( 'edit_pledge', $pledge->ID ); + $readonly = ! current_user_can( 'edit_page', $pledge->ID ); $data = array(); foreach ( get_pledge_meta_config() as $key => $config ) { $data[ $key ] = get_post_meta( $pledge->ID, META_PREFIX . $key, $config['single'] ); } + echo '
'; + switch ( $box['id'] ) { case 'pledge-email': require FiveForTheFuture\get_views_path() . 'inputs-pledge-org-email.php'; break; + case 'org-info': require FiveForTheFuture\get_views_path() . 'inputs-pledge-org-info.php'; break; @@ -154,43 +164,8 @@ function render_meta_boxes( $pledge, $box ) { require FiveForTheFuture\get_views_path() . 'inputs-pledge-contributors.php'; break; } -} -/** - * Check that an array contains values for all required keys. - * - * @return bool|WP_Error True if all required values are present. Otherwise WP_Error. - */ -function has_required_pledge_meta( array $submission ) { - $error = new WP_Error(); - - $required = array_keys( get_pledge_meta_config( 'user_input' ) ); - - foreach ( $required as $key ) { - if ( ! isset( $submission[ $key ] ) || is_null( $submission[ $key ] ) ) { - $error->add( - 'required_field_empty', - sprintf( - __( 'The %s field does not have a value.', 'wporg' ), - sanitize_key( $key ) - ) - ); - } elseif ( false === $submission[ $key ] ) { - $error->add( - 'required_field_invalid', - sprintf( - __( 'The %s field has an invalid value.', 'wporg' ), - sanitize_key( $key ) - ) - ); - } - } - - if ( ! empty( $error->get_error_messages() ) ) { - return $error; - } - - return true; + echo '
'; } /** @@ -209,7 +184,7 @@ function save_pledge( $pledge_id, $pledge ) { return; } - if ( ! $pledge instanceof WP_Post || $pledge->post_type !== Pledge\CPT_ID ) { + if ( ! $pledge instanceof WP_Post || Pledge\CPT_ID !== $pledge->post_type ) { return; } @@ -217,7 +192,7 @@ function save_pledge( $pledge_id, $pledge ) { return; } - if ( ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) || $pledge->post_status === 'auto-draft' ) { + if ( ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) || 'auto-draft' === $pledge->post_status ) { return; } @@ -279,6 +254,94 @@ function update_generated_meta( $meta_id, $object_id, $meta_key, $_meta_value ) } } +/** + * Check that an array contains values for all required keys. + * + * @return bool|WP_Error True if all required values are present. Otherwise WP_Error. + */ +function has_required_pledge_meta( array $submission ) { + $error = new WP_Error(); + + $required = array_keys( get_pledge_meta_config( 'user_input' ) ); + + foreach ( $required as $key ) { + if ( ! isset( $submission[ $key ] ) || is_null( $submission[ $key ] ) ) { + $error->add( + 'required_field_empty', + sprintf( + __( 'The %s field does not have a value.', 'wporg' ), + sanitize_key( $key ) + ) + ); + } elseif ( false === $submission[ $key ] ) { + $error->add( + 'required_field_invalid', + sprintf( + __( 'The %s field has an invalid value.', 'wporg' ), + sanitize_key( $key ) + ) + ); + } + } + + if ( ! empty( $error->get_error_messages() ) ) { + return $error; + } + + return true; +} + +/** + * Get the input filters for submitted content. + * + * @return array + */ +function get_input_filters() { + return array_merge( + // Inputs that correspond to meta values. + wp_list_pluck( get_pledge_meta_config( 'user_input' ), 'php_filter' ), + // Inputs with no corresponding meta value. + array( + 'contributor-wporg-usernames' => [ + 'filter' => FILTER_SANITIZE_STRING, + 'flags' => FILTER_REQUIRE_ARRAY, + ], + 'pledge-agreement' => FILTER_VALIDATE_BOOLEAN, + ) + ); +} + +/** + * Get the metadata for a given pledge, or a default set if no pledge is provided. + * + * @param int $pledge_id + * @param string $context + * @return array Pledge data + */ +function get_pledge_meta( $pledge_id = 0, $context = '' ) { + // Get existing pledge, if it exists. + $pledge = get_post( $pledge_id ); + + $keys = get_pledge_meta_config( $context ); + $meta = array(); + + // Get POST'd submission, if it exists. + $submission = filter_input_array( INPUT_POST, get_input_filters() ); + + foreach ( $keys as $key => $config ) { + if ( isset( $submission[ $key ] ) ) { + $meta[ $key ] = $submission[ $key ]; + } else if ( $pledge instanceof WP_Post ) { + $meta_key = META_PREFIX . $key; + $meta[ $key ] = get_post_meta( $pledge->ID, $meta_key, true ); + } else { + $meta[ $key ] = $config['default'] ?: ''; + } + } + + return $meta; +} + /** * Isolate the domain from a given URL and remove the `www.` if necessary. * @@ -292,3 +355,18 @@ function get_normalized_domain_from_url( $url ) { return $domain; } + +/** + * Enqueue CSS file for admin page. + * + * @return void + */ +function enqueue_assets() { + $ver = filemtime( FiveForTheFuture\PATH . '/assets/css/admin.css' ); + wp_register_style( '5ftf-admin', plugins_url( 'assets/css/admin.css', __DIR__ ), [], $ver ); + + $current_page = get_current_screen(); + if ( Pledge\CPT_ID === $current_page->id ) { + wp_enqueue_style( '5ftf-admin' ); + } +} diff --git a/plugins/wporg-5ftf/views/form-pledge-manage.php b/plugins/wporg-5ftf/views/form-pledge-manage.php index b014cc6..a97c2d7 100644 --- a/plugins/wporg-5ftf/views/form-pledge-manage.php +++ b/plugins/wporg-5ftf/views/form-pledge-manage.php @@ -7,15 +7,19 @@ use function WordPressDotOrg\FiveForTheFuture\get_views_path; /** @var bool $updated */ ?> -
+
- +
diff --git a/plugins/wporg-5ftf/views/form-pledge-new.php b/plugins/wporg-5ftf/views/form-pledge-new.php index 5e26434..bfdd8be 100755 --- a/plugins/wporg-5ftf/views/form-pledge-new.php +++ b/plugins/wporg-5ftf/views/form-pledge-new.php @@ -13,33 +13,41 @@ use function WordPressDotOrg\FiveForTheFuture\get_views_path; +
-
- -
+

+
-
- +
+

+ +

+ +

-
+
- +
diff --git a/plugins/wporg-5ftf/views/inputs-pledge-contributors.php b/plugins/wporg-5ftf/views/inputs-pledge-contributors.php index f4f7aed..bc3fee3 100644 --- a/plugins/wporg-5ftf/views/inputs-pledge-contributors.php +++ b/plugins/wporg-5ftf/views/inputs-pledge-contributors.php @@ -1,9 +1,9 @@ @@ -14,14 +14,14 @@ namespace WordPressDotOrg\FiveForTheFuture\View; -

- +

+

diff --git a/plugins/wporg-5ftf/views/inputs-pledge-new-misc.php b/plugins/wporg-5ftf/views/inputs-pledge-new-misc.php index edb3ca6..2954f53 100644 --- a/plugins/wporg-5ftf/views/inputs-pledge-new-misc.php +++ b/plugins/wporg-5ftf/views/inputs-pledge-new-misc.php @@ -1,11 +1,11 @@ -
+

diff --git a/plugins/wporg-5ftf/views/inputs-pledge-org-email.php b/plugins/wporg-5ftf/views/inputs-pledge-org-email.php index 654f170..8838e56 100644 --- a/plugins/wporg-5ftf/views/inputs-pledge-org-email.php +++ b/plugins/wporg-5ftf/views/inputs-pledge-org-email.php @@ -1,23 +1,26 @@
- + />
+ + > +
+ +
+ + + />
diff --git a/plugins/wporg-5ftf/views/inputs-pledge-org-logo.php b/plugins/wporg-5ftf/views/inputs-pledge-org-logo.php deleted file mode 100644 index 50f842d..0000000 --- a/plugins/wporg-5ftf/views/inputs-pledge-org-logo.php +++ /dev/null @@ -1,17 +0,0 @@ - - -
- - -
diff --git a/themes/wporg-5ftf/css/objects/_objects.scss b/themes/wporg-5ftf/css/objects/_objects.scss index 6623b9b..c9da9b7 100644 --- a/themes/wporg-5ftf/css/objects/_objects.scss +++ b/themes/wporg-5ftf/css/objects/_objects.scss @@ -8,5 +8,6 @@ @import "../../../pub/wporg/css/objects/notices"; @import "buttons"; @import "image"; +@import "pledge-form"; @import "pullquote"; @import "site-header"; diff --git a/themes/wporg-5ftf/css/objects/_pledge-form.scss b/themes/wporg-5ftf/css/objects/_pledge-form.scss new file mode 100644 index 0000000..b37e86e --- /dev/null +++ b/themes/wporg-5ftf/css/objects/_pledge-form.scss @@ -0,0 +1,59 @@ +.pledge-form { + + .form-field { + margin-bottom: ms(4); + + label { + margin-bottom: ms(-5); + display: inline-block; + font-weight: 600; + font-size: 16px; + color: $color__text-input; + } + + input[type="text"], + input[type="url"], + input[type="number"], + input[type="email"], + textarea { + display: block; + width: 100%; + padding: ms(-5) ms(-2); + background: $color__background-input; + border: 1px solid $color__border-input; + box-shadow: none; + } + + input[type="number"] { + max-width: 10em; + height: auto; + } + + > p { + margin-top: ms(-5); + font-size: ms(-2); + } + } + + .form-field__logo { + + input { + padding: ms(-6) 0; + line-height: 1; + } + } + + .form-field__agree { + + label { + margin-bottom: 0; + } + } + + input[type="submit"] { + display: inline-block; + height: auto; + padding: ms(-3) ms(0); + font-weight: 600; + } +} diff --git a/themes/wporg-5ftf/css/settings/_colors.scss b/themes/wporg-5ftf/css/settings/_colors.scss index 5b67e89..07487cf 100644 --- a/themes/wporg-5ftf/css/settings/_colors.scss +++ b/themes/wporg-5ftf/css/settings/_colors.scss @@ -4,6 +4,7 @@ $color__background-hr: #eee; $color__background-button: #eee; $color__background-pre: #eee; $color__background-ins: #fff9c0; +$color__background-input: #f9f9f9; $color__text-screen: #21759b; $color__text-input: #32373c;