Adding blueprint.json for enabling plugin previews in WP.org plugin repo

.github/workflows/publish-release.yml

@@ -47,5 +47,5 @@ jobs:
           SVN_USERNAME: ${{ secrets.SVN_USERNAME }}
           SVN_PASSWORD: ${{ secrets.SVN_PASSWORD }}
           BUILD_DIR: release/${{ inputs.version }}
-          ASSETS_DIR: .wporg
+          ASSETS_DIR: .wporg/assets
           VERSION: ${{ inputs.version }}

.wporg/assets/blueprints/blueprint.json

@@ -0,0 +1,34 @@
+{
+  "landingPage": "/sample-page/",
+  "preferredVersions": {
+    "php": "8.0",
+    "wp": "latest"
+  },
+  "steps": [
+    {
+      "step": "login",
+      "username": "admin",
+      "password": "password"
+    },
+    {
+      "step": "setSiteOptions",
+      "options": {
+        "permalink_structure": "/%year%/%monthnum%/%day%/%postname%/"
+      }
+    },
+    {
+      "step": "installPlugin",
+      "pluginZipFile": {
+        "resource": "wordpress.org/plugins",
+        "slug": "chatrix"
+      }
+    },
+    {
+      "step": "runPHP",
+      "code": "<?php\n\nrequire_once 'wordpress/wp-load.php';\n\n$chatrix_block_simple = '<!-- wp:paragraph --> <p>Below you can see \"Chatrix\" block in action. You can add it anywhere using either <code>/chatrix</code> or by looking up chatrix when choosing which block to insert.</p> <!-- /wp:paragraph -->  <!-- wp:paragraph --> <p>Even though its not functional in this Playground demo, since it requires its own service worker and that is not compatible with the Playground (running WordPress in your browser) at the moment, you can at least see how it looks and it can be added anywhere you can add a Gutenberg block :)</p> <!-- /wp:paragraph --> <!-- wp:automattic/chatrix {\"instanceId\":\"2530674218113325\",\"defaultHomeserver\":\"matrix.org\"} /-->';\n\n$chatrix_block_2col = <<<CHATRIXBLOCK2COLUMNS\n<!-- wp:paragraph -->\n<p>Below you can see “Chatrix” block in action. You can add it anywhere using either&nbsp;<code>/chatrix</code>&nbsp;or by looking up chatrix when choosing which block to insert.</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:columns -->\n<div class=\"wp-block-columns\">\n<!-- wp:column {\"width\":\"33.33%\"} -->\n<div class=\"wp-block-column\" style=\"flex-basis:33.33%\">\n<!-- wp:paragraph -->\n<p>Here can be some login instructions of participating in the chat window on the right side:</p>\n<!-- /wp:paragraph -->\n</div>\n<!-- /wp:column -->\n<!-- wp:column {\"width\":\"66.66%\"} -->\n<div class=\"wp-block-column\" style=\"flex-basis:66.66%\">\n<!-- wp:automattic/chatrix {\"instanceId\":\"4986644425212020\",\"defaultHomeserver\":\"matrix.org\"} /-->\n</div>\n<!-- /wp:column -->\n</div>\n<!-- /wp:columns -->\n\n<!-- wp:paragraph -->\n<p>Unfortunately, it's not possible to login into Matrix inside of Playground demo, since it requires its own service worker and that is not compatible with the Playground at the moment. You can explore how it looks and how it can be added anywhere you can add a Gutenberg block :)</p>\n<!-- /wp:paragraph -->\nCHATRIXBLOCK2COLUMNS;\n\n$sample_page_post_id = 2;\n\nwp_update_post( array(\n    'ID' => $sample_page_post_id,\n    'post_title' => 'Chatrix [Regular]',\n    'post_content' => $chatrix_block_simple\n) );\n\nwp_insert_post( array(\n    'ID' => 3,\n    'post_title' => 'Chatrix [2 Column]',\n    'post_type' => 'page',\n    'post_status' => 'publish',\n    'post_content' => $chatrix_block_2col\n) );\n\nwp_insert_post( array(\n    'ID' => 4,\n    'post_title' => 'Chatrix [Popup]',\n    'post_type' => 'page',\n    'post_status' => 'publish',\n    'post_content' => '<!-- wp:paragraph --> <p>On this page, you can see the popup widget at the bottom right of your screen. Click on it to show Chatrix.</p> <!-- /wp:paragraph -->'\n) );\n\nupdate_option( 'chatrix_settings', array(\n    'homeserver' => 'matrix.org',\n    'room' => '#matrix:matrix.org',\n    'show_on' => 'specific',\n    'pages' => array(\n        0 => '4'\n    )\n) );",
+      "progress": {
+        "caption": "Setting Chatrix instances"
+      }
+    }
+  ]
+}

.wporg/assets/readme.md

@@ -0,0 +1,3 @@
+Run `update_blueprint.sh` after making changes in `blueprint_runphp_step_code.php` so that `.wporg/assets/blueprints/blueprint.json` is updated.
+
+[See blueprint in action on playground](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/automattic/chatrix/main/.wporg/assets/blueprints/blueprint.json)

.wporg/blueprint_runphp_step_code.php

@@ -0,0 +1,65 @@
+<?php
+
+require_once 'wordpress/wp-load.php';
+
+$chatrix_block_simple = '<!-- wp:paragraph --> <p>Below you can see "Chatrix" block in action. You can add it anywhere using either <code>/chatrix</code> or by looking up chatrix when choosing which block to insert.</p> <!-- /wp:paragraph -->  <!-- wp:paragraph --> <p>Even though its not functional in this Playground demo, since it requires its own service worker and that is not compatible with the Playground (running WordPress in your browser) at the moment, you can at least see how it looks and it can be added anywhere you can add a Gutenberg block :)</p> <!-- /wp:paragraph --> <!-- wp:automattic/chatrix {"instanceId":"2530674218113325","defaultHomeserver":"matrix.org"} /-->';
+
+$chatrix_block_2col = <<<CHATRIXBLOCK2COLUMNS
+<!-- wp:paragraph -->
+<p>Below you can see “Chatrix” block in action. You can add it anywhere using either&nbsp;<code>/chatrix</code>&nbsp;or by looking up chatrix when choosing which block to insert.</p>
+<!-- /wp:paragraph -->
+
+<!-- wp:columns -->
+<div class="wp-block-columns">
+<!-- wp:column {"width":"33.33%"} -->
+<div class="wp-block-column" style="flex-basis:33.33%">
+<!-- wp:paragraph -->
+<p>Here can be some login instructions of participating in the chat window on the right side:</p>
+<!-- /wp:paragraph -->
+</div>
+<!-- /wp:column -->
+<!-- wp:column {"width":"66.66%"} -->
+<div class="wp-block-column" style="flex-basis:66.66%">
+<!-- wp:automattic/chatrix {"instanceId":"4986644425212020","defaultHomeserver":"matrix.org"} /-->
+</div>
+<!-- /wp:column -->
+</div>
+<!-- /wp:columns -->
+
+<!-- wp:paragraph -->
+<p>Unfortunately, it's not possible to login into Matrix inside of Playground demo, since it requires its own service worker and that is not compatible with the Playground at the moment. You can explore how it looks and how it can be added anywhere you can add a Gutenberg block :)</p>
+<!-- /wp:paragraph -->
+CHATRIXBLOCK2COLUMNS;
+
+$sample_page_post_id = 2;
+
+wp_update_post( array(
+    'ID' => $sample_page_post_id,
+    'post_title' => 'Chatrix [Regular]',
+    'post_content' => $chatrix_block_simple
+) );
+
+wp_insert_post( array(
+    'ID' => 3,
+    'post_title' => 'Chatrix [2 Column]',
+    'post_type' => 'page',
+    'post_status' => 'publish',
+    'post_content' => $chatrix_block_2col
+) );
+
+wp_insert_post( array(
+    'ID' => 4,
+    'post_title' => 'Chatrix [Popup]',
+    'post_type' => 'page',
+    'post_status' => 'publish',
+    'post_content' => '<!-- wp:paragraph --> <p>On this page, you can see the popup widget at the bottom right of your screen. Click on it to show Chatrix.</p> <!-- /wp:paragraph -->'
+) );
+
+update_option( 'chatrix_settings', array(
+    'homeserver' => 'matrix.org',
+    'room' => '#matrix:matrix.org',
+    'show_on' => 'specific',
+    'pages' => array(
+        0 => '4'
+    )
+) );

.wporg/update_blueprint.sh

@@ -0,0 +1,16 @@
+#!/usr/bin/env bash
+
+if ! command -v jq &> /dev/null ; then
+    echo "jq is not installed. Please install jq (https://jqlang.github.io/jq/) before running this script."
+fi
+
+# Get the directory of the script
+script_dir="$(dirname "$(readlink -f "$0")")"
+
+blueprint_location="$script_dir/assets/blueprints/blueprint.json"
+phpsrc_location="$script_dir/blueprint_runphp_step_code.php"
+
+jq --arg newCode "$(cat $phpsrc_location)" '.steps[] |= if .step == "runPHP" then .code = $newCode else . end' $blueprint_location > updated_blueprint.json
+
+rm $blueprint_location
+mv updated_blueprint.json $blueprint_location

README.md

@@ -18,11 +18,11 @@ Easily add a [Matrix](https://matrix.org) client to WordPress pages, either thro
 If you have any feedback or questions about Chatrix, please do talk to plugin maintainers at [#chatrix:matrix.org](https://matrix.to/#/#chatrix:matrix.org).
 
 ## Screenshots
-![Block - Login](.wporg/screenshot-1.png)
-![Block - Room List](.wporg/screenshot-2.png)
-![Block - Timeline](.wporg/screenshot-3.png)
-![Popup - Settings](.wporg/screenshot-4.png)
-![Popup - Timeline](.wporg/screenshot-5.png)
+![Block - Login](.wporg/assets/screenshot-1.png)
+![Block - Room List](.wporg/assets/screenshot-2.png)
+![Block - Timeline](.wporg/assets/screenshot-3.png)
+![Popup - Settings](.wporg/assets/screenshot-4.png)
+![Popup - Timeline](.wporg/assets/screenshot-5.png)
 
 ## Frequently Asked Questions
 ### How can I install this plugin on my site?