diff --git a/dataset.js b/dataset.js
new file mode 100644
index 0000000000000000000000000000000000000000..7a348bf07cb76511930d35ea5c925932e54c98ec
--- /dev/null
+++ b/dataset.js
@@ -0,0 +1 @@
+const PLUGIN_PATH = "http://localhost/2021/aud_worpress/wp-content/plugins/knowledge-space-wp-plugin/";
\ No newline at end of file
diff --git a/editor/css/editor.css b/editor/css/editor.css
new file mode 100644
index 0000000000000000000000000000000000000000..ea32a7da121b4c0a4c3c191a96f17a4562220278
--- /dev/null
+++ b/editor/css/editor.css
@@ -0,0 +1,15 @@
+div#ks-editor section {
+ border: 1px lightgrey solid;
+ border-radius: 1px;
+ margin: 5px;
+ padding: 2.5px;
+ width: auto;
+}
+
+div#ks-editor section > * {
+ margin: 2.5px;
+}
+
+div#ks-editor *.selected {
+ background-color: lightblue;
+}
diff --git a/editor/editor.html b/editor/editor.html
deleted file mode 100644
index e490ec03ce2072a41cd8b6bddef4a104a8124924..0000000000000000000000000000000000000000
--- a/editor/editor.html
+++ /dev/null
@@ -1,62 +0,0 @@
-<div id="ks-editor">
- <style>
- div#ks-editor section {
- border: 1px lightgrey solid;
- border-radius: 1px;
- margin: 5px;
- padding: 2.5px;
- width: auto;
- }
-
- div#ks-editor section > * {
- margin: 2.5px;
- }
-
- div#ks-editor *.selected {
- background-color: lightblue;
- }
- </style>
-
- <script src="https://unpkg.com/force-graph"></script>
- <!--<script src="../../dist/force-graph.js"></script>-->
-
- <script>
- const PLUGIN_PATH = "%WWW%";
- </script>
-
- <script src="%WWW%editor/js/manageddata.js"></script>
- <script src="%WWW%editor/js/graph.js"></script>
- <script src="%WWW%editor/js/tools/tool.js"></script>
- <script src="%WWW%editor/js/tools/undotool.js"></script>
- <script src="%WWW%editor/js/tools/redotool.js"></script>
- <script src="%WWW%editor/js/tools/selecttool.js"></script>
- <script src="%WWW%editor/js/tools/collecttool.js"></script>
- <script src="%WWW%editor/js/tools/deletetool.js"></script>
- <script src="%WWW%editor/js/tools/addnodetool.js"></script>
- <script src="%WWW%editor/js/tools/connecttool.js"></script>
- <script src="%WWW%editor/js/display.js"></script>
- <script src="%WWW%editor/js/state.js"></script>
- <script src="%WWW%editor/js/editor.js"></script>
-
- <h1>Interface</h1>
- <div id="2d-graph"></div>
- <section id="toolbar"></section>
- <section>
- <h3 id="selected-item">Nothing selected</h3>
- <ul id="selected-params"></ul>
- <button onclick="graph.getCleanData()">Save NOT YET IMPLEMENTED</button>
- <section>
- <h4>Sources</h4>
- <ul id="selected-sources"></ul>
- </section>
- <section>
- <h4>Targets</h4>
- <ul id="selected-targets"></ul>
- </section>
- </section>
- <section>
- <h3>Collected items</h3>
- <ul id="selected-items"></ul>
- <button onclick="state.clearSelectedItems()">Clear</button>
- </section>
-</div>
diff --git a/editor/editor.php b/editor/editor.php
new file mode 100644
index 0000000000000000000000000000000000000000..79f24536eec8f6347a451231fcfd09a14f6e8789
--- /dev/null
+++ b/editor/editor.php
@@ -0,0 +1,26 @@
+<div id="ks-editor">
+ <script src="https://unpkg.com/force-graph"></script>
+ <!--<script src="../../dist/force-graph.js"></script>-->
+
+ <h1>Interface</h1>
+ <div id="2d-graph"></div>
+ <section id="toolbar"></section>
+ <section>
+ <h3 id="selected-item">Nothing selected</h3>
+ <ul id="selected-params"></ul>
+ <button onclick="graph.getCleanData()">Save NOT YET IMPLEMENTED</button>
+ <section>
+ <h4>Sources</h4>
+ <ul id="selected-sources"></ul>
+ </section>
+ <section>
+ <h4>Targets</h4>
+ <ul id="selected-targets"></ul>
+ </section>
+ </section>
+ <section>
+ <h3>Collected items</h3>
+ <ul id="selected-items"></ul>
+ <button onclick="state.clearSelectedItems()">Clear</button>
+ </section>
+</div>
diff --git a/knowledge-space.php b/knowledge-space.php
index 63b8a2e493af2199e7ab07dd7bd03ba8ea9a2934..a620ae4fbc996421d82f9024da1cafd9e3f3ebd3 100644
--- a/knowledge-space.php
+++ b/knowledge-space.php
@@ -33,28 +33,77 @@ function ks_add_graph(): string
$script2 = "<script src='$script_path2'></script>";
$script3 = "<script src='$script_path3'></script>";
$script4 = "<script src='$script_path4'></script>";
+
+
+ return $three . $renderer . $renderer2 . $graph . $div . $variables . $script0 . $script1 . $script2 . $script3 . $script4;
+}
-
- return $three . $renderer .$renderer2 . $graph . $div . $variables . $script0 . $script1 . $script2 .$script3 .$script4;
+function ks_add_editor()
+{
+ ks_add_editor_dependencies();
+ require_once(__DIR__.'/editor/editor.php');
}
-function ks_add_editor(): string
+function ks_add_editor_dependencies()
{
- // Proper, secure script loading in the future
- // Reference https://stackoverflow.com/a/16823761/7376120
- wp_enqueue_script('jquery');
+ wp_enqueue_script('jquery'); // Should be wp_enqueue_script('jquery'), but doesn't work
- $plugin_url = plugin_dir_url(__FILE__);
+ ks_enqueue_script('dataset.js');
+ ks_enqueue_script('editor/js/manageddata.js');
+ ks_enqueue_script('editor/js/graph.js', ["manageddata"]);
+ ks_enqueue_script('editor/js/tools/tool.js');
+ ks_enqueue_script('editor/js/tools/undotool.js', ["tool"]);
+ ks_enqueue_script('editor/js/tools/redotool.js', ["tool"]);
+ ks_enqueue_script('editor/js/tools/selecttool.js', ["tool"]);
+ ks_enqueue_script('editor/js/tools/collecttool.js', ["tool"]);
+ ks_enqueue_script('editor/js/tools/deletetool.js', ["tool"]);
+ ks_enqueue_script('editor/js/tools/addnodetool.js', ["tool"]);
+ ks_enqueue_script('editor/js/tools/connecttool.js', ["tool"]);
+ ks_enqueue_script('editor/js/display.js', []);
+ ks_enqueue_script('editor/js/state.js', ["tool", "display"]);
+ ks_enqueue_script('editor/js/editor.js', ["state", "graph", "dataset"]);
- $raw_html = file_get_contents(__DIR__.DIRECTORY_SEPARATOR."editor".DIRECTORY_SEPARATOR."editor.html");
- $ready_html = str_replace("%WWW%", $plugin_url, $raw_html);
+ ks_enqueue_style('editor/css/editor.css');
+}
- return $ready_html;
+function ks_enqueue_script($relative_path, $dependencies = array())
+{
+ $prefix = "ks";
+ $type = "script";
+ $script_name = end(explode("/", $relative_path));
+ $script_name = explode(".", $script_name)[0];
+
+ for ($i = 0; $i < sizeof($dependencies); $i++) {
+ $dependencies[$i] = $prefix . "-" . $dependencies[$i] . "-" . $type;
+ }
+
+ // Source: https://developer.wordpress.org/reference/functions/wp_enqueue_script/ a comment from Andrija Naglic
+ // $file_version = date("ymd-Gis", filemtime(plugin_dir_path(__FILE__) . $relative_path));
+
+ wp_enqueue_script($prefix . "-" . $script_name . "-" . $type, plugins_url($relative_path, __FILE__), $dependencies, false);
}
-function kg_load_css() {
+function ks_enqueue_style($relative_path, $dependencies = array())
+{
+ $prefix = "ks";
+ $type = "style";
+ $style_name = end(explode("/", $relative_path));
+ $style_name = explode(".", $style_name)[0];
+
+ for ($i = 0; $i < sizeof($dependencies); $i++) {
+ $dependencies[$i] = $prefix . "-" . $dependencies[$i] . "-" . $type;
+ }
+
+ // Source: https://developer.wordpress.org/reference/functions/wp_enqueue_script/ a comment from Andrija Naglic
+ $file_version = date("ymd-Gis", filemtime(plugin_dir_path(__FILE__) . $relative_path));
+
+ wp_enqueue_style($prefix . "-" . $style_name . "-" . $type, plugins_url($relative_path, __FILE__), $dependencies, $file_version);
+}
+
+function kg_load_css()
+{
$plugin_dir = plugin_dir_url(__FILE__);
- wp_enqueue_style('kg-style', $plugin_dir.'kg-style.css');
+ wp_enqueue_style('kg-style', $plugin_dir . 'kg-style.css');
}
add_action('wp_enqueue_scripts', 'kg_load_css');