reverting to prev breaking changes

ebi-jdispatcher · Oct 30, 2024 · 8e82ff6 · 8e82ff6
1 parent 11de302
commit 8e82ff6
Show file tree

Hide file tree

Showing 11 changed files with 853 additions and 2,913 deletions.
diff --git a/bin/app.js b/bin/app.js
@@ -35,7 +35,7 @@ if (isNode) {
     };
 }
 // web-component support
-import './visual-output-webcomponent.ts';
-import './functional-predictions-webcomponent.ts';
+import './visual-output-webcomponent';
+import './functional-predictions-webcomponent';
 // demo index page with JobId input form (implemented in TypeScript)
-import './index.ts';
+import '.';
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -44,43 +44,43 @@
     },
     "license": "Apache-2.0",
     "dependencies": {
-        "@types/browser-or-node": "^1.3.2",
-        "@types/figlet": "^1.7.0",
-        "@types/node": "^22.8.1",
-        "@types/node-fetch": "^2.6.11",
-        "@webcomponents/webcomponentsjs": "^2.8.0",
-        "assert": "^2.1.0",
-        "browser-or-node": "^3.0.0",
+        "@types/browser-or-node": "^1.3.0",
+        "@types/fabric": "4.5.11",
+        "@types/figlet": "^1.5.5",
+        "@types/node": "^18.13.0",
+        "@types/node-fetch": "^2.6.2",
+        "@webcomponents/webcomponentsjs": "^2.7.0",
+        "assert": "^2.0.0",
+        "browser-or-node": "^2.1.1",
         "buffer": "^6.0.3",
-        "canvas": "^2.11.2",
-        "chalk": "^5.3.0",
-        "commander": "^12.1.0",
+        "canvas": "^2.11.0",
+        "chalk": "^5.2.0",
+        "commander": "^9.5.0",
         "commonjs": "0.0.1",
-        "fabric": "6.4.3",
-        "figlet": "^1.8.0",
-        "lit": "^3.2.1",
-        "lit-element": "^4.1.1",
-        "lit-html": "^3.2.1",
+        "fabric": "5.2.1",
+        "figlet": "^1.5.2",
+        "lit": "^2.6.1",
+        "lit-element": "^3.2.2",
+        "lit-html": "^2.6.1",
         "mini-svg-data-uri": "^1.4.4",
-        "node-fetch": "^3.3.2",
-        "stream": "^0.0.3",
+        "node-fetch": "^3.3.0",
+        "stream": "^0.0.2",
         "xml-js": "^1.6.11"
     },
     "devDependencies": {
-        "@types/jsdom": "^21.1.7",
-        "@typescript-eslint/eslint-plugin": "^8.11.0",
-        "@typescript-eslint/parser": "^8.11.0",
+        "@typescript-eslint/eslint-plugin": "^5.52.0",
+        "@typescript-eslint/parser": "^5.52.0",
         "clean-webpack-plugin": "^4.0.0",
-        "copy-webpack-plugin": "^12.0.2",
-        "eslint": "^9.13.0",
-        "html-webpack-plugin": "^5.6.3",
+        "copy-webpack-plugin": "^11.0.0",
+        "eslint": "^8.34.0",
+        "html-webpack-plugin": "^5.5.0",
         "node-loader": "^2.0.0",
         "standard-version": "^9.5.0",
-        "ts-loader": "^9.5.1",
-        "typescript": "^5.6.3",
-        "webpack": "^5.95.0",
-        "webpack-cli": "^5.1.4",
-        "webpack-dev-server": "^5.1.0",
+        "ts-loader": "^9.4.2",
+        "typescript": "^4.9.5",
+        "webpack": "^5.75.0",
+        "webpack-cli": "^4.10.0",
+        "webpack-dev-server": "^4.11.1",
         "webpack-node-externals": "^3.0.0"
     }
 }
diff --git a/src/app.ts b/src/app.ts
@@ -45,8 +45,8 @@ if (isNode) {
 }
 
 // web-component support
-import './visual-output-webcomponent.ts';
-import './functional-predictions-webcomponent.ts';
+import './visual-output-webcomponent';
+import './functional-predictions-webcomponent';
 
 // demo index page with JobId input form (implemented in TypeScript)
-import './index.ts';
+import '.';
diff --git a/src/color-schemes.ts b/src/color-schemes.ts
@@ -1,4 +1,4 @@
-import { Gradient, FabricObject } from 'fabric';
+import { fabric } from 'fabric';
 import { ColorType } from './custom-types';
 
 export const defaultGradient: ColorType = {
@@ -10,10 +10,10 @@ export const defaultGradient: ColorType = {
   keys: [0.0, 0.25, 0.5, 0.75, 1.0],
 };
 
-export function colorDefaultGradient(canvasObj: FabricObject, start: number, end: number) {
+export function colorDefaultGradient(canvasObj: fabric.Object, start: number, end: number) {
   canvasObj.set(
     'fill',
-    new Gradient({
+    new fabric.Gradient({
       type: 'linear',
       coords: {
         x1: start,
@@ -41,10 +41,10 @@ export const ncbiBlastGradient: ColorType = {
   keys: [0, 40, 50, 80, 200],
 };
 
-export function colorNcbiBlastGradient(canvasObj: FabricObject, start: number, end: number) {
+export function colorNcbiBlastGradient(canvasObj: fabric.Object, start: number, end: number) {
   canvasObj.set(
     'fill',
-    new Gradient({
+    new fabric.Gradient({
       type: 'linear',
       coords: {
         x1: start,

diff --git a/src/custom-events.ts b/src/custom-events.ts
@@ -1,19 +1,19 @@
-import { FabricObject, Group } from 'fabric';
+import { fabric } from 'fabric';
 import { TextType, RectType, ColorSchemeEnum, RenderOptions } from './custom-types';
 import { VisualOutput } from './visual-output-app';
 import { Hsp, IprMatchFlat } from './data-model';
 import { FunctionalPredictions } from './functional-predictions-app';
 import { drawURLInfoTooltip, drawDomainTooltips, drawDomainInfoTooltips } from './drawing-utilities';
 
 export function mouseOverText(
-  fabricObj: FabricObject,
+  fabricObj: fabric.Object,
   textObj: TextType,
   sequence: string,
   URL: string,
   renderOptions: RenderOptions,
   _this: VisualOutput | FunctionalPredictions
 ) {
-  fabricObj.on('mouseover', (e: any) => {
+  fabricObj.on('mouseover', (e: fabric.IEvent) => {
     if (e.target) {
       e.target.set('hoverCursor', 'pointer');
       e.target.setOptions(textObj);
@@ -27,17 +27,17 @@ export function mouseOverText(
   });
 }
 
-export function mouseDownText(fabricObj: FabricObject, href: string, _this: VisualOutput | FunctionalPredictions) {
-  fabricObj.on('mousedown', (e: any) => {
+export function mouseDownText(fabricObj: fabric.Object, href: string, _this: VisualOutput | FunctionalPredictions) {
+  fabricObj.on('mousedown', (e: fabric.IEvent) => {
     if (e.target) {
       window.open(href, '_blank');
       _this.canvas.renderAll();
     }
   });
 }
 
-export function mouseOutText(fabricObj: FabricObject, textObj: TextType, _this: VisualOutput | FunctionalPredictions) {
-  fabricObj.on('mouseout', (e: any) => {
+export function mouseOutText(fabricObj: fabric.Object, textObj: TextType, _this: VisualOutput | FunctionalPredictions) {
+  fabricObj.on('mouseout', (e: fabric.IEvent) => {
     if (e.target) {
       e.target.setOptions(textObj);
       e.target.setOptions({ underline: false });
@@ -51,7 +51,7 @@ function isHsp(object: any): object is Hsp {
 }
 
 export function mouseOverDomain(
-  fabricObj: FabricObject,
+  fabricObj: fabric.Object,
   startPixels: number,
   endPixels: number,
   seq_from: number,
@@ -60,10 +60,10 @@ export function mouseOverDomain(
   renderOptions: RenderOptions,
   _this: VisualOutput | FunctionalPredictions
 ) {
-  fabricObj.on('mouseover', (e: any) => {
+  fabricObj.on('mouseover', (e: fabric.IEvent) => {
     if (e.target) {
       e.target.set('hoverCursor', 'pointer');
-      let tooltipGroup: Group;
+      let tooltipGroup: fabric.Group;
       if (isHsp(domain)) {
         // Query/Subject tooltip
         tooltipGroup = drawDomainTooltips(
@@ -89,29 +89,28 @@ export function mouseOverDomain(
       }
       _this.canvas.add(tooltipGroup);
       tooltipGroup.set({ visible: true });
-      // FIXME
-      // fabricObj.bringToFront();
-      // tooltipGroup.bringToFront();
+      fabricObj.bringToFront();
+      tooltipGroup.bringToFront();
       _this.canvas.renderAll();
       tooltipGroup.set({ visible: false });
     }
   });
 }
 
-export function mouseOutDomain(fabricObj: FabricObject, _this: VisualOutput | FunctionalPredictions) {
-  fabricObj.on('mouseout', (e: any) => {
+export function mouseOutDomain(fabricObj: fabric.Object, _this: VisualOutput | FunctionalPredictions) {
+  fabricObj.on('mouseout', (e: fabric.IEvent) => {
     if (e.target) {
       _this.canvas.renderAll();
     }
   });
 }
 
 export function mouseOverCheckbox(
-  fabricObj: FabricObject,
+  fabricObj: fabric.Object,
   textObj: TextType,
   _this: VisualOutput | FunctionalPredictions
 ) {
-  fabricObj.on('mouseover', (e: any) => {
+  fabricObj.on('mouseover', (e: fabric.IEvent) => {
     if (e.target) {
       e.target.set('hoverCursor', 'pointer');
       e.target.setOptions(textObj);
@@ -122,11 +121,11 @@ export function mouseOverCheckbox(
 }
 
 export function mouseDownCheckbox(
-  fabricObj: FabricObject,
+  fabricObj: fabric.Object,
   value: ColorSchemeEnum,
   _this: VisualOutput | FunctionalPredictions
 ) {
-  fabricObj.on('mousedown', (e: any) => {
+  fabricObj.on('mousedown', (e: fabric.IEvent) => {
     if (e.target) {
       if (_this.colorScheme != value) {
         _this.colorScheme = value;
@@ -137,12 +136,12 @@ export function mouseDownCheckbox(
 }
 
 export function mouseOutCheckbox(
-  fabricObj: FabricObject,
+  fabricObj: fabric.Object,
   textObj: TextType,
   value: ColorSchemeEnum,
   _this: VisualOutput | FunctionalPredictions
 ) {
-  fabricObj.on('mouseout', (e: any) => {
+  fabricObj.on('mouseout', (e: fabric.IEvent) => {
     if (e.target) {
       e.target.setOptions(textObj);
       if (_this.colorScheme != value) {
@@ -156,12 +155,12 @@ export function mouseOutCheckbox(
 }
 
 export function mouseOverDomainCheckbox(
-  fabricObj: FabricObject,
+  fabricObj: fabric.Object,
   rectObj: RectType,
   currentDomainDatabase: string,
   _this: FunctionalPredictions
 ) {
-  fabricObj.on('mouseover', (e: any) => {
+  fabricObj.on('mouseover', (e: fabric.IEvent) => {
     if (e.target) {
       e.target.set('hoverCursor', 'pointer');
       e.target.setOptions(rectObj);
@@ -185,11 +184,11 @@ export function mouseOverDomainCheckbox(
 }
 
 export function mouseDownDomainCheckbox(
-  fabricObj: FabricObject,
+  fabricObj: fabric.Object,
   currentDomainDatabase: string,
   _this: FunctionalPredictions
 ) {
-  fabricObj.on('mousedown', (e: any) => {
+  fabricObj.on('mousedown', (e: fabric.IEvent) => {
     if (e.target) {
       if (
         !_this.domainDatabaseList.includes(currentDomainDatabase) &&
@@ -211,12 +210,12 @@ export function mouseDownDomainCheckbox(
 }
 
 export function mouseOutDomainCheckbox(
-  fabricObj: FabricObject,
+  fabricObj: fabric.Object,
   rectObj: RectType,
   currentDomainDatabase: string,
   _this: FunctionalPredictions
 ) {
-  fabricObj.on('mouseout', (e: any) => {
+  fabricObj.on('mouseout', (e: fabric.IEvent) => {
     if (e.target) {
       let currentDomainDatabaseDisabled = false;
       if (!_this.uniqueDomainDatabases.includes(currentDomainDatabase)) {