refactor: word press plugin update to address review issues

.github/workflows/end-to-end-tests.yml

@@ -46,7 +46,7 @@ jobs:
         run: |
           cd packages/web-component/wordpress-plugin
           unzip -d extract read-along-web-app-loader.zip
-          if ! diff -qr read-along-web-app-loader extract/read-along-web-app-loader; then \
+          if ! diff --exclude=js -qr read-along-web-app-loader extract/read-along-web-app-loader; then \
             echo The zipped WordPress plugin packages/web-component/wordpress-plugin/read-along-web-app-loader.zip is out of date.; \
             false; \
           fi

.gitignore

@@ -8,3 +8,4 @@ www
 .python-version
 *~
 **/version.ts
+packages/web-component/wordpress-plugin/read-along-web-app-loader/js/*

packages/web-component/bin/make-wordpress-plugin

@@ -0,0 +1,5 @@
+#!/bin/bash
+# delete previous version
+cd packages/web-component/wordpress-plugin/ || exit
+rm -rf read-along-web-app-loader.zip
+zip a -r ./read-along-web-app-loader.zip ./read-along-web-app-loader

packages/web-component/wordpress-plugin/README.md

@@ -16,7 +16,7 @@ This page contains instructions on how to embed a read-along book in your WordPr
 
 You must have an administrator account on your WordPress site to install this plugin.
 
-### Manual Installation
+### Installation
 
 ![Manual Installation Screenshot](read-along-web-app-loader/assets/screenshot-manual-install.png)
 
@@ -28,15 +28,6 @@ You must have an administrator account on your WordPress site to install this pl
 6. Choose File `read-along-web-app-loader.zip` and click **Install Now**
 7. Activate the plugin.
 
-### Installing from the Plugin Directory _(coming soon)_
-
-1. Login to your WordPress site
-2. Choose Plugins from the menu of the Dashboard
-3. Click **Add New Plugin**
-4. Search for `Read Along`
-5. Click **Install Now** when you find **Read Along Web App Loader**
-6. Click **Activate**
-
 ## Embedding a Read-Along in WordPress
 
 There are several ways to deploy your read-along on your WordPress site. In this configuration, you plan to upload all your read-along assets to your site's Media Library and embed them in a page or post.

packages/web-component/wordpress-plugin/read-along-web-app-loader/read-along-web-app-loader.php

@@ -0,0 +1,107 @@
+<?php
+
+/**
+ * This plugin loads the scripts and styles for a read along component
+ *
+ * @link https://github.com/ReadAlongs/
+ * @since 1.0.0
+ *
+ * @package Read_Along_Web_App_Loader
+ *
+ * @wordpress-plugin
+ * Plugin Name:       Read-Along Web App Loader
+ * Plugin URI:        https://github.com/ReadAlongs/Studio-Web/
+ * Description:       This plugin loads the script and styles needed to activate the &lt;read-along&gt; tag in a Word Press site
+ * Version:           1.5.0
+ * Author:            Delasie Torkornoo
+ * License:           MIT
+ * License URI:       https://github.com/ReadAlongs/Studio-Web/blob/main/LICENSE
+
+ */
+
+// If this file is called directly, abort.
+if (!defined("WPINC")) {
+  die();
+}
+/**
+ * Currently plugin version.
+ */
+define("Read_Along_Web_App_Loader_VERSION", "1.5.0");
+define("Read_Along_Web_App_VERSION", "1.5.x");
+class ReadAlongWebAppLoader
+{
+  /**
+   * This function handles the activation of the code
+   * The [read_along_web_app_loader version=""] short code
+   * Accepts version of read-along generated
+   */
+
+  public static function short_code($attrs = [], $content = null, $tag = "")
+  {
+    $output = "";
+    // normalize attribute keys, lowercase
+    $attrs = array_change_key_case((array) $attrs, CASE_LOWER);
+    $attributes = shortcode_atts(
+      [
+        "version" => Read_Along_Web_App_VERSION,
+      ],
+      $attrs,
+      $tag
+    );
+
+    if (!is_null($content)) {
+      $output = apply_filters("the_content", $content);
+    }
+
+    $src = sprintf(
+      "https://unpkg.com/@readalongs/web-component@%s/dist/web-component/web-component.esm.js",
+      $attributes["version"]
+    );
+    //script source code https://github.com/ReadAlongs/Studio-Web/
+    wp_enqueue_script_module(
+      "read_along_web_component_script",
+      $src,
+      [],
+      Read_Along_Web_App_VERSION
+    );
+    return $output;
+  }
+  /**
+   * Register read-along formats
+   */
+  public static function supported_format($mimes = [])
+  {
+    //add key for read along format
+    $mimes["readalong"] = "text/xml";
+    //add other supported audio formats
+    $mimes["m4a"] = "audio/mp4";
+    $mimes["wav"] = "audio/wav";
+
+    return $mimes;
+  }
+  /**
+   * add the shortcode
+   *
+   */
+
+  public static function init()
+  {
+    if (!shortcode_exists("read_along_web_app_loader")) {
+      add_shortcode("read_along_web_app_loader", [
+        get_called_class(),
+        "short_code",
+      ]);
+    }
+  }
+  /**
+   * Begins execution of the plugin.
+   *
+   * @since    1.0.0
+   */
+  public static function run()
+  {
+    add_action("init", [get_called_class(), "init"], 11); //hook to the init
+  }
+}
+add_filter("upload_mimes", ["ReadAlongWebAppLoader", "supported_format"]); //add supported formats
+ReadAlongWebAppLoader::run(); //run the plugin

packages/web-component/wordpress-plugin/read-along-web-app-loader/readme.txt

@@ -1,26 +1,28 @@
 === ReadAlong Web App Loader ===
 Contributors: deltork
 Tags: read-along, read along, web app loading
-Requires at least: 4.7
+Requires at least: 6.5.0
 Tested up to: 6.5.2
-Stable tag: 1.0.0
+Stable tag: 1.4.0
 Requires PHP: 7.0
 License: MIT
-License URI: https://github.com/ReadAlongs/Studio-Web/blob/main/LICENSE
+License https://github.com/ReadAlongs/Studio-Web/blob/main/LICENSE
 
-This WordPress plugin allows the deployment and activation of Read-Alongs generated using https://github.com/ReadAlongs/ on WordPress sites.
+This WordPress plugin allows the deployment and activation of a Read-Along generated using https://github.com/ReadAlongs/ on WordPress sites.
 
 
 == Description ==
 
-This WordPress plugin allows the deployment and activation of Read-Alongs generated using https://github.com/ReadAlongs/ on WordPress sites. Just wrap your `<read-along>` in a WordPress shortcode `[read_along_web_app_loader]`. The plugin does not load the script on all pages on your site; it will only add the script to the pages with the shortcode.
-The shortcode accepts two optional attributes:
- - The `src` attribute for users with custom scripts; defaults to unpkg.com
- - The `version` attribute for which version on unpkg.com defaults; to the latest
+This plugin is a free service (no account required) for activating the &lt;read-along&gt; tag in a WordPress site. The source code of the scripts used to activate the  &lt;read-along&gt; tag is https://github.com/ReadAlongs/Studio-Web/.
+This plugin will help you deploy and activate a Read-Along generated using **Studio-Web** or **Studio-CLI** from https://github.com/ReadAlongs/ on your WordPress site.
+Please copy and paste the HTML code from the WordPress deployment section of the readme.txt generated by our studio application. Alternatively, just wrap your `<read-along>` in a WordPress shortcode `[read_along_web_app_loader]`.
+
+The shortcode accepts one optional attribute:
+ - The `version` attribute for which version of the read-along web app to use
 
 == Frequently Asked Questions ==
 
-= How to get the code required for my read along =
+= How to get the code required for my read-along =
 
 Copy the code from the WordPress deployment section of the readme.txt
 
@@ -30,15 +32,23 @@ There are two ways to generate a read-along. The online web app (download the we
 
 == Screenshots ==
 
-1. Configure read-along web app component in your WordPress classic editor
-2. Sample read-along book 
-3. Configure read-along web app component in your WordPress block editor
+1. Configure the read-along web app component in your WordPress classic editor
+2. Sample read-along book
+3. Configure the read-along web app component in your WordPress block editor
 
 == Changelog ==
-
+= 1.5.0=
+* default read-along app version bumped to 1.5.0
+= 1.4.0=
+* default read-along app version bumped to 1.4.0
+= 1.3.2 =
+* Code updates
 = 1.0.0 =
 * Initial Release
 
-
-
 == Upgrade Notice ==
+= 1.3.2 =
+Bumped default read-along app version to 1.3.0
+
+== Contributing ==
+The ReadAlong is an open-source project. You can make a Pull-Request to our repo at https://github.com/ReadAlongs/Studio-Web/