less and more constrasting colours, allow HeadRenderer to fail
This commit is contained in:
parent
ce7dba096e
commit
0662aea1e5
5 changed files with 30 additions and 36 deletions
1
.gitignore
vendored
1
.gitignore
vendored
|
@ -3,4 +3,5 @@
|
||||||
/public/blob/*
|
/public/blob/*
|
||||||
!/public/blob/.gitkeep
|
!/public/blob/.gitkeep
|
||||||
/node_modules
|
/node_modules
|
||||||
|
/public/js/dist
|
||||||
|
|
||||||
|
|
10
public/js/dist/bundle.js
vendored
10
public/js/dist/bundle.js
vendored
File diff suppressed because one or more lines are too long
|
@ -5,7 +5,7 @@ export default class Bar extends Component {
|
||||||
const ceilCurrent = Math.ceil(current);
|
const ceilCurrent = Math.ceil(current);
|
||||||
const perc = (ceilCurrent / base) * 100;
|
const perc = (ceilCurrent / base) * 100;
|
||||||
return <div className={`bar ${type}`}>
|
return <div className={`bar ${type}`}>
|
||||||
<div className="inner-bar" style={{width: Math.max(perc) + '%'}}>
|
<div className="inner-bar" style={{width: Math.max(perc, 100) + '%'}}>
|
||||||
<span className="inner-text">{ceilCurrent}/{base} ({Math.ceil(perc)}%)</span>
|
<span className="inner-text">{ceilCurrent}/{base} ({Math.ceil(perc)}%)</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -84,16 +84,19 @@ export class HeadRenderer {
|
||||||
this.clear();
|
this.clear();
|
||||||
while (this.renderQueue.length > 0) {
|
while (this.renderQueue.length > 0) {
|
||||||
let [objects, res] = this.renderQueue.shift();
|
let [objects, res] = this.renderQueue.shift();
|
||||||
console.log(objects, res);
|
try {
|
||||||
let shapePromises = objects.map(async x => {
|
let shapePromises = objects.map(async x => {
|
||||||
let req = await fetch(`blob/shape/${x}.json`);
|
let req = await fetch(`blob/shape/${x}.json`);
|
||||||
let json = await req.json();
|
let json = await req.json();
|
||||||
let shapeColl = await ShapeCollection.forceLoad(json, 'blob/texture/');
|
let shapeColl = await ShapeCollection.forceLoad(json, 'blob/texture/');
|
||||||
this.add(shapeColl);
|
this.add(shapeColl);
|
||||||
});
|
});
|
||||||
await Promise.all(shapePromises);
|
await Promise.all(shapePromises);
|
||||||
this.rotate(-5 * (Math.PI / 180), -30 * (Math.PI / 180), 0);
|
this.rotate(-5 * (Math.PI / 180), -30 * (Math.PI / 180), 0);
|
||||||
res(await this.draw());
|
res(await this.draw());
|
||||||
|
} catch (e) {
|
||||||
|
console.log("Failed to render", objects);
|
||||||
|
}
|
||||||
this.clear();
|
this.clear();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
30
src/utils.js
30
src/utils.js
|
@ -12,26 +12,26 @@ export function uuidv4() {
|
||||||
}
|
}
|
||||||
|
|
||||||
const COLORS = [
|
const COLORS = [
|
||||||
'#fc5c65',
|
// '#fc5c65',
|
||||||
'#fd9644',
|
'#fd9644',
|
||||||
'#fed330',
|
// '#fed330',
|
||||||
'#26de81',
|
'#26de81',
|
||||||
'#2bcbba',
|
// '#2bcbba',
|
||||||
'#eb3b5a',
|
'#eb3b5a',
|
||||||
'#fa8231',
|
// '#fa8231',
|
||||||
'#f7b731',
|
// '#f7b731',
|
||||||
'#20bf6b',
|
// '#20bf6b',
|
||||||
'#0fb9b1',
|
// '#0fb9b1',
|
||||||
'#45aaf2',
|
'#45aaf2',
|
||||||
'#4b7bec',
|
// '#4b7bec',
|
||||||
'#a55eea',
|
'#a55eea',
|
||||||
'#d1d8e0',
|
'#fff',
|
||||||
'#778ca3',
|
// '#778ca3',
|
||||||
'#2d98da',
|
// '#2d98da',
|
||||||
'#3867d6',
|
// '#3867d6',
|
||||||
'#8854d0',
|
// '#8854d0',
|
||||||
'#a5b1c2',
|
// '#a5b1c2',
|
||||||
'#4b6584',
|
// '#4b6584',
|
||||||
];
|
];
|
||||||
|
|
||||||
export function colorFromName(name) {
|
export function colorFromName(name) {
|
||||||
|
|
Loading…
Reference in a new issue