mirror of
https://github.com/galaxyproject/galaxy.git
synced 2026-11-02 19:52:14 +08:00
Migrate phylocanvas to script tag
This commit is contained in:
+1
-2
@@ -30,13 +30,12 @@ const STATIC_PLUGIN_BUILD_IDS = [
|
||||
"nvd3/nvd3_bar",
|
||||
"openseadragon",
|
||||
"PCA_3Dplot",
|
||||
"phylocanvas",
|
||||
"pv",
|
||||
"scatterplot",
|
||||
"tiffviewer",
|
||||
"ts_visjs",
|
||||
];
|
||||
const INSTALL_PLUGIN_BUILD_IDS = ["cytoscape", "ngl", "msa", "openlayers", "venn", "vizarr"]; // todo: derive from XML
|
||||
const INSTALL_PLUGIN_BUILD_IDS = ["cytoscape", "ngl", "msa", "openlayers", "phylocanvas", "venn", "vizarr"]; // todo: derive from XML
|
||||
const DIST_PLUGIN_BUILD_IDS = ["new_user"];
|
||||
const PLUGIN_BUILD_IDS = Array.prototype.concat(DIST_PLUGIN_BUILD_IDS, STATIC_PLUGIN_BUILD_IDS);
|
||||
|
||||
|
||||
@@ -13,7 +13,10 @@
|
||||
<params>
|
||||
<param type="dataset" var_name_in_template="hda" required="true">dataset_id</param>
|
||||
</params>
|
||||
<entry_point entry_point_type="chart" src="script.js"/>
|
||||
<requirements>
|
||||
<requirement type="npm" version="0.0.2" package="@galaxyproject/phylocanvas"/>
|
||||
</requirements>
|
||||
<entry_point entry_point_type="script" src="dist/index.js" css="dist/index.css" />
|
||||
<settings>
|
||||
<input>
|
||||
<label>Tree types</label>
|
||||
@@ -45,78 +48,6 @@
|
||||
</data>
|
||||
</data>
|
||||
</input>
|
||||
<input>
|
||||
<name>edge_color</name>
|
||||
<label>Select a color for the tree</label>
|
||||
<type>color</type>
|
||||
<value>#222222</value>
|
||||
</input>
|
||||
<input>
|
||||
<name>highlighted_color</name>
|
||||
<label>Select a color for the highlighted branch of tree</label>
|
||||
<type>color</type>
|
||||
<value>#548DB8</value>
|
||||
</input>
|
||||
<input>
|
||||
<name>node_color</name>
|
||||
<label>Select a color for the nodes of the tree</label>
|
||||
<type>color</type>
|
||||
<value>#333333</value>
|
||||
</input>
|
||||
<input>
|
||||
<label>Show/Hide labels</label>
|
||||
<name>show_labels</name>
|
||||
<help>Select false to hide labels.</help>
|
||||
<type>select</type>
|
||||
<display>radio</display>
|
||||
<value>true</value>
|
||||
<data>
|
||||
<data>
|
||||
<label>True</label>
|
||||
<value>true</value>
|
||||
</data>
|
||||
<data>
|
||||
<label>False</label>
|
||||
<value>false</value>
|
||||
</data>
|
||||
</data>
|
||||
</input>
|
||||
<input>
|
||||
<label>Align labels</label>
|
||||
<name>align_labels</name>
|
||||
<help>Select to align the labels of tree. Supported with rectangular, circular, and hierarchical tree types.</help>
|
||||
<type>select</type>
|
||||
<display>radio</display>
|
||||
<value>true</value>
|
||||
<data>
|
||||
<data>
|
||||
<label>True</label>
|
||||
<value>true</value>
|
||||
</data>
|
||||
<data>
|
||||
<label>False</label>
|
||||
<value>false</value>
|
||||
</data>
|
||||
</data>
|
||||
</input>
|
||||
<input>
|
||||
<label>Show bootstrap confidence values</label>
|
||||
<name>show_bootstrap</name>
|
||||
<help>Select true to show bootstrap confidence values.</help>
|
||||
<type>select</type>
|
||||
<display>radio</display>
|
||||
<value>false</value>
|
||||
<data>
|
||||
<data>
|
||||
<label>True</label>
|
||||
<value>true</value>
|
||||
</data>
|
||||
<data>
|
||||
<label>False</label>
|
||||
<value>false</value>
|
||||
</data>
|
||||
</data>
|
||||
</input>
|
||||
<input>
|
||||
<label>Node shapes for leaves</label>
|
||||
<name>node_shape</name>
|
||||
@@ -143,5 +74,37 @@
|
||||
</data>
|
||||
</data>
|
||||
</input>
|
||||
<input>
|
||||
<name>edge_color</name>
|
||||
<label>Select a color for the tree</label>
|
||||
<type>color</type>
|
||||
<value>#222222</value>
|
||||
</input>
|
||||
<input>
|
||||
<name>highlighted_color</name>
|
||||
<label>Select a color for the highlighted branch of tree</label>
|
||||
<type>color</type>
|
||||
<value>#548DB8</value>
|
||||
</input>
|
||||
<input>
|
||||
<name>node_color</name>
|
||||
<label>Select a color for the nodes of the tree</label>
|
||||
<type>color</type>
|
||||
<value>#333333</value>
|
||||
</input>
|
||||
<input>
|
||||
<label>Show labels</label>
|
||||
<name>show_labels</name>
|
||||
<help>Select false to hide labels.</help>
|
||||
<type>boolean</type>
|
||||
<value>true</value>
|
||||
</input>
|
||||
<input>
|
||||
<label>Align labels</label>
|
||||
<name>align_labels</name>
|
||||
<help>Select to align the labels of tree. Supported with rectangular, circular, and hierarchical tree types.</help>
|
||||
<type>boolean</type>
|
||||
<value>false</value>
|
||||
</input>
|
||||
</settings>
|
||||
</visualization>
|
||||
|
||||
@@ -1,22 +0,0 @@
|
||||
{
|
||||
"name": "visualization",
|
||||
"version": "0.1.0",
|
||||
"keywords": [
|
||||
"galaxy",
|
||||
"visualization"
|
||||
],
|
||||
"license": "AFL-3.0",
|
||||
"dependencies": {
|
||||
"@phylocanvas/phylocanvas.gl": "^1.48.0",
|
||||
"babel-preset-env": "^1.6.1",
|
||||
"deck.gl": "^8.8.23"
|
||||
},
|
||||
"scripts": {
|
||||
"build": "parcel build src/script.js --dist-dir static"
|
||||
},
|
||||
"devDependencies": {
|
||||
"buffer": "^6.0.3",
|
||||
"parcel": "^2.12.0",
|
||||
"process": "^0.11.10"
|
||||
}
|
||||
}
|
||||
@@ -1,48 +0,0 @@
|
||||
import * as phylocanvas from "@phylocanvas/phylocanvas.gl";
|
||||
|
||||
/* This will be part of the charts/viz standard lib in 23.1 */
|
||||
const slashCleanup = /(\/)+/g;
|
||||
function prefixedDownloadUrl(root, path) {
|
||||
return `${root}/${path}`.replace(slashCleanup, "/");
|
||||
}
|
||||
window.bundleEntries = window.bundleEntries || {};
|
||||
window.bundleEntries.load = function (options) {
|
||||
const chart = options.chart;
|
||||
const dataset = options.dataset;
|
||||
const settings = options.chart.settings;
|
||||
fetch(prefixedDownloadUrl(options.root, dataset.download_url)).then((response) => {
|
||||
if (response.ok) {
|
||||
response.text().then((content) => {
|
||||
const container = document.getElementById(options.target);
|
||||
const tree = new phylocanvas.PhylocanvasGL(
|
||||
container,
|
||||
{
|
||||
source: content,
|
||||
showLabels: settings.get("show_labels") === "true" ? true : false,
|
||||
showLeafLabels: settings.get("show_labels") === "true" ? true : false,
|
||||
interactive: true,
|
||||
nodeShape: settings.get("node_shape"),
|
||||
type: settings.get("tree_type"),
|
||||
alignLabels: settings.get("align_labels") === "true" ? true : false,
|
||||
strokeColour: settings.get("edge_color"),
|
||||
highlightColour: settings.get("highlighted_color"),
|
||||
fillColour: settings.get("node_color"),
|
||||
showInternalNodeLabels: settings.get("show_bootstrap") === "true" ? true : false,
|
||||
},
|
||||
[phylocanvas.plugins.scalebar]
|
||||
);
|
||||
|
||||
tree.resize(container.parentElement.clientWidth, container.parentElement.clientHeight);
|
||||
chart.state("ok", "Done.");
|
||||
options.process.resolve();
|
||||
// resize tree on window resize
|
||||
window.addEventListener("resize", () => {
|
||||
tree.resize(container.parentElement.clientWidth, container.parentElement.clientHeight);
|
||||
});
|
||||
});
|
||||
} else {
|
||||
chart.state("failed", "Failed to access dataset.");
|
||||
options.process.resolve();
|
||||
}
|
||||
});
|
||||
};
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 7.8 KiB |
Reference in New Issue
Block a user