From 72a5e8d23f8e17fb6cc64327ef6d3ff478535859 Mon Sep 17 00:00:00 2001 From: Chris Pirich Date: Mon, 28 Oct 2019 16:45:45 -0700 Subject: [PATCH 1/2] WIP: export demo content in package --- package.json | 6 +- src/demo/helpers.js | 5 +- src/demo/models/activityIntro.js | 5 +- src/demo/models/loading.js | 2 +- src/demo/models/pond.js | 5 +- src/demo/models/predict.js | 5 +- src/demo/models/train.js | 5 +- src/demo/models/trainingIntro.js | 5 +- src/demo/models/words.js | 2 +- src/demo/renderer.js | 2 +- src/index.js | 6 +- src/utils/fishData.js | 281 ++++++++++++++++++++----------- webpack.config.js | 7 + yarn.lock | 26 ++- 14 files changed, 249 insertions(+), 113 deletions(-) diff --git a/package.json b/package.json index 92a8315a..8dfdfc93 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@code-dot-org/ml-activities", - "version": "0.0.1", + "version": "0.0.2", "description": "", "main": "dist/main.js", "jest": { @@ -19,7 +19,7 @@ }, "repository": { "type": "git", - "url": "git+ssh://git@github.com/code-dot-org/dance-party.git" + "url": "git+ssh://git@github.com/code-dot-org/ml-activities.git" }, "author": "", "license": "Apache-2.0", @@ -45,6 +45,7 @@ "css-loader": "^3.2.0", "eslint": ">=4.18.2", "eslint-plugin-react": "^7.11.0", + "idempotent-babel-polyfill": "6.26.0-1", "jest": "^15.0.0", "jquery": "1.12.1", "jquery-ui": "^1.12.1", @@ -59,6 +60,7 @@ "react-dom": "~15.4.0", "react-test-renderer": "~15.4.0", "style-loader": "^1.0.0", + "url-loader": "^2.2.0", "webpack": "4.19.1", "webpack-cli": "^3.3.6", "webpack-dev-server": "^3.1.4", diff --git a/src/demo/helpers.js b/src/demo/helpers.js index bd6a77cd..7199215a 100644 --- a/src/demo/helpers.js +++ b/src/demo/helpers.js @@ -2,6 +2,7 @@ import {setState} from './state'; import {init as initScene} from './init'; import {Modes} from './constants'; import {FishBodyPart} from '../utils/fishData'; +import underwaterBackground from '../../public/images/underwater-background.png'; export const backgroundPathForMode = mode => { let imgName; @@ -9,7 +10,9 @@ export const backgroundPathForMode = mode => { imgName = 'underwater'; } - return imgName ? backgroundPath(imgName) : null; + // return imgName ? backgroundPath(imgName) : null; + // TODO: fix this + return imgName ? underwaterBackground : null; }; export const backgroundPath = imgName => { diff --git a/src/demo/models/activityIntro.js b/src/demo/models/activityIntro.js index de5af9da..fb23dd17 100644 --- a/src/demo/models/activityIntro.js +++ b/src/demo/models/activityIntro.js @@ -1,7 +1,8 @@ -import 'babel-polyfill'; +import 'idempotent-babel-polyfill'; import {setState} from '../state'; import {Modes} from '../constants'; import {createButton, createImage, createText, toMode} from '../helpers'; +import aiBotClosed from '../../../public/images/ai-bot-closed.png'; export const init = () => { const footerElements = [ @@ -19,7 +20,7 @@ export const init = () => { }), createImage({ id: 'activity-intro-ai-bot', - src: 'images/ai-bot-closed.png' + src: aiBotClosed }) ]; setState({uiElements, footerElements}); diff --git a/src/demo/models/loading.js b/src/demo/models/loading.js index 0e496145..4787c977 100644 --- a/src/demo/models/loading.js +++ b/src/demo/models/loading.js @@ -1,4 +1,4 @@ -import 'babel-polyfill'; +import 'idempotent-babel-polyfill'; import {initRenderer} from '../renderer'; import {setState} from '../state'; import {Modes} from '../constants'; diff --git a/src/demo/models/pond.js b/src/demo/models/pond.js index f3a413fe..0fe9e88e 100644 --- a/src/demo/models/pond.js +++ b/src/demo/models/pond.js @@ -1,4 +1,4 @@ -import 'babel-polyfill'; +import 'idempotent-babel-polyfill'; import _ from 'lodash'; import {setState, getState} from '../state'; import constants, {Modes, ClassType} from '../constants'; @@ -9,12 +9,13 @@ import { randomInt, toMode } from '../helpers'; +import aiBotClosed from '../../../public/images/ai-bot-closed.png'; const headerElements = [createText({id: 'header', text: 'A.I. Results'})]; const staticUiElements = [ createImage({ id: 'pond-ai-bot', - src: 'images/ai-bot-closed.png' + src: aiBotClosed }) ]; const staticFooterElements = [ diff --git a/src/demo/models/predict.js b/src/demo/models/predict.js index 9347e870..b68c73fd 100644 --- a/src/demo/models/predict.js +++ b/src/demo/models/predict.js @@ -1,14 +1,15 @@ -import 'babel-polyfill'; +import 'idempotent-babel-polyfill'; import $ from 'jquery'; import {setState} from '../state'; import {Modes} from '../constants'; import {createButton, createText, createImage, toMode} from '../helpers'; +import aiBotClosed from '../../../public/images/ai-bot-closed.png'; const headerElements = [createText({id: 'header', text: 'A.I. Sorting'})]; const uiElements = [ createImage({ id: 'predict-ai-bot', - src: 'images/ai-bot-closed.png' + src: aiBotClosed }) ]; const footerElements = [ diff --git a/src/demo/models/train.js b/src/demo/models/train.js index c0547d3f..c2f6dede 100644 --- a/src/demo/models/train.js +++ b/src/demo/models/train.js @@ -1,10 +1,11 @@ import $ from 'jquery'; -import 'babel-polyfill'; +import 'idempotent-babel-polyfill'; import {setState, getState} from '../state'; import {Modes, ClassType} from '../constants'; import {createButton, createText, createImage, toMode} from '../helpers'; import SimpleTrainer from '../../utils/SimpleTrainer'; import {generateOcean} from '../../utils/generateOcean'; +import aiBotClosed from '../../../public/images/ai-bot-closed.png'; const staticUiElements = [ createButton({ @@ -19,7 +20,7 @@ const staticUiElements = [ }), createImage({ id: 'training-ai-bot', - src: 'images/ai-bot-closed.png' + src: aiBotClosed }) ]; const headerElements = [createText({id: 'header', text: 'A.I. Training'})]; diff --git a/src/demo/models/trainingIntro.js b/src/demo/models/trainingIntro.js index ef6a7209..d3eb8e83 100644 --- a/src/demo/models/trainingIntro.js +++ b/src/demo/models/trainingIntro.js @@ -1,7 +1,8 @@ -import 'babel-polyfill'; +import 'idempotent-babel-polyfill'; import {getState, setState} from '../state'; import {Modes} from '../constants'; import {createButton, createImage, createText, toMode} from '../helpers'; +import aiBotClosed from '../../../public/images/ai-bot-closed.png'; export const init = () => { const state = getState(); @@ -19,7 +20,7 @@ export const init = () => { }), createImage({ id: 'training-intro-ai-bot', - src: 'images/ai-bot-closed.png' + src: aiBotClosed }) ]; setState({uiElements, footerElements}); diff --git a/src/demo/models/words.js b/src/demo/models/words.js index d5c48817..c630d32c 100644 --- a/src/demo/models/words.js +++ b/src/demo/models/words.js @@ -1,4 +1,4 @@ -import 'babel-polyfill'; +import 'idempotent-babel-polyfill'; import {getState, setState} from '../state'; import {Modes} from '../constants'; import {init as initScene} from '../init'; diff --git a/src/demo/renderer.js b/src/demo/renderer.js index c157e5c7..f56ae861 100644 --- a/src/demo/renderer.js +++ b/src/demo/renderer.js @@ -1,5 +1,5 @@ import $ from 'jquery'; -import 'babel-polyfill'; +import 'idempotent-babel-polyfill'; import _ from 'lodash'; import {getState, setState} from './state'; import constants, {Modes, ClassType} from './constants'; diff --git a/src/index.js b/src/index.js index 98b566e2..7499bb44 100644 --- a/src/index.js +++ b/src/index.js @@ -1 +1,5 @@ -alert('Hello world! -index.jsx'); +export {init as initScene} from './demo/init'; +export {default as constants} from './demo/constants'; +export {Modes} from './demo/constants'; +export * from './demo/state'; +export * from './demo/renderer'; diff --git a/src/utils/fishData.js b/src/utils/fishData.js index f0d321f6..340732d0 100644 --- a/src/utils/fishData.js +++ b/src/utils/fishData.js @@ -1,5 +1,96 @@ import {PropTypes} from 'react'; +import Body_Fish1 from '../../public/images/fish/body/Body_Fish1.png'; +import Body_Fish2 from '../../public/images/fish/body/Body_Fish2.png'; +import Body_Fish3 from '../../public/images/fish/body/Body_Fish3.png'; +import Body_Fish4 from '../../public/images/fish/body/Body_Fish4.png'; +import Body_Fish5 from '../../public/images/fish/body/Body_Fish5.png'; +import Body_Fish6 from '../../public/images/fish/body/Body_Fish6.png'; +import Body_Narrow1 from '../../public/images/fish/body/Body_Narrow1.png'; +import Body_Narrow2 from '../../public/images/fish/body/Body_Narrow2.png'; +import Body_Round1 from '../../public/images/fish/body/Body_Round1.png'; +import Body_Round2 from '../../public/images/fish/body/Body_Round2.png'; +import Body_Sharp1 from '../../public/images/fish/body/Body_Sharp1.png'; +import Body_Sharp2 from '../../public/images/fish/body/Body_Sharp2.png'; +import Body_Spikey1 from '../../public/images/fish/body/Body_Spikey1.png'; +import Body_Spikey2 from '../../public/images/fish/body/Body_Spikey2.png'; +import Body_Square1 from '../../public/images/fish/body/Body_Square1.png'; +import Body_Square2 from '../../public/images/fish/body/Body_Square2.png'; +import Body_Wide1 from '../../public/images/fish/body/Body_Wide1.png'; +import Body_Wide2 from '../../public/images/fish/body/Body_Wide2.png'; + +import Dorsal_Fin_Fish1 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Fish1.png'; +import Dorsal_Fin_Fish2 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Fish2.png'; +import Dorsal_Fin_Fish3 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Fish3.png'; +import Dorsal_Fin_Fish4 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Fish4.png'; +import Dorsal_Fin_Fish6 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Fish6.png'; +import Dorsal_Fin_Narrow1 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Narrow1.png'; +import Dorsal_Fin_Round1 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Round1.png'; +import Dorsal_Fin_Round2 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Round2.png'; +import Dorsal_Fin_Sharp1 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Sharp1.png'; +import Dorsal_Fin_Sharp2 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Sharp2.png'; +import Dorsal_Fin_Spikey1 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Spikey1.png'; +import Dorsal_Fin_Spikey2 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Spikey2.png'; +import Dorsal_Fin_Square1 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Square1.png'; +import Dorsal_Fin_Square2 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Square2.png'; +import Dorsal_Fin_Wide1 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Wide1.png'; +import Dorsal_Fin_Wide2 from '../../public/images/fish/dorsalFin/Dorsal_Fin_Wide2.png'; + +import Pectoral_Fin_Fish2 from '../../public/images/fish/pectoralFin/Pectoral_Fin_Fish2.png'; +import Pectoral_Fin_Fish4 from '../../public/images/fish/pectoralFin/Pectoral_Fin_Fish4.png'; +import Pectoral_Fin_Fish6 from '../../public/images/fish/pectoralFin/Pectoral_Fin_Fish6.png'; +import Pectoral_Fin_Narrow1 from '../../public/images/fish/pectoralFin/Pectoral_Fin_Narrow1.png'; +import Pectoral_Fin_Narrow2 from '../../public/images/fish/pectoralFin/Pectoral_Fin_Narrow2.png'; +import Pectoral_Fin_Round2 from '../../public/images/fish/pectoralFin/Pectoral_Fin_Round2.png'; +import Pectoral_Fin_Sharp1 from '../../public/images/fish/pectoralFin/Pectoral_Fin_Sharp1.png'; +import Pectoral_Fin_Spikey1 from '../../public/images/fish/pectoralFin/Pectoral_Fin_Spikey1.png'; +import Pectoral_Fin_Square2 from '../../public/images/fish/pectoralFin/Pectoral_Fin_Square2.png'; +import Pectoral_Fin_Wide1 from '../../public/images/fish/pectoralFin/Pectoral_Fin_Wide1.png'; + +import Tail_Fin_Fish1 from '../../public/images/fish/tailFin/Tail_Fin_Fish1.png'; +import Tail_Fin_Fish2 from '../../public/images/fish/tailFin/Tail_Fin_Fish2.png'; +import Tail_Fin_Fish3 from '../../public/images/fish/tailFin/Tail_Fin_Fish3.png'; +import Tail_Fin_Fish4 from '../../public/images/fish/tailFin/Tail_Fin_Fish4.png'; +import Tail_Fin_Fish6 from '../../public/images/fish/tailFin/Tail_Fin_Fish6.png'; +import Tail_Fin_Narrow1 from '../../public/images/fish/tailFin/Tail_Fin_Narrow1.png'; +import Tail_Fin_Narrow2 from '../../public/images/fish/tailFin/Tail_Fin_Narrow2.png'; +import Tail_Fin_Round1 from '../../public/images/fish/tailFin/Tail_Fin_Round1.png'; +import Tail_Fin_Sharp1 from '../../public/images/fish/tailFin/Tail_Fin_Sharp1.png'; +import Tail_Fin_Sharp2 from '../../public/images/fish/tailFin/Tail_Fin_Sharp2.png'; +import Tail_Fin_Spikey1 from '../../public/images/fish/tailFin/Tail_Fin_Spikey1.png'; +import Tail_Fin_Square1 from '../../public/images/fish/tailFin/Tail_Fin_Square1.png'; +import Tail_Fin_Square2 from '../../public/images/fish/tailFin/Tail_Fin_Square2.png'; +import Tail_Fin_Wide1 from '../../public/images/fish/tailFin/Tail_Fin_Wide1.png'; +import Tail_Fin_Wide2 from '../../public/images/fish/tailFin/Tail_Fin_Wide2.png'; + +import Eyes_Narrow1 from '../../public/images/fish/eyes/Eyes_Narrow1.png'; +import Eyes_Narrow2 from '../../public/images/fish/eyes/Eyes_Narrow2.png'; +import Eyes_Round1 from '../../public/images/fish/eyes/Eyes_Round1.png'; +import Eyes_Round2 from '../../public/images/fish/eyes/Eyes_Round2.png'; +import Eyes_Sharp1 from '../../public/images/fish/eyes/Eyes_Sharp1.png'; +import Eyes_Sharp2 from '../../public/images/fish/eyes/Eyes_Sharp2.png'; +import Eyes_Spikey1 from '../../public/images/fish/eyes/Eyes_Spikey1.png'; +import Eyes_Spikey2 from '../../public/images/fish/eyes/Eyes_Spikey2.png'; +import Eyes_Square1 from '../../public/images/fish/eyes/Eyes_Square1.png'; +import Eyes_Square2 from '../../public/images/fish/eyes/Eyes_Square2.png'; +import Eyes_Wide1 from '../../public/images/fish/eyes/Eyes_Wide1.png'; +import Eyes_Wide2 from '../../public/images/fish/eyes/Eyes_Wide2.png'; + +import Mouth_Fish2 from '../../public/images/fish/mouth/Mouth_Fish2.png'; +import Mouth_Fish3 from '../../public/images/fish/mouth/Mouth_Fish3.png'; +import Mouth_Fish6 from '../../public/images/fish/mouth/Mouth_Fish6.png'; +import Mouth_Narrow1 from '../../public/images/fish/mouth/Mouth_Narrow1.png'; +import Mouth_Narrow2 from '../../public/images/fish/mouth/Mouth_Narrow2.png'; +import Mouth_Round1 from '../../public/images/fish/mouth/Mouth_Round1.png'; +import Mouth_Round2 from '../../public/images/fish/mouth/Mouth_Round2.png'; +import Mouth_Sharp1 from '../../public/images/fish/mouth/Mouth_Sharp1.png'; +import Mouth_Sharp2 from '../../public/images/fish/mouth/Mouth_Sharp2.png'; +import Mouth_Spikey1 from '../../public/images/fish/mouth/Mouth_Spikey1.png'; +import Mouth_Square1 from '../../public/images/fish/mouth/Mouth_Square1.png'; +import Mouth_Square2 from '../../public/images/fish/mouth/Mouth_Square2.png'; +import Mouth_Wide1 from '../../public/images/fish/mouth/Mouth_Wide1.png'; +import Mouth_Wide2 from '../../public/images/fish/mouth/Mouth_Wide2.png'; + // Describe the different body parts of the fish. The object // is ordered by its render dependency (i.e., dorsalFin should be rendered // before body). @@ -33,7 +124,7 @@ const fishComponents = { // BODY KNN DATA: [area, BodyShape] bodies: { fish6: { - src: 'images/fish/body/Body_Fish6.png', + src: Body_Fish6, anchor: [100, 50], eyeAnchor: [17, 12], mouthAnchor: [20, 40], @@ -45,7 +136,7 @@ const fishComponents = { type: FishBodyPart.BODY }, fish3: { - src: 'images/fish/body/Body_Fish3.png', + src: Body_Fish3, anchor: [100, 50], eyeAnchor: [17, 10], mouthAnchor: [18, 40], @@ -57,7 +148,7 @@ const fishComponents = { type: FishBodyPart.BODY }, fish1: { - src: 'images/fish/body/Body_Fish1.png', + src: Body_Fish1, anchor: [100, 50], eyeAnchor: [10, 15], mouthAnchor: [8, 45], @@ -69,7 +160,7 @@ const fishComponents = { type: FishBodyPart.BODY }, fish2: { - src: 'images/fish/body/Body_Fish2.png', + src: Body_Fish2, anchor: [100, 50], eyeAnchor: [15, 11], mouthAnchor: [12, 41], @@ -81,7 +172,7 @@ const fishComponents = { type: FishBodyPart.BODY }, fish4: { - src: 'images/fish/body/Body_Fish4.png', + src: Body_Fish4, anchor: [80, 50], eyeAnchor: [18, 12], mouthAnchor: [25, 40], @@ -93,7 +184,7 @@ const fishComponents = { type: FishBodyPart.BODY }, wide1: { - src: 'images/fish/body/Body_Wide1.png', + src: Body_Wide1, anchor: [80, 20], eyeAnchor: [17, 17], mouthAnchor: [15, 58], @@ -105,7 +196,7 @@ const fishComponents = { type: FishBodyPart.BODY }, fish5: { - src: 'images/fish/body/Body_Fish5.png', + src: Body_Fish5, anchor: [100, 30], eyeAnchor: [20, 17], mouthAnchor: [10, 57], @@ -117,7 +208,7 @@ const fishComponents = { type: FishBodyPart.BODY }, wide2: { - src: 'images/fish/body/Body_Wide2.png', + src: Body_Wide2, anchor: [80, 20], eyeAnchor: [20, 27], mouthAnchor: [20, 63], @@ -129,7 +220,7 @@ const fishComponents = { type: FishBodyPart.BODY }, square1: { - src: 'images/fish/body/Body_Square1.png', + src: Body_Square1, anchor: [80, 40], eyeAnchor: [9, 17], mouthAnchor: [9, 53], @@ -141,7 +232,7 @@ const fishComponents = { type: FishBodyPart.BODY }, square2: { - src: 'images/fish/body/Body_Square2.png', + src: Body_Square2, anchor: [80, 40], eyeAnchor: [10, 20], mouthAnchor: [10, 63], @@ -153,7 +244,7 @@ const fishComponents = { type: FishBodyPart.BODY }, spikey1: { - src: 'images/fish/body/Body_Spikey1.png', + src: Body_Spikey1, anchor: [80, 40], eyeAnchor: [19, 27], mouthAnchor: [19, 59], @@ -165,7 +256,7 @@ const fishComponents = { type: FishBodyPart.BODY }, spikey2: { - src: 'images/fish/body/Body_Spikey2.png', + src: Body_Spikey2, anchor: [80, 40], eyeAnchor: [21, 21], mouthAnchor: [16, 80], @@ -177,7 +268,7 @@ const fishComponents = { type: FishBodyPart.BODY }, sharp1: { - src: 'images/fish/body/Body_Sharp1.png', + src: Body_Sharp1, anchor: [80, 40], eyeAnchor: [30, 40], mouthAnchor: [30, 70], @@ -189,7 +280,7 @@ const fishComponents = { type: FishBodyPart.BODY }, sharp2: { - src: 'images/fish/body/Body_Sharp2.png', + src: Body_Sharp2, anchor: [80, 40], eyeAnchor: [21, 11], mouthAnchor: [26, 50], @@ -201,7 +292,7 @@ const fishComponents = { type: FishBodyPart.BODY }, round1: { - src: 'images/fish/body/Body_Round1.png', + src: Body_Round1, anchor: [80, 40], eyeAnchor: [16, 10], mouthAnchor: [8, 70], @@ -213,7 +304,7 @@ const fishComponents = { type: FishBodyPart.BODY }, round2: { - src: 'images/fish/body/Body_Round2.png', + src: Body_Round2, anchor: [80, 40], eyeAnchor: [3, 11], mouthAnchor: [5, 40], @@ -225,7 +316,7 @@ const fishComponents = { type: FishBodyPart.BODY }, narrow1: { - src: 'images/fish/body/Body_Narrow1.png', + src: Body_Narrow1, anchor: [80, 40], eyeAnchor: [3, 20], mouthAnchor: [-3, 60], @@ -237,7 +328,7 @@ const fishComponents = { type: FishBodyPart.BODY }, narrow2: { - src: 'images/fish/body/Body_Narrow2.png', + src: Body_Narrow2, anchor: [80, 40], eyeAnchor: [20, 3], mouthAnchor: [20, 28], @@ -252,62 +343,62 @@ const fishComponents = { // EYE KNN DATA: [eye area, eye:pupil ratio] eyes: { narrow1: { - src: 'images/fish/eyes/Eyes_Narrow1.png', + src: Eyes_Narrow1, knnData: [1524, 6.1], type: FishBodyPart.EYE }, narrow2: { - src: 'images/fish/eyes/Eyes_Narrow2.png', + src: Eyes_Narrow2, knnData: [1524, 7.74], type: FishBodyPart.EYE }, round1: { - src: 'images/fish/eyes/Eyes_Round1.png', + src: Eyes_Round1, knnData: [2903, 13.26], type: FishBodyPart.EYE }, round2: { - src: 'images/fish/eyes/Eyes_Round2.png', + src: Eyes_Round2, knnData: [1390, 3.75], type: FishBodyPart.EYE }, sharp1: { - src: 'images/fish/eyes/Eyes_Sharp1.png', + src: Eyes_Sharp1, knnData: [250, 4.24], type: FishBodyPart.EYE }, sharp2: { - src: 'images/fish/eyes/Eyes_Sharp2.png', + src: Eyes_Sharp2, knnData: [638, 6.13], type: FishBodyPart.EYE }, spikey1: { - src: 'images/fish/eyes/Eyes_Spikey1.png', + src: Eyes_Spikey1, knnData: [891, 3.44], type: FishBodyPart.EYE }, spikey2: { - src: 'images/fish/eyes/Eyes_Spikey2.png', + src: Eyes_Spikey2, knnData: [2256, 4.74], type: FishBodyPart.EYE }, square1: { - src: 'images/fish/eyes/Eyes_Square1.png', + src: Eyes_Square1, knnData: [1250, 6.94], type: FishBodyPart.EYE }, square2: { - src: 'images/fish/eyes/Eyes_Square2.png', + src: Eyes_Square2, knnData: [2238, 2.79], type: FishBodyPart.EYE }, wide1: { - src: 'images/fish/eyes/Eyes_Wide1.png', + src: Eyes_Wide1, knnData: [712, 4], type: FishBodyPart.EYE }, wide2: { - src: 'images/fish/eyes/Eyes_Wide2.png', + src: Eyes_Wide2, knnData: [76, 9.5], type: FishBodyPart.EYE } @@ -315,85 +406,85 @@ const fishComponents = { // MOUTH KNN DATA: [numTeeth, ratio of height:width, MouthExpression] mouths: { fish2: { - src: 'images/fish/mouth/Mouth_Fish2.png', + src: Mouth_Fish2, knnData: [0, 1.5, MouthExpression.NEUTRAL], tinted: true, type: FishBodyPart.MOUTH }, fish3: { - src: 'images/fish/mouth/Mouth_Fish3.png', + src: Mouth_Fish3, knnData: [0, 0.76, MouthExpression.NEUTRAL], tinted: true, type: FishBodyPart.MOUTH }, fish6: { - src: 'images/fish/mouth/Mouth_Fish6.png', + src: Mouth_Fish6, knnData: [0, 0.39, MouthExpression.NEUTRAL], tinted: true, type: FishBodyPart.MOUTH }, narrow1: { - src: 'images/fish/mouth/Mouth_Narrow1.png', + src: Mouth_Narrow1, knnData: [0, 1.06, MouthExpression.NEUTRAL], tinted: true, type: FishBodyPart.MOUTH }, narrow2: { - src: 'images/fish/mouth/Mouth_Narrow2.png', + src: Mouth_Narrow2, knnData: [0, 2.17, MouthExpression.FROWN], tinted: false, type: FishBodyPart.MOUTH }, round1: { - src: 'images/fish/mouth/Mouth_Round1.png', + src: Mouth_Round1, knnData: [0, 1, MouthExpression.NEUTRAL], tinted: false, type: FishBodyPart.MOUTH }, round2: { - src: 'images/fish/mouth/Mouth_Round2.png', + src: Mouth_Round2, knnData: [0, 2.17, MouthExpression.NEUTRAL], tinted: true, type: FishBodyPart.MOUTH }, sharp1: { - src: 'images/fish/mouth/Mouth_Sharp1.png', + src: Mouth_Sharp1, knnData: [10, 1.83, MouthExpression.SMILE], tinted: false, type: FishBodyPart.MOUTH }, sharp2: { - src: 'images/fish/mouth/Mouth_Sharp2.png', + src: Mouth_Sharp2, knnData: [2, 2.13, MouthExpression.SMILE], tinted: false, type: FishBodyPart.MOUTH }, spikey1: { - src: 'images/fish/mouth/Mouth_Spikey1.png', + src: Mouth_Spikey1, knnData: [6, 2, MouthExpression.SMILE], tinted: false, type: FishBodyPart.MOUTH }, square1: { - src: 'images/fish/mouth/Mouth_Square1.png', + src: Mouth_Square1, knnData: [2, 2.91, MouthExpression.FROWN], tinted: false, type: FishBodyPart.MOUTH }, square2: { - src: 'images/fish/mouth/Mouth_Square2.png', + src: Mouth_Square2, knnData: [1, 0.63, MouthExpression.FROWN], tinted: false, type: FishBodyPart.MOUTH }, wide1: { - src: 'images/fish/mouth/Mouth_Wide1.png', + src: Mouth_Wide1, knnData: [0, 1.06, MouthExpression.NEUTRAL], tinted: true, type: FishBodyPart.MOUTH }, wide2: { - src: 'images/fish/mouth/Mouth_Wide2.png', + src: Mouth_Wide2, knnData: [0, 3.71, MouthExpression.FROWN], tinted: true, type: FishBodyPart.MOUTH @@ -402,104 +493,104 @@ const fishComponents = { // SIDE FIN KNN DATA: [pointiness rank] pectoralFinsFront: { fish2: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Fish2.png', + src: Pectoral_Fin_Fish2, knnData: [9], type: FishBodyPart.PECTORAL_FIN_FRONT }, fish4: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Fish4.png', + src: Pectoral_Fin_Fish4, knnData: [1], type: FishBodyPart.PECTORAL_FIN_FRONT }, fish6: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Fish6.png', + src: Pectoral_Fin_Fish6, knnData: [15], type: FishBodyPart.PECTORAL_FIN_FRONT }, narrow1: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Narrow1.png', + src: Pectoral_Fin_Narrow1, knnData: [4], type: FishBodyPart.PECTORAL_FIN_FRONT }, narrow2: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Narrow2.png', + src: Pectoral_Fin_Narrow2, knnData: [5], type: FishBodyPart.PECTORAL_FIN_FRONT }, round2: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Round2.png', + src: Pectoral_Fin_Round2, knnData: [7], type: FishBodyPart.PECTORAL_FIN_FRONT }, sharp1: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Sharp1.png', + src: Pectoral_Fin_Sharp1, knnData: [2], type: FishBodyPart.PECTORAL_FIN_FRONT }, spikey1: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Spikey1.png', + src: Pectoral_Fin_Spikey1, knnData: [3], type: FishBodyPart.PECTORAL_FIN_FRONT }, square2: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Square2.png', + src: Pectoral_Fin_Square2, knnData: [10], type: FishBodyPart.PECTORAL_FIN_FRONT }, wide1: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Wide1.png', + src: Pectoral_Fin_Wide1, knnData: [14], type: FishBodyPart.PECTORAL_FIN_FRONT } }, pectoralFinsBack: { fish2: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Fish2.png', + src: Pectoral_Fin_Fish2, knnData: [], type: FishBodyPart.PECTORAL_FIN_BACK }, fish4: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Fish4.png', + src: Pectoral_Fin_Fish4, knnData: [], type: FishBodyPart.PECTORAL_FIN_BACK }, fish6: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Fish6.png', + src: Pectoral_Fin_Fish6, knnData: [], type: FishBodyPart.PECTORAL_FIN_BACK }, narrow1: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Narrow1.png', + src: Pectoral_Fin_Narrow1, knnData: [], type: FishBodyPart.PECTORAL_FIN_BACK }, narrow2: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Narrow2.png', + src: Pectoral_Fin_Narrow2, knnData: [], type: FishBodyPart.PECTORAL_FIN_BACK }, round2: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Round2.png', + src: Pectoral_Fin_Round2, knnData: [], type: FishBodyPart.PECTORAL_FIN_BACK }, sharp1: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Sharp1.png', + src: Pectoral_Fin_Sharp1, knnData: [], type: FishBodyPart.PECTORAL_FIN_BACK }, spikey1: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Spikey1.png', + src: Pectoral_Fin_Spikey1, knnData: [], type: FishBodyPart.PECTORAL_FIN_BACK }, square2: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Square2.png', + src: Pectoral_Fin_Square2, knnData: [], type: FishBodyPart.PECTORAL_FIN_BACK }, wide1: { - src: 'images/fish/pectoralFin/Pectoral_Fin_Wide1.png', + src: Pectoral_Fin_Wide1, knnData: [], type: FishBodyPart.PECTORAL_FIN_BACK } @@ -508,82 +599,82 @@ const fishComponents = { // TOP FIN KNN DATA: [] topFins: { fish1: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Fish1.png', + src: Dorsal_Fin_Fish1, knnData: [], type: FishBodyPart.DORSAL_FIN }, fish2: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Fish2.png', + src: Dorsal_Fin_Fish2, knnData: [], type: FishBodyPart.DORSAL_FIN }, fish3: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Fish3.png', + src: Dorsal_Fin_Fish3, knnData: [], type: FishBodyPart.DORSAL_FIN }, fish4: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Fish4.png', + src: Dorsal_Fin_Fish4, knnData: [], type: FishBodyPart.DORSAL_FIN }, fish6: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Fish6.png', + src: Dorsal_Fin_Fish6, knnData: [], type: FishBodyPart.DORSAL_FIN }, narrow1: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Narrow1.png', + src: Dorsal_Fin_Narrow1, knnData: [], type: FishBodyPart.DORSAL_FIN }, round1: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Round1.png', + src: Dorsal_Fin_Round1, knnData: [], type: FishBodyPart.DORSAL_FIN }, round2: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Round2.png', + src: Dorsal_Fin_Round2, knnData: [], type: FishBodyPart.DORSAL_FIN }, sharp1: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Sharp1.png', + src: Dorsal_Fin_Sharp1, knnData: [], type: FishBodyPart.DORSAL_FIN }, sharp2: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Sharp2.png', + src: Dorsal_Fin_Sharp2, knnData: [], type: FishBodyPart.DORSAL_FIN }, spikey1: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Spikey1.png', + src: Dorsal_Fin_Spikey1, knnData: [], type: FishBodyPart.DORSAL_FIN }, spikey2: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Spikey2.png', + src: Dorsal_Fin_Spikey2, knnData: [], type: FishBodyPart.DORSAL_FIN }, square1: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Square1.png', + src: Dorsal_Fin_Square1, knnData: [], type: FishBodyPart.DORSAL_FIN }, square2: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Square2.png', + src: Dorsal_Fin_Square2, knnData: [], type: FishBodyPart.DORSAL_FIN }, wide1: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Wide1.png', + src: Dorsal_Fin_Wide1, knnData: [], type: FishBodyPart.DORSAL_FIN }, wide2: { - src: 'images/fish/dorsalFin/Dorsal_Fin_Wide2.png', + src: Dorsal_Fin_Wide2, knnData: [], type: FishBodyPart.DORSAL_FIN } @@ -591,77 +682,77 @@ const fishComponents = { // TAIL KNN DATA: [] tails: { fish1: { - src: 'images/fish/tailFin/Tail_Fin_Fish1.png', + src: Tail_Fin_Fish1, knnData: [], type: FishBodyPart.TAIL }, fish2: { - src: 'images/fish/tailFin/Tail_Fin_Fish2.png', + src: Tail_Fin_Fish2, knnData: [], type: FishBodyPart.TAIL }, fish3: { - src: 'images/fish/tailFin/Tail_Fin_Fish3.png', + src: Tail_Fin_Fish3, knnData: [], type: FishBodyPart.TAIL }, fish4: { - src: 'images/fish/tailFin/Tail_Fin_Fish4.png', + src: Tail_Fin_Fish4, knnData: [], type: FishBodyPart.TAIL }, fish6: { - src: 'images/fish/tailFin/Tail_Fin_Fish6.png', + src: Tail_Fin_Fish6, knnData: [], type: FishBodyPart.TAIL }, narrow1: { - src: 'images/fish/tailFin/Tail_Fin_Narrow1.png', + src: Tail_Fin_Narrow1, knnData: [], type: FishBodyPart.TAIL }, narrow2: { - src: 'images/fish/tailFin/Tail_Fin_Narrow2.png', + src: Tail_Fin_Narrow2, knnData: [], type: FishBodyPart.TAIL }, round1: { - src: 'images/fish/tailFin/Tail_Fin_Round1.png', + src: Tail_Fin_Round1, knnData: [], type: FishBodyPart.TAIL }, sharp1: { - src: 'images/fish/tailFin/Tail_Fin_Sharp1.png', + src: Tail_Fin_Sharp1, knnData: [], type: FishBodyPart.TAIL }, sharp2: { - src: 'images/fish/tailFin/Tail_Fin_Sharp2.png', + src: Tail_Fin_Sharp2, knnData: [], type: FishBodyPart.TAIL }, spikey1: { - src: 'images/fish/tailFin/Tail_Fin_Spikey1.png', + src: Tail_Fin_Spikey1, knnData: [], type: FishBodyPart.TAIL }, square1: { - src: 'images/fish/tailFin/Tail_Fin_Square1.png', + src: Tail_Fin_Square1, knnData: [], type: FishBodyPart.TAIL }, square2: { - src: 'images/fish/tailFin/Tail_Fin_Square2.png', + src: Tail_Fin_Square2, knnData: [], type: FishBodyPart.TAIL }, wide1: { - src: 'images/fish/tailFin/Tail_Fin_Wide1.png', + src: Tail_Fin_Wide1, knnData: [], type: FishBodyPart.TAIL }, wide2: { - src: 'images/fish/tailFin/Tail_Fin_Wide2.png', + src: Tail_Fin_Wide2, knnData: [], type: FishBodyPart.TAIL } diff --git a/webpack.config.js b/webpack.config.js index 29e95e54..fe3cff73 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -28,6 +28,13 @@ module.exports = { plugins: ["transform-class-properties"] } }] + }, + { + test: /\.png$/, + loader: "url-loader", + options: { + limit: true, // everything + } }], }, }; diff --git a/yarn.lock b/yarn.lock index 112b0987..48a00825 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3493,6 +3493,13 @@ icss-utils@^4.0.0, icss-utils@^4.1.1: dependencies: postcss "^7.0.14" +idempotent-babel-polyfill@6.26.0-1: + version "6.26.0-1" + resolved "https://registry.yarnpkg.com/idempotent-babel-polyfill/-/idempotent-babel-polyfill-6.26.0-1.tgz#b8941ac0c1300e93ac1752b01e12bbba2abb6878" + integrity sha512-fOI9i1LG6T2pY77iw/+/kFnpVYDVMVEfKrtEQIxzzTpW3ZkYTKlnOsOjSrDpX9LngQhdEYWBRDUCnETPN7NV/g== + dependencies: + babel-polyfill "^6.26.0" + ieee754@^1.1.4: version "1.1.13" resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.1.13.tgz#ec168558e95aa181fd87d37f55c32bbcb6708b84" @@ -4749,7 +4756,7 @@ mime@1.6.0: resolved "https://registry.yarnpkg.com/mime/-/mime-1.6.0.tgz#32cd9e5c64553bd58d19a568af452acff04981b1" integrity sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg== -mime@^2.4.2: +mime@^2.4.2, mime@^2.4.4: version "2.4.4" resolved "https://registry.yarnpkg.com/mime/-/mime-2.4.4.tgz#bd7b91135fc6b01cde3e9bae33d659b63d8857e5" integrity sha512-LRxmNwziLPT828z+4YkNzloCFC2YM4wrB99k+AV5ZbEyfGNWfG8SO1FUXLmLDBSo89NrJZ4DIWeLjy1CHGhMGA== @@ -6306,6 +6313,14 @@ schema-utils@^2.0.0, schema-utils@^2.0.1: ajv "^6.10.2" ajv-keywords "^3.4.1" +schema-utils@^2.4.1: + version "2.5.0" + resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-2.5.0.tgz#8f254f618d402cc80257486213c8970edfd7c22f" + integrity sha512-32ISrwW2scPXHUSusP8qMg5dLUawKkyV+/qIEV9JdXKx+rsM6mi8vZY8khg2M69Qom16rtroWXD3Ybtiws38gQ== + dependencies: + ajv "^6.10.2" + ajv-keywords "^3.4.1" + seedrandom@2.4.3: version "2.4.3" resolved "https://registry.yarnpkg.com/seedrandom/-/seedrandom-2.4.3.tgz#2438504dad33917314bff18ac4d794f16d6aaecc" @@ -7126,6 +7141,15 @@ urix@^0.1.0: resolved "https://registry.yarnpkg.com/urix/-/urix-0.1.0.tgz#da937f7a62e21fec1fd18d49b35c2935067a6c72" integrity sha1-2pN/emLiH+wf0Y1Js1wpNQZ6bHI= +url-loader@^2.2.0: + version "2.2.0" + resolved "https://registry.yarnpkg.com/url-loader/-/url-loader-2.2.0.tgz#af321aece1fd0d683adc8aaeb27829f29c75b46e" + integrity sha512-G8nk3np8ZAnwhHXas1JxJEwJyQdqFXAKJehfgZ/XrC48volFBRtO+FIKtF2u0Ma3bw+4vnDVjHPAQYlF9p2vsw== + dependencies: + loader-utils "^1.2.3" + mime "^2.4.4" + schema-utils "^2.4.1" + url-parse@^1.4.3: version "1.4.7" resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.4.7.tgz#a8a83535e8c00a316e403a5db4ac1b9b853ae278" From 73fecff6899204ccfebe4aaa588e4f41d5612a3d Mon Sep 17 00:00:00 2001 From: Bethany Connor Date: Tue, 29 Oct 2019 14:21:18 -0700 Subject: [PATCH 2/2] Fix test failure in webpack loading of pngs --- package.json | 6 +++++- yarn.lock | 12 ++++++++++++ 2 files changed, 17 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index 8dfdfc93..849d3c19 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,10 @@ "description": "", "main": "dist/main.js", "jest": { - "testEnvironment": "node" + "testEnvironment": "node", + "moduleNameMapper": { + ".+\\.(jpg|jpeg|png)$": "identity-obj-proxy" + } }, "scripts": { "build": "webpack -p", @@ -46,6 +49,7 @@ "eslint": ">=4.18.2", "eslint-plugin-react": "^7.11.0", "idempotent-babel-polyfill": "6.26.0-1", + "identity-obj-proxy": "^3.0.0", "jest": "^15.0.0", "jquery": "1.12.1", "jquery-ui": "^1.12.1", diff --git a/yarn.lock b/yarn.lock index 48a00825..b66d0f2d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3267,6 +3267,11 @@ har-validator@~5.1.0: ajv "^6.5.5" har-schema "^2.0.0" +harmony-reflect@^1.4.6: + version "1.6.1" + resolved "https://registry.yarnpkg.com/harmony-reflect/-/harmony-reflect-1.6.1.tgz#c108d4f2bb451efef7a37861fdbdae72c9bdefa9" + integrity sha512-WJTeyp0JzGtHcuMsi7rw2VwtkvLa+JyfEKJCFyfcS0+CDkjQ5lHPu7zEhFZP+PDSRrEgXa5Ah0l1MbgbE41XjA== + has-ansi@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/has-ansi/-/has-ansi-2.0.0.tgz#34f5049ce1ecdf2b0649af3ef24e45ed35416d91" @@ -3500,6 +3505,13 @@ idempotent-babel-polyfill@6.26.0-1: dependencies: babel-polyfill "^6.26.0" +identity-obj-proxy@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/identity-obj-proxy/-/identity-obj-proxy-3.0.0.tgz#94d2bda96084453ef36fbc5aaec37e0f79f1fc14" + integrity sha1-lNK9qWCERT7zb7xarsN+D3nx/BQ= + dependencies: + harmony-reflect "^1.4.6" + ieee754@^1.1.4: version "1.1.13" resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.1.13.tgz#ec168558e95aa181fd87d37f55c32bbcb6708b84"