You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
185 lines
5.1 KiB
185 lines
5.1 KiB
import scroll from "../../utils/scroll"; |
|
const height = window.innerHeight; |
|
const width = window.innerWidth; |
|
const prevScroll = localStorage.getItem("prevScroll"); |
|
|
|
const initialState = { |
|
page1TopPosition: scroll.homeScrollHandler(1), |
|
page2TopPosition: scroll.homeScrollHandler(2), |
|
page2RotateX: scroll.linearFormula( |
|
scroll.linearFormula( |
|
prevScroll > height ? height : prevScroll, |
|
45, |
|
0, |
|
0, |
|
height |
|
) |
|
), |
|
page2BoxPosition: scroll.initializeBoxPosition(prevScroll), |
|
page2MobilePosition: scroll.linearFormula( |
|
prevScroll > 2.5 * height ? 2.5 * height : prevScroll, |
|
-(((height * 10) / 20 / width) * 100), |
|
6, |
|
2 * height, |
|
2.5 * height |
|
), |
|
page2VideoPosition: |
|
window.scrollY > 4 * height |
|
? scroll.videoLinearFormula(4 * height) |
|
: window.scrollY > height |
|
? scroll.videoLinearFormula(window.scrollY) |
|
: null, |
|
page2VideoTopPosition: |
|
prevScroll > 3 * height |
|
? scroll.linearFormula(3 * height, 70, 50, 2.8 * height, 3 * height) |
|
: scroll.linearFormula(prevScroll, 70, 50, 2.8 * height, 3 * height), |
|
page2MobileUnit: scroll.initializeMobileUnit(prevScroll), |
|
videoTubeTopPosition: scroll.homeScrollHandler(3), |
|
testTranslateY: scroll.linearFormula( |
|
prevScroll > 5 * window.innerHeight ? 5 * window.innerHeight : prevScroll, |
|
0, |
|
-101, |
|
4.5 * height, |
|
5 * height |
|
), |
|
page3TopPosition: scroll.homeScrollHandler(4), |
|
page3TestTranslateY: |
|
prevScroll < 6.3 * height |
|
? 0 |
|
: scroll.linearFormula( |
|
prevScroll > 7 * height ? 7 * height : prevScroll, |
|
0, |
|
100, |
|
6.3 * height, |
|
7 * height |
|
), |
|
page4TopPosition: scroll.homeScrollHandler(5), |
|
}; |
|
|
|
export default function scrollAction(state = initialState, action) { |
|
let { type, data } = action; |
|
switch (type) { |
|
case "scroll/page1/floatMouse": |
|
return { ...state, floatMouseToggle: data }; |
|
case "scroll/page1/top": |
|
return { ...state, page1TopPosition: scroll.homeScrollHandler(1) }; |
|
case "scroll/page2/top": |
|
return { ...state, page2TopPosition: scroll.homeScrollHandler(2) }; |
|
case "scroll/page2/rotateX": |
|
return { |
|
...state, |
|
page2RotateX: scroll.linearFormula(window.scrollY, 45, 0, 0, height), |
|
}; |
|
case "scroll/page2/boxPosition": |
|
return { |
|
...state, |
|
page2BoxPosition: { |
|
translateY: scroll.linearFormula( |
|
data.scrollY, |
|
data.translateY.pos1, |
|
data.translateY.pos2, |
|
data.start, |
|
data.end |
|
), |
|
translateX: scroll.linearFormula( |
|
data.scrollY, |
|
data.translateX.pos1, |
|
data.translateX.pos2, |
|
data.start, |
|
data.end |
|
), |
|
rotate: scroll.linearFormula( |
|
data.scrollY, |
|
data.rotate.pos1, |
|
data.rotate.pos2, |
|
data.start, |
|
data.end |
|
), |
|
}, |
|
page2TopPosition: 0, |
|
page2RotateX: 0, |
|
}; |
|
case "scroll/page2/mobilePosition": |
|
return { |
|
...state, |
|
page2MobilePosition: scroll.linearFormula( |
|
window.scrollY, |
|
-(((height * 10) / 20 / width) * 100), |
|
6, |
|
2 * height, |
|
2.5 * height |
|
), |
|
page2BoxPosition: { translateX: 32, translateY: 10, rotate: 0 }, |
|
}; |
|
case "scroll/page2/videoPosition": |
|
return { |
|
...state, |
|
page2VideoPosition: scroll.videoLinearFormula(window.scrollY), |
|
page2VideoTopPosition: 50, |
|
}; |
|
case "scroll/page2/videoTopPosition": |
|
return { |
|
...state, |
|
page2VideoTopPosition: scroll.linearFormula( |
|
window.scrollY, |
|
70, |
|
50, |
|
2.8 * height, |
|
3 * height |
|
), |
|
page2MobilePosition: 6, |
|
}; |
|
case "scroll/page2/mobileUnit": |
|
return { |
|
...state, |
|
page2MobileUnit: scroll.initializeMobileUnit(window.scrollY), |
|
}; |
|
case "scroll/videoTube/top": |
|
return { ...state, videoTubeTopPosition: scroll.homeScrollHandler(3) }; |
|
case "scroll/test/translateY": |
|
const joiRect = JSON.parse(localStorage.getItem("joiRect")); |
|
return { |
|
...state, |
|
testTranslateY: scroll.linearFormula( |
|
window.scrollY, |
|
0, |
|
-101, |
|
4.5 * height, |
|
5 * height |
|
), |
|
videoTubeTopPosition: 0, |
|
page2VideoPosition: { |
|
width: joiRect.width, |
|
height: joiRect.height, |
|
top: joiRect.top, |
|
left: joiRect.left, |
|
}, |
|
}; |
|
case "scroll/page3/top": |
|
return { |
|
...state, |
|
page3TopPosition: scroll.homeScrollHandler(4), |
|
testTranslateY: -101, |
|
}; |
|
case "scroll/page3/testTranslateY": |
|
return { |
|
...state, |
|
page3TestTranslateY: scroll.linearFormula( |
|
window.scrollY, |
|
0, |
|
100, |
|
6.3 * height, |
|
7 * height |
|
), |
|
page3TopPosition: 0, |
|
}; |
|
case "scroll/page4/top": |
|
return { |
|
...state, |
|
page4TopPosition: scroll.homeScrollHandler(5), |
|
page3TestTranslateY: 100, |
|
}; |
|
default: |
|
return state; |
|
} |
|
}
|
|
|