Skip to content

Commit f143437

Browse files
kevinrev26racsoraul
kevinrev26
authored and
racsoraul
committed
Fixed observations of the pull request: add empty background to png files and refactoring code to be more adaptable
1 parent d73dba6 commit f143437

File tree

10 files changed

+78
-42
lines changed

10 files changed

+78
-42
lines changed

‎README.md

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -65,5 +65,8 @@ const Monster = () =>
6565

6666
## Generating PNG files
6767

68-
1) run the command `npm run snaps`
69-
2) This command will generate a folder inside snapshots directory containing the png files of all monsters.
68+
1) Change the property to `true` into the file `demo/src/utils/env.js`
69+
2) Change execution permissions on `snaps.sh` file with: `chmod u+x snaps.sh`
70+
3) Run the script `./snapsh.sh`
71+
5) Wait...
72+
4) This command will generate a images folder inside snapshots directory containing the png files of all monsters.

‎demo/src/index.js

Lines changed: 19 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
1+
//require('dotenv').config()
12
import React, { Fragment, Component } from 'react'
23
import { render } from 'react-dom'
3-
import { monster3D, monsters } from './utils/monsterEnum';
4+
import { monster3D, monsters } from './utils/monsterEnum'
45
import { Monster3DProfile, ActionType } from '../../src'
5-
import monsterDecors from './utils/monsterDecorators';
6+
import monsterDecors from './utils/monsterDecorators'
7+
import isSnaps from './utils/env'
68

79
class App extends Component {
810
constructor(props) {
@@ -23,15 +25,16 @@ class App extends Component {
2325

2426
render() {
2527
const { currentAnimation, currentMonster } = this.state
28+
2629
return (
2730
<Fragment>
2831
<h1>Monster3DProfile</h1>
2932
<Monster3DProfile
3033
typeId="devil"
31-
path={currentMonster}
34+
path={isSnaps ? monster3D(this.props.monster) : currentMonster }
3235
action={currentAnimation}
3336
size={{ height: "600px" }}
34-
background={{ alpha: 1 }}
37+
background={{ alpha: isSnaps ? 0 : 1}}
3538
exposure={2}
3639
ambientColor={0xffffff}
3740
directIntensity={3}
@@ -74,8 +77,15 @@ class App extends Component {
7477
)
7578
}
7679
}
77-
78-
render(
79-
<App />,
80-
document.querySelector('#demo')
81-
)
80+
if(isSnaps){
81+
window.renderIt = (monster, node) => {
82+
render(
83+
<App monster={monster}/>,
84+
node
85+
)}
86+
}else{
87+
render(
88+
<App />,
89+
document.querySelector('#demo')
90+
)
91+
}

‎demo/src/utils/env.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export default false

‎package-lock.json

Lines changed: 17 additions & 21 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎snaps.sh

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
#!/bin/bash
2+
3+
DIR="snapshots/app/public/"
4+
5+
#building component
6+
npm run build
7+
8+
# verify if images directory exists
9+
if [ -d "snapshots/images" ]
10+
then
11+
rm -r snapshots/images/
12+
fi
13+
14+
# verify if public directory is empty
15+
if [ "$(ls -A $DIR)" ]
16+
then
17+
rm snapshots/app/public/*
18+
fi
19+
20+
#copying demo/dist
21+
cp demo/dist/* snapshots/app/public/
22+
23+
# generating snaps
24+
npm run snaps

‎snapshots/app/public/demo.a48304f7.js.map

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎snapshots/app/public/demo.a48304f7.js renamed to ‎snapshots/app/public/demo.bcabdefa.js

Lines changed: 7 additions & 7 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎snapshots/app/public/demo.bcabdefa.js.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎snapshots/app/public/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,5 +9,5 @@
99
<body>
1010
<div id="demo"></div>
1111
<script>!function(e){function r(r){for(var n,f,i=r[0],l=r[1],a=r[2],c=0,s=[];c<i.length;c++)f=i[c],o[f]&&s.push(o[f][0]),o[f]=0;for(n in l)Object.prototype.hasOwnProperty.call(l,n)&&(e[n]=l[n]);for(p&&p(r);s.length;)s.shift()();return u.push.apply(u,a||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,i=1;i<t.length;i++){var l=t[i];0!==o[l]&&(n=!1)}n&&(u.splice(r--,1),e=f(f.s=t[0]))}return e}var n={},o={1:0},u=[];function f(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,f),t.l=!0,t.exports}f.m=e,f.c=n,f.d=function(e,r,t){f.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},f.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},f.t=function(e,r){if(1&r&&(e=f(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(f.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)f.d(t,n,function(r){return e[r]}.bind(null,n));return t},f.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return f.d(r,"a",r),r},f.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},f.p="";var i=window.webpackJsonp=window.webpackJsonp||[],l=i.push.bind(i);i.push=r,i=i.slice();for(var a=0;a<i.length;a++)r(i[a]);var p=l;t()}([]);</script>
12-
<script type="text/javascript" src="demo.a48304f7.js"></script></body>
12+
<script type="text/javascript" src="demo.bcabdefa.js"></script></body>
1313
</html>

‎snapshots/script.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@ const monsters = ["Baal", "BadChicken", "Bat", "Bear", "Beetle", "Butterfly", "C
66
"Ghost", "MetalGuitar", "Minion", "Ness", "Ogre", "Penguin", "RockWorm", "Rocky", "Scorpion", "Serpent", "Spider", "TheThing", "Toad",
77
"Tree", "Troll", "Tucan", "Vampire", "Wolf", "Worm"];
88

9+
/* Check if images exists */
10+
911

1012
const takeSnaps = async (port) => {
1113
const browser = await puppeteer.launch({ devtools: false });
@@ -20,7 +22,7 @@ const takeSnaps = async (port) => {
2022
const imageEncoded = await page.evaluate(async (monster) => {
2123

2224
renderIt(monster, document.querySelector("#demo"));
23-
await ((ms = 2000) =>
25+
await ((ms = 1500) =>
2426
new Promise((resolve, reject) => {
2527
try {
2628
setTimeout(resolve, ms)

0 commit comments

Comments
 (0)