Adds API endpoint for $ref support

feat(PathProcessorPatterns)

Author: cybtachyon

js/patternkit.jsoneditor.js

@@ -0,0 +1,112 @@
+/**
+ * @file
+ * Provides Twig Pattern Library Editing Functionality.
+ *
+ * @external Drupal
+ *
+ * @external jQuery
+ *
+ * @external JSONEditor
+ */
+
+(function ($, Drupal) {
+  Drupal.behaviors.patternkitEditor = {
+    attach: function (context, settings) {
+      var $target = $('#editor-shadow-injection-target', context);
+      $target.once('patternkit-editor').each(function () {
+        var shadow = this.attachShadow({mode: 'open'});
+        shadow.innerHTML = '<link rel="stylesheet" id="theme_stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css"><link rel="stylesheet" id="icon_stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.0.3/css/font-awesome.css"><div id="editor_holder"></div>';
+
+        var data = {};
+        data.schema = JSON.parse(drupalSettings.patternkitEditor.schemaJson);
+        data.starting = JSON.parse(drupalSettings.patternkitEditor.startingJson);
+
+        if (data.starting !== null) {
+          JSONEditor.defaults.options.startval = data.starting;
+        }
+
+        // Override how references are resolved.
+        JSONEditor.prototype._loadExternalRefs = function (schema, callback) {
+          var self = this;
+          var refs = this._getExternalRefs(schema);
+
+          var done = 0, waiting = 0, callback_fired = false;
+
+          $.each(refs, function (url) {
+            if (self.refs[url]) {
+              return;
+            }
+            if (!self.options.ajax) {
+              throw "Must set ajax option to true to load external ref " + url;
+            }
+            self.refs[url] = 'loading';
+            waiting++;
+
+            var r = new XMLHttpRequest();
+            var uri = drupalSettings.path.baseUrl + url + '/schema';
+
+            r.open("GET", uri, true);
+            r.onreadystatechange = function () {
+              if (r.readyState !== 4) {
+                return;
+              }
+              // Request succeeded.
+              if (r.status === 200) {
+                var response;
+                try {
+                  response = JSON.parse(r.responseText);
+                }
+                catch (e) {
+                  window.console.log(e);
+                  throw "Failed to parse external ref " + url;
+                }
+                if (!response || typeof response !== "object") {
+                  throw "External ref does not contain a valid schema - " + url;
+                }
+
+                self.refs[url] = response;
+                self._loadExternalRefs(response,function () {
+                  done++;
+                  if (done >= waiting && !callback_fired) {
+                    callback_fired = true;
+                    callback();
+                  }
+                });
+              }
+              // Request failed.
+              else {
+                window.console.log(r);
+                throw "Failed to fetch ref via ajax- " + url;
+              }
+            };
+            r.send();
+          });
+
+          if (!waiting) {
+            callback();
+          }
+        };
+
+        // Initialize the editor with a JSON schema.
+        var editor = new JSONEditor(
+          $target[0].shadowRoot.getElementById('editor_holder'), {
+            schema:            data.schema,
+            theme:             'bootstrap3',
+            iconlib:           'fontawesome4',
+            keep_oneof_values: false,
+            disable_edit_json: true,
+            disable_collapse:  true,
+            ajax:              true,
+            refs: { }
+          }
+        );
+        JSONEditor.plugins.sceditor.emoticonsEnabled = false;
+
+        editor.on('change', function () {
+          document.getElementById('schema_instance_config').value = JSON.stringify(editor.getValue());
+
+        });
+      });
+    }
+  };
+})(jQuery, Drupal);

patternkit.libraries.yml

@@ -2,7 +2,7 @@ patternkit.editor:
   version: VERSION
   js:
     js/jsoneditor.min.js: {minified: true}
-    js/twigeditor.js: {}
+    js/patternkit.jsoneditor.js: {}
   dependencies:
     - core/drupalSettings
     - core/jquery

patternkit.routing.yml

@@ -23,12 +23,14 @@ patternkit.add_page:
     _admin_route: TRUE
   requirements:
     _permission: 'administer blocks'
-patternkit.api.schema:
-  path: 'api/patternkit/{library}/{pattern}/schema'
+patternkit.api:
+  path: '/api/patternkit'
   defaults:
-    _controller: '\Drupal\patternkit\Controller\PatternkitController::apiPatternSchema'
+    _controller: '\Drupal\patternkit\Controller\PatternkitController::apiPattern'
+  requirements:
+    _access: 'TRUE'
 patternkit.settings:
-  path: 'admin/config/user-interface/patternkit'
+  path: '/admin/config/user-interface/patternkit'
   defaults:
     _form: '\Drupal\patternkit\Form\PatternkitSettingsForm'
     _title: 'Patternkit settings'

patternkit.services.yml

@@ -2,6 +2,10 @@ services:
   logger.channel.patternkit:
     parent: logger.channel_base
     arguments: ['patternkit']
+  path_processor.patterns:
+    class: Drupal\patternkit\PathProcessor\PathProcessorPatterns
+    tags:
+      - { name: path_processor_inbound, priority: 200 }
   patternkit.library.discovery:
     class: Drupal\patternkit\PatternkitLibraryDiscovery
     arguments: ['@patternkit.library.discovery.collector']

src/Controller/PatternkitController.php

@@ -10,9 +10,12 @@
 use Drupal\Core\Url;
 use Drupal\patternkit\Pattern;
 use Exception;
+use RuntimeException;
+use function str_replace;
 use Symfony\Component\DependencyInjection\ContainerInterface;
 use Symfony\Component\HttpFoundation\JsonResponse;
 use Symfony\Component\HttpFoundation\Request;
+use Symfony\Component\HttpFoundation\Response;
 
 /**
  * Controller routines for block example routes.
@@ -153,17 +156,53 @@ public function addForm($pattern_id, Request $request): array {
   /**
    * Returns the JSON-encoded Patternkit schema for the provided pattern.
    *
-   * @param string $library
-   *   The name of the pattern library to search.
+   * @param \Symfony\Component\HttpFoundation\Request $request
+   *   The request object.
+   * @param string $pattern
+   *   The name of the pattern to use for retrieving the schema.
+   *
+   * @return \Symfony\Component\HttpFoundation\Response
+   *   The schema response.
+   */
+  public function apiPattern(Request $request, $pattern = NULL): Response {
+    $pattern = $request->query->get('pattern') ?? $pattern;
+    if (!$pattern) {
+      return new Response();
+    }
+    $test_len = strlen('/schema');
+    if (substr_compare($pattern, '/schema', strlen($pattern) - $test_len, $test_len) === 0) {
+      return $this->apiPatternSchema(substr($pattern, 0, -$test_len));
+    }
+    $asset_id = str_replace('/', '.', $pattern);
+    try {
+      $response = $this->libraryDiscovery->getLibraryAsset($asset_id);
+      if ($response === NULL) {
+        throw new RuntimeException("Unable to locate $pattern.");
+      }
+    }
+    catch (Exception $exception) {
+      $response = ['error' => $exception->getMessage()];
+    }
+    return new JsonResponse($response);
+  }
+
+  /**
+   * Returns the JSON-encoded Patternkit schema for the provided pattern.
+   *
    * @param string $pattern
    *   The name of the pattern to use for retrieving the schema.
    *
    * @return \Symfony\Component\HttpFoundation\JsonResponse
    *   The schema response.
    */
-  public function apiPatternSchema($library, $pattern): JsonResponse {
+  public function apiPatternSchema($pattern): JsonResponse {
+    $asset_id = str_replace('/', '.', $pattern);
     try {
-      $response = $this->libraryDiscovery->getLibraryAsset("$library.$pattern");
+      $pattern_asset = $this->libraryDiscovery->getLibraryAsset($asset_id);
+      if ($pattern_asset === NULL) {
+        throw new RuntimeException("Unable to locate $pattern.");
+      }
+      $response = $pattern_asset->schema ?? [];
     }
     catch (Exception $exception) {
       $response = ['error' => $exception->getMessage()];

src/PathProcessor/PathProcessorPatterns.php

@@ -0,0 +1,30 @@
+<?php
+
+namespace Drupal\patternkit\PathProcessor;
+
+use Drupal\Core\PathProcessor\InboundPathProcessorInterface;
+use Symfony\Component\HttpFoundation\Request;
+
+/**
+ * Defines a path processor to rewrite pattern URLs.
+ *
+ * As the route system does not allow arbitrary amount of parameters convert
+ * the pattern path to a query parameter on the request.
+ */
+class PathProcessorPatterns implements InboundPathProcessorInterface {
+
+  /**
+   * {@inheritdoc}
+   */
+  public function processInbound($path, Request $request): string {
+    if (strpos($path, '/api/patternkit') === 0
+      && !$request->query->has('pattern')) {
+
+      $pattern_path = preg_replace('|^\/api\/patternkit\/|', '', $path);
+      $request->query->set('pattern', $pattern_path);
+      return '/api/patternkit';
+    }
+    return $path;
+  }
+
+}

src/Pattern.php

@@ -2,9 +2,6 @@
 
 namespace Drupal\patternkit;
 
-use function is_string;
-use function PHPSTORM_META\type;
-
 /**
  * A collection of a JSON schema and renderable markup.
  *
@@ -59,7 +56,9 @@ class Pattern {
   /**
    * The configuration object containing token data.
    *
-   * @var object
+   * This only exists once a pattern has been configured.
+   *
+   * @var object|array
    */
   public $config;
 
@@ -78,7 +77,7 @@ class Pattern {
   public $body;
 
   /**
-   * The pattern template file.
+   * The filesystem pattern template file path relative to the library.
    *
    * @var string
    */
@@ -91,10 +90,19 @@ class Pattern {
    */
   public $html;
 
+  /**
+   * The library path to the pattern root directory.
+   *
+   * @var string
+   *
+   * @code 'atoms/example/src/' @endcode
+   */
+  public $path;
+
   /**
    * The JSON Schema for the pattern.
    *
-   * @var object
+   * @var object|array
    */
   public $schema;
 
@@ -117,6 +125,8 @@ class Pattern {
   /**
    * The API URL for the pattern.
    *
+   * In Twig libraries this is often the namespace.
+   *
    * @var string
    */
   public $url;

src/PatternLibraryCollector.php

@@ -15,6 +15,7 @@
 use Drupal\Core\Serialization\Yaml;
 use Drupal\Core\Theme\ThemeManagerInterface;
 use Drupal\patternkit\Form\PatternkitSettingsForm;
+use function str_replace;
 use Symfony\Component\DependencyInjection\ContainerInterface;
 use Drupal\Core\Cache\CacheCollector;
 use Drupal\Core\Lock\LockBackendInterface;
@@ -442,13 +443,13 @@ protected function getLibraryMetadata(): array {
             $plugin_id = $info['plugin'] ?? 'twig';
             /** @var \Drupal\patternkit\PatternLibraryPluginInterface $plugin */
             $plugin = $this->libraryPluginManager->createInstance($plugin_id);
+            $metadata[$library_name]['name'] = $library_name;
             $metadata[$library_name] += $info;
             /** @var \Drupal\patternkit\Pattern $pattern */
-            foreach ($plugin->getMetadata($extension, $library_name, $info['data']) as $pattern) {
-              $pattern_id = $pattern->getId();
-              $category = $pattern->category;
+            foreach ($plugin->getMetadata($extension, $metadata[$library_name], $info['data']) as $pattern_path => $pattern) {
               $pattern->setLibraryPluginId($plugin_id);
-              $metadata[$library_name]['patterns']["$library_name.$category.$pattern_id"] = $pattern;
+              $cache_id = str_replace('/', '.', trim($pattern_path, '@'));
+              $metadata[$library_name]['patterns'][$cache_id] = $pattern;
             }
           }
         }

src/PatternLibraryJSONParserTrait.php

@@ -40,13 +40,11 @@ public static function schemaDereference($properties, array &$metadata) {
       if ($property !== '$ref') {
         continue;
       }
-      $pattern = strstr($value, '.json', TRUE);
-      $ref = substr($value, strlen("$pattern.json"));
-      if (!isset($metadata[$pattern])) {
+      if (!isset($metadata[$value])) {
         unset($properties[$property]);
         continue;
       }
-      $properties[$property] = $metadata[$pattern]->url . $ref;
+      $properties[$property] = 'api/patternkit/' . trim($value, '@');
     }
     return $properties;
   }