From bba1edcaf68c1922fd3ef0f7cf3b7e2505daa04d Mon Sep 17 00:00:00 2001
From: Sophia Atkinson <sophialul@protonmail.com>
Date: Mon, 11 Sep 2023 21:20:05 -0700
Subject: [PATCH] updated Switched cdn to jsdelivr and added noscript

---
 juxtapose.php | 111 +++++++++++++++++++++++++++-----------------------
 1 file changed, 61 insertions(+), 50 deletions(-)

diff --git a/juxtapose.php b/juxtapose.php
index 978c010..de504a6 100644
--- a/juxtapose.php
+++ b/juxtapose.php
@@ -1,72 +1,83 @@
 <?php
 /*
 Plugin Name: Juxtapose
-Plugin URI: http://wordpress.org/plugins/juxtaposejs/
+Plugin URI: https://github.com/fcingolani/wordpress-juxtapose
 Description: Adds a [juxtapose] shortcode to embed Northwestern University Knight Lab's JuxtaposeJS frame comparisons.
 Author: Federico Cingolani
-Version: 1.0
-Author URI: http://fcingolani.com.ar/
+Version: 1.1
+Author URI: https://fcingolani.com.ar/
 */
 
-class Juxtapose {
+class Juxtapose
+{
+    static $shortcode_rendered;
 
-  static $shortcode_rendered;
+    static function initialize()
+    {
+        self::$shortcode_rendered = false;
 
-  static function initialize() {
-    self::$shortcode_rendered = false;
+        add_shortcode("juxtapose", [__CLASS__, "shortcode"]);
 
-    add_shortcode('juxtapose', array(__CLASS__, 'shortcode'));
+        add_action("init", [__CLASS__, "init"]);
+        add_action("wp_footer", [__CLASS__, "wp_footer"]);
+    }
 
-    add_action('init',      array(__CLASS__, 'init'));
-    add_action('wp_footer', array(__CLASS__, 'wp_footer'));
-  }
+    // TODO: Sanitize attributes
+    static function shortcode($atts)
+    {
+        self::$shortcode_rendered = true;
 
-  // TODO: Sanitize attributes
-  static function shortcode( $atts ) {
-    self::$shortcode_rendered = true;
+        wp_enqueue_script("juxtapose");
 
-    wp_enqueue_script('juxtapose');
+        $a = shortcode_atts(
+            [
+                "startingposition" => 50,
+                "showlabels" => true,
+                "showcredits" => true,
+                "animate" => true,
+                "mode" => "horizontal",
 
-    $a = shortcode_atts( array(
-        'startingposition'  => 50,
-        'showlabels'        => true,
-        'showcredits'       => true,
-        'animate'           => true,
-        'mode'              => 'horizontal',
+                "leftsrc" => "",
+                "leftlabel" => "",
+                "leftcredit" => "",
 
-        'leftsrc'           => '',
-        'leftlabel'         => '',
-        'leftcredit'        => '',
+                "rightsrc" => "",
+                "rightlabel" => "",
+                "rightcredit" => "",
+            ],
+            $atts
+        );
 
-        'rightsrc'          => '',
-        'rightlabel'        => '',
-        'rightcredit'       => '',
-    ), $atts );
-
-    return <<<EOT
-<div class="juxtapose" data-startingposition="{$a['startingposition']}" data-showlabels="{$a['showlabels']}" data-showcredits="{$a['showcredits']}" data-animate="{$a['animate']}" data-mode="{$a['mode']}">
-  <img src="{$a['leftsrc']}" data-label="{$a['leftlabel']}" data-credit="{$a['leftcredit']}">
-  <img src="{$a['rightsrc']}" data-label="{$a['rightlabel']}" data-credit="{$a['rightcredit']}">
+        return <<<EOT
+<div class="juxtapose" data-startingposition="{$a["startingposition"]}" data-showlabels="{$a["showlabels"]}" data-showcredits="{$a["showcredits"]}" data-animate="{$a["animate"]}" data-mode="{$a["mode"]}">
+  <img src="{$a["leftsrc"]}" data-label="{$a["leftlabel"]}" data-credit="{$a["leftcredit"]}">
+  <img src="{$a["rightsrc"]}" data-label="{$a["rightlabel"]}" data-credit="{$a["rightcredit"]}">
 </div>
+<noscript><style>.juxtapose{display:none;}</style><h2><strong>JavaScript Is Needed To View This Juxtapose!</strong></h2></noscript>
 EOT;
+    }
 
-  }
-
-  static function init() {
-    wp_register_script( 'juxtapose',  "//s3.amazonaws.com/cdn.knightlab.com/libs/juxtapose/latest/js/juxtapose.js", null, null, true );
-    
-  }
-
-  static function wp_footer() {
-    // Should be using wp_enqueue_style, but it can't be used to add styles to the footer.
-    // Yeah i know, <link> inside <body> is not valid HTML.
-    // But i don't want to load this css when there's not need to.
-    // SUE ME.
-    if(self::$shortcode_rendered){
-      echo '<link rel="stylesheet" href="//s3.amazonaws.com/cdn.knightlab.com/libs/juxtapose/latest/css/juxtapose.css">';
-    }    
-  }
+    static function init()
+    {
+        wp_register_script(
+            "juxtapose",
+            "https://cdn.jsdelivr.net/npm/juxtaposejs/build/js/juxtapose.min.js",
+            null,
+            null,
+            true
+        );
+    }
 
+    static function wp_footer()
+    {
+        // Should be using wp_enqueue_style, but it can't be used to add styles to the footer.
+        // Yeah i know, <link> inside <body> is not valid HTML.
+        // But i don't want to load this css when there's not need to.
+        // SUE ME.
+        if (self::$shortcode_rendered) {
+            echo '<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/juxtaposejs/build/css/juxtapose.min.css">';
+        }
+    }
 }
 
-Juxtapose::initialize();
\ No newline at end of file
+Juxtapose::initialize();