From 526c87b61e6a6aa02916ad7356da01606c7c86d2 Mon Sep 17 00:00:00 2001
From: Brett Zamir <brettz9@yahoo.com>
Date: Wed, 26 Sep 2018 12:38:00 +0800
Subject: [PATCH] - Further work on openclipart (use qr-manipulation)

---
 editor/extensions/imagelib/openclipart.js | 18 +++++++++---------
 package-lock.json                         | 12 ++++++++++++
 package.json                              |  2 ++
 3 files changed, 23 insertions(+), 9 deletions(-)

diff --git a/editor/extensions/imagelib/openclipart.js b/editor/extensions/imagelib/openclipart.js
index 95dd14ae..1cc77ccc 100644
--- a/editor/extensions/imagelib/openclipart.js
+++ b/editor/extensions/imagelib/openclipart.js
@@ -1,4 +1,8 @@
-import {jml, $, body} from '../../external/jamilih/jml-es.js';
+import {jml, body} from '../../external/jamilih/jml-es.js';
+
+import $ from '../../../node_modules/query-result/esm/index.js';
+import {manipulation} from '../../../node_modules/qr-manipulation/dist/index-es.js';
+manipulation($, jml);
 
 jml('div', [
   ['style', [
@@ -16,15 +20,11 @@ jml('div', [
     $custom: {
       async $submit () {
         console.log('submit2');
-        const results = $('#results');
-        while (results.hasChildNodes()) {
-          results.firstChild.remove();
-        }
         const url = new URL('https://openclipart.org/search/json/');
         [
           'query', 'sort', 'amount', 'page'
         ].forEach((prop) => {
-          const {value} = $('#' + prop);
+          const {value} = $('#' + prop)[0];
           url.searchParams.set(prop, value);
         });
         const r = await fetch(url);
@@ -41,8 +41,8 @@ jml('div', [
           current_page: currentPage
         }} = json;
 
-        // $('#page').value = currentPage;
-        // $('#page').max = pages;
+        // $('#page')[0].value = currentPage;
+        // $('#page')[0].max = pages;
 
         function queryLink (uploader) {
           return ['a', {
@@ -64,7 +64,7 @@ jml('div', [
         //    }` object of relevance?
         // - No need for `tags` with `tags_array`
         // - `svg`'s: `png_thumb`, `png_full_lossy`, `png_2400px`
-        jml(results, [
+        $('#results').htmlJML([
           ['span', [
             'Number of results: ',
             numResults
diff --git a/package-lock.json b/package-lock.json
index b37bb04b..0be6acb7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5586,12 +5586,24 @@
       "integrity": "sha1-fjL3W0E4EpHQRhHxvxQQmsAGUdc=",
       "dev": true
     },
+    "qr-manipulation": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/qr-manipulation/-/qr-manipulation-0.6.1.tgz",
+      "integrity": "sha512-H6xACEWInMrv7AiKSH5xqCEO7opn9WGBe14jAreHu3vqjJpgEcBOYfsR2H45sFlXuWcPMz1gphaHhax/6yMAVQ==",
+      "dev": true
+    },
     "qs": {
       "version": "6.5.2",
       "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.2.tgz",
       "integrity": "sha512-N5ZAX4/LxJmF+7wN74pUD6qAh9/wnvdQcjq9TZjevvXzSUo7bfmw91saqMjzGS2xq91/odN2dW/WOl7qQHNDGA==",
       "dev": true
     },
+    "query-result": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/query-result/-/query-result-0.2.0.tgz",
+      "integrity": "sha512-IYS3H3bctALxk93tgZP7GOSRdsUr/o5rOzzFqZOohX5WNQ3XMQn+pkC7vyVA6bBwDOG0M1mKy8MVhIDkwBS67w==",
+      "dev": true
+    },
     "qunit": {
       "version": "2.6.2",
       "resolved": "https://registry.npmjs.org/qunit/-/qunit-2.6.2.tgz",
diff --git a/package.json b/package.json
index 2492820e..a8985d05 100644
--- a/package.json
+++ b/package.json
@@ -73,6 +73,8 @@
     "node-static": "^0.7.11",
     "opn-cli": "^3.1.0",
     "promise-fs": "^1.3.0",
+    "qr-manipulation": "^0.6.1",
+    "query-result": "^0.2.0",
     "qunit": "^2.6.2",
     "rollup": "0.66.2",
     "rollup-plugin-babel": "^3.0.7",