Skip to content

Commit

Permalink
Merge branch 'dev' of https://github.com/engaging-computing/myr into doc
Browse files Browse the repository at this point in the history
  • Loading branch information
Jlu18 committed Jan 13, 2022
2 parents 08110f6 + f87b4e0 commit 4a42722
Show file tree
Hide file tree
Showing 24 changed files with 1,075 additions and 762 deletions.
2 changes: 1 addition & 1 deletion .env.example
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
#The client ID should NOT start with http or https! This will cause authentication failure!
REACT_APP_GOOGLE_CLIENTID=<Required for authenticting with the backend, get this from a team member>
REACT_APP_GOOGLE_CLIENTID=<Required for authenticting with the backend, get this from a team member>
2 changes: 1 addition & 1 deletion .eslintrc.json
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@
"curly": "warn",
"no-lonely-if": "warn",
"no-console": [
"error",
"warn",
{
"allow": [
"warn",
Expand Down
2 changes: 1 addition & 1 deletion .nvmrc
Original file line number Diff line number Diff line change
@@ -1 +1 @@
10.13
10.13
15 changes: 11 additions & 4 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,17 @@ The Engaging Computing Group develops new technologies to enable learners—yout
## Status
[![CircleCI](https://circleci.com/gh/engaging-computing/MYR.svg?style=shield)](https://circleci.com/gh/engaging-computing/MYR)

## Change Log - 2.3.1 -> 2.4.0
- Added ability to import custom GLTF models into a scene
- Added a keyboard shortcut information menu
- Added a slider for setting the movement speed in a scene
## Change Log - 2.4.0 -> 3.0.0
- Removed undocumented aliases for `box` and `prisim`
- All scenes using these aliases have been automatically changed to reflect the new API
- Changed the behavior of `getRandomColor` to only return a random color
- Added `setRandomColor` to behave like `getRandomColor` did previously
- A migration has updated scenes to be properly using these functions
- If your scene broke as a result of this update, please let us know [[email protected]](mailto:[email protected])
- Misc. Package dependency updates
- Moved Model and Asset reference to their own page
- Removed broken links to non-existent example pages



## Acknowledgments
Expand Down
Binary file added img/grid_alpha_0.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1,308 changes: 700 additions & 608 deletions package-lock.json

Large diffs are not rendered by default.

16 changes: 8 additions & 8 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
{
"name": "myr",
"version": "2.4.0",
"version": "3.0.0",
"private": false,
"engines": {
"node": "^12.18.2"
},
"devDependencies": {
"@babel/core": "^7.9.0",
"enzyme": "^3.3.0",
"enzyme-adapter-react-16": "^1.1.1",
"enzyme-adapter-react-16": "^1.15.6",
"esdoc": "^1.1.0",
"esdoc-standard-plugin": "^1.0.0",
"eslint-plugin-react": "^7.13.0",
Expand All @@ -17,10 +17,10 @@
},
"dependencies": {
"@engaging-computing/aframe-physics-system": "^4.0.0",
"@material-ui/core": "^4.11.2",
"@material-ui/core": "^4.12.3",
"aframe": "^1.0.4",
"aframe-animation-component": "^5.0.0",
"aframe-environment-component": "^1.0.0",
"aframe-environment-component": "^1.3.1",
"aframe-extras": "^4.1.2",
"aframe-react": "^4.4.0",
"bootstrap": "^4.6.0",
Expand All @@ -35,19 +35,19 @@
"qrcode.react": "^1.0.1",
"react": "^16.8.4",
"react-ace": "^6.0.0",
"react-color": "^2.17.0",
"react-color": "^2.19.3",
"react-dom": "^16.2.0",
"react-google-login": "^5.1.19",
"react-progressive-image": "^0.3.0",
"react-redux": "^5.0.7",
"react-router-dom": "^4.2.2",
"react-select": "^3.0.4",
"reactour": "^1.9.1",
"reactour": "^1.18.6",
"redux": "^3.7.2",
"redux-thunk": "^2.3.0",
"socket.io-client": "^4.0.0",
"socket.io-client": "^4.3.2",
"source-map-explorer": "^2.0.0",
"styled-components": "^5.0.0",
"styled-components": "^5.3.3",
"three": "^0.126.1",
"ua-parser-js": "^0.7.24"
},
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import React from "react";
import Header from "../structural/header/Header";
import Footer from "../structural/Footer";
import ModelReferencePage from "../reference/ModelReferencePage";
import AssetReferencePage from "../reference/AssetReferencePage";

import * as layoutTypes from "../../constants/LayoutTypes.js";

Expand All @@ -10,7 +10,7 @@ import * as layoutTypes from "../../constants/LayoutTypes.js";
* @param {object} param0 List of props that will be use in components
* @returns {HTMLElement} Layout of the model reference page
*/
export const ModelReference = ({ editor, editorActions, user, authActions, scene, sceneActions, projectActions, courseActions, projects, courses, match, collectionActions, collections }) => (
export const AssetReference = ({ editor, editorActions, user, authActions, scene, sceneActions, projectActions, courseActions, projects, courses, match, collectionActions, collections }) => (
<div className="App">
<Header
logging={authActions}
Expand All @@ -31,10 +31,10 @@ export const ModelReference = ({ editor, editorActions, user, authActions, scene
layoutType={layoutTypes.REFERENCE}
/>
<div className="row no-gutters">
<ModelReferencePage />
<AssetReferencePage />
</div>
<Footer />
</div>
);

export default ModelReference;
export default AssetReference;
71 changes: 71 additions & 0 deletions src/components/reference/AssetReferencePage.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
import React from "react";
import ModelTab from "./ModelReferenceTab";
import TextureTab from "./TextureReferenceTab";

import {
Tabs,
Tab,
Icon,
Hidden,
} from "@material-ui/core";

import "../../css/ModelReferencePage.css";

export default class AssetReference extends React.Component {

constructor(props) {
super(props);
this.state = {
value: "a",
};
}

handleChange = (event, value) => {
this.setState({ value });
};

componentDidMount() {
const qsa = new URLSearchParams(window.location.search);
if (qsa.has("tab") && qsa.get("tab").toLowerCase() === "textures") {
this.setState({ value: "b" });
}
}

render() {
document.title = "Asset | MYR";
return (
<div id="modelReference-page">
<Tabs
id="modelReference-tabs"
variant="fullWidth"
value={this.state.value}
onChange={this.handleChange} >
<Tab
icon={<Icon className="material-icons model">model</Icon>}
label={
<Hidden xsDown>
<div>MODEL</div>
</Hidden>
}
value='a' />
<Tab
icon={<Icon className="material-icons texture">texture</Icon>}
label={
<Hidden xsDown>
<div>TEXTURE</div>
</Hidden>
}
value='b' />
</Tabs>
{this.state.value === "a" &&
<div style={{ marginTop: 0 }}>
<ModelTab />
</div>}
{this.state.value === "b" &&
<div style={{ marginTop: 0 }}>
<TextureTab />
</div>}
</div>
);
}
}
54 changes: 54 additions & 0 deletions src/components/reference/ModelReferenceTab.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
import React from "react";
import model from "../../myr/modelReference";

import ModelPack from "../structural/Models.js";

import {
Table,
TableBody,
TableHead,
TableRow,
TableCell
} from "@material-ui/core";

import "../../css/ModelReferencePage.css";

export default class ModelReference extends React.Component {
imageHelper = (model) => {
if(model) {
let models = ModelPack().ModelPack;

if(models.has(model)) {
let gltf = models.get(model);
return gltf.image;
}
return null;
}
return null;
};

render() {
return (
<Table >
<TableHead >
<TableRow>
<TableCell>Name</TableCell>
<TableCell></TableCell>
<TableCell className='model'>Image</TableCell>
</TableRow>
</TableHead>
<TableBody> {model.map((row, index) => {
return (
<TableRow key={index}>
<TableCell >{row.name}</TableCell>
<TableCell ></TableCell>
<TableCell >
<img id="image" src={this.imageHelper(row.model)} alt="alt" height = "90" width = "90"></img>
</TableCell>
</TableRow>);
})}
</TableBody>
</Table>
);
}
}
30 changes: 21 additions & 9 deletions src/components/reference/Reference.js
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,12 @@ const newTabStyle = {
right: 50,
};

const assetReferenceBtn = {
position: "fixed",
top: 0,
right: 95,
};

/**
* Reference is a react component that creates drawer contains references
*/
Expand Down Expand Up @@ -65,14 +71,12 @@ class Reference extends Component {
this.setState({ value: "a" });
};

/**
* Conver the name and parameters of API to following format to be use in first column of table
* format: name(...parameters);
*
* @param {string} name name of API to create
* @param {array} parameters array of object that each contains type and name of the parameter
* @returns {HTMLElement} create a DOM element with name of APIs and Parameters
*/
assetHandleOpen = () => {
window.open(window.origin + "/asset-reference");
this.setState({ value: "a" });
};


nameHelper = (name, parameters) => {
return (
<span>{name}({(parameters.map((element, i, params) => {
Expand Down Expand Up @@ -188,10 +192,18 @@ class Reference extends Component {
<Icon className="material-icons">close</Icon>
</IconButton>
<IconButton
title="Open reference page &#013;(in a new tab)"
color="default"
style={newTabStyle}
onClick={this.handleOpen}>
<Icon className="material-icons">open_in_new</Icon>
<Icon className="material-icons">menu_book</Icon>
</IconButton>
<IconButton
title="Open asset reference page &#013;(in a new tab)"
color="default"
style={assetReferenceBtn}
onClick={this.assetHandleOpen}>
<Icon className="material-icons-outlined">settings_system_daydream</Icon>
</IconButton>
</div>
<div>
Expand Down
59 changes: 59 additions & 0 deletions src/components/reference/TextureReferenceTab.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
import React from "react";
import texture from "../../myr/textureReference";

import TexturePack from "../structural/Textures.js";

import {
Table,
TableBody,
TableHead,
TableRow,
TableCell,
} from "@material-ui/core";

import "../../css/TextureReferencePage.css";

export default class TextureReference extends React.Component {
imageHelper = (image) => {
if(image) {
let textures = TexturePack();
let textureTitle = [...textures.TexturePack.map(obj => obj.title)];
let textureURL = [...textures.TexturePack.map(obj => obj.url)];

let texture = textureURL[textureTitle.indexOf(image)];

return (
texture
);
} else {
return null;
}
};

render() {
return (
<Table >
<TableHead >
<TableRow>
<TableCell>Name</TableCell>
<TableCell></TableCell>
<TableCell className='texture'>Image</TableCell>
<TableCell className='creator'>Image Creator</TableCell>
</TableRow>
</TableHead>
<TableBody> {texture.map((row, index) => {
return (
<TableRow key={index}>
<TableCell >{row.name}</TableCell>
<TableCell ></TableCell>
<TableCell >
<img id="image" src={this.imageHelper(row.image)} alt="alt" height = "90" width = "90"></img>
</TableCell>
<TableCell >{row.creator}</TableCell>
</TableRow>);
})}
</TableBody>
</Table>
);
}
}
3 changes: 2 additions & 1 deletion src/components/structural/View.js
Original file line number Diff line number Diff line change
Expand Up @@ -357,6 +357,7 @@ class View extends Component {
<a-grid height="53.33" width="53.33" position="-0.5 -0.26 -0.5" scale="1.5 1.5 1.5" material="shader:flat;"/>
<a-tube path="-35 -0.2 0, 35 -0.2 0" radius="0.05" material="color: red; shader:flat;"></a-tube>
<a-tube path="0 -0.2 -35, 0 -0.2 35" radius="0.05" material="color: blue; shader:flat;"></a-tube>
<a-tube path="0 -35 0, 0 35 0" radius="0.05" material="color: green; shader:flat;"></a-tube>
<a-text
color="#555"
rotation="0 0 0"
Expand All @@ -374,7 +375,7 @@ class View extends Component {
<a-text
color="#555"
rotation="0 90 90"
position="0 .1 0"
position=".1 .1 0"
side="double"
value=" Y + "></a-text>
</Fragment>
Expand Down
Loading

0 comments on commit 4a42722

Please sign in to comment.