Create wikis in a background process

* The form now points to start.php, which converts
  allowed POST data to environment variables and
  sends them to new.php
* The output is written to log files in log/*.html
  which are then polled by the JS for new content
  every second
* Logs are only deleted when the wiki is deleted,
  allowing for debugging and inspection by other
  users.

Fixes #399, #336

Author: edg2s

deletewiki.sh

@@ -3,5 +3,7 @@ set -ex
 
 rm -rf $PATCHDEMO/wikis/$WIKI
 
+rm -f $PATCHDEMO/logs/$WIKI.html
+
 # delete database
 mysql -u patchdemo --password=patchdemo -e "DROP DATABASE IF EXISTS patchdemo_$WIKI";

index.php

@@ -57,7 +57,7 @@
 	echo new OOUI\FormLayout( [
 		'infusable' => true,
 		'method' => 'POST',
-		'action' => 'new.php',
+		'action' => 'start.php',
 		'id' => 'new-form',
 		'items' => [
 			new OOUI\FieldsetLayout( [
@@ -348,7 +348,10 @@
 		'<td data-label="Linked tasks" class="linkedTasks">' . $linkedTasks . '</td>' .
 		'<td data-label="Time" class="date">' . date( 'Y-m-d H:i:s', $wikiData[ 'created' ] ) . '</td>' .
 		( $useOAuth ? '<td data-label="Creator">' . ( $creator ? user_link( $creator ) : '?' ) . '</td>' : '' ) .
-		( $canAdmin ? '<td data-label="Time to create">' . ( $wikiData['timeToCreate'] ? format_duration( $wikiData['timeToCreate'] ) : '' ) . '</td>' : '' ) .
+		( $canAdmin ?
+			'<td data-label="Time to create"><a href="start.php?wiki=' . $wiki . '">' . ( $wikiData['timeToCreate'] ? format_duration( $wikiData['timeToCreate'] ) : '' ) . '</a></td>' :
+			''
+		) .
 		( count( $actions ) ?
 			'<td data-label="Actions">' . implode( '&nbsp;&middot;&nbsp;', $actions ) . '</td>' :
 			'<!-- EMPTY ACTIONS -->'

js/new.js

@@ -0,0 +1,79 @@
+/* global OO, pd */
+( function () {
+	window.pd = window.pd || {};
+
+	var installProgressField = OO.ui.infuse(
+		document.getElementsByClassName( 'installProgressField' )[ 0 ]
+	);
+
+	installProgressField.fieldWidget.pushPending();
+
+	var openWiki = OO.ui.infuse(
+		document.getElementsByClassName( 'openWiki' )[ 0 ]
+	);
+
+	function endProgress() {
+		installProgressField.fieldWidget.popPending();
+		pd.finished = true;
+	}
+
+	pd.abandon = function ( html ) {
+		installProgressField.fieldWidget.setDisabled( true );
+		installProgressField.setErrors( [ new OO.ui.HtmlSnippet( html ) ] );
+		pd.notify( 'Your PatchDemo wiki failed to build', html );
+		endProgress();
+	};
+
+	pd.setProgress = function ( pc, label ) {
+		installProgressField.fieldWidget.setProgress( pc );
+		installProgressField.setLabel( label );
+		if ( pc === 100 ) {
+			openWiki.setDisabled( false );
+			pd.notify( 'Your PatchDemo wiki is ready!' );
+			endProgress();
+		}
+	};
+
+	pd.notify = function ( message, body ) {
+		if ( 'Notification' in window && +localStorage.getItem( 'patchdemo-notifications' ) ) {
+			// eslint-disable-next-line no-new
+			new Notification(
+				message,
+				{
+					icon: './images/favicon-32x32.png',
+					body: body
+				}
+			);
+		}
+	};
+
+	$( function () {
+		// eslint-disable-next-line no-jquery/no-global-selector
+		var $log = $( '.newWikiLog' );
+		var log = '';
+		var offset = 0;
+		function poll() {
+			$.get( 'log.php', {
+				wiki: pd.wiki,
+				offset: offset
+			} ).then( function ( result ) {
+				if ( result ) {
+					// result can be unbalanced HTML, so store it in
+					// a string and rewrite the whole thing each time
+					log += result;
+					$log.html( log );
+					offset += result.length;
+				}
+				if ( !pd.finished ) {
+					setTimeout( poll, 1000 );
+				}
+			} );
+		}
+
+		poll();
+
+		// Add wiki to URL so that page can be shared/reloaded
+		history.replaceState( null, '', 'start.php?wiki=' + pd.wiki );
+	} );
+
+}() );

js/start.js

@@ -0,0 +1,21 @@
+<?php
+
+$offset = $_GET['offset'];
+$wiki = $_GET['wiki'];
+
+if ( !preg_match( '/^[0-9a-f]{10,32}$/', $wiki ) ) {
+	die( 'Invalid wiki name.' );
+}
+
+$file = 'logs/' . $wiki . '.html';
+
+if ( file_exists( $file ) ) {
+	echo file_get_contents(
+		$file,
+		false,
+		null,
+		$offset
+	);
+} else {
+	echo "<script>pd.abandon( 'Log not found.' );</script>";
+}