jgam
@jgam
Reviews Written
1
Average Rating
4.0
Posts
Q&A
์ค๋ฅ
์ ๋ ์๋๋ ๋ถ๋ถ์ด ์์ด ๋๊ธ๋จ๊น๋๋ค. ์ ์ฝ๋๋ ์ด๋ ์ต๋๋ค. (() => { let yOffset = 0; let prevScrollHeight = 0; //current scroll yOffset previous scroll sections sum of heights let currentScene = 0;// currently activated scene in front of our eye let enterNewScene = false; //whne new scene set, starts true const sceneInfo = [ { type: 'sticky', scrollHeight: 0, heightNum: 5,// browser's height times 5 to set scrollHeight objs:{ container: document.querySelector('#scroll-section-0'), messageA: document.querySelector('#scroll-section-0 .main-message.a'), messageB: document.querySelector('#scroll-section-0 .main-message.b'), messageC: document.querySelector('#scroll-section-0 .main-message.c'), messageD : document.querySelector('#scroll-section-0 .main-message.d'), canvas: document.querySelector('#video-canvas-0'), context: document.querySelector('#video-canvas-0').getContext('2d'), videoImages: [], }, values: { // in messageA_opacity: [0,1, {start: 0.1, end:0.2}], messageA_translateY_in: [20, 0, {start:0.1, end:0.2}], messageB_opacity: [0,1, {start: 0.3, end:0.4}], messageB_translateY_in: [20, 0, {start:0.3, end:0.4}], messageC_opacity: [0,1, {start: 0.5, end:0.6}], messageC_translateY_in: [20, 0, {start:0.5, end:0.6}], messageD_opacity: [0,1, {start: 0.7, end:0.8}], messageD_translateY_in: [20, 0, {start:0.7, end:0.8}], // out messageA_opacity_out: [1,0,{start:0.25, end:0.3}], messageA_translateY_out: [0, -20, {start:0.25, end:0.3}], messageB_opacity_out: [1,0,{start:0.45, end:0.5}], messageB_translateY_out: [0, -20, {start:0.45, end:0.5}], messageC_opacity_out: [1,0,{start:0.65, end:0.7}], messageC_translateY_out: [0, -20, {start:0.65, end:0.7}], messageD_opacity_out: [1,0,{start:0.85, end:0.9}], messageD_translateY_out: [0, -20, {start:0.85, end:0.9}], // images videoIMageCount: 300, imageSequence: [0, 299], //canvas canvas_opacity: [1,0,{start:0.9,end:1}] } }, { type: 'normal', scrollHeight: 0, heightNum: 5,// browser's height times 5 to set scrollHeight, objs:{ container: document.querySelector('#scroll-section-1') } }, { type: 'sticky', scrollHeight: 0,// for compatibility purposes heightNum: 5,// browser's height times 5 to set scrollHeight objs:{ container: document.querySelector('#scroll-section-2'), messageA: document.querySelector('#scroll-section-2 .a'), messageB: document.querySelector('#scroll-section-2 .b'), messageC: document.querySelector('#scroll-section-2 .c'), pinB: document.querySelector('#scroll-section-2 .b .pin'), pinC: document.querySelector('#scroll-section-2 .c .pin'), canvas: document.querySelector('#video-canvas-1'), context: document.querySelector('#video-canvas-1').getContext('2d'), videoImages: [], }, values:{ messageA_translateY_in: [20, 0, {start:0.15, end:0.2}], messageB_translateY_in: [30, 0, {start:0.5, end:0.55}], messageC_translateY_in: [30, 0, {start:0.72, end:0.77}], messageA_opacity: [0,1,{start:0.15, end:0.2}], messageB_opacity: [0,1,{start:0.5, end:0.55}], messageC_opacity: [0,1,{start:0.72, end:0.77}], messageA_translateY_out: [0,-20, {start:0.3, end:0.35}], messageB_translateY_out: [0,-20, {start:0.58, end:0.63}], messageC_translateY_out: [0,-20, {start:0.85, end:0.9}], messageA_opacity_out: [1,0,{start:0.3, end:0.35}], messageB_opacity_out: [1,0,{start:0.58, end:0.63}], messageC_opacity_out: [1,0,{start:0.85, end:0.9}], pinB_scaleY: [0.5,1,{start:0.5, end:0.55}], pinC_scaleY: [0.5,1,{start:0.72, end:0.77}], pinB_opacity: [0,1,{start:0.5, end:0.55}], pinC_opacity: [0,1,{start:0.72, end:0.77}], pinB_opacity_out:[1,0,{start:0.58, end:0.63}], pinC_opacity_out:[1,0,{start:0.85, end:0.9}], // images videoIMageCount: 960, imageSequence: [0, 959], //canvas canvas_opacity: [0,1,{start:0,end:0.1}], canvas_opacity_out: [1,0,{start: 0.95, end:1}] } }, { type: 'sticky', scrollHeight: 0, heightNum: 5,// browser's height times 5 to set scrollHeight objs:{ container: document.querySelector('#scroll-section-3'), canvasCaption: document.querySelector('.canvas-caption'), canvas: document.querySelector('.image-blend-canvas'), context: document.querySelector('.image-blend-canvas').getContext('2d'), imagesPath: [ './images/blend-image-1.jpg', './images/blend-image-2.jpg', ], images:[] }, values: { rect1X: [0,0,{start:0, end:0}], rect2X: [0,0,{start:0, end:0}], rectStartY: 0, } }, ] function setCanvasImages(){ let imgElem; for(let i =0; i = yOffset){ currentScene = i; break; } } document.body.setAttribute('id', `show-scene-${currentScene}`); const heightRatio = window.innerHeight/1080; // multiply window ratio to the current browser's height sceneInfo[0].objs.canvas.style.transform = `translate3d(-50%, -50%, 0) scale(${heightRatio})`; sceneInfo[2].objs.canvas.style.transform = `translate3d(-50%, -50%, 0) scale(${heightRatio})`; } // the ratio of current scrolled values in terms of Y offset function calcValues(values, currentYOffset){ let rv; const scrollHeight = sceneInfo[currentScene].scrollHeight; // current Scene, scrolled section need to be factored let scrollRatio = currentYOffset / sceneInfo[currentScene].scrollHeight; // specific start ~ specific end animation activated if(values.length ===3){ const partScrollStart = values[2].start * scrollHeight; const partScrollEnd = values[2].end * scrollHeight; const partScrollHeight = partScrollEnd - partScrollStart; if(currentYOffset >= partScrollStart && currentYOffset partScrollEnd){ rv =values[1]; } } else{ rv = scrollRatio * (values[1] - values[0]) + values[0] } return rv; } function playAnimation(){ const objs = sceneInfo[currentScene].objs; const values = sceneInfo[currentScene].values; const currentYOffset = yOffset - prevScrollHeight; //current scene's ratio current height const scrollRatio = currentYOffset / sceneInfo[currentScene].scrollHeight; switch(currentScene){ case 0: // getting the sequence and scrolls of it let sequence = Math.round(calcValues(values.imageSequence, currentYOffset)); objs.context.drawImage(objs.videoImages[sequence], 0, 0); objs.canvas.style.opacity = calcValues(values.canvas_opacity, currentYOffset); // scrolling and interaction with texts if (scrollRatio prevScrollHeight + sceneInfo[currentScene].scrollHeight && currentScene { // call necessary function in here yOffset = window.pageYOffset; scrollLoop(); }) // window.addEventListener('DOMContentLoaded', setLayout); window.addEventListener('load',() => { setLayout(); sceneInfo[0].objs.context.drawImage(sceneInfo[0].objs.videoImages[0],0,0); }) window.addEventListener('resize', setLayout); })();
- 0
- 5
- 381
Q&A
๋ฐฑ์๋ address in use
์ ๋ฐ์ดํธ: ์ฐ์ ์ฑ์ ๋์์ ํฉ๋๋ค๋ง, pm2 monit์์ ์ ๋๋ก๋ ๋ก๊น ์ด ๋๊ณ ์๋๊ฑฐ ๊ฐ์ง๋ ์์ต๋๋ค. ๊ณ ๋ก, ๋ก๊ทธ์ธ์ ํจ์๋ ๋ถ๊ตฌํ๊ณ ๋ก๊ทธ์ธ๋์๋ค๊ณ ์ธ์์ ํ์ง ๋ชปํ๋ค์...
- 0
- 2
- 241
Q&A
enzyme?
๋ํธ๋!๊ด์ฐฎ์ต๋๋ค. ํ์ ๋ค์ ์งํ์ค์ธ๋ฐ, setup.js์์ ์ด๋ฒ์๋ ์๋ฌ๊ฐ ๋จ๋ค์. ์ ๋ง ํ ์ํ๋ ์ํ๋ฆฌ๊ณ ํ์ ๋๋ก ๋ค ๋ฐ๋ผ์ํ๋๋ฐ ๋์ค๋ ์๋ฌ๋ ์ด๋ ์ต๋๋ค. your test suite must contain at least one test. ์ ์๊ฐ์ธ๋ฐ, testsํด๋ ์์์์ผ๋ฉด test๊ฐ ๋ฌด์กฐ๊ฑด ํ๋์ ๋ ์์ด์ผ ๋๋๊ฑฐ๊ฐ๋ค์. ๊ทธ๋ ์ง๋ง setup.js๋ ํ ์คํธ๊ฐ ํ๋๋ ์์ด์ ์๋ฌ๊ฐ ๋จ๋ค์. ํ์ง๋ง, ๋ํธ๋ ๊ฐ์์์๋ ํ ์คํธ๊ฐ์์ด์....์ ๋ ์ฐธ ์๋ฌธ์ด๋ค์. ํน์ ์ถ์ฒํด์ฃผ์ค ๋ฐฉ๋ฒ์ด์๋์?
- 1
- 13
- 728
Q&A
enzyme?
๋ฒ์ ์ด ํ๋ฆฌ๊ธฐ๋ ํฉ๋๋ค๋ง, ์ ๊ฐ ๊ฐ๊ณ ์๋๊ฒ๋ค์ด ๋ค ์ ๊ทธ๋ ์ด๋ ๋ฒ์ ์ด๋ค์.react : 16.8.6 react-native: 0.59.9 enzyme: 3.10.0 enzyme-adapter-react-16: 1.14.0 ํน์ ์ด๊ฒ๋ค์ ๋ค์ด๊ทธ๋ ์ด๋ ์์ผ์ผ๋ ๊น์?
- 1
- 13
- 728
Q&A
enzyme?
์ ๋ค. ๊ทธ ๋ถ๋ถ์ ์ ๋ ์ธ์งํ๊ณ ์์์ต๋๋ค. ์ ๊ฐ ์ฌ์ญค๋ดค๋ original ์ง๋ฌธ์ผ๋ก ๋์๊ฐ์๋ฉด, ๋ํธ๋์ ์ฝ๋๋ ํ์คํธ๋ฅผ ๋๋ ธ์๋, Received: text ๊ฐ ๋์ค๊ณ , ์ ๊ฐ์๊ฒฝ์ฐ๋ Received: ๊ฐ ๋์ต๋๋ค. ์ด ํ๋ฆฐ ๋ถ๋ถ์ด ๊ฒฐ๊ตญ ์๋ฌ๋ฅผ ์ผ์ผํค๊ณ ์์ผ๋, app.js๋ฅผ ๋ด๋ฌ๋ผ๊ณ ํ๊ณ ์์ต๋๋ค. ํน์ ์ด๋ค ๋ถ๋ถ์ด ์๋ชป ๋์์๊น์?
- 1
- 13
- 728
Q&A
enzyme?
๋ค! App-test.js /** * @format */ import 'react-native'; import React from 'react'; import App from '../src/App'; import { Text } from 'react-native'; import { shallow } from 'enzyme'; describe('Jest', ()=> { it('is it working?', () => { const a = 1; expect(a + 1).toBe(2) }) }) describe('Enzyme', () => { it('is it working?', () => { const text = 'some text'; const wrapper = shallow(Text>textText>); expect(wrapper.text()).toBe(text); }) }) setup.js import { configure } from 'enzyme'; import Adapter from 'enzyme-adapter-react-16'; configure({ adapter: new Adapter() });
- 1
- 13
- 728
Q&A
jest - type error
ํด๊ฒฐ ํ์์ต๋๋ค! ๊ฐ์ฌํฉ๋๋ค!
- 1
- 4
- 453
Q&A
jest - type error
๋ง์ํ์ ๊ฒ์ผ๋ก ์งํ์ ํด๋ณด์๋ ๋๊ฐ์ ์๋ฌ๊ฐ ๋จ๋ค์. ์ ์ App.spec.jsํ์ผ์ ๋๋ค. import 'react-native'; import React from 'react'; import App from '../src/App'; import format from 'path'; describe('Jest', ()=> { it('is it working?', () => { const a = 1; expect(a + 1).toBe(2) }) }) ์ฐธ๊ณ ๋ก, tests๋ผ๋ ํด๋๊ฐ ์์ด์ ์ ๊ฐ ์๋์ผ๋ก ๋ง๋ค์์ต๋๋ค. ๋ฌผ๋ก ๊ทธ ๊ณผ์ ์์ app.spec.jsํ์ผ๋ ์ ๊ฐ ๋ง๋ค์๊ตฌ์.
- 1
- 4
- 453




