Ticket #262: 262.2.diff

camptix-badge-generator/includes/indesign-badges.php

@@ -9 +9 @@
 
 add_action( 'camptix_menu_tools_indesign_badges', __NAMESPACE__ . '\render_indesign_page' );
 
+/*
+ * todo
+ *
+ * can't call serve_zip_file() in build_assets() because headers already sent
+ * also, downloading gravatars takes too long to do while user is waiting for page to load
+ * so, when user hit `generate assets` button, use javascript to hide the button and show a spinner and a message that say it'll take a few minutes
+ * send ajax post to kick off build
+ * send ajax get to check if build is done every ~10 seconds
+ * maybe show progress
+ * when it's done, hide spinner/message and show a `download` button
+ * clicking that button reloads php page with param to serve the zip, then delete it
+ *
+ * post-deploy:
+ *      - update documentation at https://make.wordpress.org/community/handbook/wordcamp-organizer/first-steps/helpful-documents-and-templates/create-wordcamp-badges-with-gravatars/
+ *      - Post to make/community announcing to organizers that it's available now
+ *      - update dashboard widget with link to both html and indesign
+ */
+
 /**
  * Render the Indesign Badges page
  */
@@ -17 +35 @@
                 return;
         }
 
+        //$_POST['generate-indesign-assets'] = 1; //todo testing
+
+        if ( isset( $_POST['generate-indesign-assets'] ) ) {
+                // todo verify nonce
+
+                try {
+                        build_assets();
+                } catch ( \Exception $exception ) {
+                        /*
+                         * There's nothing more to do here, we just needed to capture the $exception variable so the view can
+                         * display the message to the user.
+                         *
+                         * Because the message is being displayed, make sure you don't put anything overly technical, or
+                         * anything sensitive inside it.
+                         */
+                }
+        }
+
         $html_customizer_url = HTML\get_customizer_section_url();
 
         require_once( dirname( __DIR__ ) . '/views/indesign-badges/page-indesign-badges.php' );
@@ -39 +75 @@
                 download_gravatars( $attendees, $gravatar_folder );
                 generate_csv( $csv_filename, $zip_local_folder, $attendees, $gravatar_folder );
                 create_zip_file( $zip_filename, $zip_local_folder, $csv_filename, $gravatar_folder );
+                serve_zip_file( $zip_filename );
         } finally {
                 // todo Delete contents of $assets_folder, then rmdir( $assets_folder );
         }

new file camptix-badge-generator/javascript/indesign-badges.js

@@ +1 @@
+jQuery( document ).ready( function( $ ) {
+        'use strict';
+
+        var app = window.CampTixInDesignBadges = {
+
+                /**
+                 * Main entry point
+                 */
+                init: function() {
+                        try {
+                                $( '#cbg-generate-assets' ).click( app.requestAssetGeneration );
+                        } catch ( exception ) {
+                                app.log( exception );
+                        }
+                },
+
+                /**
+                 * todo
+                 *
+                 * @param {object} event
+                 */
+                requestAssetGeneration : function( event ) {
+                        try {
+                        } catch ( exception ) {
+                                wcb.log( exception );
+                        }
+                },
+
+                /**
+                 * Log a message to the console
+                 *
+                 * @param {*} error
+                 */
+                log : function( error ) {
+                        if ( ! window.console ) {
+                                return;
+                        }
+
+                        if ( 'string' === typeof error ) {
+                                console.log( 'CampTix Badge Generator: ' + error );
+                        } else {
+                                console.log( 'CampTix Badge Generator: ', error );
+                        }
+                }
+        };
+
+        app.init();
+} );

camptix-badge-generator/views/common/page-generate-badges.php

@@ -3 +3 @@
 namespace CampTix\Badge_Generator;
 defined( 'WPINC' ) or die();
 
+/**
+ * @var string $html_customizer_url
+ * @var string $indesign_page_url
+ * @var string $notify_tool_url
+ */
 ?>
 
 <p>

camptix-badge-generator/views/indesign-badges/page-indesign-badges.php

@@ -4 +4 @@
 defined( 'WPINC' ) or die();
 
 /**
- * @var string $html_customizer_url
+ * @var \Exception $exception
  */
 
+/*
+todo
+
+- Update the rest of this text
+        bring in documentation from handbook, or just link to it? has more details on using data merge, screenshots, etc</li>
+        https://make.wordpress.org/community/handbook/wordcamp-organizer/planning-details/wordcamp-name-badge-templates
+        https://make.wordpress.org/community/handbook/wordcamp-organizer/first-steps/helpful-documents-and-templates/create-wordcamp-badges-with-gravatars/personalized-badges-with-indesign/
+- Bring documentation inline instead of being in handbook, similar to Remote CSS
+- Maybe link to http://ollehost.dk/blog/2016/02/16/convert-character-encoding-of-a-csv-file-for-indesign-data-merge/
+        Or can just fix that during the export?
+
+*/
+
 ?>
 
 <h2>
         <?php _e( 'InDesign Badges', 'wordcamporg' ); ?>
 </h2>
 
-<p>
-        <?php _e(
-                "The process for building InDesign badges hasn't been automated yet, so it requires a developer to run a script.
-                 That script will create a CSV file and will download Gravatar images for all attendees.
-                 Once that's done, a designer can take those files into InDesign and use the Data Merge feature to create personalized badges for each attendee.",
-                'wordcamporg'
-        ); ?>
-</p>
+<?php if ( isset( $exception ) ) : ?>
+        <div class="notice notice-error notice-large inline">
+                <?php esc_html_e( 'Error: ', 'wordcamporg' ); ?>
+                <?php echo esc_html( $exception->getMessage() ); ?>
+        </div>
+<?php endif; ?>
 
-<p>
-        <?php printf(
-                __(
-                        'Full instructions are <a href="%s">available in the WordCamp Organizer Handbook</a>.
-                        If you\'d prefer an easier way, <a href="%s">the HTML/CSS method</a> is much more automated at this time.',
-                        'wordcamporg'
-                ),
-                'https://make.wordpress.org/community/handbook/wordcamp-organizer-handbook/first-steps/helpful-documents-and-templates/create-wordcamp-badges-with-gravatars/',
-                esc_url( $html_customizer_url )
-        ); ?>
-</p>
+<button id="cbg-generate-assets" class="button button-primary">
+        <?php esc_html_e( 'Generate Assets', 'wordcamporg' ); ?>
+</button>
+
+<span class="spinner is-active"></span>
+
+<button id="cbg-download-assets" class="button button-primary">
+        <?php esc_html_e( 'Download Assets', 'wordcamporg' ); ?>
+</button>
 
 <p>
-        <?php printf(
-                __( 'if you\'d like to help automate the InDesign process, you can contribute to <a href="%s">Meta ticket #262</a>.', 'wordcamporg' ),
-                'https://meta.trac.wordpress.org/ticket/262'
-        ); ?>
+        intro sentence<br/>
+        good to do dry run early on, make sure everything works, printer will accept output, etc<br/>
+        but then wait until last minute to do complete steps, because don't want to have to repeat the process several times
 </p>
+
+<ol>
+        <li><?php echo wp_kses( __( 'Click on the <code>Generate Assets</code> button.', 'wordcamporg' ), 'post' ); ?></li>
+        <li><?php esc_html_e( 'Wait while the assets are being generated. This can take 5+ minutes, especially if you have hundreds of attendees.', 'wordcamporg' ); ?></li>
+        <li><?php echo wp_kses( __( 'Click on the <code>Download Assets</code> button once it appears.', 'wordcamporg' ), 'post' ); ?></li>
+        <li><?php esc_html_e( 'Unzip the downloaded file on your computer, and use a spreadsheet application to open the CSV file inside.', 'wordcamporg' ); ?></li>
+        <li><?php echo wp_kses( __( 'Use the find/replace feature to change the file paths in the <code>Gravatar</code> column. It should match the location on your computer where you extracted the assets to.', 'wordcamporg' ), 'post' ); ?></li>
+        <li><?php esc_html_e( "Remove any columns that you don't plan on merging, since InDesign will complain about them.", 'wordcamporg' ); ?></li>
+        <li><?php esc_html_e( 'Review the data in the CSV and fix anything that will look bad on the badges. For example, inconsistent capitalization, typos, etc.', 'wordcamporg' ); ?></li>
+        <li><?php esc_html_e( 'Open InDesign and use the Data Merge feature to generate a unique badge for each attendee.', 'wordcamporg' ); ?></li>
+        <li><?php esc_html_e( 'Export the results into a file that you can give to your print vendor.', 'wordcamporg' ); ?></li>
+</ol>