Cart Error
+{item_count} items in your cart
+ {renderCartItems()}
+ Subtotal: {display_item_total}
+ Tax: {included_tax_total}
+ Total: {display_total}
+ Loading Product...
;
+ }
+
+ if (isSuccess) {
+ const variants = data?.data.relationships.variants.data;
+
+ const handleAddToCart = () =>
+ addToCart.mutate({
+ variant_id: Array.isArray(variants) ? variants[0].id : "",
+ quantity: 1
+ });
+
+ const handleKeyPress = (event: React.KeyboardEvent) => {
+ switch (event.key) {
+ case "ArrowLeft":
+ case "ArrowRight":
+ let productId: number = parseInt(`${id}`);
+ productId = event.key == "ArrowLeft" ? productId - 1 : productId + 1;
+
+ fetchProduct(`${productId}`)
+ .then((product) => {
+ router.push(`/${product?.data?.attributes?.slug}`);
+ })
+ .catch(() => {
+ /* product not found */
+ });
+ break;
+ }
+ };
+
+ const imageSource =
+ Array.isArray(data?.included) && data?.included[0]?.attributes?.styles?.[2].url;
+ const source = imageSource
+ ? `http://localhost:8080${imageSource}`
+ : "https://via.placeholder.com/400x600";
+ // const source = "https://via.placeholder.com/400x600";
+
+ return (
+
+
+
+
*/}
+
+
+ 
+
+
+ 
+
+ {data?.data?.attributes?.name}
+{data?.data?.attributes?.description}
+${data?.data?.attributes?.price}
+ + + +
+
+
+
+
+
+
+
+
+
+ Product Details
+ Model Info
+
+ FABRIC : 100% POLYESTER BUST : 29”LENGTH : 25 1/2”
+
+ Model info goes here:
+
+ Height: 5'8''
+
+ Bust: 32
+
+ Waist: 24''
+
+ Hip: 34"
+
+ Wearing Size: XS
+
you may also like:
+ {polProductList ? polProductList : <>} + + +PRODUCT NOT FOUND
;
+};
+
+export async function getServerSideProps() {
+ const queryClient = new QueryClient();
+
+ // await queryClient.prefetchQuery(["posts", 1], () => fetchPosts(1));
+ await queryClient.prefetchQuery(["streams", 1], () => fetchStreams(1));
+ await queryClient.prefetchQuery(["products", 1], () => fetchProducts(1));
+
+ return {
+ props: {
+ dehydratedState: dehydrate(queryClient)
+ }
+ };
+}
diff --git a/components/Category/index.ts b/components/Category/index.ts
new file mode 100644
index 00000000..aa97d92b
--- /dev/null
+++ b/components/Category/index.ts
@@ -0,0 +1 @@
+export { Category } from "./Category";
diff --git a/components/ComingSoon/ComingSoon.styles.tsx b/components/ComingSoon/ComingSoon.styles.tsx
new file mode 100644
index 00000000..0b1cd94a
--- /dev/null
+++ b/components/ComingSoon/ComingSoon.styles.tsx
@@ -0,0 +1,33 @@
+import styled from "@emotion/styled";
+
+export const Container = styled.div`
+ display: flex;
+ flex-direction: column;
+ position: relative;
+ justify-content: center;
+ align-items: center;
+ width: auto;
+ min-height: 100vh;
+`;
+
+export const Logo = styled.img`
+ width: auto;
+ height: 240px;
+
+ @media screen and (max-width: ${(p) => p.theme.breakpoints.values.sm}px) {
+ width: 90%;
+ height: auto;
+ }
+`;
+
+export const Text = styled.div`
+ text-align: center;
+ width: 425px;
+ top: 400px;
+ font-style: normal;
+ font-weight: normal;
+ font-size: 21.4598px;
+ line-height: 28px;
+ color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary};
+`;
diff --git a/components/ComingSoon/ComingSoon.tsx b/components/ComingSoon/ComingSoon.tsx
new file mode 100644
index 00000000..4c332450
--- /dev/null
+++ b/components/ComingSoon/ComingSoon.tsx
@@ -0,0 +1,17 @@
+import React from "react";
+import { NotifyForm, SocialLinks } from "../../components";
+import { Container, Logo, Text } from "./ComingSoon.styles";
+
+export const ComingSoon = () => {
+ const mailChimpUrl = `${process.env.MAILCHIMP_URL}?u=${process.env.MAILCHIMP_ID}&id=${process.env.MAILCHIMP_U}`;
+ return (
+ <>
+ Account Settings
+ Need Help?
+ +
-
- );
- }
-}
diff --git a/components/InfoBox/InfoBox.tsx b/components/InfoBox/InfoBox.tsx
new file mode 100644
index 00000000..f0eaa81f
--- /dev/null
+++ b/components/InfoBox/InfoBox.tsx
@@ -0,0 +1,16 @@
+import React from "react";
+import styled from "@emotion/styled";
+import { InfoBoxProps } from "./types";
+
+const Info = styled.div`
+ margin-top: 20px;
+ margin-bottom: 20px;
+ padding-top: 20px;
+ padding-bottom: 20px;
+ border-top: 1px solid #ececec;
+ border-bottom: 1px solid #ececec;
+`;
+
+export const InfoBox: React.FC
-
-
-
*/}
-
- - {this.state.songs[this.state.index] && - this.state.songs[this.state.index].title} -
- -
- {
- this.rap = element;
- }}
- autoPlay={this.state.isPlaying}
- onEnded={this._playNextSong}
- onError={this._ErrorNextSong}
- onPlay={(e) => this._playCurrentSong}
- onPause={(e) => this._pauseAudio}
- volume={this.state.volume}
- onVolumeChanged={this.handleChangeReverse}
- // onSeeked={this.seekbarFunction}
- muted={this.state.muted}
- style={styles}
- />
-
-
-
-
- {this.state.isPlaying ? (
-
-
- ) : (
-
-
- )}
-
-
-
-
-
-
-
-
-
- {children}
-
-);
-
-export { InfoBox };
diff --git a/components/InfoBox/types/index.d.ts b/components/InfoBox/types/index.d.ts
new file mode 100644
index 00000000..c3a74a0d
--- /dev/null
+++ b/components/InfoBox/types/index.d.ts
@@ -0,0 +1,3 @@
+export interface InfoBoxProps {
+ children: string;
+}
diff --git a/components/Layout/Layout.styles.tsx b/components/Layout/Layout.styles.tsx
new file mode 100644
index 00000000..e90b5bfa
--- /dev/null
+++ b/components/Layout/Layout.styles.tsx
@@ -0,0 +1,53 @@
+import styled from "@emotion/styled";
+import { pxIphone } from "../../utils";
+
+// export const LayoutContainer = styled.main`
+// width: 100%;
+// min-height: 100vh;
+// flex: 1;
+// display: flex;
+// flex-direction: column;
+// max-height: calc(100% - 235px);
+// `;
+// export const Content = styled.div`
+// width: 100%;
+// flex: 1;
+// display: flex;
+// flex-direction: column;
+// overflow: hidden;
+// `;
+
+type LogoType = {
+ src: string;
+ darkMode: boolean;
+};
+
+export const Logo = styled.img{loginForm.title}
+On Sale!
+hey
*/} + {subItems.map(({ item, i }: any) => { + return
+
+
+
+ ) : null}
+ {/* {renderMenuItems(menuItemsData && menuItemsData?.response_data.menu_location_listing[0], "", 0)} */}
+ {renderMenuItems(menusData, "", 0)}
+
+
+ Privacy Policy - Terms & Conditions -
+ RETURN POLICY
+
+ All Materials Copyright © {currYear} POL Clothing
+
+
+.
+.
+.
+
+
+
+3. right - The menu opens from the left by default.
+ To have it open from the right, use the right prop.
+ It's just a boolean so you don't need to specify a value.
+ Then set the position of the button using CSS.
+ example:
+
+
+
+#
+
+#
+
+
+.
+.
+.
+
+
+2. outerContainerId - the id of the element containing everything,including the menu component
+example:
+ shouldDisableOverlayClick() } />
+
+12. noTransition
+ You can disable all transitions/animations by passing
+ noTransition.
+ ;
+ onIconHoverChange?: Function;
+}
diff --git a/components/MainMenu/types/CrossIcon.d.ts b/components/MainMenu/types/CrossIcon.d.ts
new file mode 100644
index 00000000..e9c03610
--- /dev/null
+++ b/components/MainMenu/types/CrossIcon.d.ts
@@ -0,0 +1,13 @@
+import { MouseEventHandler, ReactElement } from "react";
+export type CrossIconStyles = {
+ bmCross: object;
+ bmCrossButton: object;
+};
+export interface CrossIconProps {
+ customIcon: ReactElement;
+ styles: CrossIconStyles;
+ crossClassName: string;
+ className: string;
+ onClick: MouseEventHandler;
+ isOpen: boolean;
+}
diff --git a/components/MainMenu/types/DesktopMenu.d.ts b/components/MainMenu/types/DesktopMenu.d.ts
new file mode 100644
index 00000000..8d0e11c6
--- /dev/null
+++ b/components/MainMenu/types/DesktopMenu.d.ts
@@ -0,0 +1,9 @@
+import { menuDataItem } from "./index";
+
+export interface IDesktopMenuProps {
+ // menusData: menuDataItem[];
+ menusData: any;
+ pcMenuItemClassName?: string;
+ pcWrapClassName?: string;
+ onMenuItemClick?: (keyPath: string, key: string) => void;
+}
diff --git a/components/MainMenu/types/baseStyles.d.ts b/components/MainMenu/types/baseStyles.d.ts
new file mode 100644
index 00000000..3e147adc
--- /dev/null
+++ b/components/MainMenu/types/baseStyles.d.ts
@@ -0,0 +1,8 @@
+export interface BaseStyles {
+ overlay: (isOpen: boolean) => object;
+ menuWrap: (isOpen: boolean, width: string, right: boolean) => object;
+ menu: () => object;
+ itemList: () => object;
+ item: () => object;
+}
+export type BaseStylesKey = keyof BaseStyles;
diff --git a/components/MainMenu/types/index.d.ts b/components/MainMenu/types/index.d.ts
new file mode 100644
index 00000000..1a72de87
--- /dev/null
+++ b/components/MainMenu/types/index.d.ts
@@ -0,0 +1,81 @@
+import { FunctionComponent, ReactElement, ReactNode } from "react";
+import { BurgerIconStyles } from "./BurgerIconProps";
+declare global {
+ interface Window {
+ mina: any;
+ gtag: any;
+ }
+}
+export type Path = {
+ animate: Function;
+};
+export type BurgerMenu = {
+ slide: ReactElement;
+ stack: ReactElement;
+ elastic: ReactElement;
+ bubble: ReactElement;
+ push: ReactElement;
+ pushRotate: ReactElement;
+ scaleDown: ReactElement;
+ scaleRotate: ReactElement;
+ fallDown: ReactElement;
+ reveal: ReactElement;
+};
+
+export type menuItem = {
+ name: string;
+ key: string;
+ icon?: () => ReactNode;
+};
+export type menuDataItem = {
+ name: string;
+ key: string;
+ children?: menuDataItem[];
+ icon?: () => ReactNode;
+ pcIcon?: () => ReactNode;
+ pcMenuItem?: ReactNode;
+};
+export interface MainMenuProps {
+ showMenuHeader?: boolean;
+ pcWrapClassName?: string;
+ pcMenuItemClassName?: string;
+ onMenuItemClick?: (keyPath: string, key: string) => void;
+ menusData: menuDataItem[];
+ animationType?: keyof BurgerMenu;
+ children?: JSX.Element | JSX.Element[];
+ bodyClassName?: string;
+ burgerBarClassName?: string;
+ burgerButtonClassName?: string;
+ className?: string;
+ crossButtonClassName?: string;
+ crossClassName?: string;
+ customBurgerIcon?: ReactElement | false;
+ customCrossIcon?: ReactElement | false;
+ customOnKeyDown?: EventListener;
+ disableAutoFocus?: boolean;
+ disableCloseOnEsc?: boolean;
+ disableOverlayClick?: boolean | Function;
+ htmlClassName?: string;
+ id?: string;
+ isOpen?: boolean;
+ itemClassName?: string;
+ itemListClassName?: string;
+ itemListElement?: "div" | "nav" | FunctionComponent<{ className: string; style: object }>;
+ menuClassName?: string;
+ menuFooter?: boolean;
+ morphShapeClassName?: string;
+ noOverlay?: boolean;
+ noTransition?: boolean;
+ onClose?: Function;
+ onIconHoverChange?: () => void;
+ onOpen?: Function;
+ onStateChange?: Function;
+ outerContainerId?: string;
+ overlayClassName?: string;
+ pageWrapId?: string;
+ right?: boolean;
+ showMenuHeader?: boolean;
+ styles?: BurgerIconStyles;
+ width?: number | string;
+ outterContainerId?: string;
+}
diff --git a/components/MainMenu/types/menuFactory.d.ts b/components/MainMenu/types/menuFactory.d.ts
new file mode 100644
index 00000000..91df61c9
--- /dev/null
+++ b/components/MainMenu/types/menuFactory.d.ts
@@ -0,0 +1,57 @@
+import { FunctionComponent, ReactElement } from "react";
+import { BurgerIconStyles } from "./BurgerIconProps";
+export type SVG = {
+ animate: Function;
+ lib: Function;
+ pathInitial?: string;
+ pathOpen: string;
+};
+export type MenuFactoryStyles = {
+ svg?: SVG;
+ overlay?: (isOpen: boolean, width: string, right: boolean) => object;
+ menuWrap?: (isOpen: boolean, width: string, right: boolean) => object;
+ menu?: (isOpen: boolean, width: string, right: boolean) => object;
+ itemList?: (isOpen: boolean, width: string, right: boolean) => object | undefined;
+ item?: (isOpen: boolean, width: string, right: boolean, nthChild: number) => object;
+ pageWrap?: (isOpen: boolean, width: string, right: boolean) => object;
+ outerContainer?: (isOpen: boolean) => object;
+ burgerIcon?: (isOpen: boolean, width: string, right: boolean) => object;
+ morphShape?: (isOpen: boolean, width: string, right: boolean) => object;
+ closeButton?: (isOpen: boolean, width: string, right: boolean) => object;
+};
+export type MenuFactoryStylesKey = keyof MenuFactoryStyles;
+export interface MenuProps {
+ isOpen?: boolean;
+ onStateChange: Function;
+ disableAutoFocus: boolean;
+ customOnKeyDown?: EventListener;
+ onOpen?: Function;
+ onClose?: Function;
+ width?: number | string;
+ right?: boolean;
+ styles?: BurgerIconStyles;
+ noTransition: boolean;
+ htmlClassName?: string;
+ bodyClassName?: string;
+ pageWrapId: string;
+ outerContainerId?: string;
+ disableCloseOnEsc: boolean;
+ disableOverlayClick?: boolean | Function;
+ noOverlay: boolean;
+ overlayClassName: string;
+ customBurgerIcon?: ReactElement | false;
+ burgerButtonClassName?: string;
+ burgerBarClassName?: string;
+ onIconStateChange?: () => void;
+ id: string;
+ className: string;
+ morphShapeClassName: string;
+ itemListElement?: "div" | "nav" | FunctionComponent<{ className: string; style: object }>;
+ itemListClassName: string;
+ itemClassName: string;
+ customCrossIcon?: ReactElement | false;
+ crossClassName: string;
+ crossButtonClassName: string;
+ menuClassName: string;
+ children: JSX.Element | JSX.Element[];
+}
diff --git a/components/MainMenu/utils.ts b/components/MainMenu/utils.ts
new file mode 100644
index 00000000..fe2225c7
--- /dev/null
+++ b/components/MainMenu/utils.ts
@@ -0,0 +1 @@
+export const pxToNum = (val: string) => parseInt(val.slice(0, -2), 10);
diff --git a/components/MediaPlayer/MediaPlayer.styles.tsx b/components/MediaPlayer/MediaPlayer.styles.tsx
new file mode 100644
index 00000000..7860cb9e
--- /dev/null
+++ b/components/MediaPlayer/MediaPlayer.styles.tsx
@@ -0,0 +1,83 @@
+import styled from "@emotion/styled";
+import { keyframes } from "@emotion/react";
+
+export const StarsContainer = styled.div`
+ position: fixed;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ background-color: black;
+`;
+
+const spin = keyframes`
+ from {
+ transform: rotate(0deg)
+ }
+ to {
+ transform: rotate(360deg)
+ }
+`;
+
+export const Stars = styled.div`
+ content: "";
+ position: absolute;
+ width: 200%;
+ height: 200%;
+ top: -50%;
+ left: -50%;
+ background: url(img/stars.png) 0 0 repeat;
+ background-size: cover;
+ animation: ${spin} 180s linear infinite;
+`;
+
+export const GlowContainer = styled.div`
+ height: 100%;
+ width: 100%;
+ position: absolute;
+ z-index: 999;
+ overflow: hidden;
+ pointer-events: none;
+`;
+
+/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#2e04e8+0,660058+100&0+0,1+100 */
+export const Glow = styled.div`
+ background: radial-gradient(ellipse at center, rgba(46, 4, 232, 0) 0%, rgba(102, 0, 88, 1) 100%);
+ display: block;
+ height: 100%;
+ width: 100%;
+ top: 100px;
+ left: 0;
+ opacity: 0.66;
+ transform: scale(2.2);
+`;
+
+export const Skyline = styled.div`
+ z-index: 1;
+ position: fixed;
+ width: 100%;
+ left: 0;
+ bottom: 0px;
+ height: 490px;
+ display: block;
+ background: url(img/skyline.png) repeat-x;
+ background-size: 1775px 600px;
+ background-position: center -30px;
+ pointer-events: none;
+`;
+
+export const Cockpit = styled.div`
+ z-index: 2;
+ position: fixed;
+ width: 100%;
+ height: 100%;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ display: block;
+ background: url(img/cockpit.png) no-repeat;
+ background-size: 120% 120%;
+ background-position: top center;
+
+ pointer-events: none;
+`;
diff --git a/components/MediaPlayer/MediaPlayer.tsx b/components/MediaPlayer/MediaPlayer.tsx
new file mode 100644
index 00000000..78b048b1
--- /dev/null
+++ b/components/MediaPlayer/MediaPlayer.tsx
@@ -0,0 +1,414 @@
+import React, { useRef, useState, useEffect } from "react";
+import ReactAudioPlayer from "react-audio-player";
+import Image from "next/image";
+import { useTracks } from "../../hooks/useTracks";
+import { Video } from "../Video";
+const user_id = process.env.SC_USER_ID;
+const client_id = process.env.SC_CLIENT_ID;
+const client_secret = process.env.SC_CLIENT_SECRET;
+
+import { StarsContainer, Stars, GlowContainer, Glow, Skyline, Cockpit } from "./MediaPlayer.styles";
+import { NotifyForm } from "..";
+
+const styles = {
+ backgroundColor: "#1f1f1f",
+ paddingLeft: "17px",
+ paddingRight: "15px"
+};
+
+interface Props {}
+
+export interface S {
+ songs: any;
+ index: any;
+ isPlaying: boolean;
+ url: any;
+ currentTime: any;
+ duration: any;
+ muted: boolean;
+ volume: number;
+ reverse: any;
+ seeking: boolean;
+ seekable: any;
+ audioInput: any;
+ seekbarvalue: any;
+}
+
+export interface Song {
+ title: string;
+ permalink_url: string;
+ stream_url: string;
+}
+
+// export const MediaPlayer = (props: any): => {
+export const MediaPlayer = (props: any) => {
+ const {
+ error,
+ status,
+ data: songData,
+ isLoading,
+ isSuccess
+ }: { error: any; status: any; data: any; isLoading: boolean; isSuccess: boolean } = useTracks(
+ "smokeyyy"
+ );
+ //seekbarFunction: (e: Event) => void;
+ const rap = useRef();
+ const [songs, setSongs] = useState([]);
+ const [songIndex, setIndex] = useState(0);
+ const [isPlaying, setIsPlaying] = useState(false);
+ const [url, setUrl] = useState("");
+ const [currentTime, setCurrentTime] = useState("");
+ const [duration, setDuration] = useState("");
+ const [muted, setMuted] = useState(false);
+ const [volume, setVolume] = useState(1);
+ const [reverse, setReverse] = useState(100);
+ const [seeking, setSeeking] = useState(false);
+ const [seekable, setSeekable] = useState("");
+ const [audioInput, setAudioInput] = useState(null);
+ const [seekbarvalue, setSeekbarvalue] = useState("");
+
+ useEffect(() => {
+ const audio = document.getElementsByClassName("react-audio-player")[0];
+ // console.log( this.rap.audioEl.current);
+ //audio.addEventListener('timeupdate', this.UpdateTheTime, false);
+ // audio.addEventListener('durationchange', this.SetSeekBar, false);
+ // const seekbar = document.getElementById('seekbar');
+ // this.setState({ seekbarvalue: seekbar })
+ setAudioInput(audio);
+ const { current } = rap;
+ // if (rap && rap.audioEl && rap.audioEl.current) {
+ if (current) {
+ current.onvolumechange = (e: any) => {
+ console.log(`Events**********`, e);
+ };
+ }
+ //this.setState({ audioInput: this.rap });
+ // document.addEventListener("keypress", (e) => {
+ // console.log("KEYPRESSED*************", e)
+ // if (e.key === " ") {
+ // if (isPlaying) {
+ // this._pauseAudio();
+ // } else {
+ // this._playCurrentSong();
+ // }
+ // }
+ // });
+
+ /* Update state songs while data is passed from parent component while ready and formated */
+ // setSongs(props.songs);
+ }, [songs, rap, props.songs]);
+
+ const ApiCall = async () => {
+ console.log("Starting API call");
+
+ const userTracks = await useTracks("smokeyyy");
+ // const userTracks = await sc.playlists.getV2("smokeyyy");
+ // const userTracks = await fetch("/api/corsProxy").then((res: any) => {
+ // console.log("res: ", res);
+ // return res;
+ // }).catch((err: any) => { throw Error(err) });
+ // const userTracks = await fetch("/api/corsProxy");
+ // const trackData = userTracks.json();
+ console.log("Tracks: ", userTracks, songData);
+ // setSongs(userTracks);
+ // return userTracks;
+ // SC.initialize({
+ // client_id: `${process.env.SC_CLIENT_ID}`,
+ // redirect_uri: 'https://smokey.fm/player'
+ // });
+ // SC.get('/user/6319082/tracks')
+ // .then(tracks => {
+ // console.log('Latest tracks: ', tracks);
+ // return tracks.json();
+ // })
+ // .then(result => {
+ // this.setState({ songs: result[0].tracks }, () => this.GetUrl());
+ // },
+ // (error) => {}
+ // );
+ // fetch(
+ // `https://api.soundcloud.com/users/${user_id}/playlists?client_id=${client_id}`,
+ // {
+ // method: "GET",
+ // headers: {
+ // "Content-type": "application/json;charset=UTF-8",
+ // "Authorization": `OAuth ${client_secret}`
+ // }
+ // }
+ // )
+ // fetch(
+ // "https://api.soundcloud.com/users/6319082/playlists?client_id=" +
+ // `${client_id}`
+ // )
+ // .then((res) => res.json())
+ // .then(
+ // (result) => {
+ // this.setState({ songs: result[0].tracks }, () => this.GetUrl());
+ // },
+ // (error) => {}
+ // );
+ return userTracks;
+ };
+
+ const GetCurrentTimeAndDuration = () => {
+ const { current } = rap;
+ // setCurrentTime(rap.audioEl.current.currentTime);
+ // setDuration(rap.audioEl.current.duration);
+ // setDuration(rap.audioEl.current.seeking);
+ // setDuration(rap.audioEl.current.seekable);
+ };
+
+ const randomArrayShuffle = (array: any) => {
+ var currentIndex = array.length,
+ temporaryValue,
+ randomIndex;
+ while (0 !== currentIndex) {
+ randomIndex = Math.floor(Math.random() * currentIndex);
+ currentIndex -= 1;
+ temporaryValue = array[currentIndex];
+ array[currentIndex] = array[randomIndex];
+ array[randomIndex] = temporaryValue;
+ }
+ return array;
+ };
+
+ // const GetUrl = () => {
+ // randomArrayShuffle(songs);
+
+ // const songUrl = songs.map((song: any) => {
+ // return song.stream_url + "?client_id=" + `${client_id}`;
+ // });
+ // setUrl(songUrl);
+ // //this.GetCurrentTimeAndDuration()
+ // };
+
+ // UpdateTheTime = () => {
+ // var sec = audioInput.currentTime;
+ // var h = Math.floor(sec / 3600);
+ // sec = sec % 3600;
+ // var min = Math.floor(sec / 60);
+ // sec = Math.floor(sec % 60);
+ // if (sec.toString().length < 2) sec = "0" + sec;
+ // if (min.toString().length < 2) min = 0 + min;
+ // document.getElementById('lblTime').innerHTML = h + ":" + min + ":" + sec;
+ // seekbarvalue.min = audioInput.startTime;
+ // seekbarvalue.max = audioInput.duration;
+ // seekbarvalue.value = audioInput.currentTime;
+ // }
+
+ // SetSeekBar = () => {
+ // seekbarvalue.min = 0;
+ // seekbarvalue.max = audioInput.duration;
+ // }
+
+ const handleChangeReverse = (value: any) => {
+ const finalValue = (value * 1) / 100;
+ if (finalValue) {
+ setVolume(finalValue);
+ }
+ };
+
+ const mutedPlayer = () => {
+ if (muted == true) {
+ setMuted(false);
+ } else {
+ setMuted(true);
+ }
+ };
+ const _playCurrentSong = () => {
+ // rap.audioEl.current.play();
+ setIsPlaying(true);
+ };
+
+ const _pauseAudio = () => {
+ // rap.audioEl.current.pause();
+ setIsPlaying(false);
+ };
+
+ const getRandomIndex = () => {
+ return Math.floor(Math.random() * songs.length);
+ };
+
+ const _playNextSong = () => {
+ if (songs && songs.length != undefined && songs.length != 0) {
+ let randomIndex = getRandomIndex();
+
+ if (randomIndex != songIndex) {
+ setIndex(randomIndex);
+ } else {
+ _playNextSong();
+ }
+ }
+ };
+
+ const _ErrorNextSong = (e: any) => {
+ console.log(
+ `${
+ songs[songIndex] && songs[songIndex].title
+ } can't be loaded \nAutomatically loading next song...`
+ );
+ _playNextSong();
+ };
+
+ const _renderSongPlayer = () => {
+ if (isLoading) {
+ return
+
+
+
+ {
- constructor(props: Props) {
- super(props)
- this.state = {
- toggle: false,
- ModalOpen: false
- }
- }
- render() {
- return (
- `
+ margin: 10px auto;
+ width: 300px;
+ display: block;
+ overflow: hidden;
+ & form {
+ transition: 0.33s all ease-in-out;
+ width: auto;
+ display: flex;
+ flex-direction: row;
+ flex-wrap: nowrap;
+ overflow: hidden;
+ justify-content: flex-start;
+ margin-left: ${(p) => `-${300 * p.index}px`};
+ }
+`;
+
+interface QuestionWrapperType {
+ isVisible?: boolean;
+}
+
+export const QuestionWrapper = styled.div`
+ display: ${(p) => (p.isVisible ? "block" : "none")};
+ width: 300px;
+`;
+
+export const EmailInput = styled.input`
+ text-align: left;
+ width: 300px;
+ height: 36.15px;
+ border: none;
+ box-sizing: border-box;
+ // position: absolute;
+ // left: 50%;
+ // margin-left: -150px;
+ outline: none;
+ padding: 8px 15px;
+ background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23333' stroke-width='4' stroke-dasharray='11%2c 33%2c 66%2c 10' stroke-dashoffset='0' stroke-linecap='round'/%3e%3c/svg%3e");
+ transition: 0.33s all ease-in-out;
+ &::placeholder {
+ color: ${(props) => props.theme.colors.blue.primary};
+ }
+ &:focus {
+ transition: 0.33s all ease-in-out;
+ color: ${(props) => props.theme.colors.blue.primary};
+ background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23333' stroke-width='4' stroke-dasharray='0' stroke-dashoffset='0' stroke-linecap='round'/%3e%3c/svg%3e");
+ }
+ &:focus::placeholder {
+ color: ${(props) => props.theme.colors.brand.bright};
+ }
+`;
+
+export const Button = styled.button`
+ transition: 0.33s all ease-in-out;
+ color: #000;
+ text-align: center;
+ width: 201px;
+ height: 36.15px;
+ margin-left: -100px;
+ background: rgb(154, 154, 154);
+ background: linear-gradient(90deg, rgba(154, 154, 154, 0) 0%, rgba(154, 154, 154, 1) 100%);
+ border: none;
+ box-sizing: border-box;
+ position: relative;
+ top: 0;
+ right: 0;
+ width: 75px;
+ cursor: pointer;
+ float: right;
+ &:hover {
+ transition: 0.33s all ease-in-out;
+ background: linear-gradient(90deg, rgba(2, 0, 36, 0) 0%, rgba(0, 0, 0, 1) 100%);
+ }
+ &:active {
+ background: ${(props) => props.theme.colors.black.primary};
+ color: ${(props) => props.theme.colors.white.primary};
+ }
+`;
+
+export const MailTo = styled.a`
+ text-decoration: none;
+ text-align: center;
+ line-height: 19px;
+ font-style: normal;
+ font-weight: 200;
+ font-size: 15px;
+ color: #ffffff;
+ padding-top: 25px;
+ bottom: 0;
+`;
diff --git a/components/NotifyForm/NotifyForm.tsx b/components/NotifyForm/NotifyForm.tsx
new file mode 100644
index 00000000..3f8f9656
--- /dev/null
+++ b/components/NotifyForm/NotifyForm.tsx
@@ -0,0 +1,197 @@
+// Reference:
+// https://leerob.io/blog/mailchimp-next-js
+
+import React, { useEffect, useState } from "react";
+
+import {
+ Container,
+ NotifyText,
+ FormWrapper,
+ QuestionWrapper,
+ EmailInput,
+ Button,
+ MailTo
+} from "./NotifyForm.styles";
+
+const notifyQuestions = [
+ {
+ id: "email",
+ question: "Wanna know when the product becomes available?",
+ placeholder: "Email",
+ buttonText: "Get Updates"
+ },
+ {
+ id: "firstName",
+ question: "Great. Btw, what's your name?",
+ placeholder: "First Name",
+ buttonText: "Save Name"
+ },
+ {
+ id: "lastName",
+ question: "Ok, and your last name?",
+ placeholder: "Last Name",
+ buttonText: "Save Name"
+ },
+ {
+ id: "phone",
+ question: "Perfect, wanna get text updates from us?",
+ placeholder: "Phone",
+ buttonText: "Sure"
+ }
+];
+
+export const NotifyForm = () => {
+ const [currentQuestion, setCurrentQuestion] = useState(0);
+ const [email, setEmail] = useState("");
+ const [firstName, setFirstName] = useState("");
+ const [lastName, setLastName] = useState("");
+ const [phone, setPhone] = useState("");
+ const [value, setValue] = useState("");
+ const [status, setStatus] = useState("");
+ const [message, setMessage] = useState("");
+
+ const switchQuestionSetter = (id: string, val: string) => {
+ switch (id) {
+ case "email":
+ return setEmail(val);
+ case "firstName":
+ return setFirstName(val);
+ case "lastName":
+ return setLastName(val);
+ case "phone":
+ return setPhone(val);
+ default:
+ return setValue(val);
+ }
+ };
+
+ const switchQuestionValue = (id: string) => {
+ switch (id) {
+ case "email":
+ return email;
+ case "firstName":
+ return firstName;
+ case "lastName":
+ return lastName;
+ case "phone":
+ return phone;
+ default:
+ return value;
+ }
+ };
+
+ const renderQuestions = (questionIndex: number) => {
+ const isCurrent = questionIndex === currentQuestion;
+ const isFirst = currentQuestion < 1;
+ const isLast = currentQuestion >= notifyQuestions.length;
+ return notifyQuestions.map((question, i) => {
+ return (
+
+ {!isLast && (
+ <>
+ {question.question}
+ switchQuestionSetter(question.id, e.target.value)}
+ />
+
+
+ )}
+
+ );
+ });
+ };
+
+ const handleSubmit = async (e: any, newContact: boolean) => {
+ e.preventDefault();
+ console.log("Submitting!");
+
+ const res = await fetch("/api/subscribe", {
+ body: JSON.stringify({
+ email: email,
+ firstName: firstName,
+ lastName: lastName,
+ phone: phone,
+ newContact: newContact
+ }),
+ headers: {
+ "Content-Type": "application/json"
+ },
+ method: "POST"
+ });
+
+ const resBody = await res.json();
+ console.log("Response: ", resBody);
+ setStatus("sending");
+
+ if (resBody.error.length) {
+ setStatus("error");
+ setMessage(resBody.error);
+ return;
+ } else {
+ const nextQuestionIndex =
+ currentQuestion < notifyQuestions.length ? currentQuestion + 1 : currentQuestion;
+ setStatus("success");
+ setMessage("Thanks so much! We'll keep you posted.");
+ setCurrentQuestion(nextQuestionIndex);
+ }
+ };
+
+ const clearFields = () => {
+ setEmail("");
+ // setFirstName('');
+ // setLastName('');
+ };
+
+ useEffect(() => {
+ // if (status === "success") clearFields();
+ // if(modalOpen && status === "success") clearFields();
+ }, [status]);
+
+ return (
+ <>
+
+
+
+ {/* MailChimp Status */}
+ {status === "sending" && (
+ sending...
+ )}
+ {status === "error" && (
+
+ {message === "Bad Request" ? `${message} or Email already exists` : message}
+
+ )}
+ {status === "success" && currentQuestion >= notifyQuestions.length && (
+ {message}
+ )}
+
+
+ Got Questions? We'd love to hear from you.
+
+
+
+ );
+};
diff --git a/components/NotifyForm/index.tsx b/components/NotifyForm/index.tsx
new file mode 100644
index 00000000..6224c5c1
--- /dev/null
+++ b/components/NotifyForm/index.tsx
@@ -0,0 +1 @@
+export { NotifyForm } from "./NotifyForm";
diff --git a/components/POLProductList/PolProductList.styles.tsx b/components/POLProductList/PolProductList.styles.tsx
new file mode 100644
index 00000000..a042ae80
--- /dev/null
+++ b/components/POLProductList/PolProductList.styles.tsx
@@ -0,0 +1,88 @@
+import styled from "@emotion/styled";
+import Rating from "@material-ui/lab/Rating";
+import { pxPC } from "../../utils";
+import { XlargeTitle, ProductTitle, DescText, PriceText } from "../../styles/BaseStyles";
+export const Container = styled.div`
+ margin-top: ${pxPC(30)};
+
+ & div div:first-of-type {
+ margin: 0 0 0 10px;
+ }
+`;
+export const Title = styled(XlargeTitle)`
+ margin-bottom: ${pxPC(26)};
+ color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary};
+`;
+export const ProductBox = styled.div`
+ margin-top: ${pxPC(30)};
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+ overflow-x: scroll;
+ overflow-y: hidden;
+`;
+export const ProductItem = styled.div`
+ margin-right: ${pxPC(26)};
+ width: ${pxPC(319)};
+ display: flex;
+ flex-direction: column;
+ justify-content: flex-start;
+ align-items: center;
+`;
+export const ProductImgOutterBox = styled.div`
+ height: ${pxPC(478)};
+ width: 100%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ overflow: hidden;
+`;
+export const ProductImg = styled.img`
+ object-fit: cover;
+ width: 100%;
+`;
+export const MyProductTitle = styled(ProductTitle)`
+ margin-top: ${pxPC(3)};
+`;
+export const ProductDesc = styled(DescText)`
+ margin-top: ${pxPC(3)};
+`;
+export const ProductFooter = styled.div`
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ align-self: stretch;
+`;
+export const ProductFooterLeft = styled.div``;
+export const ProductFooterRight = styled.div``;
+export const ProductRate = styled(Rating)`
+ margin-top: ${pxPC(18)};
+`;
+export const Price = styled(PriceText)`
+ margin-top: ${pxPC(11)};
+ text-align: right;
+`;
+export const ThreeDot = styled.div`
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+ margin-top: ${pxPC(3)};
+`;
+const Dot = styled.div`
+ width: ${pxPC(12)};
+ height: ${pxPC(12)};
+ border-radius: 50%;
+ border: 1px solid
+ ${(p) => (p.theme.isDarkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary)};
+ margin-right: ${pxPC(8)};
+`;
+export const Dot1 = styled(Dot)`
+ background: #cbc8bf;
+`;
+export const Dot2 = styled(Dot)`
+ background: #979d93;
+`;
+export const Dot3 = styled(Dot)`
+ background: #979d93;
+`;
diff --git a/components/POLProductList/PolProductList.tsx b/components/POLProductList/PolProductList.tsx
new file mode 100644
index 00000000..6ba312b4
--- /dev/null
+++ b/components/POLProductList/PolProductList.tsx
@@ -0,0 +1,73 @@
+import React, { useEffect } from "react";
+import { Swiper, SwiperSlide } from "swiper/react";
+import type { IProducts } from "@spree/storefront-api-v2-sdk/types/interfaces/Product";
+import { fetchStreams, fetchProducts, useProducts, useStreams } from "../../hooks";
+import { ProductCard } from "../ProductCard";
+import { Container, Title } from "./PolProductList.styles";
+
+// export interface ProductListProps {
+// data?: IProducts;
+// included?: any;
+// meta?: any;
+// links?: any;
+// }
+export interface PolProductListProps {
+ products?: IProducts;
+ title?: string;
+}
+const PolProductList: React.FC = (props) => {
+ const { products, title } = props;
+
+ if (products && Array.isArray(products.data)) {
+ return (
+
+ {props.title}
+
+ {products?.data?.map((item: any, index: any) => {
+ const defaultImg =
+ "https://static-assets.strikinglycdn.com/images/ecommerce/ecommerce-default-image.png";
+ const productImg = item.relationships?.images?.data[0]?.id;
+ const allImages = products
+ ? products?.included?.filter((e: any) => e.type == "image")
+ : [];
+ const foundImg = allImages
+ ? allImages.filter((e: any) => e["id"] == productImg)
+ : undefined;
+ const imgUrl = foundImg !== undefined ? foundImg[0]?.attributes?.styles[4]?.url : "";
+ const imgSrc = productImg ? `${process.env.SPREE_API_URL}${imgUrl}` : defaultImg;
+
+ let optionTypes = item.relationships?.option_types?.data;
+ let productOptionIds = optionTypes.map((i: any) => i.id);
+ let allOptions =
+ products && products?.included?.filter((e: any) => e.type == "option_value");
+ let productVariantColors = allOptions
+ ? allOptions?.filter((e: any) => e.attributes.presentation.includes("#"))
+ : null;
+ let foundOptions =
+ productVariantColors !== null
+ ? productVariantColors.filter((i: any) => {
+ // console.log("foundOption: ", i.relationships.option_type.data.id);
+ return productOptionIds.includes(i.relationships.option_type.data.id);
+ })
+ : null;
+ // console.log("list: ", products, productVariantColors, foundOptions);
+ return (
+
+
+ );
+ })}
+
+
+ );
+ }
+ return null;
+};
+
+export default PolProductList;
diff --git a/components/POLProductList/index.tsx b/components/POLProductList/index.tsx
new file mode 100644
index 00000000..52268b54
--- /dev/null
+++ b/components/POLProductList/index.tsx
@@ -0,0 +1 @@
+export { default } from "./PolProductList";
diff --git a/components/POLTerms/ElectronicSignaturesModal.css b/components/POLTerms/ElectronicSignaturesModal.css
new file mode 100644
index 00000000..45d58ebd
--- /dev/null
+++ b/components/POLTerms/ElectronicSignaturesModal.css
@@ -0,0 +1,48 @@
+/* Modal header container */
+.gkBGAw {
+ z-index: 1052;
+}
+
+/* Modal header h5 */
+.iJuqEf {
+ margin: 0 10%;
+}
+
+.es-modal-container {
+ margin-right: 10px;
+}
+
+.es-modal-btn-close {
+ cursor: pointer;
+ position: absolute;
+ top: 0;
+ right: 0;
+ margin-top: 17px;
+ margin-right: 20px;
+ width: 31px;
+ height: 31px;
+ background-size: cover;
+}
+
+.es-modal-content-container {
+ margin: 20px 0;
+ padding: 15px;
+}
+
+@media (max-width: 480px) {
+ .es-modal-content-container {
+ border: none !important;
+ }
+}
+
+.es-modal-text {
+ font-size: 14px;
+ line-height: 22px;
+ color: #696969;
+}
+
+.es-modal-content-title {
+ font-size: 16px;
+ color: #696969;
+ font-weight: 700;
+}
diff --git a/components/POLTerms/ElectronicSignaturesModal.tsx b/components/POLTerms/ElectronicSignaturesModal.tsx
new file mode 100644
index 00000000..1f331544
--- /dev/null
+++ b/components/POLTerms/ElectronicSignaturesModal.tsx
@@ -0,0 +1,138 @@
+/* eslint-disable no-console */
+import React from "react";
+// import PropTypes from "prop-types";
+
+// import { Close } from '@material-ui/icons';
+
+export const PolElectronicSignaturesModal = () => {
+ return (
+ = () => {
+ const [postCount, setPostCount] = useState(10);
+ const { data, isLoading, isFetching } = usePosts(postCount);
+
+ if (isLoading) return
+
+ {data?.map((post, index) => (
+
+
+ {index + 1}.
+ {post.title}
+
+
+ ))}
+
+ {postCount <= 90 && (
+ setPostCount(postCount + 10)} disabled={isFetching}>
+ {isFetching ? "Loading..." : "Show More"}
+
+ )}
+
+ );
+};
diff --git a/components/PostList/index.tsx b/components/PostList/index.tsx
index 1254dd87..c08f9c31 100644
--- a/components/PostList/index.tsx
+++ b/components/PostList/index.tsx
@@ -1,70 +1 @@
-import React, { useState } from "react";
-import { usePosts } from "../../hooks/usePosts";
-
-export const PostList = () => {
- const [postCount, setPostCount] = useState(10);
- const { data, isLoading, isFetching } = usePosts(postCount);
-
- if (isLoading) return
-
- );
-};
+export { PostList } from "./PostList";
diff --git a/components/PostList/types/index.d.ts b/components/PostList/types/index.d.ts
new file mode 100644
index 00000000..56637213
--- /dev/null
+++ b/components/PostList/types/index.d.ts
@@ -0,0 +1 @@
+export interface PostListProps {}
diff --git a/components/ProductCard/ProductCard.styles.tsx b/components/ProductCard/ProductCard.styles.tsx
new file mode 100644
index 00000000..15d335d9
--- /dev/null
+++ b/components/ProductCard/ProductCard.styles.tsx
@@ -0,0 +1,77 @@
+import styled from "@emotion/styled";
+import Link from "next/link";
+import Rating from "@material-ui/lab/Rating";
+import { pxPC } from "../../utils";
+import { XlargeTitle, DescText, PriceText } from "../../styles/BaseStyles";
+
+export const ProductCardWrapper = styled.div`
+ margin-top: ${pxPC(30)};
+ cursor: pointer;
+`;
+
+export const ProductImgWrapper = styled.div`
+ width: 100%;
+ height: ${pxPC(478)};
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ overflow: hidden;
+
+ @media (max-width: ${(p) => p.theme.breakpoints.values.sm}) {
+ flex-direction: column;
+ }
+`;
+export const ProductImg = styled.img`
+ object-fit: cover;
+ width: 100%;
+ height: 100%;
+`;
+export const ProductTitle = styled.h4`
+ font-family: ${(p) => p.theme.typography.titleSM.fontFamily};
+ color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary};
+`;
+export const ProductDesc = styled.p`
+ font-weight: 100;
+`;
+export const ProductFooter = styled.div`
+ display: flex;
+ justify-content: space-between;
+ align-items: start;
+ align-self: stretch;
+`;
+export const ProductFooterLeft = styled.div``;
+export const ProductFooterRight = styled.div``;
+export const ProductRate = styled(Rating)`
+ margin-top: ${pxPC(18)};
+`;
+export const Price = styled.h3`
+ font-family: ${(p) => p.theme.typography.titleSM.fontFamily};
+ color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary};
+ text-align: right;
+`;
+export const ThreeDot = styled.div`
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+ margin-top: ${pxPC(3)};
+`;
+export const Dot = styled.div`
+ width: ${pxPC(12)};
+ height: ${pxPC(12)};
+ border-radius: 50%;
+ border: 1px solid
+ ${(p) => (p.theme.isDarkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary)};
+ margin-right: ${pxPC(8)};
+ background: ${(p) => p.color};
+`;
+// export const Dot1 = styled(Dot)`
+// background: #cbc8bf;
+// `;
+// export const Dot2 = styled(Dot)`
+// background: #979d93;
+// `;
+// export const Dot3 = styled(Dot)`
+// background: #979d93;
+// `;
diff --git a/components/ProductCard/ProductCard.tsx b/components/ProductCard/ProductCard.tsx
new file mode 100644
index 00000000..b3f5246c
--- /dev/null
+++ b/components/ProductCard/ProductCard.tsx
@@ -0,0 +1,52 @@
+import React from "react";
+import { useRouter } from "next/router";
+
+import {
+ ProductCardWrapper,
+ ProductImgWrapper,
+ ProductImg,
+ ProductTitle,
+ ProductDesc,
+ ProductFooter,
+ ProductFooterLeft,
+ ProductFooterRight,
+ // ProductRate,
+ Price,
+ ThreeDot,
+ Dot
+ // Dot1,
+ // Dot2,
+ // Dot3
+} from "./ProductCard.styles";
+
+export const ProductCard = ({ imgSrc, item, opts }: any) => {
+ const router = useRouter();
+ // console.log("Card: ", item);
+ return (
+ router.push(`${item.attributes.slug}`)}>
+ <>
+
+
+
+
+ {item.attributes.name}
+ {/* {item.attributes.description} */}
+
+ {opts.slice(0, 5).map((opt: any, index: any) => {
+ // console.log("opt: ", opt);
+ return (
+
+
+
+ {/* ${item.attributes.price}
+
+
+
+
+ );
+};
diff --git a/components/ProductCard/index.tsx b/components/ProductCard/index.tsx
new file mode 100644
index 00000000..532659bc
--- /dev/null
+++ b/components/ProductCard/index.tsx
@@ -0,0 +1 @@
+export { ProductCard } from "./ProductCard";
diff --git a/components/ProductDetails/ProductDetails.styles.tsx b/components/ProductDetails/ProductDetails.styles.tsx
new file mode 100644
index 00000000..829bf6a0
--- /dev/null
+++ b/components/ProductDetails/ProductDetails.styles.tsx
@@ -0,0 +1,192 @@
+import styled from "@emotion/styled";
+import { ButtonBack, ButtonNext } from "pure-react-carousel";
+import { Slider, Slide, ImageWithZoom } from "pure-react-carousel";
+
+export const ProductContainer = styled.div`
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: center;
+ margin: 0 auto;
+ padding: 30px 0 30px;
+ width: 100%;
+ font-family: ${(p) => p.theme.typography.titleSM.fontFamily};
+`;
+
+export const ProductImageCarousel = styled.div`
+ width: 40%;
+ height: auto;
+ @media screen and (max-width: 800px) {
+ width: 100%;
+ }
+`;
+
+// These have default styles
+// These are overrides and need !important
+export const StyledSlider = styled(Slider)``;
+export const StyledSlide = styled(Slide)`
+ width: 100% !important;
+ height: 500px !important;
+`;
+export const StyledImageWithZoom = styled(ImageWithZoom)``;
+
+export const CarouselNav = styled.div`
+ width: 100%;
+ position: absolute;
+ left: 0;
+ top: 50%;
+ display: flex;
+ justify-content: space-between;
+`;
+
+export const CarouselBackButton = styled(ButtonBack)`
+ width: 50px;
+ height: 50px;
+ border-radius: 50%;
+ margin-left: 10px;
+ opacity: 0.11;
+ &:hover {
+ opacity: 1;
+ }
+`;
+
+export const CarouselNextButton = styled(ButtonNext)`
+ width: 50px;
+ height: 50px;
+ border-radius: 50%;
+ margin-right: 10px;
+ opacity: 0.11;
+ &:hover {
+ opacity: 1;
+ }
+`;
+
+export const ProductInfoBox = styled.div`
+ margin: 2%;
+`;
+
+export const ProductDescription = styled.div`
+ text-align: center;
+ max-width: 400px;
+ color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary};
+`;
+
+export const Detail = styled.h3`
+ font-family: ${(p) => p.theme.typography.titleSM.fontFamily};
+ @media screen and (max-width: 800px) {
+ font-size: 16px;
+ text-align: center;
+ }
+`;
+
+export const Price = styled.h1``;
+
+export const VariantSwatchList = styled.div`
+ width: 100%;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+`;
+
+export const VariantSwatch = styled.div`
+ display: block;
+ width: 30px;
+ height: 30px;
+ align-items: center;
+ border: 1px solid ${(p) => p.theme.colors.black.light};
+ margin: 0 10px 0 0;
+ background: ${(p) => p.color};
+
+ &:last-of-type {
+ margin: 0;
+ }
+`;
+
+export const SizesTitle = styled.p`
+ text-align: left;
+`;
+
+export const SizesPerPack = styled.div`
+ display: grid;
+ grid-template-columns: 20% 20% 20% 20% 20%;
+`;
+
+export const Size = styled.div`
+ display: grid;
+ grid-template-columns: 50% 50%;
+ align-items: center;
+ border: 1px solid ${(p) => p.theme.colors.black.light};
+ margin: 0 10px 0 0;
+ &:last-child {
+ margin: 0;
+ }
+`;
+
+export const SizeQty = styled.div`
+ padding: 3px 0 0 0;
+ border-right: 1px solid ${(p) => p.theme.colors.black.light};
+`;
+
+export const SizeTitle = styled.div`
+ padding: 3px 0 0 0;
+ background: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.gray.dark : p.theme.colors.gray.background};
+ text-transform: uppercase;
+`;
+
+export const ColorsTable = styled.div`
+ margin: 40px 0 40px 0;
+`;
+
+export const ColorsHead = styled.div``;
+
+export const ColorsTH = styled.div`
+ display: grid;
+ grid-template-columns: 40% 20% 20% 20%;
+ background: ${(p) => p.theme.colors.brand.primary};
+ color: ${(p) => p.theme.colors.white.primary};
+`;
+
+export const ColorsBody = styled.div`
+ border-left: 1px solid ${(p) => p.theme.colors.black.light};
+ border-right: 1px solid ${(p) => p.theme.colors.black.light};
+ border-bottom: 1px solid ${(p) => p.theme.colors.black.light};
+`;
+
+export const ColorsRow = styled.div`
+ display: grid;
+ grid-template-columns: 37.5% 5% 5% 5% 20% 25%;
+`;
+
+export const ColorsCell = styled.div`
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ padding: 4px 6px;
+ & input {
+ width: 100%;
+ border: 0;
+ background: transparent;
+ &:focus {
+ outline: none;
+ }
+ &::-webkit-outer-spin-button,
+ &::-webkit-inner-spin-button {
+ -webkit-appearance: none;
+ margin: 0;
+ }
+ }
+ & input[type="number"] {
+ -moz-appearance: textfield;
+ }
+`;
+
+export const BuyButton = styled.button`
+ font-family: ${(p) => p.theme.typography.titleSM.fontFamily};
+`;
+
+export const PropertyName = styled.span`
+ color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.gray.primary : p.theme.colors.black.primary};
+`;
diff --git a/components/ProductDetails/ProductDetails.tsx b/components/ProductDetails/ProductDetails.tsx
new file mode 100644
index 00000000..7934a790
--- /dev/null
+++ b/components/ProductDetails/ProductDetails.tsx
@@ -0,0 +1,530 @@
+import React, { useEffect, useState, useCallback } from "react";
+import { useRouter } from "next/router";
+import Head from "next/head";
+import { QueryClient } from "react-query";
+import { dehydrate } from "react-query/hydration";
+import { ArrowBack, ArrowForward } from "@material-ui/icons";
+import {
+ fetchStreams,
+ fetchProducts,
+ fetchVariants,
+ useProducts,
+ useStreams,
+ useVariants
+} from "../../hooks";
+import { Layout, LoadingWrapper, ProductList, Loading } from "../components";
+import { useProduct, fetchProduct } from "../../hooks/useProduct";
+import { useMutation, useQueryClient } from "react-query";
+import { addItemToCart } from "../../hooks/useCart";
+import { QueryKeys } from "../../hooks/queryKeys";
+import * as tracking from "../../config/tracking";
+import Featured from "../Home/Featured";
+import { FourOhFour } from "../404/FourOhFour";
+import { useMediaQuery } from "react-responsive";
+import homeData from "../Home/home.json";
+import { CarouselProvider, Slider } from "pure-react-carousel";
+import "pure-react-carousel/dist/react-carousel.es.css";
+// import ProductCard from "../components";
+
+import {
+ ProductContainer,
+ ProductImageCarousel,
+ ProductInfoBox,
+ ProductDescription,
+ StyledSlider,
+ StyledSlide,
+ StyledImageWithZoom,
+ CarouselNav,
+ CarouselBackButton,
+ CarouselNextButton,
+ Detail,
+ Price,
+ VariantSwatchList,
+ VariantSwatch,
+ SizesTitle,
+ SizesPerPack,
+ Size,
+ SizeQty,
+ SizeTitle,
+ ColorsTable,
+ ColorsHead,
+ ColorsTH,
+ ColorsBody,
+ ColorsRow,
+ ColorsCell,
+ BuyButton,
+ PropertyName
+} from "./ProductDetails.styles";
+import { boolean } from "yup";
+import { size } from "polished";
+
+const settings = {
+ speed: 500,
+ dots: false,
+ Infinite: false
+};
+
+interface ColorOptionType {
+ name: string;
+ quantity: number;
+}
+
+const productColors: ColorOptionType[] = [
+ {
+ name: "Yellow Rod",
+ quantity: 2
+ },
+ {
+ name: "Carnelian",
+ quantity: 2
+ }
+];
+
+interface ProductDetailsProps {
+ wholesale?: boolean;
+}
+
+export const ProductDetails = ({ wholesale }: ProductDetailsProps) => {
+ const router = useRouter();
+ const isMobile = useMediaQuery({ maxWidth: 767 });
+ const { asPath: productSlug } = router;
+ // console.log(productSlug);
+ const {
+ data: thisProduct,
+ isLoading,
+ isSuccess,
+ isError,
+ error: productError
+ } = useProduct(`${productSlug.toLowerCase().replace("/", "")}`);
+ const productImgs =
+ thisProduct && thisProduct?.included?.filter((e: any) => e["type"] === "image");
+ const productColorOptions =
+ thisProduct && thisProduct?.included?.filter((e: any) => e["type"] === "option_value");
+ const productVariantColors =
+ productColorOptions &&
+ productColorOptions?.filter((e: any) => e.attributes.presentation.includes("#"));
+ const productProperties =
+ thisProduct && thisProduct?.included?.filter((e: any) => e["type"] === "product_property");
+ const thisProductId = thisProduct?.data?.id || "";
+ const queryClient = useQueryClient();
+ const [packQtys, setPackQtys] = useState([
+ {
+ name: "XS",
+ qty: 2
+ },
+ {
+ name: "S",
+ qty: 2
+ },
+ {
+ name: "M",
+ qty: 2
+ },
+ {
+ name: "L",
+ qty: 2
+ },
+ {
+ name: "XL",
+ qty: 2
+ }
+ ]);
+
+ const totalPackQty = (sizes: any) => {
+ let qty = 0;
+ sizes.map((i: any) => qty + i.qty);
+ return qty;
+ };
+
+ const [colorOptions, setColorOptions] = useState(productVariantColors);
+ const [chosenVariants, setChoseVariants] = useState([]);
+ const [addItem, setAddItem] = useState({
+ variant_id: thisProduct?.data.id,
+ quantity: wholesale ? totalPackQty(packQtys) : 1
+ // public_metadata: {
+ // first_item_order: true
+ // },
+ // private_metadata: {
+ // recommended_by_us: false
+ // }
+ // options?: {
+ // [key: string]: string;
+ // };
+ });
+ // console.log("colors: ", productVariantColors);
+
+ const {
+ error: productsError,
+ status: productsStatus,
+ data: productsData,
+ isLoading: productsAreLoading,
+ isSuccess: productsAreSuccess
+ } = useProducts(1);
+ const randomNextProductId = productsAreSuccess
+ ? productsData?.data[Math.floor(Math.random() * productsData?.data?.length)].id
+ : "";
+
+ const {
+ error: variantsError,
+ status: variantsStatus,
+ data: variantsData,
+ isLoading: variantsAreLoading,
+ isSuccess: variantsAreSuccess
+ } = useVariants(1, thisProductId);
+
+ const similarProducts =
+ productsData && !isMobile ? (
+
+ {/* {item.attributes.options_text} */}
+
+
+ -
+
+ updatePackSelections(e)}
+ />
+
+ +
+ 24
+ ${item.attributes.price}
+
+ );
+ });
+ }
+ }, [productVariantColors]);
+
+ const renderProductImgs = useCallback(() => {
+ const productImgs =
+ thisProduct && thisProduct?.included?.filter((e: any) => e["type"] === "image");
+ const primaryImg = productImgs && productImgs[0].attributes.styles[9].url;
+ // console.log("rendered imgs: ", productImgs);
+ if (productImgs && productImgs.length < 1) {
+ return
+
+ );
+ }
+ return (
+ productImgs &&
+ productImgs.map((image, index) => {
+ // const img600 = image.attributes.styles.filter((e: any) => e['width'] == '600').url;
+ const imgUrl = image.attributes.styles[9].url;
+ const imgSrc = `${process.env.SPREE_API_URL}${imgUrl}`;
+ // console.log(imgSrc);
+ return (
+
+
+ );
+ })
+ );
+ }, [thisProduct]);
+
+ const renderVariantSwatches = useCallback(() => {
+ return (
+
+ {productVariantColors?.map((option: any, index: any) => {
+ const optionColor = option.attributes.presentation;
+ // console.log("Option: ", optionColor);
+ return
+ );
+ }, [productVariantColors]);
+
+ const renderProperties = useCallback(() => {
+ return (
+ <>
+ {productProperties?.map((property: any, index: any) => {
+ return (
+
+ {i.qty}
+ {i.name}
+
+ );
+ });
+ }, [packQtys]);
+
+ const handleAddToCart = (i: any) => {
+ console.log("ITEM: ", i);
+ addToCart.mutate(i);
+ };
+
+ useEffect(() => {
+ if (isSuccess) {
+ // // On page load, set focus on the product contaniner, because otherwise the arrow keys (left/right) won't work
+ // const productContainer = Array.from(
+ // document.getElementsByClassName("product-container")
+ // ).shift();
+
+ // if (productContainer) {
+ // (productContainer as HTMLElement).focus();
+ // }
+ tracking.trackEvent({
+ action: tracking.Action.VIEW_PRODUCT,
+ category: tracking.Category.PRODUCT_DETAIL,
+ label: thisProduct?.data?.attributes?.name
+ });
+ }
+ window.addEventListener("keydown", handleKeyPress);
+ return () => {
+ window.removeEventListener("keydown", handleKeyPress);
+ };
+ }, [isSuccess, handleKeyPress]);
+
+ if (isLoading) {
+ return (
+
+
+ );
+ }
+
+ if (isError) {
+ return
+
+
+ {thisProduct?.data.attributes.name} - {process.env.SITE_TITLE}
+
+
+
+
+
+
+ {/*
+
+
+ */}
+ {renderProductImgs()}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {wholesale &&${thisProduct?.data?.attributes?.price}
+
+ {wholesale && (
+ <>
+ Sizes Per Pack
+ {renderPackQtys()}
+
+ )}
+
+ {wholesale && (
+
+
+
+ Colors
+ Pack Qty
+ Pieces Qty
+ Pack Price
+
+
+ {renderColorOptions()}
+
+ )}
+
+ {/* RETAIL COLOR */}
+ {!wholesale && (
+
+ )}
+
+ {/* RETAIL SIZE */}
+ {!wholesale && (
+ handleAddToCart(addItem)}>
+ add to cart
+
+
+
+ {similarProducts ? similarProducts : <>}
+ {recommendedProducts ? recommendedProducts : <>}
+
+
+ );
+ }
+};
+
+export async function getServerSideProps() {
+ const queryClient = new QueryClient();
+
+ // await queryClient.prefetchQuery(["posts", 1], () => fetchPosts(1));
+ await queryClient.prefetchQuery(["streams", 1], () => fetchStreams(1));
+ await queryClient.prefetchQuery(["products", 1], () => fetchProducts(1));
+
+ return {
+ props: {
+ dehydratedState: dehydrate(queryClient)
+ }
+ };
+}
diff --git a/components/ProductDetails/index.ts b/components/ProductDetails/index.ts
new file mode 100644
index 00000000..142fd154
--- /dev/null
+++ b/components/ProductDetails/index.ts
@@ -0,0 +1 @@
+export { ProductDetails } from "./ProductDetails";
diff --git a/components/ProductList/ProductList.tsx b/components/ProductList/ProductList.tsx
new file mode 100644
index 00000000..afbbc3ea
--- /dev/null
+++ b/components/ProductList/ProductList.tsx
@@ -0,0 +1,85 @@
+import React from "react";
+import Link from "next/link";
+import { useProducts } from "../../hooks/useProducts";
+import { ProductListProps } from "./types";
+import styled from "@emotion/styled";
+
+const ProductsRow = styled.div`
+ display: grid;
+ grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
+`;
+const ProductContainer = styled.div`
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+`;
+const MyImg = styled.img`
+ height: 300px;
+ width: 240px;
+ object-fit: contain;
+`;
+const MyH1 = styled.h1`
+ font-size: 20px;
+`;
+const MySection = styled.section`
+ padding-bottom: 20px;
+`;
+const MyLi = styled.li`
+ display: block;
+ margin-bottom: 10px;
+`;
+const MyDiv = styled.div`
+ align-items: center;
+ display: flex;
+`;
+export const ProductList: React.FC = () => {
+ const { data: products, isLoading, isSuccess } = useProducts(1);
+ if (isLoading) return Loading ;
+
+ if (!isSuccess) {
+ return Could not load products ;
+ }
+
+ return (
+
+
+ {products?.data?.map((product) => {
+ const imageId =
+ Array.isArray(product.relationships.images.data) &&
+ product.relationships.images.data[0]?.id;
+ const imageSource = products?.included?.find((image: any) => image.id === imageId)
+ ?.attributes.styles[2].url;
+ const productColorOptions =
+ products && products?.included?.filter((e: any) => e["type"] === "option_value");
+ const productVariantColors =
+ productColorOptions &&
+ productColorOptions?.filter((e: any) => e.attributes.presentation.includes("#"));
+ const source = imageSource
+ ? `${process.env.SPREE_API_URL}/${imageSource}`
+ : "https://via.placeholder.com/150";
+ return (
+
+
+ {product.attributes.name}
+
+
+
+
+ );
+ })}
+
+
+ );
+};
diff --git a/components/ProductList/index.tsx b/components/ProductList/index.tsx
index 60f63f36..3181f51e 100644
--- a/components/ProductList/index.tsx
+++ b/components/ProductList/index.tsx
@@ -1,89 +1 @@
-import React from "react";
-import { useProducts } from "../../hooks/useProducts";
-
-export const ProductList = () => {
- const { data, isLoading, isFetching } = useProducts(1);
- if (isLoading) return
-
- );
-};
+export { ProductList } from "./ProductList";
diff --git a/components/ProductList/types/index.d.ts b/components/ProductList/types/index.d.ts
new file mode 100644
index 00000000..220f68f6
--- /dev/null
+++ b/components/ProductList/types/index.d.ts
@@ -0,0 +1,3 @@
+export interface ProductListProps {
+ products: any[];
+}
diff --git a/components/ResetPassword/ResetPassword.styles.tsx b/components/ResetPassword/ResetPassword.styles.tsx
new file mode 100644
index 00000000..2a97b6e1
--- /dev/null
+++ b/components/ResetPassword/ResetPassword.styles.tsx
@@ -0,0 +1,30 @@
+import styled from "@emotion/styled";
+import { Form } from "formik";
+
+interface GenericThemeType {
+ theme?: any;
+}
+
+export const ResetPasswordWrapper = styled.div`
+ width: 33%;
+ min-height: 60vh;
+ margin: 0 auto;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+`;
+
+export const FormWrapper = styled(Form)`
+ width: 100%;
+`;
+
+export const InputWrapper = styled.div`
+ text-align: left;
+ margin: 10px 0;
+
+ & .MuiFormControl-root.MuiTextField-root {
+ width: 100%;
+ }
+`;
diff --git a/components/ResetPassword/ResetPassword.tsx b/components/ResetPassword/ResetPassword.tsx
new file mode 100644
index 00000000..7e973d84
--- /dev/null
+++ b/components/ResetPassword/ResetPassword.tsx
@@ -0,0 +1,59 @@
+import * as React from "react";
+import Link from "next/link";
+import { useRouter } from "next/router";
+import { Formik, Form, Field, ErrorMessage } from "formik";
+import styled from "@emotion/styled";
+import { FormikInput } from "../FormikWrappers";
+
+import { resetPasswordForm } from "../AuthForm/constants";
+import { ResetPasswordWrapper, FormWrapper, InputWrapper } from "./ResetPassword.styles";
+
+const FieldContainer = styled.div`
+ margin: 15px 0px;
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ justify-content: flex-start;
+`;
+
+export const ResetPassword = () => {
+ return (
+
+ {
+ resetPasswordForm
+ .onSubmit(values)
+ .then(() => {
+ setSubmitting(false);
+ })
+ .catch(() => {
+ setSubmitting(false);
+ });
+ }}
+ >
+ {({ isSubmitting }) => (
+
+
+
+
+
+
+ )}
+
+
+ );
+};
diff --git a/components/ResetPassword/index.tsx b/components/ResetPassword/index.tsx
new file mode 100644
index 00000000..fb1e17a6
--- /dev/null
+++ b/components/ResetPassword/index.tsx
@@ -0,0 +1 @@
+export { ResetPassword } from "./ResetPassword";
diff --git a/components/SearchBar/SearchBar.styles.ts b/components/SearchBar/SearchBar.styles.ts
new file mode 100644
index 00000000..5c443956
--- /dev/null
+++ b/components/SearchBar/SearchBar.styles.ts
@@ -0,0 +1,164 @@
+import { css } from "@emotion/react";
+import styled from "@emotion/styled";
+
+export const StyledSearch = styled.div`
+ position: relative;
+
+ #search {
+ height: 42px;
+ font-weight: normal;
+ }
+`;
+
+export const SearchBarWrapper = styled.div`
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+`;
+
+export const SearchInputWrapper = styled.div`
+ display: flex;
+ justify-content: flex-end;
+ width: 100%;
+`;
+
+interface StyledInputContainerType {
+ isExpanded: boolean;
+ isWidthSet: boolean;
+}
+
+export interface WithThemeType {
+ darkMode?: boolean;
+ theme?: {
+ colors: {
+ blue: {
+ primary: string;
+ };
+ gray: {
+ medium: string;
+ };
+ };
+ };
+}
+
+// Get Search input expanded, fitting nice with suggestion dropdown
+export const StyledInputContainer = styled.div`
+ position: relative;
+ display: inline-block;
+ width: ${(p) => (p.isExpanded ? "236px" : "0%")};
+ transition: 0.33s all ease-in-out;
+
+ & > input {
+ transition: 0.33s all ease-in-out;
+ background: transparent;
+ padding-left: ${(p) => (p.isExpanded ? "34px" : 0)};
+ margin-right: 10px;
+ border-bottom: ${(p) =>
+ p.isExpanded
+ ? `1px solid ${
+ p.theme.isDarkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary
+ }`
+ : 0};
+ width: ${(p) => (p.isWidthSet ? "140px" : "100%")};
+ ${(p) => (p.isExpanded ? "padding: 0px 26px 0 30px;" : null)}
+ }
+`;
+
+export const StyledInput = styled.input`
+ font-family: ${(p) => p.theme.typography.titleSM.fontFamily};
+ background: ${(p) => (p.darkMode ? p.theme.colors.black.primary : p.theme.colors.white.primary)};
+ caret-color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary};
+ color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary};
+ border: 0;
+ outline: none;
+`;
+
+const defaultPrefixStyles = css`
+ position: absolute;
+ display: flex;
+ align-items: center;
+ top: 0;
+ height: 100%;
+ width: 44px;
+ z-index: 3;
+ cursor: pointer;
+`;
+
+export const StyledInputPrefix = styled.div`
+ ${defaultPrefixStyles};
+ left: 5px;
+ justify-content: flex-start;
+
+ & > i {
+ color: ${(p) => (p.darkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary)};
+ }
+`;
+
+export const StyledInputPostfix = styled.div`
+ ${defaultPrefixStyles};
+ right: 5px;
+ justify-content: flex-end;
+ color: ${(p) => (p.darkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary)};
+
+ & > i {
+ color: ${(p) => (p.darkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary)};
+ }
+
+ &:hover {
+ color: ${(props) => props.theme.colors.brand.primary};
+ cursor: pointer;
+ }
+`;
+
+export const StyledIcon = styled.svg`
+ width: 1rem;
+ height: 1rem;
+
+ &.close-icon {
+ width: 13px;
+ height: 13px;
+ }
+`;
+
+export const ButtonWrapper = styled.div`
+ display: flex;
+ flex-direction: row;
+ flex-grow: 1;
+`;
+
+export interface SearchButtonProps {
+ darkMode?: boolean;
+ theme?: {
+ colors: {
+ white: { primary: string };
+ blue: {
+ primary: string;
+ medium: string;
+ };
+ };
+ };
+}
+
+export const SearchButton = styled.button`
+ margin: 16px 10px 10px -55px;
+ float: right;
+ position: absolute;
+ border: 0;
+ border-radius: 3px;
+ padding: 3px 18px;
+ color: ${(props) => props.theme.colors.white.primary};
+ background-color: ${(props) => props.theme.colors.blue.primary};
+ cursor: pointer;
+
+ &:hover {
+ background-color: ${(props) => props.theme.colors.blue.medium};
+ }
+`;
+export interface BrowseButtonProps {
+ small?: boolean;
+}
+export const BrowseButton = styled.button`
+ margin: 10px 10px 10px 20px;
+`;
diff --git a/components/SearchBar/SearchBar.tsx b/components/SearchBar/SearchBar.tsx
new file mode 100644
index 00000000..14121d1c
--- /dev/null
+++ b/components/SearchBar/SearchBar.tsx
@@ -0,0 +1,205 @@
+import React, {
+ useState,
+ useEffect,
+ createRef,
+ useRef,
+ useCallback,
+ KeyboardEvent,
+ MouseEvent,
+ TouchEvent
+} from "react";
+import {
+ StyledSearch,
+ StyledInputContainer,
+ SearchInputWrapper,
+ StyledInput,
+ StyledIcon,
+ StyledInputPrefix,
+ StyledInputPostfix,
+ SearchButton,
+ BrowseButton,
+ SearchBarWrapper,
+ ButtonWrapper
+} from "./SearchBar.styles";
+import AutoComplete from "../SearchSuggestions";
+import { useRouter } from "next/router";
+import { useOnClickOutside } from "../../hooks";
+import { SearchBarProps } from "./types";
+import * as tracking from "../../config/tracking";
+import { Search } from "@material-ui/icons";
+
+const SearchBar = ({
+ darkMode,
+ placeholder = "Search...",
+ autoComplete = true,
+ value = "",
+ ...rest
+}: SearchBarProps) => {
+ const router = useRouter();
+ const [query, setQuery] = useState(value);
+ const [isAutoCompleteVisible, setIsAutocompleteVisible] = useState(false);
+ const [isExpanded, setIsExpanded] = useState(false);
+ const [isWidthSet, setIsWidthSet] = useState(false);
+ const [isSearchLoading, setIsSearchLoading] = useState(false);
+ // const [isSearchInputFocusable, setIsSearchInputFocusable] = useState(false);
+
+ const handleSearchChange = (e: any) => {
+ const { value } = e.target;
+ if (value.length === 0) handleSearchClear();
+ setQuery(value);
+ setIsAutocompleteVisible(true);
+ };
+
+ const handleSearchClear = () => {
+ setQuery("");
+ setIsAutocompleteVisible(false);
+ };
+
+ const { ref: dropdownRef } = useCustomRef();
+
+ const handleClickOutside = useCallback((event: Event) => {
+ const someNode = event.target as Node;
+ if (dropdownRef.current && !dropdownRef.current?.contains(someNode)) {
+ setIsAutocompleteVisible(false);
+ }
+ }, []);
+
+ useOnClickOutside(dropdownRef, handleClickOutside);
+
+ useEffect(() => {
+ // !isSearchInputFocusable && setIsSearchInputFocusable(!isSearchInputFocusable);
+ document.addEventListener("mousedown", handleClickOutside);
+ document.addEventListener("touchstart", handleClickOutside);
+
+ return () => {
+ document.removeEventListener("mousedown", handleClickOutside);
+ document.removeEventListener("touchstart", handleClickOutside);
+ };
+ }, []);
+
+ const keyboardEvents = (event: KeyboardEvent) => {
+ // TO DO: handle UP & DOWN keys
+ switch (event.key) {
+ case "Escape":
+ case "Tab":
+ setIsAutocompleteVisible(false);
+ break;
+ case "Enter":
+ if (query.length > 3) {
+ if (event.key === "Enter" && query.length > 3) {
+ tracking.trackEvent({
+ action: tracking.Action.PRESS_ENTER,
+ category: tracking.Category.SEARCH_BAR,
+ label: query
+ });
+
+ router.push(`/search?term=${query}`);
+ }
+ }
+ break;
+
+ default:
+ break;
+ }
+ };
+
+ const selectSuggestion = (suggestion: string) => {
+ tracking.trackEvent({
+ action: tracking.Action.SELECT_SUGGESTION,
+ category: tracking.Category.SEARCH_BAR,
+ label: suggestion
+ });
+
+ setQuery(suggestion);
+ };
+
+ // Wait to set search width until exanding animation (0.33s) completes
+ const handleSetSearchWidth = () =>
+ setTimeout(() => {
+ setIsWidthSet(!isWidthSet);
+ }, 330);
+
+ // Open Search, unless open then close/hide everything and remove explicit search width
+ const searchRef = createRef();
+
+ const toggleSearch = () => {
+ const currSearchElement = searchRef.current!;
+ if (currSearchElement) {
+ currSearchElement.focus();
+ }
+ setIsExpanded(!isExpanded);
+ isWidthSet ? setIsWidthSet(!isWidthSet) : handleSetSearchWidth();
+ setQuery("");
+ isAutoCompleteVisible && setIsAutocompleteVisible(!isAutoCompleteVisible);
+ };
+
+ const labelId = "label-search";
+ const dropdownId = "dropdown-search";
+
+ return (
+
+
+
+
+
+
+
+ keyboardEvents(e)}
+ tabIndex={0}
+ value={query}
+ placeholder={placeholder}
+ onChange={handleSearchChange}
+ id="search"
+ aria-controls={dropdownId}
+ aria-labelledby={labelId}
+ role="textbox"
+ autoComplete="off"
+ />
+ {query && (
+
+
+
+ )}
+
+
+ {/*
+ Search
+ */}
+
+
+ {autoComplete ? (
+ setIsSearchLoading}
+ isVisible={isAutoCompleteVisible}
+ toggleVisibility={(e: any) => setIsAutocompleteVisible(e)}
+ id={dropdownId}
+ labelId={labelId}
+ onSelect={(e: any) => selectSuggestion(e)}
+ query={query}
+ />
+ ) : null}
+
+ );
+};
+
+const useCustomRef = () => {
+ const myRef = useRef(null);
+
+ return { ref: myRef };
+};
+
+export default SearchBar;
diff --git a/components/SearchBar/index.ts b/components/SearchBar/index.ts
new file mode 100644
index 00000000..f3cedd3e
--- /dev/null
+++ b/components/SearchBar/index.ts
@@ -0,0 +1 @@
+export { default } from "./SearchBar";
diff --git a/components/SearchBar/types/index.d.ts b/components/SearchBar/types/index.d.ts
new file mode 100644
index 00000000..976fa4cf
--- /dev/null
+++ b/components/SearchBar/types/index.d.ts
@@ -0,0 +1,7 @@
+export * from "./SearchBar";
+export interface SearchBarProps {
+ darkMode?: boolean;
+ placeholder?: string;
+ autoComplete?: boolean;
+ value?: string;
+}
diff --git a/components/SearchSuggestions/SearchSuggestions.styles.tsx b/components/SearchSuggestions/SearchSuggestions.styles.tsx
new file mode 100644
index 00000000..81413ff5
--- /dev/null
+++ b/components/SearchSuggestions/SearchSuggestions.styles.tsx
@@ -0,0 +1,95 @@
+import styled from "@emotion/styled";
+
+export interface StyledSearchSuggestionsProps {
+ theme?: {
+ colors: {
+ blue: { primary: string };
+ gray: { background: string };
+ };
+ };
+}
+export const StyledSearchSuggestions = styled.div`
+ position: absolute;
+ display: block;
+ width: 100%;
+ max-height: 245px;
+
+ background: white;
+ border-radius: 0px 0px 12px 12px;
+ box-shadow: 0 7px 13px 1px rgba(24, 41, 60, 0.1);
+ overflow-y: auto;
+ overflow-x: hidden;
+ z-index: 1;
+
+ &::-webkit-scrollbar {
+ width: 20px;
+ border-radius: 0 0 12px 0;
+ background-color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.black.light : p.theme.colors.white.primary};
+ }
+
+ &::-webkit-scrollbar-thumb {
+ border-radius: 12px;
+ height: 80px;
+ background-color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.black.medium : p.theme.colors.gray.background};
+ /* box-shadow: 0 2px 12px rgba(0, 0, 0, 0.33); */
+ transition: 1s all ease-in-out;
+ &:active {
+ transition: 1s all ease-in-out;
+ /* box-shadow: 0 2px 20px rgba(0, 0, 0, 0.22); */
+ }
+ }
+
+ &::-webkit-scrollbar-track {
+ border-radius: 12px;
+ background-color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.gray.dark : p.theme.colors.gray.light};
+ }
+`;
+export interface StyledSuggestionLinkProps {
+ theme?: {
+ colors: {
+ blue: {
+ primary: string;
+ };
+ gray: {
+ background: string;
+ };
+ };
+ };
+}
+export const StyledSuggestionLink = styled.div`
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 12px 16px 12px 30px;
+ font-family: ${(p) => p.theme.typography.titleSM.fontFamily};
+ background-color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.black.primary : p.theme.colors.white.primary};
+ color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary};
+
+ font-size: 14px;
+ font-weight: 700;
+ text-align: left;
+ cursor: pointer;
+
+ &:hover {
+ text-decoration: none;
+ background-color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.gray.medium : p.theme.colors.gray.background};
+ color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary};
+ }
+
+ mark {
+ font-weight: 400;
+ }
+`;
+
+export const StyledSuggestionContent = styled.div`
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+`;
diff --git a/components/SearchSuggestions/SearchSuggestions.tsx b/components/SearchSuggestions/SearchSuggestions.tsx
new file mode 100644
index 00000000..2aae8e55
--- /dev/null
+++ b/components/SearchSuggestions/SearchSuggestions.tsx
@@ -0,0 +1,72 @@
+import React, { useContext, useEffect, useState } from "react";
+import { useQuery } from "react-query";
+import { LoadingIcon } from "..";
+import { useProducts } from "../../hooks/useProducts";
+import { StyledSearchSuggestions } from "./SearchSuggestions.styles";
+import Suggestion from "./Suggestion";
+import { SearchSuggestionsProps } from "./types";
+
+const SearchSuggestions = ({
+ id,
+ labelId,
+ isVisible,
+ setIsSearchLoading,
+ toggleVisibility,
+ onSelect,
+ query
+}: SearchSuggestionsProps) => {
+ const {
+ error,
+ status,
+ data,
+ isLoading,
+ isSuccess
+ }: { error: any; status: any; data: any; isLoading: boolean; isSuccess: boolean } =
+ useProducts(1);
+ const [page, setPage] = useState(1);
+ const [suggestions, setSuggestions] = useState([]);
+ // const [error, setError] = useState('');
+
+ useEffect(() => {
+ // getSearchData();
+ // data ? console.log("stuff: ", data) : null;
+ // console.log("suggestions: ", suggestions, "data: ", data);
+ }, []);
+
+ if (isLoading) {
+ setIsSearchLoading();
+ return (
+
+
+ );
+ }
+
+ if (error && isVisible) {
+ return (
+
+
+ );
+ }
+
+ setIsSearchLoading();
+ return (
+
+ {isVisible &&
+ data?.data?.map((item: any, index: any) => {
+ return (
+ toggleVisibility(e)}
+ onChange={(e: any) => onSelect(e)}
+ query={query}
+ />
+ );
+ })}
+
+ );
+};
+
+export default SearchSuggestions;
diff --git a/components/SearchSuggestions/Suggestion.tsx b/components/SearchSuggestions/Suggestion.tsx
new file mode 100644
index 00000000..4ba0ae9c
--- /dev/null
+++ b/components/SearchSuggestions/Suggestion.tsx
@@ -0,0 +1,57 @@
+import React from "react";
+import { useRouter } from "next/router";
+import { nanoid } from "nanoid";
+import { IProduct } from "@spree/storefront-api-v2-sdk/types/interfaces/Product";
+// import { useDispatch } from 'react-redux';
+// import { commonOperations } from '@common/ducks';
+import { StyledSuggestionLink, StyledSuggestionContent } from "./SearchSuggestions.styles";
+const formatWithHighlight = (text: string, query: string | undefined) => {
+ if (!query) return text;
+
+ const sanitizeString = (str: any) => {
+ str = str.replace(/[^a-z0-9áéíóúñü \.,_-]/gim, "");
+ return str.trim();
+ };
+
+ const reg = new RegExp(`(${sanitizeString(query)})`, "gi");
+ const textParts = text.split(reg);
+ return textParts.map((part: any) =>
+ part.match(reg) ? (
+ part
+ ) : (
+
+ {part}
+
+ )
+ );
+};
+type OwnProps = {
+ suggestion?: any;
+ query?: string;
+ onChange: (e: any) => void;
+ toggleVisibility: (e: any) => void;
+};
+
+const Suggestion = ({ suggestion, query, onChange, toggleVisibility }: OwnProps) => {
+ const router = useRouter();
+ const handleSelection = (e: any) => {
+ onChange("");
+ e.preventDefault();
+ toggleVisibility(false);
+ router.push(`/${suggestion.attributes.slug}`);
+ };
+
+ if (suggestion) {
+ return (
+
+
+ {formatWithHighlight(suggestion.attributes.name, query)}
+
+
+ );
+ } else {
+ return <>;
+ }
+};
+
+export default Suggestion;
diff --git a/components/SearchSuggestions/index.ts b/components/SearchSuggestions/index.ts
new file mode 100644
index 00000000..9eb99f52
--- /dev/null
+++ b/components/SearchSuggestions/index.ts
@@ -0,0 +1 @@
+export { default } from "./SearchSuggestions";
diff --git a/components/SearchSuggestions/types/SearchSuggestions.d.ts b/components/SearchSuggestions/types/SearchSuggestions.d.ts
new file mode 100644
index 00000000..48fb2439
--- /dev/null
+++ b/components/SearchSuggestions/types/SearchSuggestions.d.ts
@@ -0,0 +1,8 @@
+export interface SearchSuggestionsProps {
+ id?: string;
+ labelId?: string;
+ isVisible?: boolean;
+ query?: string;
+ toggleVisibility: (e) => void;
+ onSelect: (e) => void;
+}
diff --git a/components/SearchSuggestions/types/index.d.ts b/components/SearchSuggestions/types/index.d.ts
new file mode 100644
index 00000000..fd5e03e9
--- /dev/null
+++ b/components/SearchSuggestions/types/index.d.ts
@@ -0,0 +1,10 @@
+export * from "./SearchSuggestions";
+export interface SearchSuggestionsProps {
+ id?: string;
+ labelId?: string;
+ isVisible?: boolean;
+ setIsSearchLoading: () => void;
+ toggleVisibility: (e) => void;
+ onSelect: (e) => void;
+ query?: string;
+}
diff --git a/components/SignupForm/POLQuestions/Account.tsx b/components/SignupForm/POLQuestions/Account.tsx
new file mode 100644
index 00000000..3362835e
--- /dev/null
+++ b/components/SignupForm/POLQuestions/Account.tsx
@@ -0,0 +1,251 @@
+// Vendor
+import React, { useState, useCallback, createRef } from "react";
+import { Carousel } from "react-responsive-carousel";
+import { Field, useFormikContext } from "formik";
+import parse from "html-react-parser";
+import { Modal } from "@material-ui/core";
+
+// Local
+import TipBot from "../../TipBot";
+import Static from "../../../utilities/staticData";
+import { FormikInput, FormikPhone, FormikCheckbox } from "../../FormikWrappers";
+import {
+ Title,
+ Subtitle,
+ Description,
+ QuestionWrapper,
+ InputGroupWrapper,
+ InputWrapper,
+ TermsWrapper,
+ TermsStatement,
+ Term,
+ StyledModalContent
+} from "./Questions.styles";
+import { PolElectronicSignaturesModal } from "../../POLTerms/ElectronicSignaturesModal";
+import { PolFinancialPrivacyModal } from "../../POLTerms/FinancialPrivacyModal";
+
+export const Account = () => {
+ // const { values, form, submitForm } = useFormikContext();
+ // console.log("FORM: ", values, useFormikContext);
+ // const { errors, touched } = useFormikContext();
+
+ const [openSignatureModal, setOpenSignatureModal] = useState(false);
+ const [openPrivacyModal, setOpenPrivacyModal] = useState(false);
+
+ const [currentSlide, setCurrentSlide] = useState(0);
+
+ const [signatureTerms, setSignatureCheckbox] = useState(false);
+ const [privacyTerms, setPrivacyCheckbox] = useState(false);
+ // const [reportingTerms, setReportingCheckbox] = useState(false);
+ // const [authorizeTerms, setAuthorizeCheckbox] = useState(false);
+
+ const toggleSignatureModal = () => {
+ setOpenSignatureModal(!openSignatureModal);
+ };
+
+ const togglePrivacyModal = () => {
+ setOpenPrivacyModal(!openPrivacyModal);
+ };
+
+ // const updateCurrentSlide = index => {
+ // if (currentSlide !== index) {
+ // setCurrentSlide(index);
+ // }
+ // };
+
+ const nextSlide = () => {
+ setCurrentSlide(currentSlide + 1);
+ };
+
+ const handleSignatureCheckbox = (field: any) => {
+ setSignatureCheckbox(!signatureTerms);
+ // form.setFieldValue('acceptSignatureTerms', signatureTerms, false);
+ };
+
+ const handlePrivacyCheckbox = (field: any) => {
+ setPrivacyCheckbox(!privacyTerms);
+ // form.setFieldValue(field.name, privacyTerms, false);
+ };
+
+ const speechMarkup = useCallback(() => {
+ return { __html: Static.questions.account.sebastian };
+ }, []);
+
+ const { title, subtitle, description } = Static.questions.account;
+
+ const passwordRef = createRef();
+
+ return (
+
+ {/*
+ {parse(title)}
+ {/* {parse(subtitle)} */}
+ {parse(description)}
+
+
+
+
+
+
+
+
+
+
+ {/* https://jasonwatmore.com/post/2020/02/08/react-formik-required-checkbox-example */}
+
+ {/*
+
+ {(formikProps: any) => (
+
+
+ I have read and agree to the{" "}
+ {" "}
+ that enables all transactions and disclosure delivery to occur electronically.
+
+ */}
+
+
+ {(formikProps: any) => (
+
+
+ I have received and read the
+
+ .
+
+
+
+
+ {(formikProps: any) => (
+
+
+ By clicking "Signup" I agree to the
+
+
+
+ {/*
+
+ {(formikProps: any) => (
+
+
+ That by providing my phone number, {process.env.SITE_TITLE}, or{" "}
+ {process.env.SITE_TITLE}'s authorized representatives*, may call and/or send
+ text messages (including by using equipment to automatically dial telephone numbers)
+ about my interest in a purchase, for marketing/sales purposes, or for any other
+ servicing or informational purpose related to my account. You do not have to consent
+ to receiving calls or texts to purchase from {process.env.SITE_TITLE}.
+
+ + *Including, but not limited to, Bridgecrest Credit Company, GO Financial and + SilverRock Automotive. + +
+ */}
+ {/* Below term appears below current Softpull form submit buttons */}
+ {/*
+
+ Consumer Report: By clicking "GET TERMS", I give {process.env.SITE_TITLE} written consent to obtain consumer reports from one or more consumer reporting agencies to show me credit options I prequalify for when financing with {process.env.SITE_TITLE}. Retrieving my pre-qualification credit terms generates a soft credit inquiry, which is visible only to me and does not affect my credit score.
+
+ */}
+
+
+
+
+ {/* setOpenSignatureModal(!openSignatureModal)} /> */}
+
+
+
+
+
+
+
+
+
+
+ );
+};
diff --git a/components/SignupForm/POLQuestions/CompanyAddress.tsx b/components/SignupForm/POLQuestions/CompanyAddress.tsx
new file mode 100644
index 00000000..43b51b40
--- /dev/null
+++ b/components/SignupForm/POLQuestions/CompanyAddress.tsx
@@ -0,0 +1,50 @@
+// Vendor
+import React, { useState, useCallback } from "react";
+// import NumberFormat from 'react-number-format';
+import { Field, useFormikContext } from "formik";
+import PlacesAutocomplete, { geocodeByAddress, getLatLng } from "react-places-autocomplete";
+
+// Local
+import TipBot from "../../TipBot";
+import { FormikInput, FormikAutocomplete } from "../../FormikWrappers";
+import { QuestionWrapper, InputGroupWrapper, InputWrapper } from "./Questions.styles";
+
+// const suggestions = [
+// '100 Freeman Street Brooklyn NY 11222',
+// '100 Freeman Road Birmingham KY 19278'
+// ];
+
+export const CompanyAddress = () => {
+ // const [address, setAddress] = useState('');
+
+ // const { errors, touched } = useFormikContext();
+
+ const speechMarkup = useCallback(() => {
+ return { __html: "What is your address?" };
+ }, []);
+
+ return (
+
+
+
+
+
+
+
+
+ );
+};
diff --git a/components/SignupForm/POLQuestions/CompanyDetails.tsx b/components/SignupForm/POLQuestions/CompanyDetails.tsx
new file mode 100644
index 00000000..7e80b645
--- /dev/null
+++ b/components/SignupForm/POLQuestions/CompanyDetails.tsx
@@ -0,0 +1,43 @@
+// Vendor
+import React, { useCallback } from "react";
+import { Field } from "formik";
+import { Button } from "@material-ui/core";
+
+// Local
+import TipBot from "../../TipBot";
+import { FormikInput } from "../../FormikWrappers";
+import { QuestionWrapper, InputGroupWrapper, InputWrapper } from "./Questions.styles";
+
+export const CompanyDetails = () => {
+ // const { errors, touched } = useFormikContext()
+
+ const speechMarkup = useCallback(() => {
+ return { __html: "Can you tell a bit about your company?" };
+ }, []);
+
+ return (
+
+
+
+
+
+
+
+
+ );
+};
diff --git a/components/SignupForm/POLQuestions/PersonalInfo.tsx b/components/SignupForm/POLQuestions/PersonalInfo.tsx
new file mode 100644
index 00000000..c6a4799a
--- /dev/null
+++ b/components/SignupForm/POLQuestions/PersonalInfo.tsx
@@ -0,0 +1,62 @@
+// Vendor
+import React, { useCallback } from "react";
+import { Field } from "formik";
+import { Button } from "@material-ui/core";
+
+// Local
+import TipBot from "../../TipBot";
+import { FormikInput, FormikDateOfBirth } from "../../FormikWrappers";
+import {
+ QuestionWrapper,
+ InputGroupWrapper,
+ InputWrapper,
+ Title,
+ Subtitle,
+ LinkOut
+} from "./Questions.styles";
+
+export const PersonalInfo = () => {
+ // const { errors, touched } = useFormikContext()
+
+ const speechMarkup = useCallback(() => {
+ return { __html: "Let's start with your name." };
+ }, []);
+
+ return (
+
+
+
+
+ {/*
+ */}
+
+
+ {/*
+ */}
+
+
+
+
+ );
+};
diff --git a/components/SignupForm/POLQuestions/Questions.styles.tsx b/components/SignupForm/POLQuestions/Questions.styles.tsx
new file mode 100644
index 00000000..f2418587
--- /dev/null
+++ b/components/SignupForm/POLQuestions/Questions.styles.tsx
@@ -0,0 +1,144 @@
+import styled from "@emotion/styled";
+import { Modal } from "@material-ui/core";
+
+export const QuestionWrapper = styled.div`
+ color: ${(props) => props.theme.colors.brand.primary};
+ ${"" /* width: 100%; */}
+ margin: 15px 0 15px 0;
+`;
+
+interface GenericThemeType {
+ theme?: any;
+}
+
+export const InputGroupWrapper = styled.div`
+ ${
+ "" /* background: ${props => props.theme.colors.white.primary};
+ color: ${props => props.theme.colors.brand.primary};
+ box-shadow: 1px 3px 8px rgba(0,0,0,0.123);
+ width: 100%;
+ margin: 15px 15px 0 0px;
+ border-top-left-radius: 8px;
+ border-top-right-radius: 8px; */
+ }
+ margin: -50px 15px 15px 15px;
+ text-align: center;
+ @media (max-width: ${(props) => props.theme.breakpoints.values.sm}px) {
+ margin: 0 auto;
+ padding: 30px 0px 0px 0px;
+ }
+ & [data-qa="title"] {
+ color: ${(props) => props.theme.colors.brand.primary};
+ font-size: 1.6rem;
+ }
+ & .carousel .thumbs-wrapper {
+ display: none;
+ }
+ & .carousel .slide {
+ background: transparent;
+ padding-bottom: 20px;
+ }
+ & .carousel .control-dots {
+ padding: 0;
+ }
+ & .carousel .control-dots .dot {
+ width: 5px;
+ height: 5px;
+ background: ${(props) => props.theme.colors.gray.primary};
+ box-shadow: none;
+ &:focus {
+ outline: none;
+ }
+ }
+ & .carousel .control-dots .dot.selected {
+ background: ${(props) => props.theme.colors.white.primary};
+ box-shadow: 0 0 0 7px ${(props) => props.theme.colors.brand.primary};
+ }
+`;
+
+export const InputWrapper = styled.div`
+ text-align: left;
+ margin: 10px 25px;
+
+ & .MuiFormControl-root.MuiTextField-root {
+ width: 100%;
+ }
+`;
+
+export const Title = styled.h1`
+ margin: 5px 15px;
+ color: ${(props) => props.theme.colors.brand.primary};
+`;
+
+export const Subtitle = styled.h3`
+ margin: 5px 15px;
+ color: ${(props) => props.theme.colors.brand.primary};
+`;
+
+export const Description = styled.p`
+ margin: 5px 15px 25px 15px;
+ color: ${(props) => props.theme.colors.gray.medium};
+`;
+
+export const LinkOut = styled.a`
+ & button {
+ margin: 0 auto;
+ }
+`;
+
+export const TermsWrapper = styled.div`
+ width: 100%;
+ display: flex;
+ flex-flow: row nowrap;
+ align-items: start;
+ padding: 0 25px;
+ overflow: hidden;
+`;
+
+export const Term = styled.div`
+ display: flex;
+ flex-flow: row nowrap;
+ align-items: flex-start;
+`;
+
+interface TermsStatementType {
+ accepted: boolean;
+ theme?: any;
+}
+
+export const TermsStatement = styled.p`
+ font-size: 0.7rem;
+ text-align: left;
+ flex-basis: 100%;
+ color: ${(props) =>
+ props.accepted ? props.theme.colors.brand.primary : props.theme.colors.red.primary};
+ height: auto;
+ overflow-y: scroll;
+ margin: 0;
+ max-width: 420px;
+
+ & button {
+ cursor: pointer;
+ display: contents;
+ font-weight: 700;
+ text-decoration: underline;
+ color: ${(props) =>
+ props.accepted ? props.theme.colors.brand.primary : props.theme.colors.red.primary};
+ }
+
+ @media (max-width: ${(props) => props.theme.breakpoints.values.sm}px) {
+ flex-basis: 50%;
+ }
+`;
+
+export const StyledModalContent = styled.div`
+ ${"" /* Modal Header Container */}
+ max-width: 50%;
+ overflow-y: scroll;
+ background: ${(p) => p.theme.colors.white.primary};
+`;
+
+// export const StyledModalHeader = styled(ModalHeader)`
+// z-index: 1052;
+// &
+// `;
diff --git a/components/SignupForm/POLQuestions/Questions.tsx b/components/SignupForm/POLQuestions/Questions.tsx
new file mode 100644
index 00000000..720c5258
--- /dev/null
+++ b/components/SignupForm/POLQuestions/Questions.tsx
@@ -0,0 +1,184 @@
+/* eslint-disable no-console */
+
+// Vendor
+// import { object, shape, number, integer, string } from 'yup';
+import { ref, addMethod, mixed, object, string, bool, date } from "yup";
+
+// Local
+import Static from "../../../utilities/staticData";
+import constants from "../../../utilities/constants";
+import { Alert } from "../../Alerts";
+import { Welcome } from "./Welcome";
+import { PersonalInfo } from "./PersonalInfo";
+import { CompanyAddress } from "./CompanyAddress";
+import { Account } from "./Account";
+import { CompanyDetails } from "./CompanyDetails";
+
+import { toShortDateZeroFill } from "../../../utilities/DateHelpers";
+
+// const SignupSchema = Yup.object().shape({
+// firstName: Yup.string()
+// .min(2, "Too Short!")
+// .max(50, "Too Long!")
+// .defined("Required"),
+// address: Yup.object().shape({
+// line1: Yup.string().defined("Required")
+// }),
+// dob: Yup.object().shape({
+// day: Yup.number()
+// .positive()
+// .integer()
+// .min(1, "Invalid.")
+// .max(31, "Invalid.")
+// })
+// });
+
+const today = new Date();
+
+// const equalTo = ({reference, msg}: any) => {
+// return mixed().test({
+// name: "equalTo",
+// exclusive: false,
+// message: msg || `Password must be the same as ${reference}`,
+// params: {
+// reference: reference.path
+// },
+// test(value) {
+// return value === this.resolve(reference);
+// }
+// });
+// };
+
+// addMethod(string, "equalTo", equalTo);
+
+export declare type FormikErrors = {
+ [K in keyof Values]?: Values[K] extends any[]
+ ? Values[K][number] extends object
+ ? FormikErrors[] | string | string[]
+ : string | string[]
+ : Values[K] extends object
+ ? FormikErrors
+ : string;
+};
+
+interface QuestionsType {
+ id: string;
+ component: any;
+ validationSchema?: any;
+ validate?: (values: any) => void | object | Promise>;
+ initialValues?: any;
+ actionLabel?: string;
+ onAction?: any;
+ keepValuesOnPrevious?: boolean;
+}
+
+export const Questions: QuestionsType[] = [
+ {
+ id: "welcome",
+ component: Welcome,
+ actionLabel: "Start Signup"
+ },
+ {
+ id: "personal-info",
+ component: PersonalInfo,
+ initialValues: {
+ firstName: "",
+ middleName: "",
+ lastName: "",
+ suffix: "",
+ dateOfBirth: "",
+ email: ""
+ },
+ validationSchema: object().shape({
+ firstName: string().defined(Static.errors.isRequired).required(Static.errors.isRequired),
+ middleName: string(),
+ lastName: string().defined(Static.errors.isRequired).required(Static.errors.isRequired),
+ suffix: string(),
+ dateOfBirth: date()
+ .transform((currentValue, originalValue) =>
+ toShortDateZeroFill(currentValue) === originalValue ||
+ toShortDateZeroFill(currentValue) === toShortDateZeroFill(originalValue)
+ ? currentValue
+ : new Date("")
+ )
+ .defined(Static.errors.isRequired)
+ .typeError("Invalid date")
+ .min(new Date("1/1/1900"), Static.errors.minDateOfBirth)
+ .max(
+ new Date(today.getFullYear() - 18, today.getMonth(), today.getDate()),
+ Static.errors.maxDateOfBirth
+ ),
+ email: string().defined(Static.errors.isRequired)
+ }),
+ actionLabel: "Next"
+ // onAction: () => {
+ // // window.scrollTo(0,0);
+ // console.log("action taken");
+ // }
+ },
+ {
+ id: "company-details",
+ component: CompanyDetails
+ },
+ {
+ id: "home-address",
+ component: CompanyAddress,
+ initialValues: {
+ homeAddress: "",
+ unitNumber: ""
+ },
+ validationSchema: object().shape({
+ homeAddress: string().defined(Static.errors.isRequired),
+ unitNumber: string()
+ }),
+ actionLabel: "Next"
+ // onAction: (sectionValues: any) => {
+ // window.scrollTo(0, 0);
+ // // console.log('ADDRESS ACTION VALS: ', sectionValues);
+ // if (sectionValues.homeAddress === "1 infinite loop") {
+ // throw new Error("Please reformat address");
+ // }
+ // }
+ },
+ {
+ id: "account-details",
+ component: Account,
+ initialValues: {
+ phoneNumber: "",
+ email: "",
+ password: "",
+ passwordConfirm: "",
+ acceptSignatureTerms: false,
+ acceptPrivacyTerms: false,
+ acceptReportingTerms: false,
+ acceptAuthorizeTerms: false
+ },
+ validationSchema: object().shape({
+ phoneNumber: string()
+ .defined(Static.errors.isRequired)
+ .min(constants.PHONE_LENGTH, Static.errors.phoneNumberValid)
+ .max(constants.PHONE_LENGTH, Static.errors.phoneNumberValid)
+ .matches(constants.PHONE_REGEX, Static.errors.phoneNumberValid),
+ email: string().defined(Static.errors.isRequired),
+ password: string()
+ .defined(Static.errors.isRequired)
+ .matches(constants.PASSWORD_REGEX, Static.errors.passwordValid),
+ passwordConfirm: string()
+ .required(Static.errors.isRequired)
+ .oneOf([ref("password"), null], "Passwords must match"),
+ acceptSignatureTerms: bool().oneOf([true], "Accept Terms & Conditions is required"),
+ acceptPrivacyTerms: bool().oneOf([true], "Accept Terms & Conditions is required"),
+ acceptReportingTerms: bool().oneOf([true], "Accept Terms & Conditions is required"),
+ acceptAuthorizeTerms: bool().oneOf([true], "Accept Terms & Conditions is required")
+ }),
+ actionLabel: "Signup",
+ onAction: (sectionValues: any) => {
+ window.scrollTo(0, 0);
+ const phone = parseFloat(sectionValues.phoneNumber.replace(/\$|,/g, ""));
+ // console.log("PHONE: ", phone);
+ if (phone < 15000) {
+ throw new Error("Something is wrong with your account details.");
+ }
+ }
+ }
+];
diff --git a/components/SignupForm/POLQuestions/Welcome.tsx b/components/SignupForm/POLQuestions/Welcome.tsx
new file mode 100644
index 00000000..0bcb7146
--- /dev/null
+++ b/components/SignupForm/POLQuestions/Welcome.tsx
@@ -0,0 +1,105 @@
+// Vendor
+import React, { useCallback } from "react";
+import styled from "@emotion/styled";
+// import { Field, useFormikContext } from 'formik';
+// import { useMediaQuery } from 'react-responsive';
+import { Carousel } from "react-responsive-carousel";
+
+// Local
+import TipBot from "../../TipBot";
+import { QuestionWrapper, InputGroupWrapper, Title, Description } from "./Questions.styles";
+
+interface GenericThemeType {
+ theme?: any;
+}
+
+export const ColorizedFinance = styled.i`
+ ${"" /* transform: scale(2); */}
+ & svg {
+ width: 5rem;
+ height: 5rem;
+ }
+ & svg g path:first-of-type {
+ fill: ${(props) => props.theme.colors.brand.primary};
+ }
+`;
+
+export const ColorizedCalendar = styled.i`
+ ${"" /* transform: scale(2); */}
+ & svg {
+ width: 5rem;
+ height: 5rem;
+ }
+ & svg g path:first-of-type {
+ fill: ${(props) => props.theme.colors.brand.primary};
+ }
+`;
+
+export const ColorizedLoan = styled.i`
+ ${"" /* transform: scale(2); */}
+ & svg {
+ width: 5rem;
+ height: 5rem;
+ }
+ & svg g path:first-of-type {
+ fill: ${(props) => props.theme.colors.brand.primary};
+ }
+`;
+
+export const ColorizedCart = styled.i`
+ ${"" /* transform: scale(2); */}
+ & svg {
+ width: 5rem;
+ height: 5rem;
+ }
+ & svg g path:first-of-type {
+ fill: ${(props) => props.theme.colors.brand.primary};
+ }
+`;
+
+const partnerName = process.env.SITE_TITLE;
+const shortName = process.env.SHORT_TITLE;
+
+export const Welcome = () => {
+ // const { errors, touched } = useFormikContext();
+
+ const speechMarkup = useCallback(() => {
+ return {
+ __html: `Welcome to ${partnerName}!
Create your account so you can start browsing, saving, and getting deals!` + }; + }, []); + + return ( +
+
+
+
+
+
+ );
+};
diff --git a/components/SignupForm/POLQuestions/index.ts b/components/SignupForm/POLQuestions/index.ts
new file mode 100644
index 00000000..3a00dd73
--- /dev/null
+++ b/components/SignupForm/POLQuestions/index.ts
@@ -0,0 +1,2 @@
+export * from "./Questions";
+export * from "./PersonalInfo";
diff --git a/components/SignupForm/Questions/Account.tsx b/components/SignupForm/Questions/Account.tsx
new file mode 100644
index 00000000..1e439b4a
--- /dev/null
+++ b/components/SignupForm/Questions/Account.tsx
@@ -0,0 +1,264 @@
+// Vendor
+import React, { useState, useCallback, createRef } from "react";
+import { Carousel } from "react-responsive-carousel";
+import { Field, useFormikContext } from "formik";
+import parse from "html-react-parser";
+import { Modal } from "@material-ui/core";
+
+// Local
+import TipBot from "../../TipBot";
+import Static from "../../../utilities/staticData";
+import { FormikInput, FormikPhone, FormikCheckbox } from "../../FormikWrappers";
+import {
+ Title,
+ Subtitle,
+ Description,
+ QuestionWrapper,
+ InputGroupWrapper,
+ InputWrapper,
+ TermsWrapper,
+ TermsStatement,
+ Term,
+ StyledModalContent
+} from "./Questions.styles";
+import { ElectronicSignaturesModal } from "../../Terms/ElectronicSignaturesModal";
+import { FinancialPrivacyModal } from "../../Terms/FinancialPrivacyModal";
+
+export const Account = () => {
+ // const { values, form, submitForm } = useFormikContext();
+ // console.log("FORM: ", values, useFormikContext);
+ // const { errors, touched } = useFormikContext();
+
+ const [openSignatureModal, setOpenSignatureModal] = useState(false);
+ const [openPrivacyModal, setOpenPrivacyModal] = useState(false);
+
+ const [currentSlide, setCurrentSlide] = useState(0);
+
+ const [signatureTerms, setSignatureCheckbox] = useState(false);
+ const [privacyTerms, setPrivacyCheckbox] = useState(false);
+ const [reportingTerms, setReportingCheckbox] = useState(false);
+ const [authorizeTerms, setAuthorizeCheckbox] = useState(false);
+
+ const toggleSignatureModal = () => {
+ setOpenSignatureModal(!openSignatureModal);
+ };
+
+ const togglePrivacyModal = () => {
+ setOpenPrivacyModal(!openPrivacyModal);
+ };
+
+ // const updateCurrentSlide = index => {
+ // if (currentSlide !== index) {
+ // setCurrentSlide(index);
+ // }
+ // };
+
+ const nextSlide = () => {
+ setCurrentSlide(currentSlide + 1);
+ };
+
+ const handleSignatureCheckbox = (field: any) => {
+ setSignatureCheckbox(!signatureTerms);
+ // form.setFieldValue('acceptSignatureTerms', signatureTerms, false);
+ };
+
+ const handlePrivacyCheckbox = (field: any) => {
+ setPrivacyCheckbox(!privacyTerms);
+ // form.setFieldValue(field.name, privacyTerms, false);
+ };
+
+ const handleReportingCheckbox = (field: any) => {
+ setReportingCheckbox(!reportingTerms);
+ // form.setFieldValue(field.name, reportingTerms, false);
+ };
+
+ const handleAuthorizeCheckbox = (field: any) => {
+ setAuthorizeCheckbox(!authorizeTerms);
+ // form.setFieldValue(field.name, authorizeTerms, false);
+ };
+
+ const speechMarkup = useCallback(() => {
+ return { __html: Static.questions.account.sebastian };
+ }, []);
+
+ const { title, subtitle, description } = Static.questions.account;
+
+ const passwordRef = createRef();
+
+ return (
+
+
+ {parse(title)}
+ {parse(subtitle)}
+ {parse(description)}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {/* https://jasonwatmore.com/post/2020/02/08/react-formik-required-checkbox-example */}
+
+ {/*
+
+ {(formikProps: any) => (
+
+
+ I have read and agree to the{" "}
+ {" "}
+ that enables all transactions and disclosure delivery to occur electronically.
+
+ */}
+
+
+ {(formikProps: any) => (
+
+
+ I have received and read the
+
+ .
+
+
+
+
+ {(formikProps: any) => (
+
+
+ By clicking "Signup" I agree to the
+
+
+
+ {/*
+
+ {(formikProps: any) => (
+
+
+ That by providing my phone number, {process.env.SITE_TITLE}, or{" "}
+ {process.env.SITE_TITLE}'s authorized representatives*, may call and/or send
+ text messages (including by using equipment to automatically dial telephone numbers)
+ about my interest in a purchase, for marketing/sales purposes, or for any other
+ servicing or informational purpose related to my account. You do not have to consent
+ to receiving calls or texts to purchase from {process.env.SITE_TITLE}.
+
+ + *Including, but not limited to, Bridgecrest Credit Company, GO Financial and + SilverRock Automotive. + +
+ */}
+ {/* Below term appears below current Softpull form submit buttons */}
+ {/*
+
+ Consumer Report: By clicking "GET TERMS", I give {process.env.SITE_TITLE} written consent to obtain consumer reports from one or more consumer reporting agencies to show me credit options I prequalify for when financing with {process.env.SITE_TITLE}. Retrieving my pre-qualification credit terms generates a soft credit inquiry, which is visible only to me and does not affect my credit score.
+
+ */}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+};
diff --git a/components/SignupForm/Questions/DateOfBirth.tsx b/components/SignupForm/Questions/DateOfBirth.tsx
new file mode 100644
index 00000000..105ca08e
--- /dev/null
+++ b/components/SignupForm/Questions/DateOfBirth.tsx
@@ -0,0 +1,24 @@
+// Vendor
+import React, { useCallback } from "react";
+// import NumberFormat from 'react-number-format';
+import { Field, useFormikContext } from "formik";
+
+// Local
+import TipBot from "../../TipBot";
+import { FormikDateOfBirth } from "../../FormikWrappers";
+import { QuestionWrapper, InputGroupWrapper, InputWrapper } from "./Questions.styles";
+
+export const DateOfBirth = () => {
+ // const { errors, touched } = useFormikContext();
+
+ const speechMarkup = useCallback(() => {
+ return { __html: "When is your birthday 🎉?" };
+ }, []);
+
+ return (
+
+
+ );
+};
diff --git a/components/SignupForm/Questions/GetPreQualified.tsx b/components/SignupForm/Questions/GetPreQualified.tsx
new file mode 100644
index 00000000..7e913c2e
--- /dev/null
+++ b/components/SignupForm/Questions/GetPreQualified.tsx
@@ -0,0 +1,102 @@
+// Vendor
+import React, { useCallback } from "react";
+import styled from "@emotion/styled";
+// import { Field, useFormikContext } from 'formik';
+// import { useMediaQuery } from 'react-responsive';
+import { Carousel } from "react-responsive-carousel";
+
+// Local
+import TipBot from "../../TipBot";
+import { QuestionWrapper, InputGroupWrapper, Title, Description } from "./Questions.styles";
+
+interface GenericThemeType {
+ theme?: any;
+}
+
+export const ColorizedFinance = styled.i`
+ ${"" /* transform: scale(2); */}
+ & svg {
+ width: 5rem;
+ height: 5rem;
+ }
+ & svg g path:first-of-type {
+ fill: ${(props) => props.theme.colors.brand.primary};
+ }
+`;
+
+export const ColorizedCalendar = styled.i`
+ ${"" /* transform: scale(2); */}
+ & svg {
+ width: 5rem;
+ height: 5rem;
+ }
+ & svg g path:first-of-type {
+ fill: ${(props) => props.theme.colors.brand.primary};
+ }
+`;
+
+export const ColorizedLoan = styled.i`
+ ${"" /* transform: scale(2); */}
+ & svg {
+ width: 5rem;
+ height: 5rem;
+ }
+ & svg g path:first-of-type {
+ fill: ${(props) => props.theme.colors.brand.primary};
+ }
+`;
+
+export const ColorizedCart = styled.i`
+ ${"" /* transform: scale(2); */}
+ & svg {
+ width: 5rem;
+ height: 5rem;
+ }
+ & svg g path:first-of-type {
+ fill: ${(props) => props.theme.colors.brand.primary};
+ }
+`;
+
+const partnerName = process.env.SITE_TITLE;
+
+export const GetPreQualified = () => {
+ // const { errors, touched } = useFormikContext();
+
+ const speechMarkup = useCallback(() => {
+ return {
+ __html: `Welcome from ${partnerName}!
Create your account, and you'll be surfing the latest trends in no-time.` + }; + }, []); + + return ( +
+
+
+
+
+
+ );
+};
diff --git a/components/SignupForm/Questions/HomeAddress.tsx b/components/SignupForm/Questions/HomeAddress.tsx
new file mode 100644
index 00000000..9300e255
--- /dev/null
+++ b/components/SignupForm/Questions/HomeAddress.tsx
@@ -0,0 +1,44 @@
+// Vendor
+import React, { useState, useCallback } from "react";
+// import NumberFormat from 'react-number-format';
+import { Field, useFormikContext } from "formik";
+import PlacesAutocomplete, { geocodeByAddress, getLatLng } from "react-places-autocomplete";
+
+// Local
+import TipBot from "../../TipBot";
+import { FormikInput, FormikAutocomplete } from "../../FormikWrappers";
+import { QuestionWrapper, InputGroupWrapper, InputWrapper } from "./Questions.styles";
+
+// const suggestions = [
+// '100 Freeman Street Brooklyn NY 11222',
+// '100 Freeman Road Birmingham KY 19278'
+// ];
+
+export const HomeAddress = () => {
+ // const [homeAddress, setHomeAddress] = useState('');
+
+ // const { errors, touched } = useFormikContext();
+
+ const speechMarkup = useCallback(() => {
+ return { __html: "Where do you currently live?" };
+ }, []);
+
+ return (
+
+
+
+
+
+
+
+
+ );
+};
diff --git a/components/SignupForm/Questions/PersonalInfo.tsx b/components/SignupForm/Questions/PersonalInfo.tsx
new file mode 100644
index 00000000..1369e55f
--- /dev/null
+++ b/components/SignupForm/Questions/PersonalInfo.tsx
@@ -0,0 +1,54 @@
+// Vendor
+import React, { useCallback } from "react";
+import { Field } from "formik";
+import { Button } from "@material-ui/core";
+
+// Local
+import TipBot from "../../TipBot";
+import { FormikInput } from "../../FormikWrappers";
+import {
+ QuestionWrapper,
+ InputGroupWrapper,
+ InputWrapper,
+ Title,
+ Subtitle,
+ LinkOut
+} from "./Questions.styles";
+
+export const PersonalInfo = () => {
+ // const { errors, touched } = useFormikContext()
+
+ const speechMarkup = useCallback(() => {
+ return { __html: "Let's start with your name." };
+ }, []);
+
+ return (
+
+
+
+
+ {/*
+ */}
+
+
+ {/*
+ */}
+
+
+ );
+};
diff --git a/components/SignupForm/Questions/Questions.md b/components/SignupForm/Questions/Questions.md
new file mode 100644
index 00000000..ef17b39c
--- /dev/null
+++ b/components/SignupForm/Questions/Questions.md
@@ -0,0 +1,34 @@
+# POL Signup Questions:
+
+## Personal Details
+
+- First name\*
+- Last name\*
+- DoB
+- Email\*
+
+## Company Details
+
+- Company Name\*
+- Reseller's Permit Number\*
+
+## Your Address
+
+- Street Address\*
+- Zip / Postal Code\*
+- City\*
+- Country\*
+- State / Province\*
+
+## Your Contact Information
+
+- Phone\*
+
+## Your Password
+
+- Password\*
+- Password Confirmation\*
+
+## I'm not a robot
+
+## Submit
diff --git a/components/SignupForm/Questions/Questions.styles.tsx b/components/SignupForm/Questions/Questions.styles.tsx
new file mode 100644
index 00000000..f2418587
--- /dev/null
+++ b/components/SignupForm/Questions/Questions.styles.tsx
@@ -0,0 +1,144 @@
+import styled from "@emotion/styled";
+import { Modal } from "@material-ui/core";
+
+export const QuestionWrapper = styled.div`
+ color: ${(props) => props.theme.colors.brand.primary};
+ ${"" /* width: 100%; */}
+ margin: 15px 0 15px 0;
+`;
+
+interface GenericThemeType {
+ theme?: any;
+}
+
+export const InputGroupWrapper = styled.div`
+ ${
+ "" /* background: ${props => props.theme.colors.white.primary};
+ color: ${props => props.theme.colors.brand.primary};
+ box-shadow: 1px 3px 8px rgba(0,0,0,0.123);
+ width: 100%;
+ margin: 15px 15px 0 0px;
+ border-top-left-radius: 8px;
+ border-top-right-radius: 8px; */
+ }
+ margin: -50px 15px 15px 15px;
+ text-align: center;
+ @media (max-width: ${(props) => props.theme.breakpoints.values.sm}px) {
+ margin: 0 auto;
+ padding: 30px 0px 0px 0px;
+ }
+ & [data-qa="title"] {
+ color: ${(props) => props.theme.colors.brand.primary};
+ font-size: 1.6rem;
+ }
+ & .carousel .thumbs-wrapper {
+ display: none;
+ }
+ & .carousel .slide {
+ background: transparent;
+ padding-bottom: 20px;
+ }
+ & .carousel .control-dots {
+ padding: 0;
+ }
+ & .carousel .control-dots .dot {
+ width: 5px;
+ height: 5px;
+ background: ${(props) => props.theme.colors.gray.primary};
+ box-shadow: none;
+ &:focus {
+ outline: none;
+ }
+ }
+ & .carousel .control-dots .dot.selected {
+ background: ${(props) => props.theme.colors.white.primary};
+ box-shadow: 0 0 0 7px ${(props) => props.theme.colors.brand.primary};
+ }
+`;
+
+export const InputWrapper = styled.div`
+ text-align: left;
+ margin: 10px 25px;
+
+ & .MuiFormControl-root.MuiTextField-root {
+ width: 100%;
+ }
+`;
+
+export const Title = styled.h1`
+ margin: 5px 15px;
+ color: ${(props) => props.theme.colors.brand.primary};
+`;
+
+export const Subtitle = styled.h3`
+ margin: 5px 15px;
+ color: ${(props) => props.theme.colors.brand.primary};
+`;
+
+export const Description = styled.p`
+ margin: 5px 15px 25px 15px;
+ color: ${(props) => props.theme.colors.gray.medium};
+`;
+
+export const LinkOut = styled.a`
+ & button {
+ margin: 0 auto;
+ }
+`;
+
+export const TermsWrapper = styled.div`
+ width: 100%;
+ display: flex;
+ flex-flow: row nowrap;
+ align-items: start;
+ padding: 0 25px;
+ overflow: hidden;
+`;
+
+export const Term = styled.div`
+ display: flex;
+ flex-flow: row nowrap;
+ align-items: flex-start;
+`;
+
+interface TermsStatementType {
+ accepted: boolean;
+ theme?: any;
+}
+
+export const TermsStatement = styled.p`
+ font-size: 0.7rem;
+ text-align: left;
+ flex-basis: 100%;
+ color: ${(props) =>
+ props.accepted ? props.theme.colors.brand.primary : props.theme.colors.red.primary};
+ height: auto;
+ overflow-y: scroll;
+ margin: 0;
+ max-width: 420px;
+
+ & button {
+ cursor: pointer;
+ display: contents;
+ font-weight: 700;
+ text-decoration: underline;
+ color: ${(props) =>
+ props.accepted ? props.theme.colors.brand.primary : props.theme.colors.red.primary};
+ }
+
+ @media (max-width: ${(props) => props.theme.breakpoints.values.sm}px) {
+ flex-basis: 50%;
+ }
+`;
+
+export const StyledModalContent = styled.div`
+ ${"" /* Modal Header Container */}
+ max-width: 50%;
+ overflow-y: scroll;
+ background: ${(p) => p.theme.colors.white.primary};
+`;
+
+// export const StyledModalHeader = styled(ModalHeader)`
+// z-index: 1052;
+// &
+// `;
diff --git a/components/SignupForm/Questions/Questions.tsx b/components/SignupForm/Questions/Questions.tsx
new file mode 100644
index 00000000..76f52500
--- /dev/null
+++ b/components/SignupForm/Questions/Questions.tsx
@@ -0,0 +1,257 @@
+/* eslint-disable no-console */
+
+// Vendor
+// import { object, shape, number, integer, string } from 'yup';
+import { ref, addMethod, mixed, object, string, bool, date } from "yup";
+
+// Local
+import Static from "../../../utilities/staticData";
+import constants from "../../../utilities/constants";
+import { Alert } from "../../Alerts";
+import { GetPreQualified } from "./GetPreQualified";
+import { PersonalInfo } from "./PersonalInfo";
+import { DateOfBirth } from "./DateOfBirth";
+import { HomeAddress } from "./HomeAddress";
+import { YearlyIncome } from "./YearlyIncome";
+import { Account } from "./Account";
+
+import { toShortDateZeroFill } from "../../../utilities/DateHelpers";
+
+// const SignupSchema = Yup.object().shape({
+// firstName: Yup.string()
+// .min(2, "Too Short!")
+// .max(50, "Too Long!")
+// .defined("Required"),
+// address: Yup.object().shape({
+// line1: Yup.string().defined("Required")
+// }),
+// dob: Yup.object().shape({
+// day: Yup.number()
+// .positive()
+// .integer()
+// .min(1, "Invalid.")
+// .max(31, "Invalid.")
+// })
+// });
+
+const today = new Date();
+
+// const equalTo = ({reference, msg}: any) => {
+// return mixed().test({
+// name: "equalTo",
+// exclusive: false,
+// message: msg || `Password must be the same as ${reference}`,
+// params: {
+// reference: reference.path
+// },
+// test(value) {
+// return value === this.resolve(reference);
+// }
+// });
+// };
+
+// addMethod(string, "equalTo", equalTo);
+
+export declare type FormikErrors = {
+ [K in keyof Values]?: Values[K] extends any[]
+ ? Values[K][number] extends object
+ ? FormikErrors[] | string | string[]
+ : string | string[]
+ : Values[K] extends object
+ ? FormikErrors
+ : string;
+};
+
+interface QuestionsType {
+ id: string;
+ component: any;
+ validationSchema?: any;
+ validate?: (values: any) => void | object | Promise>;
+ initialValues?: any;
+ actionLabel?: string;
+ onAction?: any;
+ keepValuesOnPrevious?: boolean;
+}
+
+export const Questions: QuestionsType[] = [
+ {
+ id: "get-prequalified",
+ component: GetPreQualified,
+ actionLabel: "Get Started"
+ },
+ {
+ id: "personal-info",
+ component: PersonalInfo,
+ initialValues: {
+ firstName: "",
+ middleName: "",
+ lastName: "",
+ suffix: ""
+ },
+ validationSchema: object().shape({
+ firstName: string().defined(Static.errors.isRequired),
+ middleName: string(),
+ lastName: string().defined(Static.errors.isRequired),
+ suffix: string()
+ }),
+ actionLabel: "Next"
+ // onAction: () => {
+ // // window.scrollTo(0,0);
+ // console.log("action taken");
+ // }
+ },
+ {
+ id: "date-of-birth",
+ component: DateOfBirth,
+ initialValues: {
+ dateOfBirth: ""
+ },
+ validationSchema: object().shape({
+ dateOfBirth: date()
+ .transform((currentValue, originalValue) =>
+ toShortDateZeroFill(currentValue) === originalValue ||
+ toShortDateZeroFill(currentValue) === toShortDateZeroFill(originalValue)
+ ? currentValue
+ : new Date("")
+ )
+ .defined(Static.errors.isRequired)
+ .typeError("Invalid date")
+ .min(new Date("1/1/1900"), Static.errors.minDateOfBirth)
+ .max(
+ new Date(today.getFullYear() - 18, today.getMonth(), today.getDate()),
+ Static.errors.maxDateOfBirth
+ )
+ // .when('state', {
+ // is: 'AL',
+ // then: date()
+ // .transform((currentValue, originalValue) =>
+ // toShortDateZeroFill(currentValue) === originalValue ||
+ // toShortDateZeroFill(currentValue) ===
+ // toShortDateZeroFill(originalValue)
+ // ? currentValue
+ // : new Date('')
+ // )
+ // .defined(Static.errors.isRequired)
+ // .typeError('Invalid date')
+ // .min(new Date('1/1/1900'), Static.errors.minDateOfBirth)
+ // .max(
+ // new Date(
+ // today.getFullYear() - 19,
+ // today.getMonth(),
+ // today.getDate()
+ // ),
+ // 'You must be 19 to purchase in Alabama'
+ // )
+ // })
+ }),
+ actionLabel: "Next"
+ // onAction: (sectionValues: any) => {
+ // window.scrollTo(0, 0);
+ // // if (sectionValues.dateOfBirth === '1 infinite loop') {
+ // // throw new Error('You old enough?')
+ // // }
+ // }
+ },
+ {
+ id: "home-address",
+ component: HomeAddress,
+ initialValues: {
+ homeAddress: "",
+ unitNumber: ""
+ },
+ validationSchema: object().shape({
+ homeAddress: string().defined(Static.errors.isRequired),
+ unitNumber: string()
+ }),
+ actionLabel: "Next"
+ // onAction: (sectionValues: any) => {
+ // window.scrollTo(0, 0);
+ // // console.log('ADDRESS ACTION VALS: ', sectionValues);
+ // if (sectionValues.homeAddress === "1 infinite loop") {
+ // throw new Error("Please reformat address");
+ // }
+ // }
+ },
+ {
+ id: "yearly-income",
+ component: YearlyIncome,
+ initialValues: {
+ yearlyIncome: ""
+ },
+ validationSchema: object().shape({
+ yearlyIncome: string().defined(Static.errors.isRequired)
+ }),
+ // validationSchema: object().shape({
+ // // eslint-disable-next-line no-restricted-globals
+ // yearlyIncome: number().transform(value => (isNaN(value) ? parseInt(value, 10) : value))
+ // .defined(Static.errors.isRequired)
+ // .min(constants.MIN_ANNUAL_INCOME, Static.errors.annualIncomeMin
+ // )
+ // .max(constants.MAX_ANNUAL_INCOME, Static.errors.annualIncomeMax),
+ // }),
+ actionLabel: "Next",
+ onAction: (sectionValues: any) => {
+ window.scrollTo(0, 0);
+ const incomeNumber = parseFloat(sectionValues.yearlyIncome.replace(/\$|,/g, ""));
+ // console.log("THE MONEY: ", incomeNumber);
+ if (incomeNumber < 4000) {
+ Alert.fire({
+ icon: "info",
+ title: "Hold on!",
+ text: Static.errors.annualIncomeMin,
+ confirmButtonText: "I understand"
+ });
+ throw new Error(Static.errors.annualIncomeMin);
+ } else if (incomeNumber > 9999999) {
+ Alert.fire({
+ icon: "info",
+ title: "Hold on!",
+ text: Static.errors.annualIncomeMax,
+ confirmButtonText: "I understand"
+ });
+ throw new Error(Static.errors.annualIncomeMax);
+ }
+ }
+ },
+ {
+ id: "account-details",
+ component: Account,
+ initialValues: {
+ phoneNumber: "",
+ email: "",
+ password: "",
+ passwordConfirm: "",
+ acceptSignatureTerms: false,
+ acceptPrivacyTerms: false,
+ acceptReportingTerms: false,
+ acceptAuthorizeTerms: false
+ },
+ validationSchema: object().shape({
+ phoneNumber: string()
+ .defined(Static.errors.isRequired)
+ .min(constants.PHONE_LENGTH, Static.errors.phoneNumberValid)
+ .max(constants.PHONE_LENGTH, Static.errors.phoneNumberValid)
+ .matches(constants.PHONE_REGEX, Static.errors.phoneNumberValid),
+ email: string().defined(Static.errors.isRequired),
+ password: string()
+ .defined(Static.errors.isRequired)
+ .matches(constants.PASSWORD_REGEX, Static.errors.passwordValid),
+ passwordConfirm: string()
+ .required(Static.errors.isRequired)
+ .oneOf([ref("password"), null], "Passwords must match"),
+ acceptSignatureTerms: bool().oneOf([true], "Accept Terms & Conditions is required"),
+ acceptPrivacyTerms: bool().oneOf([true], "Accept Terms & Conditions is required"),
+ acceptReportingTerms: bool().oneOf([true], "Accept Terms & Conditions is required"),
+ acceptAuthorizeTerms: bool().oneOf([true], "Accept Terms & Conditions is required")
+ }),
+ actionLabel: "Signup",
+ onAction: (sectionValues: any) => {
+ window.scrollTo(0, 0);
+ const phone = parseFloat(sectionValues.phoneNumber.replace(/\$|,/g, ""));
+ // console.log("PHONE: ", phone);
+ if (phone < 15000) {
+ throw new Error("Something is wrong with your account details.");
+ }
+ }
+ }
+];
diff --git a/components/SignupForm/Questions/YearlyIncome.tsx b/components/SignupForm/Questions/YearlyIncome.tsx
new file mode 100644
index 00000000..c42fc782
--- /dev/null
+++ b/components/SignupForm/Questions/YearlyIncome.tsx
@@ -0,0 +1,34 @@
+// Vendor
+import React, { useState, useCallback } from "react";
+import { Field, useFormikContext } from "formik";
+import { InputAdornment } from "@material-ui/core";
+
+// Local
+import TipBot from "../../TipBot";
+import { FormikIncome } from "../../FormikWrappers";
+import { QuestionWrapper, InputGroupWrapper, InputWrapper } from "./Questions.styles";
+
+export const YearlyIncome = () => {
+ const speechMarkup = useCallback(() => {
+ return { __html: "How much do you make each year?" };
+ }, []);
+
+ return (
+
+
+
+ $
+ }}
+ label="Yearly Income"
+ />
+
+
+
+ );
+};
diff --git a/components/SignupForm/Questions/index.ts b/components/SignupForm/Questions/index.ts
new file mode 100644
index 00000000..e502726e
--- /dev/null
+++ b/components/SignupForm/Questions/index.ts
@@ -0,0 +1,6 @@
+export * from "./Questions";
+export * from "./GetPreQualified";
+export * from "./PersonalInfo";
+export * from "./DateOfBirth";
+export * from "./HomeAddress";
+export * from "./YearlyIncome";
diff --git a/components/SignupForm/SignupForm-Old.tsx b/components/SignupForm/SignupForm-Old.tsx
new file mode 100644
index 00000000..7cc1e2a6
--- /dev/null
+++ b/components/SignupForm/SignupForm-Old.tsx
@@ -0,0 +1,80 @@
+import * as React from "react";
+import Link from "next/link";
+import { useRouter } from "next/router";
+import { Layout } from "../Layout";
+import { Formik, Form, Field, ErrorMessage } from "formik";
+import styled from "@emotion/styled";
+import {
+ AuthFormType,
+ loginForm,
+ signupForm,
+ resetPasswordForm,
+ updatePasswordForm,
+ updateEmailForm
+} from "../AuthForm/constants";
+import { useAuth } from "../../config/auth";
+
+const FieldContainer = styled.div`
+ margin: 15px 0px;
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ justify-content: flex-start;
+`;
+
+export const SignupForm = () => {
+ const { register } = useAuth();
+ const router = useRouter();
+ return (
+ <>
+ {
+ register({ user: values })
+ .then(() => {
+ setSubmitting(false);
+ router.push("/");
+ })
+ .catch(() => {
+ setSubmitting(false);
+ });
+ }}
+ >
+ {({ isSubmitting }) => (
+
+ )}
+
+
+ );
+};
diff --git a/components/SignupForm/SignupForm.styles.tsx b/components/SignupForm/SignupForm.styles.tsx
new file mode 100644
index 00000000..5d25474f
--- /dev/null
+++ b/components/SignupForm/SignupForm.styles.tsx
@@ -0,0 +1,258 @@
+import { Button } from "@material-ui/core";
+import styled from "@emotion/styled";
+
+interface GenericThemeType {
+ theme?: any;
+}
+
+export const MainWrapper = styled.div`
+ position: relative;
+ z-index: 1;
+ display: flex;
+ flex-flow: column nowrap;
+ padding: 0 0 80px 0;
+`;
+
+export const InitialTitle = styled.div`
+ box-sizing: border-box;
+ color: ${(props) => props.theme.colors.white.primary};
+ font-size: 2rem;
+ font-weight: 900;
+ text-transform: uppercase;
+ text-align: center;
+ padding: 40px 0 15px;
+ position: absolute;
+ margin-top: -290px;
+`;
+
+export const Title = styled.div`
+ box-sizing: border-box;
+ color: ${(props) => props.theme.colors.white.primary};
+ font-size: 2rem;
+ font-weight: 900;
+ text-transform: uppercase;
+ text-align: center;
+ padding: 40px 0 15px;
+`;
+
+export const Subtitle = styled.div`
+ box-sizing: border-box;
+ color: ${(props) => props.theme.colors.white.primary};
+ font-size: 1.2rem;
+ text-align: center;
+ padding: 20px 0 15px;
+`;
+
+export const ContentWrapper = styled.div`
+ display: flex;
+ flex-flow: row nowrap;
+ justify-content: center;
+ margin: 0 10%;
+
+ @media (max-width: ${(props) => props.theme.breakpoints.values.sm}px) {
+ flex-flow: column nowrap;
+ margin: 0 5%;
+ }
+
+ @media (min-width: ${(props) => props.theme.breakpoints.values.lg}px) {
+ }
+`;
+
+interface LeftHalfType {
+ show?: any;
+ theme?: any;
+}
+
+export const LeftHalf = styled.div`
+ display: ${(props) => props.show};
+ flex-direction: column;
+ flex-basis: 100%;
+ flex: 0 0 48%;
+ ${"" /* flex: 1; */}
+ ${"" /* flex-grow: 1; */}
+ ${"" /* flex-basis: 50%; */}
+ background: ${(props) => props.theme.colors.white.primary};
+ color: ${(props) => props.theme.colors.brand.primary};
+ /* box-shadow: 1px 3px 8px rgba(0, 0, 0, 0.123); */
+ ${"" /* width: 100%; */}
+ ${"" /* margin: 15px; */}
+ margin: 15px 15px 0 0;
+ border-radius: 8px;
+ padding: 15px 15px 60px 15px;
+ text-align: center;
+ & [data-qa="title"] {
+ color: ${(props) => props.theme.colors.brand.primary};
+ font-size: 1.6rem;
+ }
+
+ @media (max-width: ${(props) => props.theme.breakpoints.values.sm}px) {
+ margin: 15px 0 0 0;
+ display: none;
+ }
+
+ @media (min-width: ${(props) => props.theme.breakpoints.values.lg}px) {
+ ${"" /* margin: 15px; */}
+ margin: 15px 15px 0 0;
+ }
+`;
+
+interface RightHalfType {
+ isLargeDevice?: boolean;
+ theme?: any;
+}
+
+export const RightHalf = styled.div`
+ display: flex;
+ flex-direction: column;
+ flex-basis: 100%;
+ flex: 1;
+ width: ${(props) => (props.isLargeDevice ? "48%" : "100%")};
+ max-width: ${(props) => (props.isLargeDevice ? "48%" : "100%")};
+ ${"" /* flex: 1; */}
+ ${"" /* flex-grow: 1; */}
+ ${"" /* flex-basis: 50%; */}
+ & form {
+ background: ${(props) => props.theme.colors.white.primary};
+ color: ${(props) => props.theme.colors.brand.primary};
+ border-radius: 8px;
+ /* box-shadow: 1px 8px 8px rgba(0, 0, 0, 0.123); */
+ ${"" /* width: 100%; */}
+ & [data-qa='title'] {
+ color: ${(props) => props.theme.colors.brand.primary};
+ font-size: 1.6rem;
+ }
+ }
+`;
+
+interface WizardFormType {
+ canGoBack: boolean;
+ theme?: any;
+}
+
+export const WizardForm = styled.div`
+ padding-top: 0;
+ ${"" /* margin-top: ${props => props.canGoBack ? '120px' : '225px'}; */}
+ background: ${(props) => props.theme.colors.white.primary};
+ color: ${(props) => props.theme.colors.brand.primary};
+ border-radius: 8px;
+ box-shadow: 0px 22px 33px rgba(0, 0, 0, 0.066);
+ width: 100%;
+ & [data-qa="title"] {
+ color: ${(props) => props.theme.colors.brand.primary};
+ font-size: 1.6rem;
+ }
+
+ @media (max-width: ${(props) =>
+ props.theme.breakpoints.values.sm}px) and (orientation: portrait) {
+ padding-top: 0;
+ margin-top: ${(props) => (props.canGoBack ? "120px" : "225px")};
+ }
+
+ /* iPad Mini 4 --------------- */
+ @media only screen and (min-device-width: ${(props) =>
+ props.theme.breakpoints.values.sm}px) and (max-device-width: ${(props) =>
+ props.theme.breakpoints.values
+ .md}px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
+ margin-top: ${(props) => (props.canGoBack ? "120px" : "165px")};
+ padding-top: 0;
+ }
+
+ @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) and (max-width: ${(props) =>
+ props.theme.breakpoints.values.md}px) {
+ margin-top: ${(props) => (props.canGoBack ? "120px" : "165px")};
+ padding-top: 0;
+ }
+
+ @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {
+ margin-top: ${(props) => (props.canGoBack ? "120px" : "165px")};
+ padding-top: 0;
+ }
+
+ @media (min-width: ${(props) => props.theme.breakpoints.values.lg}px) {
+ margin-top: 165px;
+ padding-top: 0;
+ }
+`;
+
+export const WizardActions = styled.div`
+ margin: 0 10px 0 10px;
+ border-bottom-left-radius: 8px;
+ border-bottom-right-radius: 8px;
+ padding: 0 15px 5px 15px;
+ text-align: center;
+ display: flex;
+ flex-flow: row nowrap;
+ justify-content: center;
+
+ & .BtcsS {
+ display: none;
+ }
+
+ @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {
+ margin: 0 25px 0 25px;
+ }
+`;
+
+interface PreviousButtonType {
+ ghost?: boolean;
+}
+
+export const PreviousButton = styled(Button)`
+ flex-basis: 30%;
+ flex-grow: 1;
+ margin-right: 0.5rem !important;
+`;
+
+export const NextButton = styled(Button)`
+ background: ${(p) => p.theme.colors.brand.primary} !important;
+ margin-left: 0.5rem !important;
+ flex-basis: 70%;
+ flex-grow: 2;
+`;
+
+export const SkipAction = styled.div`
+ margin: 7px 0 15px 0;
+ padding: 0 15px 15px 15px;
+ display: flex;
+ justify-content: center;
+ & button {
+ width: 100%;
+ color: ${(props) => props.theme.colors.brand.primary};
+ text-transform: capitalize;
+ }
+
+ @media (max-width: ${(props) => props.theme.breakpoints.values.sm}px) {
+ }
+`;
+
+export const LoginAction = styled.div`
+ margin: 7px 0 15px 0;
+ padding: 0 15px 15px 15px;
+ display: flex;
+ justify-content: center;
+ & button a {
+ width: 100%;
+ color: ${(props) => props.theme.colors.brand.primary};
+ text-transform: capitalize;
+ }
+
+ @media (max-width: ${(props) => props.theme.breakpoints.values.sm}px) {
+ }
+`;
+
+export const Disclaimer = styled.div`
+ font-size: 0.7rem;
+ text-align: center;
+ padding: 15px 20px;
+ color: ${(props) => props.theme.colors.gray.medium};
+`;
+
+export const CongratsWrapper = styled.div`
+ display: flex;
+ flex-flow: column nowrap;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ padding: 20px 15px;
+ margin-top: 15px;
+`;
diff --git a/components/SignupForm/SignupForm.tsx b/components/SignupForm/SignupForm.tsx
new file mode 100644
index 00000000..01d7b581
--- /dev/null
+++ b/components/SignupForm/SignupForm.tsx
@@ -0,0 +1,322 @@
+import { useCallback } from "react";
+import Link from "next/link";
+import { useMediaQuery } from "react-responsive";
+import { Formik, Form, Field, ErrorMessage, FormikProps } from "formik";
+import FormikWizard from "formik-wizard";
+import { useFormikContext } from "formik";
+import { withWizard } from "react-albus";
+import { AuthFormType, signupForm } from "../AuthForm/constants";
+import { useAuth } from "../../config/auth";
+import { SlideInLeft, SlideOutLeft } from "../Animations";
+// import { Questions } from "./Questions";
+import { Questions } from "./POLQuestions";
+import { Alert } from "../Alerts";
+
+import FormikWizardStepType from "formik-wizard";
+
+import {
+ MainWrapper,
+ InitialTitle,
+ Title,
+ Subtitle,
+ ContentWrapper,
+ LeftHalf,
+ RightHalf,
+ WizardForm,
+ WizardActions,
+ PreviousButton,
+ NextButton,
+ SkipAction,
+ LoginAction,
+ Disclaimer,
+ CongratsWrapper
+} from "./SignupForm.styles";
+
+const FormWrapper: React.FC = ({
+ steps,
+ children,
+ // onEachStepSubmit,
+ // onSubmit,
+ // onNext,
+ wizard,
+ isLastStep,
+ status,
+ goToPreviousStep,
+ // getErrorMessage,
+ canGoBack,
+ // onFinalSubmit,
+ showNextStep,
+ actionLabel
+}: any) => {
+ // const [state, setState] = useState({
+ // errorMessage: '',
+ // stepNumber: 0
+ // });
+ // const { errorMessage, stepNumber } = state;
+
+ // useEffect(() => {
+ // window.addEventListener('keydown', keyCommand);
+ // return () => {
+ // window.removeEventListener('keydown', keyCommand);
+ // };
+ // });
+
+ // const keyCommand = e => {
+ // if (e.keyCode === 13) {
+ // wizard.next();
+ // return true;
+ // }
+ // return false;
+ // };
+
+ const isMobile = useMediaQuery({
+ // query: `(min-device-width: ${props => props.theme.breakpoints.values.lg}px)`
+ query: `(max-device-width: 768px)`
+ });
+
+ // const { values, Formik, Form, Field } = useFormikContext();
+ const { values }: any = useFormikContext();
+
+ // const { step } = this.props;
+ const termsAccepted = !!(
+ (values.acceptSignatureTerms && values.acceptPrivacyTerms)
+ // values.acceptReportingTerms &&
+ // values.acceptAuthorizeTerms
+ );
+
+ // We assume this method cannot be called on the first step
+ // const goToNextStep = () => {
+ // console.log('next step: ', steps[stepNumber + 1]);
+ // const nextStepId = steps[stepNumber + 1].id;
+ // // setState({step: { id: "personal-info" }});
+ // setState(prevState => ({ ...prevState, stepNumber: prevState.stepNumber + 1, step: { id: nextStepId} }));
+ // };
+
+ switch (status ? status.code : status) {
+ case 200:
+ window.scrollTo(0, 0);
+ return (
+
+ {status.message}
+ {status.subtitle}
+
+ {/* ← Go Back */}
+
+ );
+ default:
+ return (
+
+
+ {isMobile && !canGoBack &&
+ {children}
+
+ {canGoBack && (
+
+
+
+ )}
+ {/* console.log(wizard, wizard.step, wizard.next)} disabled={isLastStep && !termsAccepted}>{actionLabel || (isLastStep ? 'Submit' : 'Next step')} */}
+ {/* { */}
+ {isLastStep ? (
+ {
+ // console.log('next: ', values, wizard, isLastStep);
+ // console.log("next: ", wizard, isLastStep);
+ wizard.next();
+ }}
+ disabled={isLastStep && !termsAccepted}
+ >
+ {actionLabel || (isLastStep ? "Submit" : "Next")}
+
+ ) : (
+ {
+ // console.log('next: ', values, wizard, isLastStep);
+ // console.log("next: ", wizard, isLastStep);
+ wizard.next();
+ }}
+ disabled={isLastStep && !termsAccepted}
+ >
+ {actionLabel || (isLastStep ? "Submit" : "Next")}
+
+ )}
+
+ {!canGoBack && (
+
+ Already have an account?
+
+ )}
+ {/* {} */}
+ {canGoBack && (
+
+ Don't worry your information is safe{" "}
+
+ 🔐
+ {" "}
+ and we never share your information without your consent.
+ {/* – or – */}
+
+ {/*
+ Already have an account?
+ */}
+ Already have an account?
+
+
+ )}
+
+ );
+ }
+};
+
+export const SignupForm = () => {
+ // useEffect(() => {
+ // getWizard();
+ // });
+
+ // const [hasAcceptedTerms, setTerms] = useState(false);
+ // const [hasErrorModal, setErrorModal] = useState(false);
+ // const [errorMessage, setErrorMessage] = useState('');
+
+ // const toggleErrorModal = () => {
+ // setErrorModal(!hasErrorModal);
+ // };
+
+ const isLargeDevice = useMediaQuery({
+ // query: `(min-device-width: ${props => props.theme.breakpoints.values.}px)`
+ query: `(min-device-width: 768px)`
+ });
+
+ const { register } = useAuth();
+
+ const handleSubmit = useCallback((values) => {
+ new Promise((resolve, reject) => {
+ // const { firstName, lastName, middleName, suffix } = values[
+ // 'personal-info'
+ // ];
+ // const { homeAddress, unitNumber } = values['home-address'];
+ // const { yearlyIncome } = values['yearly-income'];
+ // const { phone, email, password } = values['account-details'];
+ // createUser(
+ // firstName,
+ // lastName,
+ // middleName,
+ // suffix,
+ // homeAddress,
+ // unitNumber,
+ // yearlyIncome,
+ // email,
+ // password,
+ // phone
+ // )
+ // .then(res => resolve('createUser caller res:', res))
+ // .catch(err => reject(err));
+
+ register({ user: values })
+ .then((res) => {
+ console.log("yup: ", res);
+ // setSubmitting(false);
+ // router.push("/");
+ })
+ .catch((err) => {
+ console.log("nope: ", err);
+ // setSubmitting(false);
+ });
+
+ console.log("new Promise");
+ return Promise.resolve({
+ code: 200,
+ status: 200,
+ message: "Congrats!",
+ subtitle: `Your new User ID is: ###`
+ });
+ })
+ .then((res) => {
+ console.log("handleSubmit res: ", res);
+ })
+ .catch((err) => {
+ console.log("handleSubmit error: ", err);
+ // toggleErrorModal();
+ // setErrorMessage(err);
+ Alert.fire({ icon: "error", title: "Uh oh!", text: err });
+ // return Promise.resolve({
+ // message: 'Uh oh.',
+ // subtitle: err
+ // })
+ });
+ }, []);
+
+ // We assume this method cannot be called on the last step
+ // const showNextStep = ({ setFieldTouched }) => {
+ // // TODO: Only untouch if value is '' or []
+ // const nextStepFieldNames = Object.keys(steps[stepNumber + 1].initialValues);
+ // nextStepFieldNames.forEach(fieldName => setFieldTouched(fieldName, false));
+ // setState(prevState => ({ ...prevState, stepNumber: prevState.stepNumber + 1 }));
+ // };
+
+ // We assume this method cannot be called on the first step
+ // const showPreviousStep = ({ setFieldTouched }) => {
+ // // TODO: Only untouch if value is '' or []
+ // const previousStepFieldNames = Object.keys(steps[stepNumber - 1].initialValues);
+ // previousStepFieldNames.forEach(fieldName => setFieldTouched(fieldName, false));
+
+ // setState(prevState => ({ ...prevState, stepNumber: prevState.stepNumber - 1 }));
+ // };
+
+ // const handleError = error => {
+ // setState(prevState => ({ ...prevState, errorMessage: getErrorMessage(error) }));
+ // };
+
+ return (
+
+
+
+
+ Enjoy The Journey{" "}
+ <span role="img" aria-label="sunglasses">
+ 😎
+ </span>
+
+
+
+
+ handleSubmit(values, isSubmitting)}
+ onSubmit={(values) => handleSubmit(values)}
+ // onSubmit={(values) => {
+ // register({ user: values })
+ // .then(() => {
+ // // setSubmitting(false);
+ // // router.push("/");
+ // })
+ // .catch(() => {
+ // // setSubmitting(false);
+ // });
+ // }}
+ // step={0}
+ // validator={() => ({})}
+ // albusProps={{step: 0, onNext: (context) => handleSubmit.bind(this, context)}}
+ // albusProps={{(context) => console.log(context)}}
+ render={FormWrapper}
+ />
+
+
+
+
+ );
+};
+
+SignupForm.propTypes = {};
diff --git a/components/SignupForm/index.ts b/components/SignupForm/index.ts
new file mode 100644
index 00000000..9a591bbd
--- /dev/null
+++ b/components/SignupForm/index.ts
@@ -0,0 +1 @@
+export { SignupForm } from "./SignupForm";
diff --git a/components/SocialLinks/SocialLinks.styles.tsx b/components/SocialLinks/SocialLinks.styles.tsx
new file mode 100644
index 00000000..d57ead23
--- /dev/null
+++ b/components/SocialLinks/SocialLinks.styles.tsx
@@ -0,0 +1,32 @@
+import styled from "@emotion/styled";
+
+interface FooterStateType {
+ darkMode?: boolean;
+}
+
+export const SocialContainer = styled.div`
+ display: flex;
+ justify-content: center;
+ align-items: center;
+`;
+
+export const SocialList = styled.ul`
+ padding-inline-start: 0px;
+`;
+
+export const SocialListItem = styled.li`
+ display: inline-block;
+ margin: 0 10px;
+ & a {
+ color: ${(p) => (p.darkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary)};
+ }
+ & a:hover {
+ color: ${(p) => p.theme.colors.brand.primary};
+ }
+`;
+
+export const SocialIcon = styled.img`
+ height: 40px;
+ width: 40px;
+ padding: 5px;
+`;
diff --git a/components/SocialLinks/SocialLinks.tsx b/components/SocialLinks/SocialLinks.tsx
new file mode 100644
index 00000000..8b6e610f
--- /dev/null
+++ b/components/SocialLinks/SocialLinks.tsx
@@ -0,0 +1,35 @@
+import React from "react";
+import { Facebook, Twitter, Instagram } from "@material-ui/icons";
+
+import { SocialContainer, SocialList, SocialListItem, SocialIcon } from "./SocialLinks.styles";
+
+export const SocialLinks = ({ darkMode }: any) => {
+ return (
+ <>
+
+
+
+
+ {/*
+
+
+
+ {/*
+
+
+
+ {/*
+
+
+
+ );
+};
diff --git a/components/SocialLinks/index.tsx b/components/SocialLinks/index.tsx
new file mode 100644
index 00000000..bb63e6e6
--- /dev/null
+++ b/components/SocialLinks/index.tsx
@@ -0,0 +1 @@
+export * from "./SocialLinks";
diff --git a/components/StreamCard/StreamCard.styles.tsx b/components/StreamCard/StreamCard.styles.tsx
new file mode 100644
index 00000000..fbe22eaf
--- /dev/null
+++ b/components/StreamCard/StreamCard.styles.tsx
@@ -0,0 +1,103 @@
+import styled from "@emotion/styled";
+import Link from "next/link";
+import { pxPC, pxIphone } from "../../utils";
+import { PriceText, XlargeTitle, XsmallText } from "../../styles/BaseStyles";
+
+export const StreamCardWrapper = styled.div`
+ cursor: pointer;
+ display: flex;
+ flex-direction: column;
+ justify-content: flex-start;
+ align-items: center;
+ margin: 10px;
+`;
+export const StreamImgWrapper = styled.div`
+ position: relative;
+ width: 100%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+`;
+export const StreamImg = styled.img`
+ object-fit: cover;
+ width: 100%;
+ height: 100%;
+`;
+export const StreamMask = styled.div`
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+`;
+export const StreamStatusWrapper = styled.div`
+ height: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+`;
+export const StreamStatus = styled.h4`
+ color: ${(p) => p.theme.colors.white.primary};
+ margin: 0 auto;
+ font-family: ${(p) => p.theme.typography.titleSM.fontFamily};
+ text-align: center;
+ padding: 40px;
+ @media (max-width: 375px) {
+ font-size: 19px;
+ line-height: 23px;
+ width: 88px;
+ }
+`;
+export const StreamCardLink = styled(Link)``;
+export const StreamChecked = styled.div`
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ width: 137px;
+ height: 90px;
+ margin: auto;
+ font-size: 24px;
+ line-height: 30px;
+ font-family: ${(p) => p.theme.typography.bodyMD.fontFamily};
+ text-align: center;
+ @media (max-width: 375px) {
+ font-size: 19px;
+ line-height: 23px;
+ width: 100px;
+ }
+`;
+export const StreamCardTitle = styled.h2`
+ font-family: ${(p) => p.theme.typography.titleSM.fontFamily};
+ line-height: ${(p) => p.theme.typography.titleSM.lineHeight};
+ color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary};
+ margin: 20px 0 0 0;
+`;
+
+export const StreamCardDesc = styled.p`
+ color: ${(p) =>
+ p.theme.isDarkMode ? p.theme.colors.white.primary : p.theme.colors.black.primary};
+ text-align: center;
+ font-weight: 100;
+`;
+export const InfluencerBox = styled.div`
+ display: flex;
+ flex-direction: column;
+ justify-content: flex-start;
+ align-items: center;
+ position: absolute;
+ right: ${pxPC(7.74)};
+ bottom: ${pxPC(-30)};
+`;
+export const InfluencerAvatar = styled.img``;
+export const InfluencerName = styled.span`
+ font-family: ${(p) => p.theme.typography.bodyMD.fontFamily};
+`;
diff --git a/components/StreamCard/StreamCard.tsx b/components/StreamCard/StreamCard.tsx
new file mode 100644
index 00000000..cc2b4bb0
--- /dev/null
+++ b/components/StreamCard/StreamCard.tsx
@@ -0,0 +1,56 @@
+import React from "react";
+import moment from "moment";
+import { useRouter } from "next/router";
+import Rating from "@material-ui/lab/Rating";
+
+import {
+ StreamCardWrapper,
+ InfluencerAvatar,
+ InfluencerBox,
+ InfluencerName,
+ StreamCardTitle,
+ StreamImg,
+ StreamImgWrapper,
+ StreamMask,
+ StreamStatusWrapper,
+ StreamStatus,
+ StreamCardDesc,
+ StreamChecked
+} from "./StreamCard.styles";
+
+export const StreamCard = ({ isPast, item }: any) => {
+ const router = useRouter();
+ return (
+ router.push(`/tv/${item.playback_ids[0]}`)}
+ // as={`/tv/${item.playback_ids[0]}`}
+ // title={`Link to ${item.title} Live Stream`}
+ >
+ <>
+
+ {!isPast ?
+ {isPast ? "Streamed" : "Streaming"} Soon {" "}
+ {moment(item.start_date).fromNow()} Check Back Soon
+
+ ) : null}
+ {isPast ? (
+
+ Stream Ended Watch Replay
+
+ ) : null}
+
+ Jane Doe
+ */}
+
+ {item.title}
+ {item.description}
+
+
+ );
+};
diff --git a/components/StreamCard/index.tsx b/components/StreamCard/index.tsx
new file mode 100644
index 00000000..30ae3200
--- /dev/null
+++ b/components/StreamCard/index.tsx
@@ -0,0 +1 @@
+export { StreamCard } from "./StreamCard";
diff --git a/components/StreamList/StreamList.styles.tsx b/components/StreamList/StreamList.styles.tsx
new file mode 100644
index 00000000..3c05e256
--- /dev/null
+++ b/components/StreamList/StreamList.styles.tsx
@@ -0,0 +1,132 @@
+import styled from "@emotion/styled";
+import { pxPC, pxIphone } from "../../utils";
+import { PriceText, ProductTitle, XlargeTitle, XsmallText } from "../../styles/BaseStyles";
+export const Title = styled(XlargeTitle)`
+ font-family: "Bebas Neue";
+ margin-bottom: ${pxPC(30)};
+ font-size: 44px;
+ line-height: 54px;
+ @media (max-width: 375px) {
+ margin-bottom: ${pxIphone(19)};
+ }
+`;
+export const StreamListWrapper = styled.div`
+ margin-top: ${pxPC(30)};
+ overflow: hidden;
+ @media (max-width: 375px) {
+ margin-top: ${pxIphone(19)};
+ }
+`;
+export const MySlideWrap = styled.div`
+ display: flex;
+ flex-direction: column;
+ justify-content: flex-start;
+ align-items: center;
+ margin-right: ${pxPC(14.99)};
+`;
+export const ProductImgOutterBox = styled.div`
+ position: relative;
+ width: 100%;
+`;
+export const ProductImg = styled.img`
+ object-fit: cover;
+ width: 100%;
+`;
+export const ProductMask = styled.div`
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ background-color: rgba(255, 255, 255, 0.66); ;
+`;
+export const MaskTitle = styled.div`
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ width: 114px;
+ height: 90px;
+ margin: auto;
+ font-size: 24px;
+ line-height: 30px;
+ font-family: "Bebas Neue";
+ text-align: center;
+ color: #707070;
+ @media (max-width: 375px) {
+ font-size: 19px;
+ line-height: 23px;
+ width: 88px;
+ }
+`;
+export const MaskTitleChecked = styled.div`
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ width: 137px;
+ height: 90px;
+ margin: auto;
+ font-size: 24px;
+ line-height: 30px;
+ font-family: "Bebas Neue";
+ text-align: center;
+ color: #707070;
+ @media (max-width: 375px) {
+ font-size: 19px;
+ line-height: 23px;
+ width: 100px;
+ }
+`;
+export const InfluencerBox = styled.div`
+ display: flex;
+ flex-direction: column;
+ justify-content: flex-start;
+ align-items: center;
+ position: absolute;
+ right: ${pxPC(7.74)};
+ bottom: ${pxPC(-30)};
+`;
+export const InfluencerAvatar = styled.img``;
+export const InfluencerName = styled(XsmallText)`
+ margin-top: ${pxPC(5)};
+`;
+export const MyProductTitle = styled(ProductTitle)`
+ font-family: Roboto Condensed;
+ font-size: 10.75px;
+ line-height: 13px;
+ margin-top: ${pxPC(5.56)};
+ align-self: flex-start;
+`;
+export const ProductDescBox = styled.div`
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+ margin-top: ${pxPC(31)};
+ align-self: stretch;
+`;
+export const MyProductSubTitle = styled.div`
+ font-family: Roboto Condensed;
+ font-size: 8px;
+ line-height: 9px;
+ text-decoration: underline;
+ color: #000;
+ text-align: center;
+`;
+export const MyProductSubText = styled.div`
+ margin-left: ${pxPC(4)};
+ font-family: Roboto Condensed;
+ font-size: 8px;
+ line-height: 9px;
+ color: rgba(0, 0, 0, 0.33);
+`;
+export const ProductPrice = styled(PriceText)`
+ font-family: Roboto Condensed;
+ font-size: 7.9px;
+ line-height: 9px;
+ text-align: center;
+ color: #000;
+ margin-left: auto;
+`;
diff --git a/components/StreamList/StreamList.tsx b/components/StreamList/StreamList.tsx
new file mode 100644
index 00000000..86124566
--- /dev/null
+++ b/components/StreamList/StreamList.tsx
@@ -0,0 +1,43 @@
+import React from "react";
+import moment from "moment";
+import { Swiper, SwiperSlide } from "swiper/react";
+import { StreamCard } from "../StreamCard";
+import { StreamListWrapper, Title } from "./StreamList.styles";
+import SwiperCore, { Navigation, Thumbs } from "swiper/core";
+import { useMediaQuery } from "react-responsive";
+import { IStream } from "../../typings/stream";
+export interface StreamListProps {
+ data: IStream[];
+ title: string;
+}
+SwiperCore.use([Navigation, Thumbs]);
+export const StreamList: React.FC = (props) => {
+ const { data, title } = props;
+ const isMobile = useMediaQuery({ maxWidth: 767 });
+
+ return (
+
+ {title}
+
+ {data &&
+ data.map((item, index) => {
+ const startDate = moment(item.start_date);
+ const today = moment();
+ const isPast = today.isAfter(startDate);
+ // console.log(item.playback_ids[0]);
+ return (
+
+
+ );
+ })}
+
+
+ );
+};
diff --git a/components/StreamList/index.tsx b/components/StreamList/index.tsx
new file mode 100644
index 00000000..e3470d14
--- /dev/null
+++ b/components/StreamList/index.tsx
@@ -0,0 +1 @@
+export * from "./StreamList";
diff --git a/components/StreamViewer/StreamViewer.styles.ts b/components/StreamViewer/StreamViewer.styles.ts
new file mode 100644
index 00000000..9086a8a2
--- /dev/null
+++ b/components/StreamViewer/StreamViewer.styles.ts
@@ -0,0 +1,39 @@
+import styled from "@emotion/styled";
+import { VideoJS } from "../VideoJS";
+
+export const StreamViewerWrapper = styled.div`
+ position: fixed;
+ z-index: 1;
+ top: 0;
+ left: 0;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width: 100%;
+ height: 100%;
+ backdrop-filter: blur(15px);
+`;
+
+export const StreamVideo = styled(VideoJS)`
+ // width: 50%;
+ // height: 50%;
+ width: 800px;
+ max-width: 100%;
+ cursor: pointer;
+ padding-top: 40px;
+ padding-bottom: 40px;
+ mix-blend-mode: hard-light;
+`;
+
+export const StreamHeaderFade = styled.div`
+ display: block;
+ position: absolute;
+ left: 0;
+ top: 0;
+ z-index: 3;
+ width: 100%;
+ height: 200px;
+ background: rgb(255, 255, 255);
+ background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
+ pointer-event: none;
+`;
diff --git a/components/StreamViewer/StreamViewer.tsx b/components/StreamViewer/StreamViewer.tsx
new file mode 100644
index 00000000..686c355d
--- /dev/null
+++ b/components/StreamViewer/StreamViewer.tsx
@@ -0,0 +1,108 @@
+import React, { useEffect } from "react";
+import { useRouter } from "next/router";
+
+import { StreamViewerWrapper, StreamVideo, StreamHeaderFade } from "./StreamViewer.styles";
+
+export const StreamViewer = ({ props }: any) => {
+ const router = useRouter();
+ const { streamId } = router.query;
+
+ const playerRef = React.useRef(null);
+
+ const videoJsOptions = streamId
+ ? {
+ // lookup the options in the docs for more options
+ autoplay: true,
+ controls: true,
+ responsive: true,
+ fluid: true,
+ sources: [
+ {
+ src: `https://stream.mux.com/${streamId}.m3u8`,
+ type: "application/x-mpegURL"
+ }
+ ]
+ }
+ : null;
+
+ const handlePlayerReady = (player: any) => {
+ playerRef.current = player;
+
+ // you can handle player events here
+ player.on("waiting", () => {
+ console.log("player is waiting");
+ });
+
+ player.on("dispose", () => {
+ console.log("player will dispose");
+ });
+ };
+
+ // const changePlayerOptions = () => {
+ // // you can update the player through the Video.js player instance
+ // if (!playerRef.current) {
+ // return;
+ // }
+ // // [update player through instance's api]
+ // playerRef.current.src([{src: 'http://ex.com/video.mp4', type: 'video/mp4'}]);
+ // playerRef.current.autoplay(false);
+ // };
+
+ useEffect(() => {
+ console.log(streamId);
+ }, []);
+
+ return (
+
+
+ );
+};
+
+// import { useEffect, useRef } from 'react';
+// import videojs from 'video.js';
+// import Hls from 'hls.js';
+// import { StreamViewerWrapper, StreamVideo } from './StreamViewer.styles';
+// import "video.js/dist/video-js.css";
+
+// export const StreamViewer = ({ src, poster }: any) => {
+// const videoRef = useRef(null);
+
+// useEffect(() => {
+// const video = videoRef.current
+// if (!video) return
+
+// video.controls = true
+// let hls: any
+
+// if (video.canPlayType('application/vnd.apple.mpegurl')) {
+// // This will run in safari, where HLS is supported natively
+// // video.src = src
+// // video.src = 'https://stream.mux.com/c2yVkaTxlAr402RakTmOP1sSpyQ5ENMPo5zOGKR7aWKo.m3u8'
+// video.src = 'https://stream.mux.com/ZH4K9sCgB02BNwBNshJ8cAgppZiwXXzEbvLDAI00rtgM4.m3u8'
+// } else if (Hls.isSupported()) {
+// // This will run in all other modern browsers
+// hls = new Hls()
+// // hls.loadSource('https://stream.mux.com/c2yVkaTxlAr402RakTmOP1sSpyQ5ENMPo5zOGKR7aWKo.m3u8')
+// hls.loadSource('https://stream.mux.com/ZH4K9sCgB02BNwBNshJ8cAgppZiwXXzEbvLDAI00rtgM4.m3u8')
+// hls.attachMedia(video)
+// } else {
+// console.error(
+// 'This is an old browser that does not support MSE https://developer.mozilla.org/en-US/docs/Web/API/Media_Source_Extensions_API'
+// )
+// }
+
+// return () => {
+// if (hls) {
+// hls.destroy()
+// }
+// }
+// }, [src, videoRef])
+
+// return (
+//
+//
+// )
+// };
diff --git a/components/StreamViewer/index.ts b/components/StreamViewer/index.ts
new file mode 100644
index 00000000..feddbb16
--- /dev/null
+++ b/components/StreamViewer/index.ts
@@ -0,0 +1 @@
+export { StreamViewer } from "./StreamViewer";
diff --git a/components/Terms/ElectronicSignaturesModal.css b/components/Terms/ElectronicSignaturesModal.css
new file mode 100644
index 00000000..45d58ebd
--- /dev/null
+++ b/components/Terms/ElectronicSignaturesModal.css
@@ -0,0 +1,48 @@
+/* Modal header container */
+.gkBGAw {
+ z-index: 1052;
+}
+
+/* Modal header h5 */
+.iJuqEf {
+ margin: 0 10%;
+}
+
+.es-modal-container {
+ margin-right: 10px;
+}
+
+.es-modal-btn-close {
+ cursor: pointer;
+ position: absolute;
+ top: 0;
+ right: 0;
+ margin-top: 17px;
+ margin-right: 20px;
+ width: 31px;
+ height: 31px;
+ background-size: cover;
+}
+
+.es-modal-content-container {
+ margin: 20px 0;
+ padding: 15px;
+}
+
+@media (max-width: 480px) {
+ .es-modal-content-container {
+ border: none !important;
+ }
+}
+
+.es-modal-text {
+ font-size: 14px;
+ line-height: 22px;
+ color: #696969;
+}
+
+.es-modal-content-title {
+ font-size: 16px;
+ color: #696969;
+ font-weight: 700;
+}
diff --git a/components/Terms/ElectronicSignaturesModal.tsx b/components/Terms/ElectronicSignaturesModal.tsx
new file mode 100644
index 00000000..9aa62266
--- /dev/null
+++ b/components/Terms/ElectronicSignaturesModal.tsx
@@ -0,0 +1,138 @@
+/* eslint-disable no-console */
+import React from "react";
+// import PropTypes from "prop-types";
+
+// import { Close } from '@material-ui/icons';
+
+export const ElectronicSignaturesModal = () => {
+ return (
+ `
+ transition: all 0.33s ease-in-out;
+ display: flex;
+ position: absolute;
+ left: 68px;
+ bottom: -90px;
+ font-size: 0.9rem;
+ padding: ${(props) => (props.speechReady ? "10px 14px" : "auto")};
+ width: ${(props) => (props.speechReady ? "auto" : `${width * 0.8}px`)};
+ height: ${(props) => (props.speechReady ? "auto" : `${height * 0.8}px`)};
+ align-items: center;
+ justify-content: space-around;
+ border-radius: ${(props) => (props.speechReady ? 20 : 36)}px;
+ background-color: ${(props) => props.theme.colors.white.primary};
+ box-shadow: 5px 8px 20px rgba(0, 0, 0, 0.25);
+ color: ${(props) => props.theme.colors.gray.dark};
+ &::before,
+ &::after {
+ position: absolute;
+ content: " ";
+ background: ${(props) => props.theme.colors.white.primary};
+ border-radius: 100%;
+ ${"" /* box-shadow: 5px 8px 20px rgba(0,0,0,0.25); */}
+ }
+
+ &::before {
+ bottom: 0;
+ left: -6px;
+ width: ${height / 3}px;
+ height: ${height / 3}px;
+ }
+
+ &::after {
+ bottom: -5px;
+ left: -18px;
+ width: ${height / 6}px;
+ height: ${height / 6}px;
+ }
+`;
+
+export const BubbleSpeech = styled.div`
+ color: ${(props: any) => props.theme.colors.gray.dark};
+ font-size: 1rem;
+ font-weight: 300;
+ text-align: left;
+`;
+
+export const BubbleDot = styled.div`
+ width: ${width / 8}px;
+ height: ${width / 8}px;
+ border-radius: 100%;
+ background-color: ${(props: any) => props.theme.colors.gray.medium};
+
+ animation: ${fadeInOut} 1.5s linear infinite;
+ animation-delay: 0.25s;
+
+ &:first-of-type {
+ margin-left: ${width / 8}px;
+ animation-delay: 0s;
+ }
+
+ &:last-of-type {
+ margin-right: ${width / 8}px;
+ animation-delay: 0.5s;
+ }
+`;
diff --git a/components/TipBot/TipBot.tsx b/components/TipBot/TipBot.tsx
new file mode 100644
index 00000000..6423e46a
--- /dev/null
+++ b/components/TipBot/TipBot.tsx
@@ -0,0 +1,96 @@
+/* eslint-disable react/no-danger */
+/* eslint-disable no-underscore-dangle */
+/* eslint-disable no-console */
+// Vendor
+import React, { useState, useEffect } from "react";
+import PropTypes from "prop-types";
+import { useMediaQuery } from "react-responsive";
+// import { useSpring, useTransition, config, animated } from 'react-spring';
+import { useSpring, animated } from "react-spring";
+import Typist from "react-typist";
+import parse from "html-react-parser";
+
+// Local
+// import { FadeIn } from '../Animations';
+import {
+ TipBotWrapper,
+ TipBotImage,
+ BubbleWrapper,
+ BubbleWrapperMobile,
+ BubbleSpeech,
+ BubbleDot
+} from "./TipBot.styles";
+
+const TipBot = ({ speech }: any) => {
+ const [speechReady, setSpeechStatus] = useState(false);
+ // const [show, set] = useState(false);
+
+ const speechProps = useSpring({
+ config: { duration: 800 },
+ opacity: speechReady ? 1 : 0
+ });
+
+ // const bubbleProps = useTransition(show, null, {
+ // config: config.stiff,
+ // from: { opacity: 0 },
+ // enter: { opacity: 1 },
+ // leave: { opacity: 0 },
+ // });
+
+ const isMobile = useMediaQuery({
+ // query: `(min-device-width: ${props => props.theme.breakpoints.values.lg}px)`
+ query: `(max-device-width: 768px)`
+ });
+
+ useEffect(() => {
+ // setTimeout(setSpeechStatus(s => !s), 1500);
+ setTimeout(() => {
+ setSpeechStatus(true);
+ }, 1500);
+ });
+
+ return (
+
+ {isMobile ? (
+
+ {speechReady ? (
+
+ */}
+
+ ) : (
+
+
+ console.log("typed in")}
+ >
+ {parse(speech.__html)}
+
+
+
+ )}
+
+ );
+};
+
+TipBot.propTypes = {
+ speech: PropTypes.shape({ __html: PropTypes.string.isRequired })
+};
+
+TipBot.defaultProps = {
+ speech: ""
+};
+
+export default TipBot;
diff --git a/components/TipBot/index.ts b/components/TipBot/index.ts
new file mode 100644
index 00000000..008af48e
--- /dev/null
+++ b/components/TipBot/index.ts
@@ -0,0 +1 @@
+export { default } from "./TipBot";
diff --git a/components/Video/Video.styles.tsx b/components/Video/Video.styles.tsx
new file mode 100644
index 00000000..91eca9ef
--- /dev/null
+++ b/components/Video/Video.styles.tsx
@@ -0,0 +1,12 @@
+import styled from "@emotion/styled";
+
+export const VideoContainer = styled.div`
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ position: relative;
+ background: url(img/static.gif);
+ background-size: cover;
+ background-position: 0px 0px;
+ overflow: hidden;
+`;
diff --git a/components/Video/Video.tsx b/components/Video/Video.tsx
new file mode 100644
index 00000000..a6306c6f
--- /dev/null
+++ b/components/Video/Video.tsx
@@ -0,0 +1,106 @@
+import Image from "next/image";
+import React, { useState } from "react";
+import InputRange from "react-input-range";
+import "react-input-range/lib/css/index.css";
+import "react-rangeslider/lib/index.css";
+import ReactPlayer from "react-player/youtube";
+import styled from "@emotion/styled";
+import { VideoContainer } from "./Video.styles";
+
+interface Props {
+ isPlaying: any;
+ mute: boolean;
+ mutedPlayer: any;
+ handleChangeReverse: any;
+ reverse: any;
+}
+interface S {
+ player: string;
+ playVideo: any;
+ value: any;
+ reverseValue: any;
+}
+export const Video = (props: any) => {
+ const { isPlaying } = props;
+ const [player, setPlayer] = useState(null);
+ const [playVideo, setPlayVideo] = useState("");
+ const [value, setValue] = useState(100);
+ const [reverseValue, setReverseValue] = useState(3);
+
+ const _onReady = (event: any) => {
+ event.target.pauseVideo();
+ };
+ const _onPlayerReady = (event: any) => {
+ var embedCode = event.target.getVideoEmbedCode();
+ event.target.playVideo();
+ const embedElement = document.getElementById("embed-code");
+ if (embedElement) {
+ embedElement.innerHTML = embedCode;
+ }
+ };
+
+ const opts = {
+ height: "250",
+ width: "310",
+ playerVars: {
+ autoplay: 1,
+ controls: 0,
+ rel: 0,
+ autohide: 1,
+ showinfo: 0,
+ modestbranding: 1,
+ playsinline: 1,
+ enablejsapi: 1,
+ wmode: "opaque",
+ loop: 1,
+ origin: "http://localhost:3000"
+ }
+ };
+
+ return (
+ <>
+
+ {isPlaying && (
+
+
+ );
+};
diff --git a/components/Video/index.ts b/components/Video/index.ts
new file mode 100644
index 00000000..570db25a
--- /dev/null
+++ b/components/Video/index.ts
@@ -0,0 +1 @@
+export { Video } from "./Video";
diff --git a/components/VideoJS/VideoJS.tsx b/components/VideoJS/VideoJS.tsx
new file mode 100644
index 00000000..bec41f59
--- /dev/null
+++ b/components/VideoJS/VideoJS.tsx
@@ -0,0 +1,45 @@
+import { useEffect, useRef, createRef } from "react";
+import videojs from "video.js";
+import "video.js/dist/video-js.css";
+
+export const VideoJS = ({ options, onReady }: any) => {
+ const videoRef = useRef(null);
+ // let playerRef = createRef();
+ let playerRef = useRef(null);
+
+ useEffect(() => {
+ // make sure Video.js player is only initialized once
+ if (!playerRef.current) {
+ const videoElement = videoRef.current;
+ if (!videoElement) return;
+
+ const player = (playerRef.current = videojs(videoElement, options, () => {
+ console.log("player is ready");
+ onReady && onReady(player);
+ }));
+ } else {
+ // you can update player here [update player through props]
+ // const player = playerRef.current;
+ // player.autoplay(options.autoplay);
+ // player.src(options.sources);
+ }
+ }, [options, videoRef]);
+
+ // Dispose the Video.js player when the functional component unmounts
+ useEffect(() => {
+ const player = playerRef.current;
+
+ return () => {
+ if (player) {
+ player.dispose();
+ playerRef.current = null;
+ }
+ };
+ }, [playerRef]);
+
+ return (
+ {
- constructor(props: Props) {
- super(props)
- this.state = {
- menuOpen: false
- }
- }
-
- handleStateChange(state) {
- this.setState({ menuOpen: state.isOpen })
- }
- openMenu() {
- this.setState({ menuOpen: true })
- }
- closeMenu() {
- this.setState({ menuOpen: false })
- }
-
- render() {
- const styles = {
- bmBurgerButton: {
- position: 'fixed',
- width: '10px',
- height: '10px',
- left: '11px',
- top: '11px',
- zIndex:9999
- },
- bmBurgerBars: {
- background: this.state.menuOpen? '#000' : '#ff4154'
- },
- bmBurgerBarsHover: {
- background: '#a90000'
- },
- bmCrossButton: {
- height: '24px',
- width: '24px'
- },
- bmCross: {
- background: '#ff4154'
- },
- bmMenuWrap: {
- position: 'fixed',
- minHeight: '100%',
- overflowY:'hidden'
-
-
- },
- bmMenu: {
- background: '#000',
- padding: '2.5em 1.5em 0',
- fontSize: '1.15em',
- overflowY:'hidden'
- },
- bmMorphShape: {
- fill: '#373a47'
- },
- bmItemList: {
- color: '#b8b7ad',
- padding: '0.8em'
- },
- bmItem: {
- display: 'inline-block'
- },
- bmOverlay: {
- background: 'rgba(0, 0, 0, 0.3)'
- }
- }
- return (
- <>
- {
- constructor(props: Props) {
- super(props);
- this.state = {
- player: null,
- playVideo: '',
- value: 100,
- reverseValue: 3
- }
- }
-
- _onReady(event) {
- event.target.pauseVideo();
- }
- _onPlayerReady(event) {
- var embedCode = event.target.getVideoEmbedCode();
- event.target.playVideo();
- if (document.getElementById('embed-code')) {
- document.getElementById('embed-code').innerHTML = embedCode;
- }
- }
-
- render() {
- const { isPlaying } = this.props
-
- const opts = {
- height: '250',
- width: '310',
- playerVars: {
- autoplay: 1,
- controls: 0,
- rel: 0,
- autohide: 1,
- showinfo: 0,
- modestbranding: 1,
- playsinline: 1,
- enablejsapi: 1,
- wmode: 'opaque',
- loop: 1,
- origin: 'http://localhost:3000'
- },
- };
-
- return (
- (authConfig);
diff --git a/config/index.tsx b/config/index.tsx
index 16c0f5a9..621b1e69 100644
--- a/config/index.tsx
+++ b/config/index.tsx
@@ -1,5 +1,5 @@
-const dev = process.env.NODE_ENV !== 'production'
+const dev = process.env.NODE_ENV !== "production";
//export const server = dev ? 'http://localhost:3000' : "https://api.soundcloud.com/users/6319082/playlists?client_id="
-export const client_id = '465bfa9fa3bf3c824164deb07cb2761b'
-export const user_id = '6319082'
-export const server = "https://api.soundcloud.com/users/6319082/playlists?client_id="
\ No newline at end of file
+export const client_id = "465bfa9fa3bf3c824164deb07cb2761b";
+export const user_id = "6319082";
+export const server = "https://api.soundcloud.com/users/6319082/playlists?client_id=";
diff --git a/config/soundcloud.ts b/config/soundcloud.ts
new file mode 100644
index 00000000..a76fe052
--- /dev/null
+++ b/config/soundcloud.ts
@@ -0,0 +1,3 @@
+import Soundcloud from "soundcloud.ts";
+
+export const scClient = new Soundcloud(process.env.SC_CLIENT_ID, process.env.SC_OAUTH_TOKEN);
diff --git a/config/spree.ts b/config/spree.ts
new file mode 100644
index 00000000..8e2d52f3
--- /dev/null
+++ b/config/spree.ts
@@ -0,0 +1,5 @@
+import { makeClient } from "@spree/storefront-api-v2-sdk";
+
+export const spreeClient = makeClient({
+ host: process.env.SPREE_API_URL || "https://dna-admin-staging.instinct.is/"
+});
diff --git a/config/storage.ts b/config/storage.ts
new file mode 100644
index 00000000..c8a8a7d8
--- /dev/null
+++ b/config/storage.ts
@@ -0,0 +1,41 @@
+import { IOAuthToken, IToken } from "@spree/storefront-api-v2-sdk/types/interfaces/Token";
+import { spreeClient } from "./spree";
+
+const storage = {
+ getToken: async (): Promise => {
+ const token = window.localStorage.getItem("token");
+ if (token) {
+ const parsedToken: IOAuthToken = JSON.parse(token);
+ const expiresAt = parsedToken.created_at + parsedToken.expires_in;
+ const now = Math.round(Date.now() / 1000);
+ const tokenExpired = now - expiresAt > 0;
+ if (tokenExpired) {
+ const response = await spreeClient.authentication.refreshToken({
+ refresh_token: parsedToken.refresh_token
+ });
+ if (response.isSuccess()) {
+ const newToken = response.success();
+ storage.setToken(newToken);
+ return newToken;
+ } else {
+ console.warn("COULD NOT REFRESH TOKEN");
+ storage.clearToken();
+ }
+ }
+ return JSON.parse(token);
+ }
+ },
+ setToken: (token: IOAuthToken) => window.localStorage.setItem("token", JSON.stringify(token)),
+ getGuestOrderToken: (): IToken | undefined => {
+ const token = window.localStorage.getItem("guestOrderToken");
+ if (token) {
+ return JSON.parse(token);
+ }
+ },
+ setGuestOrderToken: (token: string) => {
+ window.localStorage.setItem("guestOrderToken", JSON.stringify(token));
+ },
+ clearToken: () => window.localStorage.removeItem("token")
+};
+
+export default storage;
diff --git a/config/tracking.ts b/config/tracking.ts
new file mode 100644
index 00000000..9239ead1
--- /dev/null
+++ b/config/tracking.ts
@@ -0,0 +1,90 @@
+export const GA_TRACKING_CODE = process.env.NEXT_PUBLIC_GA_TRACKING_CODE;
+export const GA_DEBUG_MODE = process.env.NEXT_PUBLIC_GA_DEBUG_MODE;
+
+export enum Action {
+ PRESS_ENTER = "press-enter",
+ SELECT_SUGGESTION = "select-suggestion",
+ VIEW_PRODUCT = "view-product"
+}
+
+export enum Category {
+ SEARCH_BAR = "search-bar",
+ PRODUCT_DETAIL = "product-detail"
+}
+
+const TRACKING_ON = process.env.NEXT_PUBLIC_TRACKING !== "off";
+const TRACKING_VERBOSE = process.env.NEXT_PUBLIC_TRACKING_VERBOSE === "on";
+
+const TRACKING_GA_ON = process.env.NEXT_PUBLIC_TRACKING_PROVIDER_GA !== "off";
+const TRACKING_KM_ON = process.env.NEXT_PUBLIC_TRACKING_PROVIDER_KM !== "off";
+
+type TrackingEvent = {
+ action: string;
+ category: string;
+ label?: string;
+};
+
+interface TrackingProvider {
+ getName(): string;
+ isActive(): boolean;
+ trackPageview(url: string): void;
+ trackEvent({ action, category, label }: TrackingEvent): void;
+}
+
+const googleAnalyticsProvider: TrackingProvider = {
+ getName: (): string => {
+ return "Google Analytics 4";
+ },
+
+ isActive: (): boolean => {
+ return TRACKING_GA_ON;
+ },
+
+ trackPageview: (url: string): void => {
+ window.gtag("config", GA_TRACKING_CODE, {
+ page_path: url
+ });
+ },
+
+ trackEvent: ({ action, category, label }: TrackingEvent): void => {
+ window.gtag("event", action, {
+ event_category: category,
+ event_label: label,
+ value: 0
+ });
+ }
+};
+
+const trackingProviders: Array = [googleAnalyticsProvider];
+
+export const trackPageview = (url: string): void => {
+ if (!TRACKING_ON) {
+ return;
+ }
+
+ for (let provider of trackingProviders) {
+ if (provider.isActive()) {
+ if (TRACKING_VERBOSE) {
+ console.log(provider.getName() + " - trackPageview", url);
+ }
+
+ provider.trackPageview(url);
+ }
+ }
+};
+
+export const trackEvent = ({ action, category, label }: TrackingEvent): void => {
+ if (!TRACKING_ON) {
+ return;
+ }
+
+ for (let provider of trackingProviders) {
+ if (provider.isActive()) {
+ if (TRACKING_VERBOSE) {
+ console.log(provider.getName() + " - trackEvent", { action, category, label });
+ }
+
+ provider.trackEvent({ action, category, label });
+ }
+ }
+};
diff --git a/contrib/spree-storefront-api-v2-sdk-4.5.1003.tgz b/contrib/spree-storefront-api-v2-sdk-4.5.1003.tgz
new file mode 100644
index 00000000..3dfee054
Binary files /dev/null and b/contrib/spree-storefront-api-v2-sdk-4.5.1003.tgz differ
diff --git a/data/girl.json b/data/girl.json
new file mode 100644
index 00000000..c9155762
--- /dev/null
+++ b/data/girl.json
@@ -0,0 +1,6318 @@
+{
+ "v": "5.7.3",
+ "fr": 60,
+ "ip": 0,
+ "op": 81,
+ "w": 1000,
+ "h": 1000,
+ "nm": "1000",
+ "ddd": 0,
+ "assets": [],
+ "layers": [
+ {
+ "ddd": 0,
+ "ind": 5,
+ "ty": 4,
+ "nm": "shoulder",
+ "parent": 9,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": {
+ "k": [
+ { "s": [28.965], "t": 0, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [28.881], "t": 1, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [28.641], "t": 2, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [28.255], "t": 3, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [27.755], "t": 4, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [27.142], "t": 5, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [26.429], "t": 6, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [25.615], "t": 7, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [24.698], "t": 8, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [23.691], "t": 9, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [22.595], "t": 10, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [21.413], "t": 11, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [20.149], "t": 12, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [18.819], "t": 13, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [17.451], "t": 14, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [16.056], "t": 15, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [14.659], "t": 16, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [13.282], "t": 17, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [11.954], "t": 18, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.697], "t": 19, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [9.538], "t": 20, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [8.487], "t": 21, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.501], "t": 22, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [6.545], "t": 23, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.587], "t": 24, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [4.614], "t": 25, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [3.618], "t": 26, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.599], "t": 27, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.56], "t": 28, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.537], "t": 30, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.563], "t": 31, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.552], "t": 32, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.492], "t": 33, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.36], "t": 34, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.135], "t": 35, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.802], "t": 36, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.344], "t": 37, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.742], "t": 38, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.984], "t": 39, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.068], "t": 40, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.983], "t": 41, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.739], "t": 42, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.342], "t": 43, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.802], "t": 44, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.135], "t": 45, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.36], "t": 46, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.492], "t": 47, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.552], "t": 48, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.564], "t": 49, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.537], "t": 50, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.511], "t": 51, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.56], "t": 52, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.599], "t": 53, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [3.617], "t": 54, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [4.614], "t": 55, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.587], "t": 56, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.508], "t": 58, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [8.488], "t": 59, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [9.538], "t": 60, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.697], "t": 61, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [11.954], "t": 62, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [13.282], "t": 63, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [14.659], "t": 64, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [16.056], "t": 65, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [17.451], "t": 66, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [18.819], "t": 67, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [20.149], "t": 68, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [21.413], "t": 69, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [22.595], "t": 70, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [23.691], "t": 71, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [24.698], "t": 72, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [25.615], "t": 73, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [26.429], "t": 74, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [27.142], "t": 75, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [27.755], "t": 76, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [28.255], "t": 77, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [28.641], "t": 78, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [28.881], "t": 79, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [28.965], "t": 80, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } }
+ ]
+ },
+ "p": {
+ "a": 1,
+ "k": [
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 0,
+ "s": [514.137, 212.69, 0],
+ "to": [2.5, 0, 0],
+ "ti": [0, 0, 0]
+ },
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 40,
+ "s": [529.137, 212.69, 0],
+ "to": [0, 0, 0],
+ "ti": [2.5, 0, 0]
+ },
+ { "t": 80, "s": [514.137, 212.69, 0] }
+ ],
+ "ix": 2
+ },
+ "a": { "a": 0, "k": [1, -61.5, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "ef": [
+ {
+ "ty": 5,
+ "nm": "IK",
+ "np": 3,
+ "mn": "Pseudo/DUIK ik",
+ "ix": 1,
+ "en": 1,
+ "ef": [
+ {
+ "ty": 10,
+ "nm": "Controller",
+ "mn": "Pseudo/DUIK ik-0001",
+ "ix": 1,
+ "v": { "a": 0, "k": 1, "ix": 1 }
+ }
+ ]
+ }
+ ],
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0.407, -0.011],
+ [0.561, -13.468],
+ [-4.218, -19.269],
+ [-0.185, -0.555],
+ [-0.014, -0.041],
+ [-0.054, -0.162],
+ [0, -0.001],
+ [-0.152, -0.298],
+ [-0.181, -0.282],
+ [-0.208, -0.262],
+ [-0.233, -0.241],
+ [-0.257, -0.215],
+ [-0.276, -0.189],
+ [-0.293, -0.161],
+ [-0.308, -0.13],
+ [-0.32, -0.099],
+ [-0.327, -0.067],
+ [-0.333, -0.033],
+ [-0.334, 0],
+ [-0.237, 0.016],
+ [-0.329, 0.058],
+ [-0.322, 0.089],
+ [-0.313, 0.121],
+ [-0.298, 0.152],
+ [-0.281, 0.181],
+ [-0.263, 0.208],
+ [-0.24, 0.233],
+ [-0.216, 0.257],
+ [-0.189, 0.276],
+ [-0.16, 0.293],
+ [-0.13, 0.308],
+ [-0.1, 0.32],
+ [-0.066, 0.327],
+ [-0.034, 0.334],
+ [0, 0.334],
+ [0.005, 0.095],
+ [-0.01, 0.333],
+ [-0.002, 0.057],
+ [-0.396, 11.29],
+ [19.155, 1.197]
+ ],
+ "o": [
+ [-6.107, 0.162],
+ [-0.574, 13.787],
+ [0.177, 0.809],
+ [0.014, 0.04],
+ [0.05, 0.148],
+ [0, 0.001],
+ [0.121, 0.312],
+ [0.152, 0.299],
+ [0.181, 0.281],
+ [0.208, 0.263],
+ [0.234, 0.239],
+ [0.256, 0.216],
+ [0.276, 0.189],
+ [0.294, 0.16],
+ [0.308, 0.13],
+ [0.319, 0.099],
+ [0.329, 0.066],
+ [0.333, 0.034],
+ [0.238, 0.001],
+ [0.333, -0.025],
+ [0.329, -0.056],
+ [0.323, -0.089],
+ [0.312, -0.121],
+ [0.298, -0.152],
+ [0.282, -0.181],
+ [0.262, -0.208],
+ [0.241, -0.234],
+ [0.216, -0.256],
+ [0.188, -0.276],
+ [0.16, -0.294],
+ [0.131, -0.308],
+ [0.098, -0.319],
+ [0.067, -0.329],
+ [0.034, -0.333],
+ [-0.003, -0.095],
+ [-0.13, -0.481],
+ [0.001, -0.05],
+ [0.233, -7.704],
+ [0.998, -28.133],
+ [-0.387, -0.025]
+ ],
+ "v": [
+ [-0.342, -74.678],
+ [-15.111, -56.697],
+ [-9.445, 64.016],
+ [-8.927, 66.81],
+ [-8.826, 67.13],
+ [-8.471, 68.272],
+ [-8.467, 68.28],
+ [-8.058, 69.195],
+ [-7.559, 70.068],
+ [-6.974, 70.883],
+ [-6.312, 71.639],
+ [-5.575, 72.321],
+ [-4.777, 72.929],
+ [-3.923, 73.455],
+ [-3.019, 73.891],
+ [-2.076, 74.234],
+ [-1.106, 74.484],
+ [-0.112, 74.632],
+ [0.89, 74.682],
+ [1.603, 74.659],
+ [2.597, 74.534],
+ [3.575, 74.316],
+ [4.53, 74],
+ [5.445, 73.591],
+ [6.314, 73.092],
+ [7.133, 72.508],
+ [7.885, 71.845],
+ [8.571, 71.109],
+ [9.179, 70.31],
+ [9.701, 69.457],
+ [10.137, 68.552],
+ [10.484, 67.609],
+ [10.73, 66.639],
+ [10.882, 65.645],
+ [10.932, 64.644],
+ [10.921, 64.359],
+ [10.628, 63.019],
+ [10.652, 62.344],
+ [13.82, -29.165],
+ [0.851, -74.655]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [1, 0.600000023842, 0.333333343267, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [0, 0], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "shoulder",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 6,
+ "ty": 4,
+ "nm": "palm",
+ "parent": 7,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": {
+ "k": [
+ { "s": [2.8], "t": 0, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.751], "t": 1, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.616], "t": 2, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.397], "t": 3, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.116], "t": 4, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.77], "t": 5, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.366], "t": 6, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.9], "t": 7, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.364], "t": 8, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.233], "t": 9, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.895], "t": 10, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.622], "t": 11, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.413], "t": 12, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.256], "t": 13, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.127], "t": 14, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.017], "t": 15, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.904], "t": 16, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.768], "t": 17, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.576], "t": 18, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-8.306], "t": 19, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-8.928], "t": 20, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-9.429], "t": 21, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-9.841], "t": 22, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-10.197], "t": 23, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-10.528], "t": 24, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-10.842], "t": 25, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.151], "t": 26, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.462], "t": 27, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.78], "t": 28, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.416], "t": 30, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.731], "t": 31, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.037], "t": 32, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.325], "t": 33, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.588], "t": 34, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.823], "t": 35, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.02], "t": 36, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.178], "t": 37, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.288], "t": 38, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.347], "t": 39, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.366], "t": 40, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.346], "t": 41, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.283], "t": 42, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.176], "t": 43, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.02], "t": 44, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.823], "t": 45, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.589], "t": 46, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.326], "t": 47, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.036], "t": 48, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.731], "t": 49, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.417], "t": 50, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.098], "t": 51, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.779], "t": 52, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.462], "t": 53, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.152], "t": 54, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-10.842], "t": 55, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-10.528], "t": 56, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-10.195], "t": 57, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-9.834], "t": 58, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-9.428], "t": 59, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-8.928], "t": 60, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-8.306], "t": 61, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.576], "t": 62, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.768], "t": 63, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.904], "t": 64, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.017], "t": 65, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.127], "t": 66, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.256], "t": 67, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.413], "t": 68, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.622], "t": 69, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.895], "t": 70, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.233], "t": 71, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.364], "t": 72, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.9], "t": 73, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.366], "t": 74, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.77], "t": 75, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.116], "t": 76, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.397], "t": 77, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.616], "t": 78, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.751], "t": 79, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.8], "t": 80, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } }
+ ]
+ },
+ "p": {
+ "k": [
+ { "s": [19.972, 67.425, 0], "t": 0, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } },
+ { "s": [19.972, 67.425, 0], "t": 80, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } }
+ ]
+ },
+ "a": { "a": 0, "k": [-0.75, -31, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "ef": [
+ {
+ "ty": 5,
+ "nm": "IK",
+ "np": 3,
+ "mn": "Pseudo/DUIK ik",
+ "ix": 1,
+ "en": 1,
+ "ef": [
+ {
+ "ty": 10,
+ "nm": "Controller",
+ "mn": "Pseudo/DUIK ik-0001",
+ "ix": 1,
+ "v": { "a": 0, "k": 1, "ix": 1 }
+ }
+ ]
+ }
+ ],
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0.193, 0],
+ [0.136, -0.009],
+ [0.191, -0.033],
+ [0.186, -0.052],
+ [0.18, -0.07],
+ [0.173, -0.087],
+ [0.163, -0.104],
+ [0.151, -0.121],
+ [0.139, -0.135],
+ [0.124, -0.148],
+ [0.109, -0.159],
+ [0.093, -0.17],
+ [0.074, -0.178],
+ [0.057, -0.185],
+ [0.039, -0.189],
+ [0.019, -0.192],
+ [0.001, -0.193],
+ [-0.01, -0.137],
+ [-0.003, -0.026],
+ [-0.003, -0.019],
+ [-0.024, -0.145],
+ [0.013, 0.141],
+ [-2.095, -6.635],
+ [-0.2, -7.183],
+ [3.591, 0.998],
+ [-5.387, -2.195],
+ [-2.594, 4.589],
+ [4.789, -4.789],
+ [1.796, -0.998],
+ [-4.39, 3.591],
+ [-2.594, -1.796],
+ [-3.591, 5.188],
+ [-0.226, 0.368],
+ [0.798, -1.153],
+ [-0.998, 3.591],
+ [-0.151, 3.855],
+ [-0.465, 3.256],
+ [3.387, 9.732],
+ [0.199, 0.56],
+ [0.023, 0.039],
+ [0.121, 0.151],
+ [0.134, 0.138],
+ [0.148, 0.125],
+ [0.159, 0.109],
+ [0.17, 0.092],
+ [0.178, 0.076],
+ [0.184, 0.057],
+ [0.191, 0.039],
+ [0.192, 0.019]
+ ],
+ "o": [
+ [-0.137, -0.001],
+ [-0.193, 0.014],
+ [-0.19, 0.033],
+ [-0.186, 0.052],
+ [-0.18, 0.069],
+ [-0.172, 0.088],
+ [-0.163, 0.105],
+ [-0.152, 0.12],
+ [-0.138, 0.135],
+ [-0.124, 0.147],
+ [-0.11, 0.16],
+ [-0.092, 0.17],
+ [-0.075, 0.178],
+ [-0.057, 0.185],
+ [-0.038, 0.189],
+ [-0.02, 0.192],
+ [0, 0.138],
+ [0.002, 0.026],
+ [0.003, 0.019],
+ [0.013, 0.146],
+ [-0.024, -0.14],
+ [0.054, 4.71],
+ [2.394, 7.582],
+ [0.399, 7.183],
+ [-3.392, -0.998],
+ [5.587, 1.995],
+ [0.599, -0.399],
+ [-4.789, 4.789],
+ [-1.796, 0.998],
+ [-1.397, 3.192],
+ [2.594, 1.796],
+ [0.228, -0.33],
+ [-0.246, 2.326],
+ [-1.796, 2.594],
+ [0.936, -2.809],
+ [1.284, -3.815],
+ [0.862, -6.031],
+ [-0.242, -0.695],
+ [-0.022, -0.039],
+ [-0.105, -0.163],
+ [-0.12, -0.15],
+ [-0.135, -0.14],
+ [-0.147, -0.124],
+ [-0.16, -0.108],
+ [-0.17, -0.093],
+ [-0.177, -0.075],
+ [-0.186, -0.058],
+ [-0.189, -0.038],
+ [-0.192, -0.019]
+ ],
+ "v": [
+ [-0.643, -36.839],
+ [-1.052, -36.828],
+ [-1.629, -36.757],
+ [-2.194, -36.629],
+ [-2.743, -36.446],
+ [-3.273, -36.212],
+ [-3.776, -35.923],
+ [-4.247, -35.584],
+ [-4.684, -35.202],
+ [-5.077, -34.778],
+ [-5.428, -34.318],
+ [-5.732, -33.823],
+ [-5.982, -33.301],
+ [-6.18, -32.755],
+ [-6.325, -32.194],
+ [-6.41, -31.621],
+ [-6.441, -31.044],
+ [-6.426, -30.631],
+ [-6.418, -30.553],
+ [-6.41, -30.495],
+ [-6.356, -30.058],
+ [-6.41, -30.479],
+ [-8.667, -17.335],
+ [-1.882, 1.819],
+ [-8.468, 11.398],
+ [-11.66, 14.987],
+ [-0.085, 12.197],
+ [-6.274, 23.767],
+ [-14.052, 28.159],
+ [-4.875, 29.355],
+ [-8.865, 36.537],
+ [6.298, 26.561],
+ [6.976, 25.462],
+ [5.499, 31.351],
+ [10.09, 29.554],
+ [11.532, 15.233],
+ [14.279, 4.216],
+ [5.129, -31.559],
+ [4.303, -34.061],
+ [4.236, -34.178],
+ [3.897, -34.649],
+ [3.515, -35.082],
+ [3.091, -35.479],
+ [2.631, -35.83],
+ [2.136, -36.13],
+ [1.614, -36.383],
+ [1.072, -36.582],
+ [0.507, -36.726],
+ [-0.066, -36.812]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [1, 0.600000023842, 0.333333343267, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [0, 0], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "palm",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 7,
+ "ty": 4,
+ "nm": "hand",
+ "parent": 5,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": {
+ "k": [
+ { "s": [-2.454], "t": 0, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.46], "t": 1, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.491], "t": 2, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.549], "t": 3, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.67], "t": 4, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.841], "t": 5, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.063], "t": 6, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.322], "t": 7, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.592], "t": 8, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.879], "t": 9, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.17], "t": 10, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.45], "t": 11, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.712], "t": 12, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.967], "t": 13, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.256], "t": 14, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.584], "t": 15, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.984], "t": 16, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.483], "t": 17, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.131], "t": 18, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.955], "t": 19, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-8.999], "t": 20, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-10.272], "t": 21, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.685], "t": 22, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.155], "t": 23, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.607], "t": 24, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-16.003], "t": 25, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-17.311], "t": 26, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-18.51], "t": 27, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.582], "t": 28, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-20.532], "t": 29, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-21.354], "t": 30, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-22.061], "t": 31, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-22.659], "t": 32, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-23.152], "t": 33, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-23.56], "t": 34, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-23.891], "t": 35, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-24.156], "t": 36, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-24.359], "t": 37, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-24.512], "t": 38, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-24.619], "t": 39, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-24.655], "t": 40, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-24.62], "t": 41, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-24.52], "t": 42, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-24.363], "t": 43, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-24.156], "t": 44, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-23.891], "t": 45, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-23.559], "t": 46, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-23.152], "t": 47, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-22.659], "t": 48, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-22.06], "t": 49, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-21.354], "t": 50, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-20.531], "t": 51, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.583], "t": 52, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-18.51], "t": 53, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-17.31], "t": 54, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-16.003], "t": 55, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.607], "t": 56, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.16], "t": 57, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.699], "t": 58, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-10.274], "t": 59, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-8.999], "t": 60, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.955], "t": 61, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.131], "t": 62, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.483], "t": 63, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.984], "t": 64, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.584], "t": 65, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.256], "t": 66, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.967], "t": 67, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.712], "t": 68, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.45], "t": 69, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.17], "t": 70, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.879], "t": 71, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.592], "t": 72, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.322], "t": 73, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.063], "t": 74, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.841], "t": 75, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.67], "t": 76, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.549], "t": 77, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.491], "t": 78, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.46], "t": 79, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.454], "t": 80, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } }
+ ]
+ },
+ "p": {
+ "k": [
+ { "s": [0.979, 64.531, 0], "t": 0, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } },
+ { "s": [0.979, 64.531, 0], "t": 80, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } }
+ ]
+ },
+ "a": { "a": 0, "k": [-15.75, -63.25, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "ef": [
+ {
+ "ty": 5,
+ "nm": "IK",
+ "np": 3,
+ "mn": "Pseudo/DUIK ik",
+ "ix": 1,
+ "en": 1,
+ "ef": [
+ {
+ "ty": 10,
+ "nm": "Controller",
+ "mn": "Pseudo/DUIK ik-0001",
+ "ix": 1,
+ "v": { "a": 0, "k": 1, "ix": 1 }
+ }
+ ]
+ }
+ ],
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0.336, 0],
+ [0.236, -0.017],
+ [0.33, -0.057],
+ [0.322, -0.089],
+ [0.311, -0.122],
+ [0.298, -0.152],
+ [0.282, -0.181],
+ [0.262, -0.208],
+ [0.241, -0.233],
+ [0.215, -0.255],
+ [0.189, -0.276],
+ [0.161, -0.294],
+ [0.13, -0.307],
+ [0.099, -0.32],
+ [0.067, -0.329],
+ [0.033, -0.332],
+ [0, -0.336],
+ [-0.015, -0.236],
+ [-0.058, -0.33],
+ [-0.069, -0.257],
+ [-0.054, -0.162],
+ [0, -0.002],
+ [-1.578, -6.508],
+ [-0.026, -0.463],
+ [0, -0.006],
+ [0, -0.005],
+ [-0.01, -0.137],
+ [-0.002, -0.026],
+ [-0.028, -0.164],
+ [-0.051, -0.186],
+ [-0.07, -0.18],
+ [-0.088, -0.173],
+ [-0.104, -0.163],
+ [-0.119, -0.151],
+ [-0.136, -0.139],
+ [-0.147, -0.124],
+ [-0.16, -0.109],
+ [-0.17, -0.093],
+ [-0.178, -0.076],
+ [-0.184, -0.057],
+ [-0.189, -0.037],
+ [-0.192, -0.02],
+ [-0.194, 0.001],
+ [-0.136, 0.01],
+ [-0.191, 0.033],
+ [-0.186, 0.051],
+ [-0.18, 0.07],
+ [-0.173, 0.088],
+ [-0.163, 0.104],
+ [-0.151, 0.119],
+ [-0.138, 0.134],
+ [-0.125, 0.148],
+ [-0.109, 0.16],
+ [-0.093, 0.169],
+ [-0.074, 0.178],
+ [-0.057, 0.185],
+ [-0.039, 0.189],
+ [-0.019, 0.192],
+ [-0.001, 0.194],
+ [0.01, 0.136],
+ [0.004, 0.035],
+ [0.199, 0.56],
+ [0.164, 0.447],
+ [4.789, 21.349],
+ [1.045, 7.54],
+ [0.055, 0.204],
+ [-0.01, 0.333],
+ [-0.002, 0.057],
+ [0.031, 0.128],
+ [0.122, 0.313],
+ [0.152, 0.298],
+ [0.181, 0.281],
+ [0.208, 0.263],
+ [0.233, 0.24],
+ [0.255, 0.216],
+ [0.276, 0.189],
+ [0.294, 0.16],
+ [0.307, 0.13],
+ [0.32, 0.1],
+ [0.329, 0.066],
+ [0.332, 0.034]
+ ],
+ "o": [
+ [-0.237, 0.001],
+ [-0.334, 0.024],
+ [-0.329, 0.056],
+ [-0.322, 0.091],
+ [-0.312, 0.121],
+ [-0.299, 0.152],
+ [-0.281, 0.181],
+ [-0.263, 0.208],
+ [-0.239, 0.233],
+ [-0.216, 0.256],
+ [-0.19, 0.277],
+ [-0.16, 0.293],
+ [-0.13, 0.308],
+ [-0.099, 0.32],
+ [-0.066, 0.327],
+ [-0.034, 0.334],
+ [-0.001, 0.237],
+ [0.025, 0.334],
+ [0.048, 0.262],
+ [0.05, 0.147],
+ [0, 0.001],
+ [5.943, 17.776],
+ [0.142, 0.355],
+ [0, 0.006],
+ [0, 0.005],
+ [0, 0.138],
+ [0.002, 0.026],
+ [0.014, 0.166],
+ [0.032, 0.19],
+ [0.052, 0.186],
+ [0.07, 0.181],
+ [0.088, 0.172],
+ [0.104, 0.163],
+ [0.121, 0.152],
+ [0.134, 0.138],
+ [0.149, 0.125],
+ [0.16, 0.11],
+ [0.17, 0.093],
+ [0.177, 0.075],
+ [0.185, 0.056],
+ [0.189, 0.039],
+ [0.193, 0.019],
+ [0.137, 0],
+ [0.193, -0.014],
+ [0.19, -0.032],
+ [0.186, -0.052],
+ [0.181, -0.07],
+ [0.172, -0.088],
+ [0.163, -0.104],
+ [0.15, -0.12],
+ [0.139, -0.135],
+ [0.125, -0.149],
+ [0.109, -0.159],
+ [0.092, -0.17],
+ [0.075, -0.178],
+ [0.057, -0.185],
+ [0.038, -0.189],
+ [0.02, -0.193],
+ [0, -0.137],
+ [-0.004, -0.035],
+ [-0.242, -0.695],
+ [-0.241, -0.678],
+ [-5.387, -13.967],
+ [-4.825, -21.157],
+ [-0.023, -0.169],
+ [-0.13, -0.481],
+ [0.001, -0.05],
+ [-0.026, -0.129],
+ [-0.091, -0.323],
+ [-0.121, -0.312],
+ [-0.152, -0.298],
+ [-0.181, -0.282],
+ [-0.208, -0.262],
+ [-0.233, -0.241],
+ [-0.256, -0.216],
+ [-0.277, -0.188],
+ [-0.293, -0.16],
+ [-0.308, -0.131],
+ [-0.32, -0.098],
+ [-0.327, -0.067],
+ [-0.334, -0.034]
+ ],
+ "v": [
+ [-15.839, -73.18],
+ [-16.549, -73.153],
+ [-17.546, -73.032],
+ [-18.524, -72.814],
+ [-19.475, -72.494],
+ [-20.391, -72.085],
+ [-21.264, -71.586],
+ [-22.078, -71.001],
+ [-22.834, -70.339],
+ [-23.516, -69.606],
+ [-24.124, -68.807],
+ [-24.65, -67.95],
+ [-25.087, -67.05],
+ [-25.43, -66.107],
+ [-25.679, -65.133],
+ [-25.827, -64.143],
+ [-25.878, -63.137],
+ [-25.855, -62.428],
+ [-25.73, -61.43],
+ [-25.555, -60.651],
+ [-25.2, -59.509],
+ [-25.196, -59.501],
+ [14.051, 65.928],
+ [14.281, 67.35],
+ [14.281, 67.365],
+ [14.281, 67.381],
+ [14.296, 67.794],
+ [14.304, 67.872],
+ [14.366, 68.367],
+ [14.491, 68.932],
+ [14.674, 69.482],
+ [14.912, 70.012],
+ [15.2, 70.514],
+ [15.535, 70.986],
+ [15.921, 71.422],
+ [16.342, 71.816],
+ [16.806, 72.167],
+ [17.301, 72.471],
+ [17.823, 72.724],
+ [18.365, 72.923],
+ [18.926, 73.063],
+ [19.499, 73.153],
+ [20.079, 73.18],
+ [20.488, 73.164],
+ [21.065, 73.094],
+ [21.63, 72.969],
+ [22.18, 72.786],
+ [22.71, 72.549],
+ [23.212, 72.26],
+ [23.684, 71.925],
+ [24.117, 71.543],
+ [24.514, 71.118],
+ [24.865, 70.655],
+ [25.169, 70.164],
+ [25.418, 69.641],
+ [25.617, 69.096],
+ [25.761, 68.535],
+ [25.847, 67.962],
+ [25.878, 67.381],
+ [25.862, 66.972],
+ [25.851, 66.867],
+ [25.025, 64.365],
+ [24.027, 61.337],
+ [8.665, -18.871],
+ [-5.684, -62.853],
+ [-5.808, -63.422],
+ [-6.101, -64.762],
+ [-6.077, -65.437],
+ [-6.163, -65.822],
+ [-6.483, -66.777],
+ [-6.892, -67.693],
+ [-7.391, -68.562],
+ [-7.975, -69.38],
+ [-8.638, -70.132],
+ [-9.37, -70.818],
+ [-10.169, -71.426],
+ [-11.027, -71.948],
+ [-11.927, -72.385],
+ [-12.87, -72.732],
+ [-13.844, -72.977],
+ [-14.834, -73.129]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [1, 0.600000023842, 0.333333343267, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [0, 0], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "hand",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 8,
+ "ty": 4,
+ "nm": "head",
+ "parent": 9,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": {
+ "a": 1,
+ "k": [
+ { "i": { "x": [0.667], "y": [1] }, "o": { "x": [0.333], "y": [0] }, "t": 0, "s": [0] },
+ {
+ "i": { "x": [0.667], "y": [1] },
+ "o": { "x": [0.333], "y": [0] },
+ "t": 20,
+ "s": [-3.814]
+ },
+ { "i": { "x": [0.667], "y": [1] }, "o": { "x": [0.333], "y": [0] }, "t": 40, "s": [0] },
+ {
+ "i": { "x": [0.667], "y": [1] },
+ "o": { "x": [0.333], "y": [0] },
+ "t": 60,
+ "s": [-3.814]
+ },
+ { "t": 80, "s": [0] }
+ ],
+ "ix": 10
+ },
+ "p": { "a": 0, "k": [506.46, 172.152, 0], "ix": 2 },
+ "a": { "a": 0, "k": [506.46, 172.152, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 1,
+ "k": [
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 0,
+ "s": [
+ {
+ "i": [
+ [0, 0],
+ [4.14, 0.136],
+ [3.418, -2.339],
+ [3.498, -5.68],
+ [-0.882, -4.143],
+ [-2.869, -8.292],
+ [4.471, -4.285],
+ [4.533, -4.797],
+ [-0.875, -6.296],
+ [-1.093, -6.189],
+ [8.377, -9.851],
+ [9.084, 2.086],
+ [1.391, 6.252],
+ [0.176, 6.384],
+ [-1.043, 8.468],
+ [-1.004, 9.183],
+ [-0.723, 10.112],
+ [-1.987, 12.533],
+ [-5.634, 7.61],
+ [-10.984, 2.303],
+ [-11.507, -7.941],
+ [-2.299, -14.926]
+ ],
+ "o": [
+ [-3.973, -1.171],
+ [-4.14, -0.136],
+ [-5.505, 3.767],
+ [-2.221, 3.606],
+ [1.827, 8.582],
+ [1.486, 4.296],
+ [-5.368, 5.145],
+ [-5.322, 5.632],
+ [0.896, 6.448],
+ [1.093, 6.189],
+ [-9.95, 11.7],
+ [-13.783, -3.166],
+ [-1.579, -7.098],
+ [-0.235, -8.528],
+ [2.113, -17.148],
+ [1.285, -11.758],
+ [0.817, -11.434],
+ [1.483, -9.352],
+ [6.678, -9.02],
+ [13.683, -2.869],
+ [19.431, 13.409],
+ [0, 0]
+ ],
+ "v": [
+ [54.464, -56.477],
+ [42.545, -59.99],
+ [30.421, -57.269],
+ [16.947, -42.474],
+ [13.74, -30.179],
+ [21.412, -8.853],
+ [17.194, 7.758],
+ [4.704, 23.83],
+ [-0.631, 42.069],
+ [0.947, 60.159],
+ [-8.587, 94.199],
+ [-36.544, 104.511],
+ [-54.881, 85.695],
+ [-56.638, 64.335],
+ [-54.823, 39.246],
+ [-50.456, 5.915],
+ [-47.277, -26.468],
+ [-43.706, -55.764],
+ [-32.723, -79.462],
+ [-6.303, -100.334],
+ [35.109, -93.686],
+ [54.464, -56.477]
+ ],
+ "c": true
+ }
+ ]
+ },
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 40,
+ "s": [
+ {
+ "i": [
+ [0, 0],
+ [4.14, 0.136],
+ [3.418, -2.339],
+ [3.498, -5.68],
+ [-0.882, -4.143],
+ [-2.869, -8.292],
+ [1.892, -4.134],
+ [3.654, -4.718],
+ [-0.518, -6.825],
+ [-1.093, -6.189],
+ [8.377, -9.851],
+ [20.367, 7.988],
+ [3.5, 5.364],
+ [0.176, 6.384],
+ [-2.111, 8.267],
+ [-0.976, 8.522],
+ [0, 10.137],
+ [-1.987, 12.533],
+ [-5.634, 7.61],
+ [-10.984, 2.303],
+ [-11.771, -7.544],
+ [-1.924, -16.926]
+ ],
+ "o": [
+ [-3.973, -1.171],
+ [-4.14, -0.136],
+ [-5.505, 3.767],
+ [-2.221, 3.606],
+ [1.827, 8.582],
+ [1.486, 4.296],
+ [-2.259, 4.936],
+ [-4.191, 5.412],
+ [0.543, 7.152],
+ [1.093, 6.189],
+ [-9.95, 11.7],
+ [-13.166, -5.164],
+ [-3.49, -5.349],
+ [-0.235, -8.528],
+ [2.122, -8.311],
+ [1.154, -10.072],
+ [0, -12.689],
+ [1.483, -9.352],
+ [6.678, -9.02],
+ [13.683, -2.869],
+ [14.681, 9.409],
+ [0, 0]
+ ],
+ "v": [
+ [54.464, -56.477],
+ [42.545, -59.99],
+ [30.421, -57.269],
+ [16.947, -42.474],
+ [13.74, -30.179],
+ [24.662, -6.228],
+ [26.694, 7.258],
+ [15.636, 18.066],
+ [10.662, 38.412],
+ [19.947, 59.909],
+ [10.413, 93.949],
+ [-31.294, 103.011],
+ [-51.131, 84.695],
+ [-54.388, 65.585],
+ [-49.323, 40.496],
+ [-41.706, 15.915],
+ [-43.027, -14.468],
+ [-41.706, -52.514],
+ [-32.723, -79.462],
+ [-6.303, -100.334],
+ [35.109, -93.686],
+ [54.464, -56.477]
+ ],
+ "c": true
+ }
+ ]
+ },
+ {
+ "t": 80,
+ "s": [
+ {
+ "i": [
+ [0, 0],
+ [4.14, 0.136],
+ [3.418, -2.339],
+ [3.498, -5.68],
+ [-0.882, -4.143],
+ [-2.869, -8.292],
+ [4.471, -4.285],
+ [4.533, -4.797],
+ [-0.875, -6.296],
+ [-1.093, -6.189],
+ [8.377, -9.851],
+ [9.084, 2.086],
+ [1.391, 6.252],
+ [0.176, 6.384],
+ [-1.043, 8.468],
+ [-1.004, 9.183],
+ [-0.723, 10.112],
+ [-1.987, 12.533],
+ [-5.634, 7.61],
+ [-10.984, 2.303],
+ [-11.507, -7.941],
+ [-2.299, -14.926]
+ ],
+ "o": [
+ [-3.973, -1.171],
+ [-4.14, -0.136],
+ [-5.505, 3.767],
+ [-2.221, 3.606],
+ [1.827, 8.582],
+ [1.486, 4.296],
+ [-5.368, 5.145],
+ [-5.322, 5.632],
+ [0.897, 6.448],
+ [1.093, 6.189],
+ [-9.95, 11.7],
+ [-13.783, -3.166],
+ [-1.579, -7.098],
+ [-0.235, -8.528],
+ [2.113, -17.148],
+ [1.285, -11.758],
+ [0.817, -11.434],
+ [1.483, -9.352],
+ [6.678, -9.02],
+ [13.683, -2.869],
+ [19.431, 13.409],
+ [0, 0]
+ ],
+ "v": [
+ [54.464, -56.477],
+ [42.545, -59.99],
+ [30.421, -57.269],
+ [16.947, -42.474],
+ [13.74, -30.179],
+ [21.412, -8.853],
+ [17.194, 7.758],
+ [4.704, 23.83],
+ [-0.631, 42.069],
+ [0.947, 60.159],
+ [-8.587, 94.199],
+ [-36.544, 104.511],
+ [-54.881, 85.695],
+ [-56.638, 64.335],
+ [-54.823, 39.246],
+ [-50.456, 5.915],
+ [-47.277, -26.468],
+ [-43.706, -55.764],
+ [-32.723, -79.462],
+ [-6.303, -100.334],
+ [35.109, -93.686],
+ [54.464, -56.477]
+ ],
+ "c": true
+ }
+ ]
+ }
+ ],
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.1254902035, 0.156862750649, 0.278431385756, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [486.71, 160.402], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "path868",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ },
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [0.404, -5.512],
+ [0.374, -2.957],
+ [0.439, -6.976],
+ [4.604, -8.101],
+ [0.7, -0.821],
+ [0.967, -0.439],
+ [1.078, 0.091],
+ [0.986, 0.462],
+ [1.719, 1.367],
+ [9.434, 3.226],
+ [0, 0],
+ [0, 0]
+ ],
+ "o": [
+ [2.2, 5.032],
+ [-0.218, 2.974],
+ [-0.875, 6.931],
+ [-0.591, 9.39],
+ [-0.537, 0.945],
+ [-0.7, 0.821],
+ [-0.991, 0.45],
+ [-1.078, -0.091],
+ [-1.973, -0.924],
+ [-7.888, -6.274],
+ [0, 0],
+ [0, 0],
+ [0, 0]
+ ],
+ "v": [
+ [27.723, -37.052],
+ [30.475, -20.894],
+ [29.279, -12.035],
+ [28.362, 8.906],
+ [20.996, 35.808],
+ [19.187, 38.504],
+ [16.685, 40.478],
+ [13.509, 40.986],
+ [10.392, 40.107],
+ [5.007, 36.368],
+ [-21.223, 21.983],
+ [-30.565, -22.48],
+ [16.166, -41.012]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [1, 0.600000023842, 0.333333343267, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [508.098, 127.3], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "path872",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 2,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 363,
+ "st": 62,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 9,
+ "ty": 4,
+ "nm": "body",
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": { "a": 0, "k": 0, "ix": 10 },
+ "p": {
+ "a": 1,
+ "k": [
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 0,
+ "s": [501.398, 274.679, 0],
+ "to": [0, -4.167, 0],
+ "ti": [0, 0, 0]
+ },
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 20,
+ "s": [501.398, 249.679, 0],
+ "to": [0, 0, 0],
+ "ti": [0, 0, 0]
+ },
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 40,
+ "s": [501.398, 274.679, 0],
+ "to": [0, 0, 0],
+ "ti": [0, 0, 0]
+ },
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 60,
+ "s": [501.398, 249.679, 0],
+ "to": [0, 0, 0],
+ "ti": [0, -4.167, 0]
+ },
+ { "t": 80, "s": [501.398, 274.679, 0] }
+ ],
+ "ix": 2
+ },
+ "a": { "a": 0, "k": [501.398, 249.679, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 1,
+ "k": [
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 0,
+ "s": [
+ {
+ "i": [
+ [7.679, -0.14],
+ [2.444, -0.948],
+ [1.995, -11.573],
+ [10.974, -41.701],
+ [3.591, -1.397],
+ [1.197, 4.19],
+ [3.591, 28.133],
+ [-2.793, 12.969],
+ [-11.573, 6.385],
+ [3.188, -1.407],
+ [2.812, -2.573],
+ [1.397, -8.58],
+ [-5.387, -18.755],
+ [-2.394, -17.957],
+ [0.748, -3.556],
+ [1.183, 26.718],
+ [-2.185, 4.839],
+ [-7.981, 21.349],
+ [-0.399, 7.382],
+ [5.387, 11.373],
+ [7.782, 7.183]
+ ],
+ "o": [
+ [-2.56, 0.047],
+ [-10.974, 4.39],
+ [-7.582, 42.499],
+ [-0.998, 3.392],
+ [-5.587, 1.995],
+ [-7.981, -27.136],
+ [-1.796, -12.969],
+ [2.793, -12.969],
+ [-2.993, 0.998],
+ [-3.596, 1.586],
+ [-6.565, 6.007],
+ [-2.993, 19.354],
+ [6.385, 21.948],
+ [0.514, 3.599],
+ [-1.363, 28.463],
+ [-0.234, -5.297],
+ [9.178, -20.751],
+ [2.594, -6.784],
+ [0.798, -12.371],
+ [-4.39, -9.378],
+ [-5.687, -5.387]
+ ],
+ "v": [
+ [10.494, -95.582],
+ [2.945, -94.129],
+ [-15.211, -65.794],
+ [-14.813, 63.1],
+ [-22.393, 72.679],
+ [-31.57, 63.497],
+ [-49.13, -19.505],
+ [-49.329, -58.81],
+ [-25.603, -91.335],
+ [-38.554, -87.742],
+ [-50.181, -81.094],
+ [-60.297, -59.087],
+ [-51.523, -2.347],
+ [-34.364, 63.899],
+ [-34.688, 74.888],
+ [22.937, 74.888],
+ [27.087, 59.308],
+ [52.827, -3.742],
+ [61.007, -28.881],
+ [48.439, -60.408],
+ [31.678, -86.744]
+ ],
+ "c": true
+ }
+ ]
+ },
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 40,
+ "s": [
+ {
+ "i": [
+ [7.679, -0.14],
+ [2.444, -0.948],
+ [1.995, -11.573],
+ [-3.529, -49.789],
+ [3.551, -3.118],
+ [1.197, 4.19],
+ [3.591, 28.133],
+ [-2.793, 12.969],
+ [-11.573, 6.385],
+ [3.188, -1.407],
+ [2.812, -2.573],
+ [1.397, -8.58],
+ [-5.387, -18.755],
+ [-2.394, -17.957],
+ [0.748, -3.556],
+ [1.183, 26.718],
+ [-2.185, 4.839],
+ [-7.981, 21.349],
+ [-0.399, 7.382],
+ [5.387, 11.373],
+ [7.782, 7.183]
+ ],
+ "o": [
+ [-2.56, 0.047],
+ [-10.974, 4.39],
+ [-7.582, 42.499],
+ [0.326, 4.606],
+ [-5.587, 1.995],
+ [-7.981, -27.136],
+ [-1.796, -12.969],
+ [2.793, -12.969],
+ [-2.993, 0.998],
+ [-3.596, 1.586],
+ [-6.565, 6.007],
+ [-2.993, 19.354],
+ [6.385, 21.948],
+ [0.514, 3.599],
+ [-1.363, 28.463],
+ [-0.234, -5.297],
+ [9.178, -20.751],
+ [2.594, -6.784],
+ [0.798, -12.371],
+ [-4.39, -9.378],
+ [-5.687, -5.387]
+ ],
+ "v": [
+ [10.494, -95.582],
+ [2.945, -94.129],
+ [-23.961, -67.044],
+ [-22.813, 58.35],
+ [-24.893, 72.679],
+ [-31.57, 63.497],
+ [-49.13, -19.505],
+ [-49.329, -58.81],
+ [-25.603, -91.335],
+ [-38.554, -87.742],
+ [-50.181, -81.094],
+ [-60.297, -59.087],
+ [-51.523, -2.347],
+ [-34.364, 63.899],
+ [-34.688, 74.888],
+ [22.937, 74.888],
+ [27.087, 59.308],
+ [52.827, -3.742],
+ [61.007, -28.881],
+ [48.439, -60.408],
+ [31.678, -86.744]
+ ],
+ "c": true
+ }
+ ]
+ },
+ {
+ "t": 80,
+ "s": [
+ {
+ "i": [
+ [7.679, -0.14],
+ [2.444, -0.948],
+ [1.995, -11.573],
+ [10.974, -41.701],
+ [3.591, -1.397],
+ [1.197, 4.19],
+ [3.591, 28.133],
+ [-2.793, 12.969],
+ [-11.573, 6.385],
+ [3.188, -1.407],
+ [2.813, -2.573],
+ [1.397, -8.58],
+ [-5.387, -18.755],
+ [-2.394, -17.957],
+ [0.748, -3.556],
+ [1.183, 26.718],
+ [-2.185, 4.839],
+ [-7.981, 21.349],
+ [-0.399, 7.382],
+ [5.387, 11.373],
+ [7.781, 7.183]
+ ],
+ "o": [
+ [-2.56, 0.047],
+ [-10.974, 4.39],
+ [-7.582, 42.499],
+ [-0.998, 3.392],
+ [-5.587, 1.995],
+ [-7.981, -27.136],
+ [-1.796, -12.969],
+ [2.793, -12.969],
+ [-2.993, 0.998],
+ [-3.596, 1.586],
+ [-6.565, 6.007],
+ [-2.993, 19.354],
+ [6.385, 21.948],
+ [0.514, 3.599],
+ [-1.363, 28.463],
+ [-0.234, -5.297],
+ [9.178, -20.751],
+ [2.594, -6.784],
+ [0.798, -12.371],
+ [-4.39, -9.378],
+ [-5.687, -5.387]
+ ],
+ "v": [
+ [10.494, -95.582],
+ [2.945, -94.129],
+ [-15.211, -65.794],
+ [-14.813, 63.1],
+ [-22.393, 72.679],
+ [-31.57, 63.497],
+ [-49.13, -19.505],
+ [-49.329, -58.81],
+ [-25.603, -91.335],
+ [-38.554, -87.742],
+ [-50.181, -81.094],
+ [-60.297, -59.087],
+ [-51.523, -2.347],
+ [-34.364, 63.899],
+ [-34.688, 74.888],
+ [22.937, 74.888],
+ [27.087, 59.308],
+ [52.827, -3.742],
+ [61.007, -28.881],
+ [48.439, -60.408],
+ [31.678, -86.744]
+ ],
+ "c": true
+ }
+ ]
+ }
+ ],
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.658823549747, 0.074509806931, 0.223529413342, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [501.342, 267.939], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "path38",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ },
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [2.394, -4.589],
+ [4.39, -8.38],
+ [-8.979, -31.924],
+ [-1.397, -27.734],
+ [-13.568, -0.399],
+ [-4.266, 11.228],
+ [2.394, 11.972],
+ [6.584, 15.164],
+ [5.188, 5.587],
+ [0, 0]
+ ],
+ "o": [
+ [2.793, 7.582],
+ [-2.394, 4.39],
+ [-4.39, 8.181],
+ [5.587, 20.352],
+ [0.927, 3.307],
+ [13.568, 0.399],
+ [3.392, -11.972],
+ [-2.993, -14.765],
+ [-4.39, -10.176],
+ [-5.188, -5.587],
+ [0, 0]
+ ],
+ "v": [
+ [-20.943, -102.493],
+ [-20.344, -71.567],
+ [-55.261, -51.614],
+ [-54.862, 8.842],
+ [-33.314, 98.629],
+ [-7.645, 99.814],
+ [20.435, 96.251],
+ [60.065, -7.718],
+ [34.326, -56.802],
+ [3.2, -74.36],
+ [1.803, -101.895]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [1, 0.600000023842, 0.333333343267, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [502.345, 243.982], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "path34",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 2,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ },
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [0.236, -0.203],
+ [0.456, -1.334],
+ [-0.059, -1.409],
+ [-0.857, -2.687],
+ [-0.686, -2.571],
+ [0, 0],
+ [0, 0],
+ [0, 0]
+ ],
+ "o": [
+ [-0.261, 0.17],
+ [-1.069, 0.92],
+ [-0.456, 1.334],
+ [0.118, 2.818],
+ [0.808, 2.535],
+ [0, 0],
+ [0, 0],
+ [0, 0],
+ [0, 0]
+ ],
+ "v": [
+ [25.594, -3.456],
+ [24.847, -2.896],
+ [22.551, 0.598],
+ [22.003, 4.769],
+ [23.913, 12.984],
+ [26.155, 20.644],
+ [-11.956, 25.688],
+ [-26.155, 14.665],
+ [7.286, -25.688]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [1, 0.600000023842, 0.333333343267, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [493.039, 161.52], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "path876",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 3,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 10,
+ "ty": 4,
+ "nm": "skirt",
+ "parent": 9,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": {
+ "a": 1,
+ "k": [
+ {
+ "i": { "x": [0.833], "y": [1] },
+ "o": { "x": [0.333], "y": [0] },
+ "t": 0,
+ "s": [2.381]
+ },
+ {
+ "i": { "x": [0.667], "y": [1] },
+ "o": { "x": [0.167], "y": [0] },
+ "t": 45,
+ "s": [-2.847]
+ },
+ { "t": 80, "s": [2.381] }
+ ],
+ "ix": 10
+ },
+ "p": { "a": 0, "k": [501.368, 322.591, 0], "ix": 2 },
+ "a": { "a": 0, "k": [1.326, -131.3, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 1,
+ "k": [
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 0,
+ "s": [
+ {
+ "i": [
+ [0.068, 1.473],
+ [3.312, -27.521],
+ [0.169, -0.563],
+ [3.392, -3.991],
+ [8.38, -10.176],
+ [9.976, -51.677],
+ [-3.991, -9.178],
+ [-8.779, 4.589],
+ [-10.066, 7.21],
+ [-7.183, -5.786],
+ [10.118, 20.037],
+ [-17.546, -1.64],
+ [-8.669, -5.562],
+ [-12.077, 20.658],
+ [0.599, 2.394],
+ [20.751, 36.114],
+ [22.546, 22.546],
+ [1.397, 3.991]
+ ],
+ "o": [
+ [7.432, -26.068],
+ [-0.123, 0.584],
+ [-1.397, 4.988],
+ [-8.38, 9.976],
+ [-33.52, 40.504],
+ [-1.995, 9.976],
+ [3.991, 9.178],
+ [-0.599, -7.183],
+ [15.309, -8.358],
+ [15.198, 11.887],
+ [-6.102, -12.084],
+ [10.255, 0.958],
+ [18.978, 12.176],
+ [0.798, -2.394],
+ [-6.784, -40.903],
+ [-15.763, -27.535],
+ [-2.993, -2.993],
+ [-0.521, -1.433]
+ ],
+ "v": [
+ [24.237, -111.063],
+ [-33.388, -111.063],
+ [-33.665, -109.282],
+ [-41.845, -96.114],
+ [-67.783, -66.587],
+ [-131.234, 76.075],
+ [-130.634, 105.805],
+ [-106.293, 117.18],
+ [-116.866, 95.431],
+ [-68.383, 107.204],
+ [-3.537, 125.36],
+ [33.375, 107.601],
+ [61.512, 120.372],
+ [132.741, 103.213],
+ [132.542, 95.829],
+ [90.24, -20.894],
+ [32.58, -96.516],
+ [24.997, -106.691]
+ ],
+ "c": true
+ }
+ ]
+ },
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 40,
+ "s": [
+ {
+ "i": [
+ [0.068, 1.473],
+ [3.312, -27.521],
+ [0.169, -0.563],
+ [3.392, -3.991],
+ [8.38, -10.176],
+ [9.976, -51.677],
+ [2.279, -10.025],
+ [-4.781, -4.31],
+ [-9.491, 0.434],
+ [-36.647, -41.956],
+ [-25.916, 21.689],
+ [-16.902, 4.989],
+ [-9.597, -3.738],
+ [-18.266, 13.453],
+ [0.599, 2.394],
+ [20.751, 36.115],
+ [22.546, 22.546],
+ [1.397, 3.991]
+ ],
+ "o": [
+ [7.432, -26.068],
+ [-0.123, 0.584],
+ [-1.397, 4.988],
+ [-8.38, 9.976],
+ [-33.52, 40.504],
+ [-1.995, 9.976],
+ [-1.753, 7.71],
+ [7.499, 6.761],
+ [16.957, -0.776],
+ [26.002, 29.769],
+ [10.381, -8.688],
+ [11.569, -3.415],
+ [36.188, 14.094],
+ [0.798, -2.394],
+ [-6.784, -40.903],
+ [-15.763, -27.535],
+ [-2.993, -2.993],
+ [-0.521, -1.433]
+ ],
+ "v": [
+ [24.237, -111.063],
+ [-33.388, -111.063],
+ [-33.665, -109.282],
+ [-41.845, -96.114],
+ [-67.783, -66.587],
+ [-130.329, 66.605],
+ [-136.786, 97.535],
+ [-133.482, 121.023],
+ [-104.872, 130.976],
+ [-51.104, 124.457],
+ [19.122, 133.835],
+ [47.563, 115.214],
+ [75.627, 117.972],
+ [132.741, 103.213],
+ [132.542, 95.828],
+ [90.24, -20.894],
+ [32.58, -96.516],
+ [24.997, -106.691]
+ ],
+ "c": true
+ }
+ ]
+ },
+ {
+ "t": 80,
+ "s": [
+ {
+ "i": [
+ [0.068, 1.473],
+ [3.312, -27.521],
+ [0.169, -0.563],
+ [3.392, -3.991],
+ [8.38, -10.176],
+ [9.976, -51.677],
+ [-3.991, -9.178],
+ [-8.779, 4.589],
+ [-10.066, 7.21],
+ [-7.183, -5.786],
+ [10.118, 20.037],
+ [-17.546, -1.64],
+ [-8.669, -5.562],
+ [-12.077, 20.658],
+ [0.599, 2.394],
+ [20.751, 36.114],
+ [22.546, 22.546],
+ [1.397, 3.991]
+ ],
+ "o": [
+ [7.432, -26.068],
+ [-0.123, 0.584],
+ [-1.397, 4.988],
+ [-8.38, 9.976],
+ [-33.52, 40.504],
+ [-1.995, 9.976],
+ [3.991, 9.178],
+ [-0.599, -7.183],
+ [15.309, -8.358],
+ [15.198, 11.887],
+ [-6.102, -12.084],
+ [10.255, 0.958],
+ [18.978, 12.176],
+ [0.798, -2.394],
+ [-6.784, -40.903],
+ [-15.763, -27.535],
+ [-2.993, -2.993],
+ [-0.521, -1.433]
+ ],
+ "v": [
+ [24.237, -111.063],
+ [-33.388, -111.063],
+ [-33.665, -109.282],
+ [-41.845, -96.114],
+ [-67.783, -66.587],
+ [-131.234, 76.075],
+ [-130.634, 105.805],
+ [-106.293, 117.18],
+ [-116.866, 95.431],
+ [-68.383, 107.204],
+ [-3.537, 125.36],
+ [33.375, 107.601],
+ [61.512, 120.372],
+ [132.741, 103.213],
+ [132.542, 95.829],
+ [90.24, -20.894],
+ [32.58, -96.516],
+ [24.997, -106.691]
+ ],
+ "c": true
+ }
+ ]
+ }
+ ],
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.658823549747, 0.074509806931, 0.223529413342, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [0, 0], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "skirt",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 11,
+ "ty": 4,
+ "nm": "foot",
+ "parent": 13,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": {
+ "k": [
+ { "s": [10.618], "t": 0, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.532], "t": 1, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.296], "t": 2, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [9.939], "t": 3, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [9.485], "t": 4, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [8.953], "t": 5, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [8.354], "t": 6, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.7], "t": 7, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.003], "t": 8, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [6.273], "t": 9, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.518], "t": 10, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [4.742], "t": 11, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [3.955], "t": 12, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [3.165], "t": 13, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.378], "t": 14, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.603], "t": 15, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.848], "t": 16, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.13], "t": 17, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.531], "t": 18, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.087], "t": 19, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.422], "t": 20, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.441], "t": 21, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.329], "t": 22, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.149], "t": 23, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.932], "t": 24, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.693], "t": 25, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.444], "t": 26, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.193], "t": 27, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.055], "t": 28, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.295], "t": 29, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.525], "t": 30, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.74], "t": 31, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.936], "t": 32, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.113], "t": 33, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.268], "t": 34, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.397], "t": 35, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.503], "t": 36, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.595], "t": 37, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.704], "t": 38, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.854], "t": 39, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.934], "t": 40, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.141], "t": 41, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.743], "t": 42, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.729], "t": 43, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.758], "t": 44, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.357], "t": 45, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.202], "t": 46, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.515], "t": 47, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.399], "t": 48, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.9], "t": 49, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.056], "t": 50, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.882], "t": 51, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.393], "t": 52, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.398], "t": 53, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.48], "t": 54, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [4.826], "t": 55, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.393], "t": 56, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [12.81], "t": 58, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [15.246], "t": 59, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [16.761], "t": 60, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [16.618], "t": 61, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [15.791], "t": 62, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [14.742], "t": 63, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [13.615], "t": 64, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [12.454], "t": 65, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [11.282], "t": 66, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.124], "t": 67, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [9.002], "t": 68, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.951], "t": 69, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.006], "t": 70, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [6.21], "t": 71, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.607], "t": 72, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.253], "t": 73, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.215], "t": 74, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.587], "t": 75, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [6.526], "t": 76, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [8.499], "t": 77, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [11.689], "t": 78, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.902], "t": 79, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.618], "t": 80, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } }
+ ]
+ },
+ "p": {
+ "k": [
+ { "s": [2.195, 107.769, 0], "t": 0, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } },
+ { "s": [2.195, 107.769, 0], "t": 80, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } }
+ ]
+ },
+ "a": { "a": 0, "k": [499.968, 865.355, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "ef": [
+ {
+ "ty": 5,
+ "nm": "IK",
+ "np": 3,
+ "mn": "Pseudo/DUIK ik",
+ "ix": 1,
+ "en": 1,
+ "ef": [
+ {
+ "ty": 10,
+ "nm": "Controller",
+ "mn": "Pseudo/DUIK ik-0001",
+ "ix": 1,
+ "v": { "a": 0, "k": 3, "ix": 1 }
+ }
+ ]
+ }
+ ],
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [0.2, 5.188],
+ [-0.998, 7.782],
+ [-2.594, 1.995],
+ [-1.596, -3.392],
+ [-1.596, -4.19],
+ [0, -5.986],
+ [-3.791, -3.192],
+ [-5.387, 1.197],
+ [-2.793, 1.596],
+ [-1.995, -1.596],
+ [2.594, -2.993],
+ [-3.392, 0],
+ [-0.2, 6.983],
+ [1.796, -2.195],
+ [5.986, 0.399],
+ [4.589, 1.397],
+ [1.197, 4.589],
+ [0.399, 7.582],
+ [3.591, 6.784],
+ [0, -6.584],
+ [1.197, -2.793],
+ [0, 0]
+ ],
+ "o": [
+ [-0.399, -4.988],
+ [-0.399, -10.974],
+ [0.599, -3.991],
+ [-0.2, 4.789],
+ [1.596, 3.392],
+ [1.596, 4.19],
+ [0, 5.986],
+ [2.793, 2.394],
+ [5.387, -1.197],
+ [0.2, 2.993],
+ [-3.591, 3.591],
+ [-2.394, 3.192],
+ [3.192, 0],
+ [1.596, -0.599],
+ [-1.796, 2.195],
+ [-3.392, -0.2],
+ [-4.589, -1.397],
+ [-1.197, -4.589],
+ [-0.399, -7.582],
+ [-3.192, 0.798],
+ [-0.2, 6.584],
+ [-0.798, 2.993],
+ [0, 0]
+ ],
+ "v": [
+ [-26.944, 40.865],
+ [-29.737, -9.815],
+ [-31.533, -36.551],
+ [-24.55, -46.927],
+ [-24.949, -37.349],
+ [-16.768, -18.195],
+ [-12.379, 7.544],
+ [-3.799, 25.302],
+ [11.565, 29.093],
+ [21.541, 25.701],
+ [24.135, 32.086],
+ [13.56, 36.276],
+ [16.353, 42.062],
+ [31.118, 36.475],
+ [29.322, 43.858],
+ [15.555, 46.851],
+ [-3.999, 44.057],
+ [-13.177, 36.475],
+ [-16.968, 13.131],
+ [-21.158, -16.2],
+ [-24.151, 0.561],
+ [-23.552, 40.266],
+ [-26.944, 40.865]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.1254902035, 0.156862750649, 0.278431385756, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [510.718, 915.889], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "path28",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ },
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [8.979, 5.986],
+ [-1.197, -0.798],
+ [-9.976, 2.394],
+ [1.397, -0.399]
+ ],
+ "o": [
+ [-9.777, 3.591],
+ [-1.197, -0.798],
+ [8.979, 5.786],
+ [1.796, -0.399],
+ [0, 0]
+ ],
+ "v": [
+ [16.424, 0.966],
+ [-17.097, -1.03],
+ [-15.501, -3.424],
+ [16.224, -1.628],
+ [16.424, 0.966]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.1254902035, 0.156862750649, 0.278431385756, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [513.84, 931.646], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "path26",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 2,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ },
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [0.399, 0.2],
+ [10.575, 6.784],
+ [0, 0.199],
+ [0, 0.2],
+ [0, 0.599],
+ [0, 0],
+ [0, 0],
+ [-5.188, 6.784],
+ [3.991, 9.577],
+ [-0.599, 0.998],
+ [0, -0.399],
+ [-11.972, 1.197],
+ [-0.599, -0.998],
+ [1.397, 0],
+ [7.582, -3.591],
+ [-9.577, -6.784],
+ [-0.2, -1.197]
+ ],
+ "o": [
+ [-0.399, 0],
+ [-10.176, -7.782],
+ [-0.2, -0.2],
+ [-0.2, 0],
+ [-0.2, -0.599],
+ [0, 0],
+ [0, 0],
+ [7.981, -3.392],
+ [-10.974, -1.397],
+ [0.599, -0.798],
+ [0.2, 0.2],
+ [4.789, 10.575],
+ [0.399, 0.998],
+ [-1.397, 0.2],
+ [-4.789, 7.183],
+ [9.976, 5.986],
+ [-0.399, 1.197],
+ [0, 0]
+ ],
+ "v": [
+ [21.449, 27.934],
+ [20.451, 27.734],
+ [-13.468, 11.373],
+ [-13.867, 10.774],
+ [-14.067, 10.575],
+ [-14.466, 8.979],
+ [-14.466, 8.979],
+ [-14.266, 8.779],
+ [5.088, -6.983],
+ [-21.449, -25.34],
+ [-19.653, -27.934],
+ [-19.254, -27.335],
+ [11.672, -9.777],
+ [13.069, -6.983],
+ [8.879, -6.584],
+ [-10.076, 9.976],
+ [21.449, 24.342],
+ [21.449, 27.934]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.1254902035, 0.156862750649, 0.278431385756, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [508.216, 895.1], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "path24",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 3,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ },
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [0.25, -0.018],
+ [0.35, -0.059],
+ [0.341, -0.095],
+ [0.331, -0.128],
+ [0.001, 0],
+ [0.316, -0.16],
+ [0.298, -0.19],
+ [0.001, 0],
+ [0.278, -0.219],
+ [0.254, -0.247],
+ [0.228, -0.27],
+ [0.001, 0],
+ [0.2, -0.291],
+ [0.169, -0.31],
+ [0.138, -0.326],
+ [0.104, -0.338],
+ [0.001, 0],
+ [0.008, -0.03],
+ [0, 0],
+ [-0.346, -9.158],
+ [0, -11.373],
+ [-15.164, -3.192],
+ [-0.998, 6.784],
+ [1.995, 8.779],
+ [5.786, 17.758],
+ [1.983, 9.456],
+ [0.024, 0.122],
+ [0.078, 0.332],
+ [0.12, 0.307],
+ [0.16, 0.315],
+ [0.192, 0.298],
+ [0.221, 0.277],
+ [0, 0.001],
+ [0.247, 0.253],
+ [0.272, 0.227],
+ [0.292, 0.199],
+ [0.001, 0],
+ [0.311, 0.171],
+ [0.327, 0.137],
+ [0.001, 0],
+ [0.338, 0.104],
+ [0.348, 0.07],
+ [0.353, 0.036],
+ [0.354, 0.001],
+ [0.001, 0]
+ ],
+ "o": [
+ [-0.251, 0],
+ [-0.354, 0.024],
+ [-0.349, 0.061],
+ [-0.342, 0.095],
+ [-0.001, 0],
+ [-0.33, 0.128],
+ [-0.315, 0.16],
+ [-0.001, 0],
+ [-0.298, 0.191],
+ [-0.278, 0.22],
+ [-0.254, 0.246],
+ [-0.001, 0],
+ [-0.228, 0.27],
+ [-0.199, 0.292],
+ [-0.17, 0.31],
+ [-0.137, 0.326],
+ [-0.001, 0],
+ [-0.008, 0.03],
+ [0, 0],
+ [-1.991, 7.476],
+ [0.599, 10.375],
+ [0, 11.573],
+ [15.164, 3.192],
+ [0.998, -6.784],
+ [-1.995, -8.979],
+ [-4.931, -15.134],
+ [-0.026, -0.121],
+ [-0.066, -0.335],
+ [-0.091, -0.316],
+ [-0.128, -0.329],
+ [-0.161, -0.315],
+ [-0.192, -0.297],
+ [0, -0.001],
+ [-0.22, -0.276],
+ [-0.248, -0.253],
+ [-0.271, -0.227],
+ [-0.001, 0],
+ [-0.292, -0.201],
+ [-0.312, -0.169],
+ [-0.001, 0],
+ [-0.326, -0.137],
+ [-0.34, -0.104],
+ [-0.348, -0.071],
+ [-0.352, -0.036],
+ [-0.001, 0],
+ [0, 0]
+ ],
+ "v": [
+ [-12.641, -51.841],
+ [-13.393, -51.814],
+ [-14.449, -51.689],
+ [-15.485, -51.455],
+ [-16.495, -51.12],
+ [-16.499, -51.12],
+ [-17.469, -50.688],
+ [-18.389, -50.162],
+ [-18.393, -50.162],
+ [-19.258, -49.546],
+ [-20.057, -48.844],
+ [-20.782, -48.069],
+ [-20.786, -48.069],
+ [-21.429, -47.227],
+ [-21.982, -46.323],
+ [-22.446, -45.368],
+ [-22.808, -44.371],
+ [-22.812, -44.371],
+ [-22.836, -44.281],
+ [-22.917, -44.336],
+ [-29.363, -26.799],
+ [-17.789, 4.529],
+ [-0.03, 49.621],
+ [29.299, 46.43],
+ [19.922, 37.049],
+ [11.54, -10.038],
+ [-2.111, -42.769],
+ [-2.224, -43.127],
+ [-2.4, -44.145],
+ [-2.715, -45.08],
+ [-3.148, -46.046],
+ [-3.678, -46.966],
+ [-4.297, -47.827],
+ [-4.297, -47.831],
+ [-4.999, -48.626],
+ [-5.778, -49.347],
+ [-6.624, -49.986],
+ [-6.628, -49.986],
+ [-7.532, -50.544],
+ [-8.491, -51.003],
+ [-8.495, -51.003],
+ [-9.492, -51.366],
+ [-10.525, -51.627],
+ [-11.577, -51.787],
+ [-12.637, -51.841],
+ [-12.641, -51.841]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [1, 0.600000023842, 0.333333343267, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [512.537, 906.735], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "path944",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 4,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 12,
+ "ty": 4,
+ "nm": "hip",
+ "parent": 9,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": {
+ "k": [
+ { "s": [-14.373], "t": 0, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.268], "t": 1, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.98], "t": 2, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.544], "t": 3, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.986], "t": 4, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.327], "t": 5, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.583], "t": 6, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-10.765], "t": 7, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-9.886], "t": 8, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-8.959], "t": 9, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.99], "t": 10, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.985], "t": 11, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.952], "t": 12, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.899], "t": 13, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.833], "t": 14, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.683], "t": 16, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.617], "t": 17, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.424], "t": 18, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.408], "t": 19, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.252], "t": 20, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [3.07], "t": 21, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [3.999], "t": 22, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [4.968], "t": 23, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.952], "t": 24, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [6.939], "t": 25, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.921], "t": 26, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [8.892], "t": 27, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [9.848], "t": 28, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.784], "t": 29, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [11.693], "t": 30, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [12.572], "t": 31, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [13.417], "t": 32, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [14.219], "t": 33, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [14.971], "t": 34, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [15.665], "t": 35, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [16.285], "t": 36, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [16.805], "t": 37, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [17.172], "t": 38, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [17.335], "t": 39, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [17.37], "t": 40, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [17.397], "t": 41, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [17.43], "t": 42, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [13.853], "t": 43, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [8.043], "t": 44, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [4.041], "t": 45, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.524], "t": 46, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.749], "t": 47, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.885], "t": 48, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-8.931], "t": 49, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.921], "t": 50, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.866], "t": 51, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-17.778], "t": 52, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-20.651], "t": 53, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-23.469], "t": 54, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-26.213], "t": 55, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-28.844], "t": 56, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-31.317], "t": 57, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-33.578], "t": 58, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-35.561], "t": 59, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-37.166], "t": 60, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-38.608], "t": 61, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-39.928], "t": 62, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-40.895], "t": 63, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-41.429], "t": 64, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-41.519], "t": 65, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-41.201], "t": 66, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-40.522], "t": 67, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-39.533], "t": 68, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-38.27], "t": 69, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-36.766], "t": 70, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-35.044], "t": 71, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-33.116], "t": 72, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-30.983], "t": 73, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-28.624], "t": 74, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-25.992], "t": 75, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-22.964], "t": 76, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.045], "t": 77, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.076], "t": 78, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.29], "t": 79, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.373], "t": 80, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } }
+ ]
+ },
+ "p": {
+ "a": 1,
+ "k": [
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 0,
+ "s": [525.083, 486.74, 0],
+ "to": [-4.667, 0, 0],
+ "ti": [0, 0, 0]
+ },
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 40,
+ "s": [497.083, 486.74, 0],
+ "to": [0, 0, 0],
+ "ti": [-4.667, 0, 0]
+ },
+ { "t": 80, "s": [525.083, 486.74, 0] }
+ ],
+ "ix": 2
+ },
+ "a": { "a": 0, "k": [-0.75, -92.75, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "ef": [
+ {
+ "ty": 5,
+ "nm": "IK",
+ "np": 3,
+ "mn": "Pseudo/DUIK ik",
+ "ix": 1,
+ "en": 1,
+ "ef": [
+ {
+ "ty": 10,
+ "nm": "Controller",
+ "mn": "Pseudo/DUIK ik-0001",
+ "ix": 1,
+ "v": { "a": 0, "k": 3, "ix": 1 }
+ }
+ ]
+ }
+ ],
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [1.062, -0.042],
+ [0, 0],
+ [2.426, -23.15],
+ [0.108, -0.543],
+ [0.107, -0.477],
+ [0.006, -0.19],
+ [-0.034, -0.476],
+ [-0.114, -0.666],
+ [-0.181, -0.651],
+ [-0.245, -0.628],
+ [-0.306, -0.603],
+ [-0.364, -0.567],
+ [-0.419, -0.528],
+ [-0.471, -0.485],
+ [-0.516, -0.435],
+ [-0.557, -0.381],
+ [-0.593, -0.323],
+ [-0.622, -0.263],
+ [-0.645, -0.199],
+ [-0.661, -0.135],
+ [-0.671, -0.067],
+ [-0.675, 0],
+ [-0.477, 0.034],
+ [-0.665, 0.114],
+ [-0.651, 0.181],
+ [-0.629, 0.245],
+ [-0.602, 0.306],
+ [-0.567, 0.364],
+ [-0.53, 0.42],
+ [-0.484, 0.471],
+ [-0.435, 0.516],
+ [-0.381, 0.558],
+ [-0.323, 0.591],
+ [-0.263, 0.622],
+ [-0.199, 0.645],
+ [-0.098, 0.443],
+ [-0.147, 1.458],
+ [-0.153, 1.803],
+ [-2.195, 25.539],
+ [6.73, 0.277]
+ ],
+ "o": [
+ [-0.961, -0.04],
+ [-25.477, 1.01],
+ [5.041, 29.08],
+ [-0.071, 0.676],
+ [-0.086, 0.453],
+ [-0.012, 0.189],
+ [0, 0.477],
+ [0.047, 0.674],
+ [0.115, 0.666],
+ [0.181, 0.649],
+ [0.244, 0.63],
+ [0.306, 0.601],
+ [0.365, 0.567],
+ [0.42, 0.53],
+ [0.47, 0.484],
+ [0.516, 0.434],
+ [0.557, 0.381],
+ [0.593, 0.324],
+ [0.622, 0.263],
+ [0.645, 0.2],
+ [0.661, 0.133],
+ [0.672, 0.068],
+ [0.478, 0],
+ [0.673, -0.047],
+ [0.666, -0.115],
+ [0.651, -0.181],
+ [0.629, -0.244],
+ [0.601, -0.306],
+ [0.569, -0.365],
+ [0.529, -0.42],
+ [0.484, -0.47],
+ [0.435, -0.517],
+ [0.381, -0.556],
+ [0.324, -0.593],
+ [0.263, -0.622],
+ [0.128, -0.435],
+ [0.168, -1.519],
+ [0.196, -1.94],
+ [1.596, -18.356],
+ [0.436, -5.587],
+ [0, 0]
+ ],
+ "v": [
+ [35.344, -100.045],
+ [32.308, -100.041],
+ [-45.807, -75.463],
+ [-24.768, 74.919],
+ [-24.857, 77.378],
+ [-25.368, 79.26],
+ [-25.395, 79.829],
+ [-25.344, 81.259],
+ [-25.103, 83.27],
+ [-24.658, 85.246],
+ [-24.019, 87.163],
+ [-23.193, 89.014],
+ [-22.188, 90.768],
+ [-21.011, 92.412],
+ [-19.674, 93.936],
+ [-18.193, 95.316],
+ [-16.584, 96.539],
+ [-14.857, 97.595],
+ [-13.034, 98.476],
+ [-11.132, 99.17],
+ [-9.172, 99.672],
+ [-7.173, 99.972],
+ [-5.15, 100.074],
+ [-3.716, 100.023],
+ [-1.709, 99.782],
+ [0.267, 99.337],
+ [2.188, 98.698],
+ [4.035, 97.872],
+ [5.789, 96.867],
+ [7.437, 95.69],
+ [8.957, 94.353],
+ [10.337, 92.872],
+ [11.56, 91.259],
+ [12.616, 89.536],
+ [13.497, 87.713],
+ [14.191, 85.811],
+ [14.53, 84.494],
+ [15.095, 79.813],
+ [15.847, 73.586],
+ [45.776, -91.822],
+ [35.344, -100.045]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [1, 0.600000023842, 0.333333343267, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [0, 0], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "hip",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 13,
+ "ty": 4,
+ "nm": "leg",
+ "parent": 12,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": {
+ "k": [
+ { "s": [0.803], "t": 42, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.353], "t": 43, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [17.874], "t": 44, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [24.921], "t": 45, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [30.912], "t": 46, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [36.281], "t": 47, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [41.21], "t": 48, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [45.772], "t": 49, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [50.011], "t": 50, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [53.936], "t": 51, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [57.55], "t": 52, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [60.836], "t": 53, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [63.762], "t": 54, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [66.303], "t": 55, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [68.416], "t": 56, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [70.074], "t": 57, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [71.259], "t": 58, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [71.983], "t": 59, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [72.323], "t": 60, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [72.35], "t": 61, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [71.85], "t": 62, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [70.706], "t": 63, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [68.925], "t": 64, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [66.58], "t": 65, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [63.761], "t": 66, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [60.548], "t": 67, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [57.01], "t": 68, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [53.186], "t": 69, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [49.105], "t": 70, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [44.775], "t": 71, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [40.2], "t": 72, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [35.351], "t": 73, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [30.175], "t": 74, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [24.573], "t": 75, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [18.31], "t": 76, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.477], "t": 77, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.803], "t": 78, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } }
+ ]
+ },
+ "p": {
+ "k": [
+ { "s": [-5.31, 79.845, 0], "t": 0, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } },
+ { "s": [-5.31, 79.845, 0], "t": 80, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } }
+ ]
+ },
+ "a": { "a": 0, "k": [4.75, -98.25, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "ef": [
+ {
+ "ty": 5,
+ "nm": "IK",
+ "np": 3,
+ "mn": "Pseudo/DUIK ik",
+ "ix": 1,
+ "en": 1,
+ "ef": [
+ {
+ "ty": 10,
+ "nm": "Controller",
+ "mn": "Pseudo/DUIK ik-0001",
+ "ix": 1,
+ "v": { "a": 0, "k": 3, "ix": 1 }
+ }
+ ]
+ }
+ ],
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [0.476, -0.034],
+ [0.666, -0.115],
+ [0.651, -0.181],
+ [0.629, -0.245],
+ [0.602, -0.306],
+ [0.567, -0.364],
+ [0.53, -0.42],
+ [0.484, -0.471],
+ [0.435, -0.516],
+ [0.381, -0.557],
+ [0.323, -0.593],
+ [0.263, -0.622],
+ [0.199, -0.645],
+ [0.082, -0.36],
+ [0.108, -0.543],
+ [0.107, -0.477],
+ [-1.534, -32.592],
+ [0.998, -11.573],
+ [0.189, -0.892],
+ [0.089, -0.334],
+ [0, 0],
+ [0.038, -0.158],
+ [0.053, -0.284],
+ [0.056, -0.25],
+ [0.001, -0.1],
+ [-0.018, -0.249],
+ [-0.059, -0.348],
+ [-0.095, -0.34],
+ [-0.13, -0.329],
+ [-0.159, -0.315],
+ [-0.001, -0.001],
+ [-0.192, -0.296],
+ [-0.221, -0.277],
+ [-0.246, -0.255],
+ [-0.272, -0.227],
+ [-0.001, -0.001],
+ [-0.292, -0.199],
+ [-0.312, -0.169],
+ [-0.327, -0.137],
+ [-0.34, -0.105],
+ [-0.348, -0.07],
+ [-0.352, -0.036],
+ [-0.355, 0],
+ [-0.252, 0.018],
+ [-0.35, 0.06],
+ [-0.341, 0.094],
+ [-0.331, 0.128],
+ [-0.316, 0.16],
+ [-0.3, 0.191],
+ [-0.277, 0.221],
+ [-0.001, 0],
+ [-0.254, 0.246],
+ [-0.228, 0.27],
+ [-0.001, 0],
+ [-0.2, 0.292],
+ [-0.17, 0.31],
+ [-0.137, 0.324],
+ [0, 0.001],
+ [-0.105, 0.337],
+ [-0.052, 0.232],
+ [-0.077, 0.763],
+ [0, 0],
+ [0.018, 0.248],
+ [0.041, 0.259],
+ [0.024, 0.122],
+ [0.078, 0.332],
+ [0, 1.277],
+ [-2.195, 23.145],
+ [-2.521, 22.851],
+ [-0.147, 1.458],
+ [0.033, 0.472],
+ [0.114, 0.665],
+ [0.181, 0.651],
+ [0.245, 0.629],
+ [0.306, 0.602],
+ [0.364, 0.567],
+ [0.42, 0.53],
+ [0.471, 0.484],
+ [0.516, 0.435],
+ [0.557, 0.381],
+ [0.593, 0.324],
+ [0.622, 0.262],
+ [0.645, 0.201],
+ [0.661, 0.134],
+ [0.671, 0.068],
+ [0.675, 0]
+ ],
+ "o": [
+ [-0.477, 0],
+ [-0.674, 0.048],
+ [-0.666, 0.115],
+ [-0.651, 0.181],
+ [-0.629, 0.244],
+ [-0.601, 0.306],
+ [-0.569, 0.365],
+ [-0.529, 0.42],
+ [-0.484, 0.47],
+ [-0.434, 0.516],
+ [-0.381, 0.558],
+ [-0.324, 0.593],
+ [-0.263, 0.622],
+ [-0.102, 0.355],
+ [-0.071, 0.676],
+ [-0.086, 0.453],
+ [-2.637, 11.715],
+ [0.798, 19.354],
+ [-0.095, 1.102],
+ [-0.077, 0.362],
+ [0, 0],
+ [-0.045, 0.156],
+ [-0.037, 0.354],
+ [-0.046, 0.237],
+ [-0.004, 0.1],
+ [0, 0.25],
+ [0.024, 0.353],
+ [0.061, 0.348],
+ [0.096, 0.341],
+ [0.127, 0.329],
+ [0.001, 0.001],
+ [0.161, 0.314],
+ [0.192, 0.297],
+ [0.219, 0.278],
+ [0.248, 0.253],
+ [0.001, 0.001],
+ [0.271, 0.227],
+ [0.293, 0.199],
+ [0.312, 0.169],
+ [0.327, 0.139],
+ [0.34, 0.104],
+ [0.347, 0.071],
+ [0.354, 0.036],
+ [0.252, 0],
+ [0.354, -0.025],
+ [0.349, -0.059],
+ [0.342, -0.095],
+ [0.33, -0.128],
+ [0.318, -0.16],
+ [0.297, -0.192],
+ [0.001, 0],
+ [0.278, -0.219],
+ [0.254, -0.246],
+ [0.001, 0],
+ [0.228, -0.271],
+ [0.201, -0.292],
+ [0.169, -0.309],
+ [0, -0.001],
+ [0.139, -0.325],
+ [0.067, -0.228],
+ [0.092, -0.796],
+ [0, 0],
+ [0, -0.248],
+ [-0.022, -0.261],
+ [-0.026, -0.121],
+ [-0.066, -0.335],
+ [-0.276, -1.176],
+ [0, -11.972],
+ [1.209, -12.439],
+ [0.168, -1.519],
+ [0, -0.473],
+ [-0.047, -0.673],
+ [-0.115, -0.666],
+ [-0.181, -0.651],
+ [-0.244, -0.629],
+ [-0.306, -0.601],
+ [-0.365, -0.569],
+ [-0.42, -0.529],
+ [-0.47, -0.484],
+ [-0.516, -0.434],
+ [-0.557, -0.382],
+ [-0.593, -0.322],
+ [-0.622, -0.264],
+ [-0.645, -0.199],
+ [-0.661, -0.135],
+ [-0.672, -0.068],
+ [0, 0]
+ ],
+ "v": [
+ [4.91, -118.516],
+ [3.48, -118.465],
+ [1.469, -118.219],
+ [-0.507, -117.775],
+ [-2.428, -117.136],
+ [-4.275, -116.31],
+ [-6.029, -115.304],
+ [-7.677, -114.128],
+ [-9.197, -112.791],
+ [-10.577, -111.31],
+ [-11.8, -109.701],
+ [-12.856, -107.974],
+ [-13.737, -106.15],
+ [-14.431, -104.249],
+ [-14.708, -103.177],
+ [-14.797, -100.718],
+ [-15.308, -98.836],
+ [-24.972, -35.872],
+ [-7.214, 101.4],
+ [-7.833, 103.941],
+ [-8.153, 104.814],
+ [-8.071, 104.868],
+ [-8.196, 105.34],
+ [-8.239, 106.626],
+ [-8.507, 107.612],
+ [-8.515, 107.912],
+ [-8.488, 108.66],
+ [-8.363, 109.712],
+ [-8.13, 110.745],
+ [-7.791, 111.75],
+ [-7.362, 112.717],
+ [-7.358, 112.721],
+ [-6.828, 113.637],
+ [-6.208, 114.498],
+ [-5.511, 115.297],
+ [-4.731, 116.018],
+ [-4.727, 116.022],
+ [-3.882, 116.661],
+ [-2.974, 117.214],
+ [-2.015, 117.674],
+ [-1.014, 118.04],
+ [0.019, 118.301],
+ [1.067, 118.461],
+ [2.131, 118.516],
+ [2.887, 118.488],
+ [3.943, 118.36],
+ [4.98, 118.13],
+ [5.989, 117.795],
+ [6.96, 117.362],
+ [7.887, 116.836],
+ [8.748, 116.216],
+ [8.752, 116.216],
+ [9.551, 115.519],
+ [10.276, 114.743],
+ [10.28, 114.743],
+ [10.923, 113.898],
+ [11.48, 112.994],
+ [11.94, 112.043],
+ [11.94, 112.039],
+ [12.307, 111.045],
+ [12.486, 110.355],
+ [12.782, 107.904],
+ [12.774, 107.904],
+ [12.747, 107.16],
+ [12.653, 106.38],
+ [12.54, 106.022],
+ [12.365, 105.005],
+ [11.741, 101.4],
+ [16.527, -30.089],
+ [24.59, -93.602],
+ [25.155, -98.282],
+ [25.104, -99.701],
+ [24.862, -101.708],
+ [24.418, -103.684],
+ [23.779, -105.605],
+ [22.953, -107.452],
+ [21.948, -109.206],
+ [20.771, -110.854],
+ [19.434, -112.374],
+ [17.953, -113.754],
+ [16.344, -114.977],
+ [14.617, -116.037],
+ [12.793, -116.914],
+ [10.892, -117.612],
+ [8.932, -118.11],
+ [6.932, -118.414],
+ [4.91, -118.516]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [1, 0.600000023842, 0.333333343267, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [0, 0], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "leg",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 14,
+ "ty": 4,
+ "nm": "palm_B",
+ "parent": 16,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": {
+ "k": [
+ { "s": [-8.027], "t": 1, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-8.004], "t": 2, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.964], "t": 3, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.9], "t": 4, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.818], "t": 5, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.719], "t": 6, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.613], "t": 7, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.509], "t": 8, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.408], "t": 9, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.315], "t": 10, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.238], "t": 11, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.179], "t": 12, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.136], "t": 13, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.096], "t": 14, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.055], "t": 15, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7], "t": 16, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.917], "t": 17, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.781], "t": 18, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.573], "t": 19, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.261], "t": 20, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.829], "t": 21, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.304], "t": 22, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.718], "t": 23, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.105], "t": 24, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.488], "t": 25, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.888], "t": 26, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.317], "t": 27, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.787], "t": 28, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.302], "t": 29, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.87], "t": 30, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.485], "t": 31, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.146], "t": 32, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.143], "t": 33, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.389], "t": 34, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.598], "t": 35, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.769], "t": 36, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.904], "t": 37, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.007], "t": 38, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.077], "t": 39, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.1], "t": 40, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.077], "t": 41, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.011], "t": 42, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.906], "t": 43, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.769], "t": 44, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.598], "t": 45, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.389], "t": 46, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.143], "t": 47, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.146], "t": 48, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.486], "t": 49, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.871], "t": 50, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.303], "t": 51, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.786], "t": 52, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.317], "t": 53, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.889], "t": 54, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.488], "t": 55, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.105], "t": 56, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.715], "t": 57, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.297], "t": 58, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.828], "t": 59, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.261], "t": 60, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.573], "t": 61, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.781], "t": 62, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.917], "t": 63, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7], "t": 64, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.055], "t": 65, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.096], "t": 66, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.136], "t": 67, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.179], "t": 68, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.238], "t": 69, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.315], "t": 70, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.408], "t": 71, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.509], "t": 72, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.613], "t": 73, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.719], "t": 74, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.818], "t": 75, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.9], "t": 76, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.964], "t": 77, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-8.004], "t": 78, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-8.027], "t": 79, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } }
+ ]
+ },
+ "p": {
+ "k": [
+ { "s": [20.472, 67.425, 0], "t": 0, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } },
+ { "s": [20.472, 67.425, 0], "t": 80, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } }
+ ]
+ },
+ "a": { "a": 0, "k": [-0.25, -31, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "ef": [
+ {
+ "ty": 5,
+ "nm": "IK",
+ "np": 3,
+ "mn": "Pseudo/DUIK ik",
+ "ix": 1,
+ "en": 1,
+ "ef": [
+ {
+ "ty": 10,
+ "nm": "Controller",
+ "mn": "Pseudo/DUIK ik-0001",
+ "ix": 1,
+ "v": { "a": 0, "k": 2, "ix": 1 }
+ }
+ ]
+ }
+ ],
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0.193, 0],
+ [0.136, -0.009],
+ [0.191, -0.033],
+ [0.186, -0.052],
+ [0.18, -0.07],
+ [0.173, -0.087],
+ [0.163, -0.104],
+ [0.151, -0.121],
+ [0.139, -0.135],
+ [0.124, -0.148],
+ [0.109, -0.159],
+ [0.093, -0.17],
+ [0.074, -0.178],
+ [0.057, -0.185],
+ [0.039, -0.189],
+ [0.019, -0.192],
+ [0.001, -0.193],
+ [-0.01, -0.137],
+ [-0.003, -0.026],
+ [-0.003, -0.019],
+ [-0.024, -0.145],
+ [0.013, 0.141],
+ [-2.095, -6.635],
+ [-0.2, -7.183],
+ [3.591, 0.998],
+ [-5.387, -2.195],
+ [-2.594, 4.589],
+ [4.789, -4.789],
+ [1.796, -0.998],
+ [-4.39, 3.591],
+ [-2.594, -1.796],
+ [-3.591, 5.188],
+ [-0.226, 0.368],
+ [0.798, -1.153],
+ [-0.998, 3.591],
+ [-0.151, 3.855],
+ [-0.465, 3.256],
+ [3.387, 9.732],
+ [0.199, 0.56],
+ [0.023, 0.039],
+ [0.121, 0.151],
+ [0.134, 0.138],
+ [0.148, 0.125],
+ [0.159, 0.109],
+ [0.17, 0.092],
+ [0.178, 0.076],
+ [0.184, 0.057],
+ [0.191, 0.039],
+ [0.192, 0.019]
+ ],
+ "o": [
+ [-0.137, -0.001],
+ [-0.193, 0.014],
+ [-0.19, 0.033],
+ [-0.186, 0.052],
+ [-0.18, 0.069],
+ [-0.172, 0.088],
+ [-0.163, 0.105],
+ [-0.152, 0.12],
+ [-0.138, 0.135],
+ [-0.124, 0.147],
+ [-0.11, 0.16],
+ [-0.092, 0.17],
+ [-0.075, 0.178],
+ [-0.057, 0.185],
+ [-0.038, 0.189],
+ [-0.02, 0.192],
+ [0, 0.138],
+ [0.002, 0.026],
+ [0.003, 0.019],
+ [0.013, 0.146],
+ [-0.024, -0.14],
+ [0.054, 4.71],
+ [2.394, 7.582],
+ [0.399, 7.183],
+ [-3.392, -0.998],
+ [5.587, 1.995],
+ [0.599, -0.399],
+ [-4.789, 4.789],
+ [-1.796, 0.998],
+ [-1.397, 3.192],
+ [2.594, 1.796],
+ [0.228, -0.33],
+ [-0.246, 2.326],
+ [-1.796, 2.594],
+ [0.936, -2.809],
+ [1.284, -3.815],
+ [0.862, -6.031],
+ [-0.242, -0.695],
+ [-0.022, -0.039],
+ [-0.105, -0.163],
+ [-0.12, -0.15],
+ [-0.135, -0.14],
+ [-0.147, -0.124],
+ [-0.16, -0.108],
+ [-0.17, -0.093],
+ [-0.177, -0.075],
+ [-0.186, -0.058],
+ [-0.189, -0.038],
+ [-0.192, -0.019]
+ ],
+ "v": [
+ [-0.643, -36.839],
+ [-1.052, -36.828],
+ [-1.629, -36.757],
+ [-2.194, -36.629],
+ [-2.743, -36.446],
+ [-3.273, -36.212],
+ [-3.776, -35.923],
+ [-4.247, -35.584],
+ [-4.684, -35.202],
+ [-5.077, -34.778],
+ [-5.428, -34.318],
+ [-5.732, -33.823],
+ [-5.982, -33.301],
+ [-6.18, -32.755],
+ [-6.325, -32.194],
+ [-6.41, -31.621],
+ [-6.441, -31.044],
+ [-6.426, -30.631],
+ [-6.418, -30.553],
+ [-6.41, -30.495],
+ [-6.356, -30.058],
+ [-6.41, -30.479],
+ [-8.667, -17.335],
+ [-1.882, 1.819],
+ [-8.468, 11.398],
+ [-11.66, 14.987],
+ [-0.085, 12.197],
+ [-6.274, 23.767],
+ [-14.052, 28.159],
+ [-4.875, 29.355],
+ [-8.865, 36.537],
+ [6.298, 26.561],
+ [6.976, 25.462],
+ [5.499, 31.351],
+ [10.09, 29.554],
+ [11.532, 15.233],
+ [14.279, 4.216],
+ [5.129, -31.559],
+ [4.303, -34.061],
+ [4.236, -34.178],
+ [3.897, -34.649],
+ [3.515, -35.082],
+ [3.091, -35.479],
+ [2.631, -35.83],
+ [2.136, -36.13],
+ [1.614, -36.383],
+ [1.072, -36.582],
+ [0.507, -36.726],
+ [-0.066, -36.812]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.964705942191, 0.564705882353, 0.298039215686, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [0, 0], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "palm",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 15,
+ "ty": 4,
+ "nm": "shoulder _B",
+ "parent": 9,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": {
+ "k": [
+ { "s": [-14.917], "t": 0, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.815], "t": 1, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.509], "t": 2, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.016], "t": 3, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.342], "t": 4, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.508], "t": 5, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.529], "t": 6, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-10.426], "t": 7, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-9.225], "t": 8, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.939], "t": 9, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.588], "t": 10, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.191], "t": 11, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.764], "t": 12, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.317], "t": 13, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.848], "t": 14, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.638], "t": 15, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.144], "t": 16, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [3.679], "t": 17, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.264], "t": 18, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [6.916], "t": 19, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [8.667], "t": 20, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.534], "t": 21, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [12.49], "t": 22, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [14.5], "t": 23, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [16.525], "t": 24, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [18.541], "t": 25, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [20.522], "t": 26, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [22.446], "t": 27, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [24.29], "t": 28, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [26.046], "t": 29, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [27.699], "t": 30, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [29.237], "t": 31, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [30.652], "t": 32, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [31.936], "t": 33, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [33.085], "t": 34, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [34.086], "t": 35, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [34.934], "t": 36, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [35.614], "t": 37, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [36.122], "t": 38, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [36.446], "t": 39, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [36.559], "t": 40, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [36.447], "t": 41, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [36.128], "t": 42, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [35.617], "t": 43, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [34.934], "t": 44, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [34.086], "t": 45, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [33.084], "t": 46, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [31.936], "t": 47, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [30.653], "t": 48, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [29.237], "t": 49, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [27.698], "t": 50, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [26.046], "t": 51, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [24.29], "t": 52, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [22.445], "t": 53, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [20.521], "t": 54, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [18.541], "t": 55, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [16.525], "t": 56, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [14.503], "t": 57, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [12.497], "t": 58, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.535], "t": 59, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [8.667], "t": 60, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [6.916], "t": 61, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.264], "t": 62, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [3.679], "t": 63, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.144], "t": 64, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.638], "t": 65, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.848], "t": 66, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.317], "t": 67, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.764], "t": 68, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.191], "t": 69, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.588], "t": 70, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.939], "t": 71, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-9.225], "t": 72, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-10.426], "t": 73, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.529], "t": 74, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.508], "t": 75, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.342], "t": 76, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.016], "t": 77, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.509], "t": 78, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.815], "t": 79, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.917], "t": 80, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } }
+ ]
+ },
+ "p": {
+ "a": 1,
+ "k": [
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 0,
+ "s": [510.613, 213.345, 0],
+ "to": [-2, 0, 0],
+ "ti": [0, 0, 0]
+ },
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 40,
+ "s": [498.613, 213.345, 0],
+ "to": [0, 0, 0],
+ "ti": [-2, 0, 0]
+ },
+ { "t": 80, "s": [510.613, 213.345, 0] }
+ ],
+ "ix": 2
+ },
+ "a": { "a": 0, "k": [0.5, -60.5, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "ef": [
+ {
+ "ty": 5,
+ "nm": "IK",
+ "np": 3,
+ "mn": "Pseudo/DUIK ik",
+ "ix": 1,
+ "en": 1,
+ "ef": [
+ {
+ "ty": 10,
+ "nm": "Controller",
+ "mn": "Pseudo/DUIK ik-0001",
+ "ix": 1,
+ "v": { "a": 0, "k": 2, "ix": 1 }
+ }
+ ]
+ }
+ ],
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0.407, -0.011],
+ [0.561, -13.468],
+ [-4.218, -19.269],
+ [-0.185, -0.555],
+ [-0.014, -0.041],
+ [-0.054, -0.162],
+ [0, -0.001],
+ [-0.152, -0.298],
+ [-0.181, -0.282],
+ [-0.208, -0.262],
+ [-0.233, -0.241],
+ [-0.257, -0.215],
+ [-0.276, -0.189],
+ [-0.293, -0.161],
+ [-0.308, -0.13],
+ [-0.32, -0.099],
+ [-0.327, -0.067],
+ [-0.333, -0.033],
+ [-0.334, 0],
+ [-0.237, 0.016],
+ [-0.329, 0.058],
+ [-0.322, 0.089],
+ [-0.313, 0.121],
+ [-0.298, 0.152],
+ [-0.281, 0.181],
+ [-0.263, 0.208],
+ [-0.24, 0.233],
+ [-0.216, 0.257],
+ [-0.189, 0.276],
+ [-0.16, 0.293],
+ [-0.13, 0.308],
+ [-0.1, 0.32],
+ [-0.066, 0.327],
+ [-0.034, 0.334],
+ [0, 0.334],
+ [0.005, 0.095],
+ [-0.01, 0.333],
+ [-0.002, 0.057],
+ [-0.396, 11.29],
+ [19.155, 1.197]
+ ],
+ "o": [
+ [-6.107, 0.162],
+ [-0.574, 13.787],
+ [0.177, 0.809],
+ [0.014, 0.04],
+ [0.05, 0.148],
+ [0, 0.001],
+ [0.121, 0.312],
+ [0.152, 0.299],
+ [0.181, 0.281],
+ [0.208, 0.263],
+ [0.234, 0.239],
+ [0.256, 0.216],
+ [0.276, 0.189],
+ [0.294, 0.16],
+ [0.308, 0.13],
+ [0.319, 0.099],
+ [0.329, 0.066],
+ [0.333, 0.034],
+ [0.238, 0.001],
+ [0.333, -0.025],
+ [0.329, -0.056],
+ [0.323, -0.089],
+ [0.312, -0.121],
+ [0.298, -0.152],
+ [0.282, -0.181],
+ [0.262, -0.208],
+ [0.241, -0.234],
+ [0.216, -0.256],
+ [0.188, -0.276],
+ [0.16, -0.294],
+ [0.131, -0.308],
+ [0.098, -0.319],
+ [0.067, -0.329],
+ [0.034, -0.333],
+ [-0.003, -0.095],
+ [-0.13, -0.481],
+ [0.001, -0.05],
+ [0.233, -7.704],
+ [0.998, -28.133],
+ [-0.387, -0.025]
+ ],
+ "v": [
+ [-0.342, -74.678],
+ [-15.111, -56.697],
+ [-9.445, 64.016],
+ [-8.927, 66.81],
+ [-8.826, 67.13],
+ [-8.471, 68.272],
+ [-8.467, 68.28],
+ [-8.058, 69.195],
+ [-7.559, 70.068],
+ [-6.974, 70.883],
+ [-6.312, 71.639],
+ [-5.575, 72.321],
+ [-4.777, 72.929],
+ [-3.923, 73.455],
+ [-3.019, 73.891],
+ [-2.076, 74.234],
+ [-1.106, 74.484],
+ [-0.112, 74.632],
+ [0.89, 74.682],
+ [1.603, 74.659],
+ [2.597, 74.534],
+ [3.575, 74.316],
+ [4.53, 74],
+ [5.445, 73.591],
+ [6.314, 73.092],
+ [7.133, 72.508],
+ [7.885, 71.845],
+ [8.571, 71.109],
+ [9.179, 70.31],
+ [9.701, 69.457],
+ [10.137, 68.552],
+ [10.484, 67.609],
+ [10.73, 66.639],
+ [10.882, 65.645],
+ [10.932, 64.644],
+ [10.921, 64.359],
+ [10.628, 63.019],
+ [10.652, 62.344],
+ [13.82, -29.165],
+ [0.851, -74.655]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.964705942191, 0.564705882353, 0.298039215686, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [0, 0], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "shoulder",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 16,
+ "ty": 4,
+ "nm": "hand_B",
+ "parent": 15,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": {
+ "k": [
+ { "s": [-13.936], "t": 1, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.971], "t": 2, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.025], "t": 3, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.111], "t": 4, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.213], "t": 5, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.321], "t": 6, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.419], "t": 7, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.48], "t": 8, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.501], "t": 9, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.466], "t": 10, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.359], "t": 11, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.172], "t": 12, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.907], "t": 13, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.591], "t": 14, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.23], "t": 15, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.853], "t": 16, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.492], "t": 17, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.202], "t": 18, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.033], "t": 19, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.054], "t": 20, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.313], "t": 21, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.765], "t": 22, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.351], "t": 23, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.009], "t": 24, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-15.397], "t": 26, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-16.066], "t": 27, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-16.686], "t": 28, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-17.253], "t": 29, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-17.757], "t": 30, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-18.202], "t": 31, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-18.59], "t": 32, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-18.918], "t": 33, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.202], "t": 34, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.444], "t": 35, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.648], "t": 36, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.811], "t": 37, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.943], "t": 38, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-20.043], "t": 39, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-20.078], "t": 40, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-20.045], "t": 41, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.953], "t": 42, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.815], "t": 43, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.647], "t": 44, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.444], "t": 45, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.201], "t": 46, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-18.918], "t": 47, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-18.591], "t": 48, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-18.201], "t": 49, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-17.756], "t": 50, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-17.253], "t": 51, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-16.687], "t": 52, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-16.065], "t": 53, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-15.396], "t": 54, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.703], "t": 55, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.009], "t": 56, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.356], "t": 57, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.777], "t": 58, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.315], "t": 59, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.054], "t": 60, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.033], "t": 61, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.202], "t": 62, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.492], "t": 63, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.853], "t": 64, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.23], "t": 65, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.591], "t": 66, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.907], "t": 67, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.172], "t": 68, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.359], "t": 69, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.466], "t": 70, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.501], "t": 71, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.48], "t": 72, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.419], "t": 73, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.321], "t": 74, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.213], "t": 75, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.111], "t": 76, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-14.025], "t": 77, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.971], "t": 78, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.936], "t": 79, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } }
+ ]
+ },
+ "p": {
+ "k": [
+ { "s": [0.729, 64.281, 0], "t": 0, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } },
+ { "s": [0.729, 64.281, 0], "t": 80, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } }
+ ]
+ },
+ "a": { "a": 0, "k": [-16, -63.5, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "ef": [
+ {
+ "ty": 5,
+ "nm": "IK",
+ "np": 3,
+ "mn": "Pseudo/DUIK ik",
+ "ix": 1,
+ "en": 1,
+ "ef": [
+ {
+ "ty": 10,
+ "nm": "Controller",
+ "mn": "Pseudo/DUIK ik-0001",
+ "ix": 1,
+ "v": { "a": 0, "k": 2, "ix": 1 }
+ }
+ ]
+ }
+ ],
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0.336, 0],
+ [0.236, -0.017],
+ [0.33, -0.057],
+ [0.322, -0.089],
+ [0.311, -0.122],
+ [0.298, -0.152],
+ [0.282, -0.181],
+ [0.262, -0.208],
+ [0.241, -0.233],
+ [0.215, -0.255],
+ [0.189, -0.276],
+ [0.161, -0.294],
+ [0.13, -0.307],
+ [0.099, -0.32],
+ [0.067, -0.329],
+ [0.033, -0.332],
+ [0, -0.336],
+ [-0.015, -0.236],
+ [-0.058, -0.33],
+ [-0.069, -0.257],
+ [-0.054, -0.162],
+ [0, -0.002],
+ [-1.578, -6.508],
+ [-0.026, -0.463],
+ [0, -0.006],
+ [0, -0.005],
+ [-0.01, -0.137],
+ [-0.002, -0.026],
+ [-0.028, -0.164],
+ [-0.051, -0.186],
+ [-0.07, -0.18],
+ [-0.088, -0.173],
+ [-0.104, -0.163],
+ [-0.119, -0.151],
+ [-0.136, -0.139],
+ [-0.147, -0.124],
+ [-0.16, -0.109],
+ [-0.17, -0.093],
+ [-0.178, -0.076],
+ [-0.184, -0.057],
+ [-0.189, -0.037],
+ [-0.192, -0.02],
+ [-0.194, 0.001],
+ [-0.136, 0.01],
+ [-0.191, 0.033],
+ [-0.186, 0.051],
+ [-0.18, 0.07],
+ [-0.173, 0.088],
+ [-0.163, 0.104],
+ [-0.151, 0.119],
+ [-0.138, 0.134],
+ [-0.125, 0.148],
+ [-0.109, 0.16],
+ [-0.093, 0.169],
+ [-0.074, 0.178],
+ [-0.057, 0.185],
+ [-0.039, 0.189],
+ [-0.019, 0.192],
+ [-0.001, 0.194],
+ [0.01, 0.136],
+ [0.004, 0.035],
+ [0.199, 0.56],
+ [0.164, 0.447],
+ [4.789, 21.349],
+ [1.045, 7.54],
+ [0.055, 0.204],
+ [-0.01, 0.333],
+ [-0.002, 0.057],
+ [0.031, 0.128],
+ [0.122, 0.313],
+ [0.152, 0.298],
+ [0.181, 0.281],
+ [0.208, 0.263],
+ [0.233, 0.24],
+ [0.255, 0.216],
+ [0.276, 0.189],
+ [0.294, 0.16],
+ [0.307, 0.13],
+ [0.32, 0.1],
+ [0.329, 0.066],
+ [0.332, 0.034]
+ ],
+ "o": [
+ [-0.237, 0.001],
+ [-0.334, 0.024],
+ [-0.329, 0.056],
+ [-0.322, 0.091],
+ [-0.312, 0.121],
+ [-0.299, 0.152],
+ [-0.281, 0.181],
+ [-0.263, 0.208],
+ [-0.239, 0.233],
+ [-0.216, 0.256],
+ [-0.19, 0.277],
+ [-0.16, 0.293],
+ [-0.13, 0.308],
+ [-0.099, 0.32],
+ [-0.066, 0.327],
+ [-0.034, 0.334],
+ [-0.001, 0.237],
+ [0.025, 0.334],
+ [0.048, 0.262],
+ [0.05, 0.147],
+ [0, 0.001],
+ [5.943, 17.776],
+ [0.142, 0.355],
+ [0, 0.006],
+ [0, 0.005],
+ [0, 0.138],
+ [0.002, 0.026],
+ [0.014, 0.166],
+ [0.032, 0.19],
+ [0.052, 0.186],
+ [0.07, 0.181],
+ [0.088, 0.172],
+ [0.104, 0.163],
+ [0.121, 0.152],
+ [0.134, 0.138],
+ [0.149, 0.125],
+ [0.16, 0.11],
+ [0.17, 0.093],
+ [0.177, 0.075],
+ [0.185, 0.056],
+ [0.189, 0.039],
+ [0.193, 0.019],
+ [0.137, 0],
+ [0.193, -0.014],
+ [0.19, -0.032],
+ [0.186, -0.052],
+ [0.181, -0.07],
+ [0.172, -0.088],
+ [0.163, -0.104],
+ [0.15, -0.12],
+ [0.139, -0.135],
+ [0.125, -0.149],
+ [0.109, -0.159],
+ [0.092, -0.17],
+ [0.075, -0.178],
+ [0.057, -0.185],
+ [0.038, -0.189],
+ [0.02, -0.193],
+ [0, -0.137],
+ [-0.004, -0.035],
+ [-0.242, -0.695],
+ [-0.241, -0.678],
+ [-5.387, -13.967],
+ [-4.825, -21.157],
+ [-0.023, -0.169],
+ [-0.13, -0.481],
+ [0.001, -0.05],
+ [-0.026, -0.129],
+ [-0.091, -0.323],
+ [-0.121, -0.312],
+ [-0.152, -0.298],
+ [-0.181, -0.282],
+ [-0.208, -0.262],
+ [-0.233, -0.241],
+ [-0.256, -0.216],
+ [-0.277, -0.188],
+ [-0.293, -0.16],
+ [-0.308, -0.131],
+ [-0.32, -0.098],
+ [-0.327, -0.067],
+ [-0.334, -0.034]
+ ],
+ "v": [
+ [-15.839, -73.18],
+ [-16.549, -73.153],
+ [-17.546, -73.032],
+ [-18.524, -72.814],
+ [-19.475, -72.494],
+ [-20.391, -72.085],
+ [-21.264, -71.586],
+ [-22.078, -71.001],
+ [-22.834, -70.339],
+ [-23.516, -69.606],
+ [-24.124, -68.807],
+ [-24.65, -67.95],
+ [-25.087, -67.05],
+ [-25.43, -66.107],
+ [-25.679, -65.133],
+ [-25.827, -64.143],
+ [-25.878, -63.137],
+ [-25.855, -62.428],
+ [-25.73, -61.43],
+ [-25.555, -60.651],
+ [-25.2, -59.509],
+ [-25.196, -59.501],
+ [14.051, 65.928],
+ [14.281, 67.35],
+ [14.281, 67.365],
+ [14.281, 67.381],
+ [14.296, 67.794],
+ [14.304, 67.872],
+ [14.366, 68.367],
+ [14.491, 68.932],
+ [14.674, 69.482],
+ [14.912, 70.012],
+ [15.2, 70.514],
+ [15.535, 70.986],
+ [15.921, 71.422],
+ [16.342, 71.816],
+ [16.806, 72.167],
+ [17.301, 72.471],
+ [17.823, 72.724],
+ [18.365, 72.923],
+ [18.926, 73.063],
+ [19.499, 73.153],
+ [20.079, 73.18],
+ [20.488, 73.164],
+ [21.065, 73.094],
+ [21.63, 72.969],
+ [22.18, 72.786],
+ [22.71, 72.549],
+ [23.212, 72.26],
+ [23.684, 71.925],
+ [24.117, 71.543],
+ [24.514, 71.118],
+ [24.865, 70.655],
+ [25.169, 70.164],
+ [25.418, 69.641],
+ [25.617, 69.096],
+ [25.761, 68.535],
+ [25.847, 67.962],
+ [25.878, 67.381],
+ [25.862, 66.972],
+ [25.851, 66.867],
+ [25.025, 64.365],
+ [24.027, 61.337],
+ [8.665, -18.871],
+ [-5.684, -62.853],
+ [-5.808, -63.422],
+ [-6.101, -64.762],
+ [-6.077, -65.437],
+ [-6.163, -65.822],
+ [-6.483, -66.777],
+ [-6.892, -67.693],
+ [-7.391, -68.562],
+ [-7.975, -69.38],
+ [-8.638, -70.132],
+ [-9.37, -70.818],
+ [-10.169, -71.426],
+ [-11.027, -71.948],
+ [-11.927, -72.385],
+ [-12.87, -72.732],
+ [-13.844, -72.977],
+ [-14.834, -73.129]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [1, 0.600000023842, 0.333333343267, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [0, 0], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "hand",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 17,
+ "ty": 4,
+ "nm": "foot_F",
+ "parent": 19,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": {
+ "k": [
+ { "s": [-2.933], "t": 0, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.504], "t": 1, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.405], "t": 2, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.043], "t": 3, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.309], "t": 4, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.198], "t": 5, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.734], "t": 6, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.949], "t": 7, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.869], "t": 8, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.515], "t": 9, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.097], "t": 10, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.96], "t": 11, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [4.068], "t": 12, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [6.417], "t": 13, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [9.001], "t": 14, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [11.812], "t": 15, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [14.821], "t": 16, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [17.963], "t": 17, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [21.087], "t": 18, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [23.883], "t": 19, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [25.579], "t": 20, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [25.255], "t": 21, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [24.062], "t": 22, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [22.539], "t": 23, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [20.859], "t": 24, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [19.096], "t": 25, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [17.29], "t": 26, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [15.479], "t": 27, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [13.697], "t": 28, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [11.973], "t": 29, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.348], "t": 30, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [8.857], "t": 31, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.542], "t": 32, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [6.448], "t": 33, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.621], "t": 34, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.125], "t": 35, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.014], "t": 36, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.376], "t": 37, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [6.265], "t": 38, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.606], "t": 39, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [8.562], "t": 40, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [11.628], "t": 41, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [11.541], "t": 42, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [11.264], "t": 43, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.849], "t": 44, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.352], "t": 45, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [9.8], "t": 46, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [9.208], "t": 47, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [8.582], "t": 48, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.928], "t": 49, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.256], "t": 50, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [6.569], "t": 51, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.87], "t": 52, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [4.46], "t": 54, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [3.76], "t": 55, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [3.073], "t": 56, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.411], "t": 57, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.791], "t": 58, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.253], "t": 59, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.898], "t": 60, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.769], "t": 61, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.705], "t": 62, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.674], "t": 63, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.659], "t": 64, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.652], "t": 65, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.647], "t": 66, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.64], "t": 67, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.626], "t": 68, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.607], "t": 69, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.581], "t": 70, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.551], "t": 71, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.515], "t": 72, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.473], "t": 73, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.429], "t": 74, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.386], "t": 75, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.345], "t": 76, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.904], "t": 77, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.595], "t": 78, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.872], "t": 79, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.933], "t": 80, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } }
+ ]
+ },
+ "p": {
+ "k": [
+ { "s": [2.445, 108.019, 0], "t": 0, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } },
+ { "s": [2.445, 108.019, 0], "t": 80, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } }
+ ]
+ },
+ "a": { "a": 0, "k": [500.218, 865.605, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "ef": [
+ {
+ "ty": 5,
+ "nm": "IK",
+ "np": 3,
+ "mn": "Pseudo/DUIK ik",
+ "ix": 1,
+ "en": 1,
+ "ef": [
+ {
+ "ty": 10,
+ "nm": "Controller",
+ "mn": "Pseudo/DUIK ik-0001",
+ "ix": 1,
+ "v": { "a": 0, "k": 4, "ix": 1 }
+ }
+ ]
+ }
+ ],
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [0.2, 5.188],
+ [-0.998, 7.782],
+ [-2.594, 1.995],
+ [-1.596, -3.392],
+ [-1.596, -4.19],
+ [0, -5.986],
+ [-3.791, -3.192],
+ [-5.387, 1.197],
+ [-2.793, 1.596],
+ [-1.995, -1.596],
+ [2.594, -2.993],
+ [-3.392, 0],
+ [-0.2, 6.983],
+ [1.796, -2.195],
+ [5.986, 0.399],
+ [4.589, 1.397],
+ [1.197, 4.589],
+ [0.399, 7.582],
+ [3.591, 6.784],
+ [0, -6.584],
+ [1.197, -2.793],
+ [0, 0]
+ ],
+ "o": [
+ [-0.399, -4.988],
+ [-0.399, -10.974],
+ [0.599, -3.991],
+ [-0.2, 4.789],
+ [1.596, 3.392],
+ [1.596, 4.19],
+ [0, 5.986],
+ [2.793, 2.394],
+ [5.387, -1.197],
+ [0.2, 2.993],
+ [-3.591, 3.591],
+ [-2.394, 3.192],
+ [3.192, 0],
+ [1.596, -0.599],
+ [-1.796, 2.195],
+ [-3.392, -0.2],
+ [-4.589, -1.397],
+ [-1.197, -4.589],
+ [-0.399, -7.582],
+ [-3.192, 0.798],
+ [-0.2, 6.584],
+ [-0.798, 2.993],
+ [0, 0]
+ ],
+ "v": [
+ [-26.944, 40.865],
+ [-29.737, -9.815],
+ [-31.533, -36.551],
+ [-24.55, -46.927],
+ [-24.949, -37.349],
+ [-16.768, -18.195],
+ [-12.379, 7.544],
+ [-3.799, 25.302],
+ [11.565, 29.093],
+ [21.541, 25.701],
+ [24.135, 32.086],
+ [13.56, 36.276],
+ [16.353, 42.062],
+ [31.118, 36.475],
+ [29.322, 43.858],
+ [15.555, 46.851],
+ [-3.999, 44.057],
+ [-13.177, 36.475],
+ [-16.968, 13.131],
+ [-21.158, -16.2],
+ [-24.151, 0.561],
+ [-23.552, 40.266],
+ [-26.944, 40.865]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.1254902035, 0.156862750649, 0.278431385756, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [510.718, 915.889], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "path28",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ },
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [8.979, 5.986],
+ [-1.197, -0.798],
+ [-9.976, 2.394],
+ [1.397, -0.399]
+ ],
+ "o": [
+ [-9.777, 3.591],
+ [-1.197, -0.798],
+ [8.979, 5.786],
+ [1.796, -0.399],
+ [0, 0]
+ ],
+ "v": [
+ [16.424, 0.966],
+ [-17.097, -1.03],
+ [-15.501, -3.424],
+ [16.224, -1.628],
+ [16.424, 0.966]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.1254902035, 0.156862750649, 0.278431385756, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [513.84, 931.646], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "path26",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 2,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ },
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [0.399, 0.2],
+ [10.575, 6.784],
+ [0, 0.199],
+ [0, 0.2],
+ [0, 0.599],
+ [0, 0],
+ [0, 0],
+ [-5.188, 6.784],
+ [3.991, 9.577],
+ [-0.599, 0.998],
+ [0, -0.399],
+ [-11.972, 1.197],
+ [-0.599, -0.998],
+ [1.397, 0],
+ [7.582, -3.591],
+ [-9.577, -6.784],
+ [-0.2, -1.197]
+ ],
+ "o": [
+ [-0.399, 0],
+ [-10.176, -7.782],
+ [-0.2, -0.2],
+ [-0.2, 0],
+ [-0.2, -0.599],
+ [0, 0],
+ [0, 0],
+ [7.981, -3.392],
+ [-10.974, -1.397],
+ [0.599, -0.798],
+ [0.2, 0.2],
+ [4.789, 10.575],
+ [0.399, 0.998],
+ [-1.397, 0.2],
+ [-4.789, 7.183],
+ [9.976, 5.986],
+ [-0.399, 1.197],
+ [0, 0]
+ ],
+ "v": [
+ [21.449, 27.934],
+ [20.451, 27.734],
+ [-13.468, 11.373],
+ [-13.867, 10.774],
+ [-14.067, 10.575],
+ [-14.466, 8.979],
+ [-14.466, 8.979],
+ [-14.266, 8.779],
+ [5.088, -6.983],
+ [-21.449, -25.34],
+ [-19.653, -27.934],
+ [-19.254, -27.335],
+ [11.672, -9.777],
+ [13.069, -6.983],
+ [8.879, -6.584],
+ [-10.076, 9.976],
+ [21.449, 24.342],
+ [21.449, 27.934]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.1254902035, 0.156862750649, 0.278431385756, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [508.216, 895.1], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "path24",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 3,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ },
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [0.25, -0.018],
+ [0.35, -0.059],
+ [0.341, -0.095],
+ [0.331, -0.128],
+ [0.001, 0],
+ [0.316, -0.16],
+ [0.298, -0.19],
+ [0.001, 0],
+ [0.278, -0.219],
+ [0.254, -0.247],
+ [0.228, -0.27],
+ [0.001, 0],
+ [0.2, -0.291],
+ [0.169, -0.31],
+ [0.138, -0.326],
+ [0.104, -0.338],
+ [0.001, 0],
+ [0.008, -0.03],
+ [0, 0],
+ [-0.346, -9.158],
+ [0, -11.373],
+ [-15.164, -3.192],
+ [-0.998, 6.784],
+ [1.995, 8.779],
+ [5.786, 17.758],
+ [1.983, 9.456],
+ [0.024, 0.122],
+ [0.078, 0.332],
+ [0.12, 0.307],
+ [0.16, 0.315],
+ [0.192, 0.298],
+ [0.221, 0.277],
+ [0, 0.001],
+ [0.247, 0.253],
+ [0.272, 0.227],
+ [0.292, 0.199],
+ [0.001, 0],
+ [0.311, 0.171],
+ [0.327, 0.137],
+ [0.001, 0],
+ [0.338, 0.104],
+ [0.348, 0.07],
+ [0.353, 0.036],
+ [0.354, 0.001],
+ [0.001, 0]
+ ],
+ "o": [
+ [-0.251, 0],
+ [-0.354, 0.024],
+ [-0.349, 0.061],
+ [-0.342, 0.095],
+ [-0.001, 0],
+ [-0.33, 0.128],
+ [-0.315, 0.16],
+ [-0.001, 0],
+ [-0.298, 0.191],
+ [-0.278, 0.22],
+ [-0.254, 0.246],
+ [-0.001, 0],
+ [-0.228, 0.27],
+ [-0.199, 0.292],
+ [-0.17, 0.31],
+ [-0.137, 0.326],
+ [-0.001, 0],
+ [-0.008, 0.03],
+ [0, 0],
+ [-1.991, 7.476],
+ [0.599, 10.375],
+ [0, 11.573],
+ [15.164, 3.192],
+ [0.998, -6.784],
+ [-1.995, -8.979],
+ [-4.931, -15.134],
+ [-0.026, -0.121],
+ [-0.066, -0.335],
+ [-0.091, -0.316],
+ [-0.128, -0.329],
+ [-0.161, -0.315],
+ [-0.192, -0.297],
+ [0, -0.001],
+ [-0.22, -0.276],
+ [-0.248, -0.253],
+ [-0.271, -0.227],
+ [-0.001, 0],
+ [-0.292, -0.201],
+ [-0.312, -0.169],
+ [-0.001, 0],
+ [-0.326, -0.137],
+ [-0.34, -0.104],
+ [-0.348, -0.071],
+ [-0.352, -0.036],
+ [-0.001, 0],
+ [0, 0]
+ ],
+ "v": [
+ [-12.641, -51.841],
+ [-13.393, -51.814],
+ [-14.449, -51.689],
+ [-15.485, -51.455],
+ [-16.495, -51.12],
+ [-16.499, -51.12],
+ [-17.469, -50.688],
+ [-18.389, -50.162],
+ [-18.393, -50.162],
+ [-19.258, -49.546],
+ [-20.057, -48.844],
+ [-20.782, -48.069],
+ [-20.786, -48.069],
+ [-21.429, -47.227],
+ [-21.982, -46.323],
+ [-22.446, -45.368],
+ [-22.808, -44.371],
+ [-22.812, -44.371],
+ [-22.836, -44.281],
+ [-22.917, -44.336],
+ [-29.363, -26.799],
+ [-17.789, 4.529],
+ [-0.03, 49.621],
+ [29.299, 46.43],
+ [19.922, 37.049],
+ [11.54, -10.038],
+ [-2.111, -42.769],
+ [-2.224, -43.127],
+ [-2.4, -44.145],
+ [-2.715, -45.08],
+ [-3.148, -46.046],
+ [-3.678, -46.966],
+ [-4.297, -47.827],
+ [-4.297, -47.831],
+ [-4.999, -48.626],
+ [-5.778, -49.347],
+ [-6.624, -49.986],
+ [-6.628, -49.986],
+ [-7.532, -50.544],
+ [-8.491, -51.003],
+ [-8.495, -51.003],
+ [-9.492, -51.366],
+ [-10.525, -51.627],
+ [-11.577, -51.787],
+ [-12.637, -51.841],
+ [-12.641, -51.841]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.964705942191, 0.564705882353, 0.298039215686, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [512.537, 906.735], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "path944",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 4,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 18,
+ "ty": 4,
+ "nm": "hip_F",
+ "parent": 9,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": {
+ "k": [
+ { "s": [12.859], "t": 0, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [11.636], "t": 1, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [9.112], "t": 2, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [6.222], "t": 3, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [3.254], "t": 4, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.306], "t": 5, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.593], "t": 6, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.445], "t": 7, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-8.256], "t": 8, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.036], "t": 9, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.795], "t": 10, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-16.541], "t": 11, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.28], "t": 12, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-22.009], "t": 13, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-24.724], "t": 14, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-27.401], "t": 15, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-30.006], "t": 16, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-32.484], "t": 17, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-34.764], "t": 18, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-36.765], "t": 19, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-38.376], "t": 20, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-39.835], "t": 21, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-41.189], "t": 22, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-42.217], "t": 23, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-42.861], "t": 24, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-43.128], "t": 25, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-43.047], "t": 26, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-42.651], "t": 27, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-41.968], "t": 28, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-41.028], "t": 29, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-39.848], "t": 30, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-38.442], "t": 31, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-36.819], "t": 32, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-34.98], "t": 33, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-32.925], "t": 34, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-30.641], "t": 35, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-28.126], "t": 36, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-25.352], "t": 37, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-22.35], "t": 38, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-19.363], "t": 39, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-17.669], "t": 40, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.973], "t": 41, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.846], "t": 42, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.506], "t": 43, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-13.009], "t": 44, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-12.413], "t": 45, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.745], "t": 46, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-11.023], "t": 47, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-10.254], "t": 48, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-9.443], "t": 49, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-8.601], "t": 50, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-7.731], "t": 51, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-6.836], "t": 52, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-5.921], "t": 53, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.991], "t": 54, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-4.05], "t": 55, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-3.103], "t": 56, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-2.159], "t": 57, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-1.229], "t": 58, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [-0.339], "t": 59, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.439], "t": 60, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [1.238], "t": 61, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [2.178], "t": 62, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [3.177], "t": 63, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [4.204], "t": 64, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.245], "t": 65, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [6.288], "t": 66, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.326], "t": 67, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [8.354], "t": 68, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [9.366], "t": 69, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.352], "t": 70, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [11.306], "t": 71, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [12.22], "t": 72, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [13.088], "t": 73, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [13.897], "t": 74, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [14.635], "t": 75, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [15.289], "t": 76, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [13.195], "t": 77, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [12.839], "t": 78, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [12.82], "t": 79, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [12.859], "t": 80, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } }
+ ]
+ },
+ "p": {
+ "a": 1,
+ "k": [
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 0,
+ "s": [491.338, 486.99, 0],
+ "to": [6.167, 0, 0],
+ "ti": [0, 0, 0]
+ },
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 40,
+ "s": [528.338, 486.99, 0],
+ "to": [0, 0, 0],
+ "ti": [6.167, 0, 0]
+ },
+ { "t": 80, "s": [491.338, 486.99, 0] }
+ ],
+ "ix": 2
+ },
+ "a": { "a": 0, "k": [-0.5, -92.5, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "ef": [
+ {
+ "ty": 5,
+ "nm": "IK",
+ "np": 3,
+ "mn": "Pseudo/DUIK ik",
+ "ix": 1,
+ "en": 1,
+ "ef": [
+ {
+ "ty": 10,
+ "nm": "Controller",
+ "mn": "Pseudo/DUIK ik-0001",
+ "ix": 1,
+ "v": { "a": 0, "k": 4, "ix": 1 }
+ }
+ ]
+ }
+ ],
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [1.062, -0.042],
+ [0, 0],
+ [2.426, -23.15],
+ [0.108, -0.543],
+ [0.107, -0.477],
+ [0.006, -0.19],
+ [-0.034, -0.476],
+ [-0.114, -0.666],
+ [-0.181, -0.651],
+ [-0.245, -0.628],
+ [-0.306, -0.603],
+ [-0.364, -0.567],
+ [-0.419, -0.528],
+ [-0.471, -0.485],
+ [-0.516, -0.435],
+ [-0.557, -0.381],
+ [-0.593, -0.323],
+ [-0.622, -0.263],
+ [-0.645, -0.199],
+ [-0.661, -0.135],
+ [-0.671, -0.067],
+ [-0.675, 0],
+ [-0.477, 0.034],
+ [-0.665, 0.114],
+ [-0.651, 0.181],
+ [-0.629, 0.245],
+ [-0.602, 0.306],
+ [-0.567, 0.364],
+ [-0.53, 0.42],
+ [-0.484, 0.471],
+ [-0.435, 0.516],
+ [-0.381, 0.558],
+ [-0.323, 0.591],
+ [-0.263, 0.622],
+ [-0.199, 0.645],
+ [-0.098, 0.443],
+ [-0.147, 1.458],
+ [-0.153, 1.803],
+ [-2.195, 25.539],
+ [6.73, 0.277]
+ ],
+ "o": [
+ [-0.961, -0.04],
+ [-25.477, 1.01],
+ [5.041, 29.08],
+ [-0.071, 0.676],
+ [-0.086, 0.453],
+ [-0.012, 0.189],
+ [0, 0.477],
+ [0.047, 0.674],
+ [0.115, 0.666],
+ [0.181, 0.649],
+ [0.244, 0.63],
+ [0.306, 0.601],
+ [0.365, 0.567],
+ [0.42, 0.53],
+ [0.47, 0.484],
+ [0.516, 0.434],
+ [0.557, 0.381],
+ [0.593, 0.324],
+ [0.622, 0.263],
+ [0.645, 0.2],
+ [0.661, 0.133],
+ [0.672, 0.068],
+ [0.478, 0],
+ [0.673, -0.047],
+ [0.666, -0.115],
+ [0.651, -0.181],
+ [0.629, -0.244],
+ [0.601, -0.306],
+ [0.569, -0.365],
+ [0.529, -0.42],
+ [0.484, -0.47],
+ [0.435, -0.517],
+ [0.381, -0.556],
+ [0.324, -0.593],
+ [0.263, -0.622],
+ [0.128, -0.435],
+ [0.168, -1.519],
+ [0.196, -1.94],
+ [1.596, -18.356],
+ [0.436, -5.587],
+ [0, 0]
+ ],
+ "v": [
+ [35.344, -100.045],
+ [32.308, -100.041],
+ [-45.807, -75.463],
+ [-24.768, 74.919],
+ [-24.857, 77.378],
+ [-25.368, 79.26],
+ [-25.395, 79.829],
+ [-25.344, 81.259],
+ [-25.103, 83.27],
+ [-24.658, 85.246],
+ [-24.019, 87.163],
+ [-23.193, 89.014],
+ [-22.188, 90.768],
+ [-21.011, 92.412],
+ [-19.674, 93.936],
+ [-18.193, 95.316],
+ [-16.584, 96.539],
+ [-14.857, 97.595],
+ [-13.034, 98.476],
+ [-11.132, 99.17],
+ [-9.172, 99.672],
+ [-7.173, 99.972],
+ [-5.15, 100.074],
+ [-3.716, 100.023],
+ [-1.709, 99.782],
+ [0.267, 99.337],
+ [2.188, 98.698],
+ [4.035, 97.872],
+ [5.789, 96.867],
+ [7.437, 95.69],
+ [8.957, 94.353],
+ [10.337, 92.872],
+ [11.56, 91.259],
+ [12.616, 89.536],
+ [13.497, 87.713],
+ [14.191, 85.811],
+ [14.53, 84.494],
+ [15.095, 79.813],
+ [15.847, 73.586],
+ [45.776, -91.822],
+ [35.344, -100.045]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.964705882353, 0.565204156614, 0.298869652842, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [0, 0], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "hip",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 19,
+ "ty": 4,
+ "nm": "leg_F",
+ "parent": 18,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": {
+ "k": [
+ { "s": [7.795], "t": 0, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [9.904], "t": 1, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [14.188], "t": 2, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [19.015], "t": 3, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [23.908], "t": 4, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [28.705], "t": 5, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [33.351], "t": 6, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [37.841], "t": 7, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [42.169], "t": 8, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [46.334], "t": 9, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [50.336], "t": 10, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [54.159], "t": 11, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [57.787], "t": 12, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [61.19], "t": 13, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [64.334], "t": 14, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [67.159], "t": 15, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [69.602], "t": 16, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [71.592], "t": 17, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [73.074], "t": 18, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [74.033], "t": 19, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [74.519], "t": 20, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [74.636], "t": 21, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [74.203], "t": 22, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [73.15], "t": 23, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [71.526], "t": 24, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [69.416], "t": 25, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [66.903], "t": 26, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [64.049], "t": 27, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [60.901], "t": 28, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [57.499], "t": 29, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [53.86], "t": 30, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [49.997], "t": 31, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [45.914], "t": 32, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [41.602], "t": 33, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [37.057], "t": 34, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [32.249], "t": 35, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [27.172], "t": 36, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [21.779], "t": 37, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [16.125], "t": 38, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [10.632], "t": 39, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.554], "t": 40, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.807], "t": 41, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [0.807], "t": 76, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [5.666], "t": 77, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.114], "t": 78, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.675], "t": 79, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } },
+ { "s": [7.795], "t": 80, "i": { "x": [1], "y": [1] }, "o": { "x": [0], "y": [0] } }
+ ]
+ },
+ "p": {
+ "k": [
+ { "s": [-5.06, 79.72, 0], "t": 0, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } },
+ { "s": [-5.06, 79.72, 0], "t": 80, "i": { "x": 1, "y": 1 }, "o": { "x": 0, "y": 0 } }
+ ]
+ },
+ "a": { "a": 0, "k": [5, -98.375, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "ef": [
+ {
+ "ty": 5,
+ "nm": "IK",
+ "np": 3,
+ "mn": "Pseudo/DUIK ik",
+ "ix": 1,
+ "en": 1,
+ "ef": [
+ {
+ "ty": 10,
+ "nm": "Controller",
+ "mn": "Pseudo/DUIK ik-0001",
+ "ix": 1,
+ "v": { "a": 0, "k": 4, "ix": 1 }
+ }
+ ]
+ }
+ ],
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 0,
+ "k": {
+ "i": [
+ [0, 0],
+ [0.476, -0.034],
+ [0.666, -0.115],
+ [0.651, -0.181],
+ [0.629, -0.245],
+ [0.602, -0.306],
+ [0.567, -0.364],
+ [0.53, -0.42],
+ [0.484, -0.471],
+ [0.435, -0.516],
+ [0.381, -0.557],
+ [0.323, -0.593],
+ [0.263, -0.622],
+ [0.199, -0.645],
+ [0.082, -0.36],
+ [0.108, -0.543],
+ [0.107, -0.477],
+ [-1.534, -32.592],
+ [0.998, -11.573],
+ [0.189, -0.892],
+ [0.089, -0.334],
+ [0, 0],
+ [0.038, -0.158],
+ [0.053, -0.284],
+ [0.056, -0.25],
+ [0.001, -0.1],
+ [-0.018, -0.249],
+ [-0.059, -0.348],
+ [-0.095, -0.34],
+ [-0.13, -0.329],
+ [-0.159, -0.315],
+ [-0.001, -0.001],
+ [-0.192, -0.296],
+ [-0.221, -0.277],
+ [-0.246, -0.255],
+ [-0.272, -0.227],
+ [-0.001, -0.001],
+ [-0.292, -0.199],
+ [-0.312, -0.169],
+ [-0.327, -0.137],
+ [-0.34, -0.105],
+ [-0.348, -0.07],
+ [-0.352, -0.036],
+ [-0.355, 0],
+ [-0.252, 0.018],
+ [-0.35, 0.06],
+ [-0.341, 0.094],
+ [-0.331, 0.128],
+ [-0.316, 0.16],
+ [-0.3, 0.191],
+ [-0.277, 0.221],
+ [-0.001, 0],
+ [-0.254, 0.246],
+ [-0.228, 0.27],
+ [-0.001, 0],
+ [-0.2, 0.292],
+ [-0.17, 0.31],
+ [-0.137, 0.324],
+ [0, 0.001],
+ [-0.105, 0.337],
+ [-0.052, 0.232],
+ [-0.077, 0.763],
+ [0, 0],
+ [0.018, 0.248],
+ [0.041, 0.259],
+ [0.024, 0.122],
+ [0.078, 0.332],
+ [0, 1.277],
+ [-2.195, 23.145],
+ [-2.521, 22.851],
+ [-0.147, 1.458],
+ [0.033, 0.472],
+ [0.114, 0.665],
+ [0.181, 0.651],
+ [0.245, 0.629],
+ [0.306, 0.602],
+ [0.364, 0.567],
+ [0.42, 0.53],
+ [0.471, 0.484],
+ [0.516, 0.435],
+ [0.557, 0.381],
+ [0.593, 0.324],
+ [0.622, 0.262],
+ [0.645, 0.201],
+ [0.661, 0.134],
+ [0.671, 0.068],
+ [0.675, 0]
+ ],
+ "o": [
+ [-0.477, 0],
+ [-0.674, 0.048],
+ [-0.666, 0.115],
+ [-0.651, 0.181],
+ [-0.629, 0.244],
+ [-0.601, 0.306],
+ [-0.569, 0.365],
+ [-0.529, 0.42],
+ [-0.484, 0.47],
+ [-0.434, 0.516],
+ [-0.381, 0.558],
+ [-0.324, 0.593],
+ [-0.263, 0.622],
+ [-0.102, 0.355],
+ [-0.071, 0.676],
+ [-0.086, 0.453],
+ [-2.637, 11.715],
+ [0.798, 19.354],
+ [-0.095, 1.102],
+ [-0.077, 0.362],
+ [0, 0],
+ [-0.045, 0.156],
+ [-0.037, 0.354],
+ [-0.046, 0.237],
+ [-0.004, 0.1],
+ [0, 0.25],
+ [0.024, 0.353],
+ [0.061, 0.348],
+ [0.096, 0.341],
+ [0.127, 0.329],
+ [0.001, 0.001],
+ [0.161, 0.314],
+ [0.192, 0.297],
+ [0.219, 0.278],
+ [0.248, 0.253],
+ [0.001, 0.001],
+ [0.271, 0.227],
+ [0.293, 0.199],
+ [0.312, 0.169],
+ [0.327, 0.139],
+ [0.34, 0.104],
+ [0.347, 0.071],
+ [0.354, 0.036],
+ [0.252, 0],
+ [0.354, -0.025],
+ [0.349, -0.059],
+ [0.342, -0.095],
+ [0.33, -0.128],
+ [0.318, -0.16],
+ [0.297, -0.192],
+ [0.001, 0],
+ [0.278, -0.219],
+ [0.254, -0.246],
+ [0.001, 0],
+ [0.228, -0.271],
+ [0.201, -0.292],
+ [0.169, -0.309],
+ [0, -0.001],
+ [0.139, -0.325],
+ [0.067, -0.228],
+ [0.092, -0.796],
+ [0, 0],
+ [0, -0.248],
+ [-0.022, -0.261],
+ [-0.026, -0.121],
+ [-0.066, -0.335],
+ [-0.276, -1.176],
+ [0, -11.972],
+ [1.209, -12.439],
+ [0.168, -1.519],
+ [0, -0.473],
+ [-0.047, -0.673],
+ [-0.115, -0.666],
+ [-0.181, -0.651],
+ [-0.244, -0.629],
+ [-0.306, -0.601],
+ [-0.365, -0.569],
+ [-0.42, -0.529],
+ [-0.47, -0.484],
+ [-0.516, -0.434],
+ [-0.557, -0.382],
+ [-0.593, -0.322],
+ [-0.622, -0.264],
+ [-0.645, -0.199],
+ [-0.661, -0.135],
+ [-0.672, -0.068],
+ [0, 0]
+ ],
+ "v": [
+ [4.91, -118.516],
+ [3.48, -118.465],
+ [1.469, -118.219],
+ [-0.507, -117.775],
+ [-2.428, -117.136],
+ [-4.275, -116.31],
+ [-6.029, -115.304],
+ [-7.677, -114.128],
+ [-9.197, -112.791],
+ [-10.577, -111.31],
+ [-11.8, -109.701],
+ [-12.856, -107.974],
+ [-13.737, -106.15],
+ [-14.431, -104.249],
+ [-14.708, -103.177],
+ [-14.797, -100.718],
+ [-15.308, -98.836],
+ [-24.972, -35.872],
+ [-7.214, 101.4],
+ [-7.833, 103.941],
+ [-8.153, 104.814],
+ [-8.071, 104.868],
+ [-8.196, 105.34],
+ [-8.239, 106.626],
+ [-8.507, 107.612],
+ [-8.515, 107.912],
+ [-8.488, 108.66],
+ [-8.363, 109.712],
+ [-8.13, 110.745],
+ [-7.791, 111.75],
+ [-7.362, 112.717],
+ [-7.358, 112.721],
+ [-6.828, 113.637],
+ [-6.208, 114.498],
+ [-5.511, 115.297],
+ [-4.731, 116.018],
+ [-4.727, 116.022],
+ [-3.882, 116.661],
+ [-2.974, 117.214],
+ [-2.015, 117.674],
+ [-1.014, 118.04],
+ [0.019, 118.301],
+ [1.067, 118.461],
+ [2.131, 118.516],
+ [2.887, 118.488],
+ [3.943, 118.36],
+ [4.98, 118.13],
+ [5.989, 117.795],
+ [6.96, 117.362],
+ [7.887, 116.836],
+ [8.748, 116.216],
+ [8.752, 116.216],
+ [9.551, 115.519],
+ [10.276, 114.743],
+ [10.28, 114.743],
+ [10.923, 113.898],
+ [11.48, 112.994],
+ [11.94, 112.043],
+ [11.94, 112.039],
+ [12.307, 111.045],
+ [12.486, 110.355],
+ [12.782, 107.904],
+ [12.774, 107.904],
+ [12.747, 107.16],
+ [12.653, 106.38],
+ [12.54, 106.022],
+ [12.365, 105.005],
+ [11.741, 101.4],
+ [16.527, -30.089],
+ [24.59, -93.602],
+ [25.155, -98.282],
+ [25.104, -99.701],
+ [24.862, -101.708],
+ [24.418, -103.684],
+ [23.779, -105.605],
+ [22.953, -107.452],
+ [21.948, -109.206],
+ [20.771, -110.854],
+ [19.434, -112.374],
+ [17.953, -113.754],
+ [16.344, -114.977],
+ [14.617, -116.037],
+ [12.793, -116.914],
+ [10.892, -117.612],
+ [8.932, -118.11],
+ [6.932, -118.414],
+ [4.91, -118.516]
+ ],
+ "c": true
+ },
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.964705882353, 0.565204156614, 0.298869652842, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [0, 0], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "leg",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ },
+ {
+ "ddd": 0,
+ "ind": 20,
+ "ty": 4,
+ "nm": "skirt_back",
+ "parent": 10,
+ "sr": 1,
+ "ks": {
+ "o": { "a": 0, "k": 100, "ix": 11 },
+ "r": { "a": 0, "k": 0, "ix": 10 },
+ "p": { "a": 0, "k": [5.735, 102.594, 0], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
+ },
+ "ao": 0,
+ "shapes": [
+ {
+ "ty": "gr",
+ "it": [
+ {
+ "ind": 0,
+ "ty": "sh",
+ "ix": 1,
+ "ks": {
+ "a": 1,
+ "k": [
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 0,
+ "s": [
+ {
+ "i": [
+ [0, 0],
+ [-8.779, 2.793],
+ [-16.561, -17.957],
+ [-18.755, -10.974],
+ [-13.568, 3.592],
+ [12.77, 4.589],
+ [8.181, 2.993],
+ [16.361, 0.399],
+ [23.145, 0.599],
+ [17.558, -11.573],
+ [1.995, -6.385],
+ [-16.162, 2.993]
+ ],
+ "o": [
+ [8.979, -1.596],
+ [23.345, -7.383],
+ [22.347, 24.342],
+ [22.347, 13.169],
+ [-9.577, -9.577],
+ [-8.38, -2.993],
+ [-15.563, -5.387],
+ [-23.345, -0.599],
+ [-20.95, -0.399],
+ [-5.587, 3.591],
+ [-6.983, 19.753],
+ [0, 0]
+ ],
+ "v": [
+ [-89.221, 23.763],
+ [-63.482, 13.986],
+ [8.148, 23.963],
+ [65.611, 18.376],
+ [125.698, 0.72],
+ [92.148, -13.748],
+ [67.806, -23.924],
+ [19.122, -30.109],
+ [-50.712, -31.705],
+ [-111.768, -20.731],
+ [-124.537, -5.567],
+ [-89.221, 23.763]
+ ],
+ "c": true
+ }
+ ]
+ },
+ {
+ "i": { "x": 0.667, "y": 1 },
+ "o": { "x": 0.333, "y": 0 },
+ "t": 40,
+ "s": [
+ {
+ "i": [
+ [0, 0],
+ [-14.709, 1.351],
+ [-21.386, 10.421],
+ [-11.791, 12.343],
+ [-18.798, 21.281],
+ [12.77, 4.589],
+ [8.181, 2.993],
+ [16.361, 0.399],
+ [23.145, 0.599],
+ [17.558, -11.573],
+ [1.995, -6.385],
+ [-16.162, 2.993]
+ ],
+ "o": [
+ [8.979, -1.596],
+ [20.212, -1.857],
+ [15.345, -7.477],
+ [16.666, -17.446],
+ [-9.577, -9.577],
+ [-8.38, -2.993],
+ [-15.563, -5.387],
+ [-23.345, -0.599],
+ [-20.95, -0.399],
+ [-5.587, 3.591],
+ [-6.983, 19.753],
+ [0, 0]
+ ],
+ "v": [
+ [-89.221, 23.763],
+ [-46.246, 32.239],
+ [14.569, 14.228],
+ [65.611, 18.376],
+ [125.698, 0.72],
+ [92.148, -13.748],
+ [67.806, -23.924],
+ [19.122, -30.109],
+ [-50.712, -31.705],
+ [-111.768, -20.731],
+ [-124.537, -5.567],
+ [-89.221, 23.763]
+ ],
+ "c": true
+ }
+ ]
+ },
+ {
+ "t": 80,
+ "s": [
+ {
+ "i": [
+ [0, 0],
+ [-8.779, 2.793],
+ [-16.561, -17.957],
+ [-18.755, -10.974],
+ [-13.568, 3.592],
+ [12.77, 4.589],
+ [8.181, 2.993],
+ [16.361, 0.399],
+ [23.145, 0.599],
+ [17.558, -11.573],
+ [1.995, -6.385],
+ [-16.162, 2.993]
+ ],
+ "o": [
+ [8.979, -1.596],
+ [23.345, -7.383],
+ [22.347, 24.342],
+ [22.347, 13.169],
+ [-9.577, -9.577],
+ [-8.38, -2.993],
+ [-15.563, -5.387],
+ [-23.345, -0.599],
+ [-20.95, -0.399],
+ [-5.587, 3.591],
+ [-6.983, 19.753],
+ [0, 0]
+ ],
+ "v": [
+ [-89.221, 23.763],
+ [-63.482, 13.986],
+ [8.148, 23.963],
+ [65.611, 18.376],
+ [125.698, 0.72],
+ [92.148, -13.748],
+ [67.806, -23.924],
+ [19.122, -30.109],
+ [-50.712, -31.705],
+ [-111.768, -20.731],
+ [-124.537, -5.567],
+ [-89.221, 23.763]
+ ],
+ "c": true
+ }
+ ]
+ }
+ ],
+ "ix": 2
+ },
+ "nm": "Path 1",
+ "mn": "ADBE Vector Shape - Group",
+ "hd": false
+ },
+ {
+ "ty": "fl",
+ "c": { "a": 0, "k": [0.466666668653, 0.054901961237, 0.172549024224, 1], "ix": 4 },
+ "o": { "a": 0, "k": 100, "ix": 5 },
+ "r": 1,
+ "bm": 0,
+ "nm": "Fill 1",
+ "mn": "ADBE Vector Graphic - Fill",
+ "hd": false
+ },
+ {
+ "ty": "tr",
+ "p": { "a": 0, "k": [0, 0], "ix": 2 },
+ "a": { "a": 0, "k": [0, 0], "ix": 1 },
+ "s": { "a": 0, "k": [100, 100], "ix": 3 },
+ "r": { "a": 0, "k": 0, "ix": 6 },
+ "o": { "a": 0, "k": 100, "ix": 7 },
+ "sk": { "a": 0, "k": 0, "ix": 4 },
+ "sa": { "a": 0, "k": 0, "ix": 5 },
+ "nm": "Transform"
+ }
+ ],
+ "nm": "skirt_back",
+ "np": 2,
+ "cix": 2,
+ "bm": 0,
+ "ix": 1,
+ "mn": "ADBE Vector Group",
+ "hd": false
+ }
+ ],
+ "ip": 0,
+ "op": 301,
+ "st": 0,
+ "bm": 0
+ }
+ ],
+ "markers": []
+}
diff --git a/emotion.d.ts b/emotion.d.ts
new file mode 100644
index 00000000..0abead72
--- /dev/null
+++ b/emotion.d.ts
@@ -0,0 +1,188 @@
+import "@emotion/react";
+import { string } from "prop-types";
+
+declare module "@emotion/react" {
+ export interface Theme {
+ isDarkMode: boolean;
+ colors: {
+ pink: {
+ primary: string;
+ };
+ purple?: {
+ light: string;
+ primary: string;
+ };
+ gray: {
+ dark: string;
+ primary: string;
+ medium: string;
+ light: string;
+ background: string;
+ };
+ black: {
+ primary: string;
+ medium: string;
+ light: string;
+ };
+ white: {
+ primary: string;
+ medium: string;
+ light: string;
+ };
+ blue: {
+ primary: string;
+ medium: string;
+ light: string;
+ };
+ brand: {
+ bright?: string;
+ primary: string;
+ secondary: string;
+ light: string;
+ };
+ todo: {
+ primary: string;
+ medium: string;
+ light: string;
+ };
+ design: {
+ primary: string;
+ medium: string;
+ light: string;
+ };
+ developed: {
+ primary: string;
+ medium: string;
+ light: string;
+ };
+ red: {
+ primary: string;
+ medium: string;
+ light: string;
+ };
+ };
+ gradients: {
+ rainbow: string;
+ pinkhaze: string;
+ };
+ fonts: {
+ body: {
+ monoBold: string;
+ monoBoldItalic: string;
+ monoItalic: string;
+ monoExtraLight: string;
+ monoExtraLightItalic: string;
+ monoSemiBold: string;
+ bold: string;
+ condensedMedium: string;
+ };
+ };
+ background: {
+ ambient: string;
+ brand: string;
+ yellow: string;
+ OmniscientPink: string;
+ AmbientVectors: string;
+ AmbientVectorsReversed: string;
+ };
+ effect: {
+ BrandGlow: {
+ boxShadow: string;
+ background: string;
+ };
+ BrandGlowPrimaryLG: {
+ background: string;
+ boxShadow: string;
+ };
+ BrandGlowPrimarySM: {
+ boxShadow: string;
+ background: string;
+ };
+ BrandGlowSecondarySM: {
+ boxShadow: string;
+ background: string;
+ };
+ Skeuomorphism: {
+ boxShadow: string;
+ background: string;
+ };
+ };
+ typography: {
+ titleXXL: {
+ fontFamily: string;
+ fontWeight: string;
+ fontSize: string;
+ lineHeight: string;
+ color: string;
+ };
+ titleXL: {
+ fontFamily: string;
+ fontWeight: string;
+ fontSize: string;
+ lineHeight: string;
+ color: string;
+ };
+ titleLG: {
+ fontFamily: string;
+ fontWeight: string;
+ fontSize: string;
+ lineHeight: string;
+ color: string;
+ };
+ titleMD: {
+ fontFamily: string;
+ fontWeight: string;
+ fontSize: string;
+ lineHeight: string;
+ color: string;
+ };
+ titleSM: {
+ fontFamily: string;
+ fontWeight: string;
+ fontSize: string;
+ lineHeight: string;
+ color: string;
+ };
+ bodyMD: {
+ fontFamily: string;
+ fontWeight: string;
+ fontSize: string;
+ lineHeight: string;
+ color: string;
+ };
+ bodySM: {
+ fontFamily: string;
+ fontWeight: string;
+ fontSize: string;
+ lineHeight: string;
+ color: string;
+ };
+ bodyXXS: {
+ fontFamily: string;
+ fontWeight: string;
+ fontSize: string;
+ lineHeight: string;
+ color: string;
+ };
+ };
+ breakpoints: {
+ values: {
+ ss: number;
+ xs: number;
+ sm: number;
+ md: number;
+ lg: number;
+ lgxl: number;
+ xl: number;
+ };
+ heights: {
+ xs: number;
+ sm: number;
+ md: number;
+ lg: number;
+ lgxl: number;
+ xl: number;
+ };
+ };
+ }
+}
diff --git a/eslintrc.js b/eslintrc.js
new file mode 100644
index 00000000..f2c6a886
--- /dev/null
+++ b/eslintrc.js
@@ -0,0 +1,58 @@
+module.exports = {
+ root: true, // Make sure eslint picks up the config at the root of the directory
+ parser: "@typescript-eslint/parser",
+ parserOptions: {
+ ecmaVersion: 2020, // Use the latest ecmascript standard
+ sourceType: "module", // Allows using import/export statements
+ ecmaFeatures: {
+ jsx: true // Enable JSX since we're using React
+ }
+ },
+ plugins: ["simple-import-sort"],
+
+ settings: {
+ react: {
+ version: "detect" // Automatically detect the react version
+ }
+ },
+ env: {
+ browser: true, // Enables browser globals like window and document
+ amd: true, // Enables require() and define() as global variables as per the amd spec.
+ node: true // Enables Node.js global variables and Node.js scoping.
+ },
+ extends: [
+ "eslint:recommended",
+ "plugin:react/recommended",
+ "plugin:jsx-a11y/recommended",
+ "plugin:prettier/recommended", // Make this the last element so prettier config overrides other formatting rules
+ "plugin:@typescript-eslint/eslint-recommended",
+ "plugin:@typescript-eslint/recommended",
+ "prettier/@typescript-eslint"
+ ],
+ rules: {
+ "prettier/prettier": ["error", {}, { usePrettierrc: true }], // Use our .prettierrc file as source
+ "react/react-in-jsx-scope": "off",
+ "prefer-const": [
+ "error",
+ {
+ destructuring: "any",
+ ignoreReadBeforeAssign: false
+ }
+ ],
+ "jsx-a11y/anchor-is-valid": [
+ "error",
+ {
+ components: ["Link"],
+ specialLink: ["hrefLeft", "hrefRight"],
+ aspects: ["invalidHref", "preferButton"]
+ }
+ ],
+ "prefer-const": [
+ "error",
+ {
+ destructuring: "any",
+ ignoreReadBeforeAssign: false
+ }
+ ]
+ }
+};
diff --git a/font/Bebas Neue/BebasNeue.otf b/font/Bebas Neue/BebasNeue.otf
new file mode 100644
index 00000000..c52c0002
Binary files /dev/null and b/font/Bebas Neue/BebasNeue.otf differ
diff --git a/font/Bebas/Bebas.ttf b/font/Bebas/Bebas.ttf
new file mode 100644
index 00000000..eaff4866
Binary files /dev/null and b/font/Bebas/Bebas.ttf differ
diff --git a/font/Roboto Condensed/RobotoCondensed-Bold.ttf b/font/Roboto Condensed/RobotoCondensed-Bold.ttf
new file mode 100644
index 00000000..69526f0e
Binary files /dev/null and b/font/Roboto Condensed/RobotoCondensed-Bold.ttf differ
diff --git a/font/Roboto Condensed/RobotoCondensed-BoldItalic.ttf b/font/Roboto Condensed/RobotoCondensed-BoldItalic.ttf
new file mode 100644
index 00000000..c329a77e
Binary files /dev/null and b/font/Roboto Condensed/RobotoCondensed-BoldItalic.ttf differ
diff --git a/font/Roboto Condensed/RobotoCondensed-Italic.ttf b/font/Roboto Condensed/RobotoCondensed-Italic.ttf
new file mode 100644
index 00000000..815d706e
Binary files /dev/null and b/font/Roboto Condensed/RobotoCondensed-Italic.ttf differ
diff --git a/font/Roboto Condensed/RobotoCondensed-Light.ttf b/font/Roboto Condensed/RobotoCondensed-Light.ttf
new file mode 100644
index 00000000..11d0ccaa
Binary files /dev/null and b/font/Roboto Condensed/RobotoCondensed-Light.ttf differ
diff --git a/font/Roboto Condensed/RobotoCondensed-LightItalic.ttf b/font/Roboto Condensed/RobotoCondensed-LightItalic.ttf
new file mode 100644
index 00000000..1b5771f1
Binary files /dev/null and b/font/Roboto Condensed/RobotoCondensed-LightItalic.ttf differ
diff --git a/font/Roboto Condensed/RobotoCondensed-Regular.ttf b/font/Roboto Condensed/RobotoCondensed-Regular.ttf
new file mode 100644
index 00000000..cf11d91f
Binary files /dev/null and b/font/Roboto Condensed/RobotoCondensed-Regular.ttf differ
diff --git a/font/Roboto/Roboto-Black.ttf b/font/Roboto/Roboto-Black.ttf
new file mode 100644
index 00000000..ce0e5b9b
Binary files /dev/null and b/font/Roboto/Roboto-Black.ttf differ
diff --git a/font/Roboto/Roboto-BlackItalic.ttf b/font/Roboto/Roboto-BlackItalic.ttf
new file mode 100644
index 00000000..5eb95c8a
Binary files /dev/null and b/font/Roboto/Roboto-BlackItalic.ttf differ
diff --git a/font/Roboto/Roboto-Bold.ttf b/font/Roboto/Roboto-Bold.ttf
new file mode 100644
index 00000000..0ab5e0b6
Binary files /dev/null and b/font/Roboto/Roboto-Bold.ttf differ
diff --git a/font/Roboto/Roboto-BoldItalic.ttf b/font/Roboto/Roboto-BoldItalic.ttf
new file mode 100644
index 00000000..589db77f
Binary files /dev/null and b/font/Roboto/Roboto-BoldItalic.ttf differ
diff --git a/font/Roboto/Roboto-Italic.ttf b/font/Roboto/Roboto-Italic.ttf
new file mode 100644
index 00000000..1741984c
Binary files /dev/null and b/font/Roboto/Roboto-Italic.ttf differ
diff --git a/font/Roboto/Roboto-Light.ttf b/font/Roboto/Roboto-Light.ttf
new file mode 100644
index 00000000..cd1cf72e
Binary files /dev/null and b/font/Roboto/Roboto-Light.ttf differ
diff --git a/font/Roboto/Roboto-LightItalic.ttf b/font/Roboto/Roboto-LightItalic.ttf
new file mode 100644
index 00000000..f94935f8
Binary files /dev/null and b/font/Roboto/Roboto-LightItalic.ttf differ
diff --git a/font/Roboto/Roboto-Medium.ttf b/font/Roboto/Roboto-Medium.ttf
new file mode 100644
index 00000000..e7c7bac8
Binary files /dev/null and b/font/Roboto/Roboto-Medium.ttf differ
diff --git a/font/Roboto/Roboto-MediumItalic.ttf b/font/Roboto/Roboto-MediumItalic.ttf
new file mode 100644
index 00000000..81b108f0
Binary files /dev/null and b/font/Roboto/Roboto-MediumItalic.ttf differ
diff --git a/hooks/index.ts b/hooks/index.ts
index ae9d0623..b79f377d 100644
--- a/hooks/index.ts
+++ b/hooks/index.ts
@@ -1,2 +1,9 @@
export * from "./usePosts";
export * from "./useProducts";
+export * from "./useOnClickOutside";
+export * from "./useStream";
+export * from "./useStreams";
+export * from "./useTracks";
+export * from "./useMenuLocation";
+export * from "./useMenuItems";
+export * from "./useVariants";
diff --git a/hooks/queryKeys.ts b/hooks/queryKeys.ts
new file mode 100644
index 00000000..43810b5a
--- /dev/null
+++ b/hooks/queryKeys.ts
@@ -0,0 +1,13 @@
+export enum QueryKeys {
+ CART = "CART",
+ PRODUCTS = "PRODUCTS",
+ PRODUCT = "PRODUCT",
+ TRACKS = "TRACKS",
+ MENU_LOCATIONS = "MENU_LOCATIONS",
+ MENU_LOCATION = "MENU_LOCATION",
+ MENU_ITEMS = "MENU_ITEMS",
+ MENU_ITEM = "MENU_ITEM",
+ STREAMS = "STREAMS",
+ STREAM = "STREAM",
+ TRACKS = "TRACKS"
+}
diff --git a/hooks/useCart/index.ts b/hooks/useCart/index.ts
new file mode 100644
index 00000000..9d96c361
--- /dev/null
+++ b/hooks/useCart/index.ts
@@ -0,0 +1,105 @@
+import { AddItem } from "@spree/storefront-api-v2-sdk/types/interfaces/endpoints/CartClass";
+import { IOrder } from "@spree/storefront-api-v2-sdk/types/interfaces/Order";
+import { useQuery } from "react-query";
+import { spreeClient } from "../../config/spree";
+import { QueryKeys } from "../queryKeys";
+
+export const showCart = async () => {
+ const storage = (await import("../../config/storage")).default;
+ const token = await storage.getToken();
+ if (token) {
+ const getCart = await spreeClient.cart.show(
+ { bearerToken: token.access_token },
+ {
+ include: "line_items"
+ }
+ );
+ if (getCart.isSuccess()) {
+ return getCart.success();
+ } else {
+ const newCart = await spreeClient.cart.create({ bearerToken: token.access_token });
+ if (newCart.isSuccess()) {
+ return newCart.success();
+ } else {
+ throw new Error(newCart.fail().message);
+ }
+ }
+ } else {
+ const guestOrderToken = await storage.getGuestOrderToken();
+ if (guestOrderToken) {
+ const response = await spreeClient.cart.show({ orderToken: guestOrderToken as any });
+ if (response.isSuccess()) {
+ console.log("cart: ", response.success());
+ return response.success();
+ } else {
+ throw new Error(response.fail().message);
+ }
+ } else {
+ const response = await spreeClient.cart.create();
+ if (response.isSuccess()) {
+ const result = response.success();
+ storage.setGuestOrderToken(result.data.attributes.token);
+ return result;
+ } else {
+ throw new Error(response.fail().message);
+ }
+ }
+ }
+};
+
+export const addItemToCart = async (item: AddItem) => {
+ const storage = (await import("../../config/storage")).default;
+ const orderToken = await storage.getToken();
+ if (!orderToken) {
+ const guestOrderToken = await storage.getGuestOrderToken();
+
+ if (guestOrderToken) {
+ const response = await spreeClient.cart.addItem(
+ { orderToken: guestOrderToken as any },
+ {
+ variant_id: item.variant_id,
+ quantity: item.quantity
+ }
+ );
+ if (response.isSuccess()) {
+ const result = response.success();
+ return response.success();
+ } else {
+ throw new Error(response.fail().message);
+ }
+ }
+
+ const response = await spreeClient.cart.create();
+
+ if (response.isSuccess()) {
+ const result = response.success();
+ const tokenString = result.data.attributes.token;
+ storage.setGuestOrderToken(tokenString as string);
+ const newToken = await storage.getGuestOrderToken();
+ if (newToken) {
+ const addResponse = await spreeClient.cart.addItem(newToken, {
+ variant_id: item.variant_id,
+ quantity: item.quantity
+ });
+ if (addResponse.isSuccess()) {
+ return addResponse.success();
+ } else {
+ throw new Error(addResponse.fail().message);
+ }
+ }
+ } else {
+ throw new Error(response.fail().message);
+ }
+ throw new Error("NO CART TOKENS FOUND, COULD NOT ADD ITEM");
+ }
+ const response = await spreeClient.cart.addItem({ bearerToken: orderToken.access_token }, item);
+ if (response.isSuccess()) {
+ return response.success();
+ } else {
+ throw new Error(response.fail().message);
+ }
+};
+
+export const useCart = () => {
+ return useQuery([QueryKeys.CART], () => showCart());
+};
diff --git a/hooks/useMenuItems/index.ts b/hooks/useMenuItems/index.ts
new file mode 100644
index 00000000..f0a637ae
--- /dev/null
+++ b/hooks/useMenuItems/index.ts
@@ -0,0 +1 @@
+export * from "./useMenuItems";
diff --git a/hooks/useMenuItems/useMenuItems.ts b/hooks/useMenuItems/useMenuItems.ts
new file mode 100644
index 00000000..a1b9ee03
--- /dev/null
+++ b/hooks/useMenuItems/useMenuItems.ts
@@ -0,0 +1,32 @@
+import { useQuery } from "react-query";
+import { IStream } from "../../typings/stream";
+import { QueryKeys } from "../queryKeys";
+
+const fetchMenuItems = async (id: number = 1) => {
+ const storage = (await import("../../config/storage")).default;
+ const apiUrl = process.env.SPREE_API_URL;
+ const token = process.env.SPREE_ACCESS_TOKEN;
+ const requestHeaders: HeadersInit = new Headers();
+ requestHeaders.set("Content-Type", "application/json;charset=UTF-8");
+ requestHeaders.set("X-Spree-Token", `${token}`);
+ const response = await fetch(`${apiUrl}/api/v1/menu_items?menu_location_id=${id}`, {
+ method: "GET",
+ headers: requestHeaders
+ })
+ .then((response) => {
+ if (!response.ok) throw new Error("Menu Items request failed");
+ else return response.json();
+ })
+ // .then((data) => console.log(data))
+ .catch((err) => {
+ console.log(err);
+ throw new Error("Menu Items request failed");
+ });
+ // console.log(response)
+ return response;
+};
+const useMenuItems = (id: number) => {
+ return useQuery([QueryKeys.MENU_ITEMS, id], () => fetchMenuItems(id));
+};
+
+export { useMenuItems, fetchMenuItems };
diff --git a/hooks/useMenuLocation/index.ts b/hooks/useMenuLocation/index.ts
new file mode 100644
index 00000000..1c80c652
--- /dev/null
+++ b/hooks/useMenuLocation/index.ts
@@ -0,0 +1 @@
+export * from "./useMenuLocation";
diff --git a/hooks/useMenuLocation/useMenuLocation.ts b/hooks/useMenuLocation/useMenuLocation.ts
new file mode 100644
index 00000000..19abefda
--- /dev/null
+++ b/hooks/useMenuLocation/useMenuLocation.ts
@@ -0,0 +1,32 @@
+import { useQuery } from "react-query";
+import { IStream } from "../../typings/stream";
+import { QueryKeys } from "../queryKeys";
+
+const fetchMenuLocation = async (id: number = 1) => {
+ const storage = (await import("../../config/storage")).default;
+ const apiUrl = process.env.SPREE_API_URL;
+ const token = process.env.SPREE_ACCESS_TOKEN;
+ const requestHeaders: HeadersInit = new Headers();
+ requestHeaders.set("Content-Type", "application/json;charset=UTF-8");
+ requestHeaders.set("X-Spree-Token", `${token}`);
+ const response = await fetch(`${apiUrl}/api/v1/menu_locations/${id}`, {
+ method: "GET",
+ headers: requestHeaders
+ })
+ .then((response) => {
+ if (!response.ok) throw new Error("Menu Location request failed");
+ else return response.json();
+ })
+ // .then((data) => console.log(data))
+ .catch((err) => {
+ console.log(err);
+ throw new Error("Menu Location request failed");
+ });
+ // console.log(response)
+ return response;
+};
+const useMenuLocation = (id: number) => {
+ return useQuery([QueryKeys.MENU_LOCATION, id], () => fetchMenuLocation(id));
+};
+
+export { useMenuLocation, fetchMenuLocation };
diff --git a/hooks/useOnClickOutside.ts b/hooks/useOnClickOutside.ts
new file mode 100644
index 00000000..1f1dfa1f
--- /dev/null
+++ b/hooks/useOnClickOutside.ts
@@ -0,0 +1,31 @@
+import { RefObject, useEffect } from "react";
+
+type AnyEvent = MouseEvent | TouchEvent;
+
+export function useOnClickOutside(
+ ref: RefObject,
+ handler: (event: AnyEvent) => void
+) {
+ useEffect(() => {
+ const listener = (event: AnyEvent) => {
+ const el = ref?.current;
+
+ // Do nothing if clicking ref's element or descendent elements
+ if (!el || el.contains(event.target as Node)) {
+ return;
+ }
+
+ handler(event);
+ };
+
+ document.addEventListener(`mousedown`, listener);
+ document.addEventListener(`touchstart`, listener);
+
+ return () => {
+ document.removeEventListener(`mousedown`, listener);
+ document.removeEventListener(`touchstart`, listener);
+ };
+
+ // Reload only if ref or handler changes
+ }, [ref, handler]);
+}
diff --git a/hooks/usePosts/index.ts b/hooks/usePosts/index.ts
index 9e2ad03a..cc057aed 100644
--- a/hooks/usePosts/index.ts
+++ b/hooks/usePosts/index.ts
@@ -2,9 +2,7 @@ import ky from "ky-universal";
import { useQuery } from "react-query";
const fetchPosts = async (limit = 10) => {
- const parsed: any[] = await ky(
- "https://jsonplaceholder.typicode.com/posts"
- ).json();
+ const parsed: any[] = await ky("https://jsonplaceholder.typicode.com/posts").json();
const result = parsed.filter((x) => x.id <= limit);
return result;
};
diff --git a/hooks/useProduct/index.ts b/hooks/useProduct/index.ts
new file mode 100644
index 00000000..d6342b7b
--- /dev/null
+++ b/hooks/useProduct/index.ts
@@ -0,0 +1,59 @@
+import { useQuery } from "react-query";
+import { IProduct } from "@spree/storefront-api-v2-sdk/types/interfaces/Product";
+import { spreeClient } from "../../config/spree";
+import { QueryKeys } from "../queryKeys";
+
+const fetchProduct = async (slug: string): Promise => {
+ const storage = (await import("../../config/storage")).default;
+ const token = await storage.getToken();
+
+ const spreeUrl = `${process.env.SPREE_API_URL}/api/v2/storefront/products/${slug}`;
+ let queryUrl = new URL(spreeUrl),
+ params: any = {
+ include:
+ "default_variant,variants,option_types,product_properties,taxons,images,variants.option_values"
+ };
+ Object.keys(params).forEach((key) => queryUrl.searchParams.append(key, params[key]));
+ const myHeaders = new Headers();
+ myHeaders.append("Content-Type", "application/json");
+ myHeaders.append("Authorization", token ? token.access_token : "");
+ const response = await fetch(queryUrl.toString(), {
+ method: "GET",
+ headers: myHeaders
+ })
+ .then((res) => {
+ // console.log(res.status);
+ if (res.status >= 200 && res.status <= 299) {
+ return res.json();
+ }
+ // else {
+ // // Promise.reject("Product request failed");
+ // // console.log("Uh oh RES: ", res.statusText);
+ // throw new Error(res.statusText);
+ // }
+ })
+ .catch((err) => {
+ // console.log("Uh oh ERR: ", err);
+ throw new Error(`Product request failed: ${err.statusText}`);
+ });
+
+ return response;
+
+ // const response = await spreeClient.products.show(
+ // {
+ // bearerToken: token ? token.access_token : undefined
+ // },
+ // slug
+ // );
+ // if (response.isSuccess()) {
+ // return response.success();
+ // } else {
+ // throw new Error("Product request failed");
+ // }
+};
+
+const useProduct = (id: string) => {
+ return useQuery([QueryKeys.PRODUCT, id], () => fetchProduct(id));
+};
+
+export { useProduct, fetchProduct };
diff --git a/hooks/useProducts/index.ts b/hooks/useProducts/index.ts
index 163d78a5..a29b26e3 100644
--- a/hooks/useProducts/index.ts
+++ b/hooks/useProducts/index.ts
@@ -1,25 +1,29 @@
import { useQuery } from "react-query";
-import { makeClient } from "@spree/storefront-api-v2-sdk";
import { IProducts } from "@spree/storefront-api-v2-sdk/types/interfaces/Product";
-// When using the SDK in a
-
+
+ {/* CHANGEME */}
+
+
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+ {/* CHANGEME */}
+
+ {/* CHANGEME */}
+
+
+
+
+
+
+
+
{/* */}
+
+
+
+<<<<<<< HEAD:components/MainMenu/readme.txt
+
+
+#
+
+
+>>>>>>> ba20c99:components/MainMenu/mobilemenu-readme.md
+ Home
+ About
+ Contact
+ Settings
+
+<<<<<<< HEAD:components/MainMenu/mainmenu-readme.md
+=======
+>>>>>>> @aaron.smulktis/develop:components/MainMenu/Mainmenu-readme.md
+>>>>>>> ba20c99:components/MainMenu/mobilemenu-readme.md
+
+.
+.
+.
+
+
+
+18.pcWrapClassName
+19.pcMenuItemClassName
+20.onMenuItemClick:(keyPath:string,key:string)=>void;
+menusData: [{pcIcon:()=>
+
+.
+.
+.
+
+
+
+3. right - The menu opens from the left by default.
+ To have it open from the right, use the right prop.
+ It's just a boolean so you don't need to specify a value.
+ Then set the position of the button using CSS.
+ example:
+ Loading...
; + } + + if (error) { + returnError {status}
; + } + + return ( + <> + ++ {songs[songIndex] && songs[songIndex].title} +
+ +
+ _playCurrentSong}
+ onPause={(e) => _pauseAudio}
+ volume={volume}
+ onVolumeChanged={handleChangeReverse}
+ // onSeeked={seekbarFunction}
+ muted={muted}
+ style={styles}
+ />
+
+
+ );
+ };
+
+ // const ChangeTheTime = () => {
+ // audioInput.currentTime = seekbarvalue.value;
+ // };
+
+ // _playPreviousSong = () => {
+ // if (index - 1 >= 0) {
+ // this.setState({ index: index + -1 }, () => {
+ // console.log(
+ // songs.length + " IF... Previous song index is ",
+ // index
+ // );
+ // });
+ // } else {
+ // this.setState({ index: songs.length - 1 }, () => {
+ // console.log(
+ // songs.length + " ELSE... Previous song index is ",
+ // index
+ // );
+ // });
+ // }
+ // };
+
+ // console.log("data: ", data?.data?.map((item: any, index: any) => item));
+ // console.log("data: ", data);
+
+ return (
+ <>
+ {/*
+
+ {isPlaying ? (
+
+
+ ) : (
+
+
+ )}
+
+
+
+
+
+
*/}
+ {songs && _renderSongPlayer()}
+
-
-
-
- )
- }
-}
-
-export default Popup
diff --git a/components/NotifyForm/NotifyForm.styles.tsx b/components/NotifyForm/NotifyForm.styles.tsx
new file mode 100644
index 00000000..58baae58
--- /dev/null
+++ b/components/NotifyForm/NotifyForm.styles.tsx
@@ -0,0 +1,115 @@
+import styled from "@emotion/styled/";
+
+//Emotion styling
+export const Container = styled.div`
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ width: 95%;
+ height: 175px;
+`;
+
+export const NotifyText = styled.div`
+ text-align: center;
+ width: 100%;
+ font-style: normal;
+ font-weight: 200;
+ font-size: 15px;
+ line-height: 19px;
+ color: ${(props) => props.theme.colors.black.primary};
+`;
+
+interface FormWrapperType {
+ index: number;
+}
+
+export const FormWrapper = styled.div
- this.setState({ ModalOpen: true })}
- />
-
-
-
-
- Hi There!
-
- this.setState({ ModalOpen: false })} />
-
-
+
+ );
+};
+
+// ElectronicSignaturesModal.propTypes = {
+// handleClose: PropTypes.func.isRequired,
+// };
diff --git a/components/POLTerms/FinancialPrivacyModal.css b/components/POLTerms/FinancialPrivacyModal.css
new file mode 100644
index 00000000..00b9dd2a
--- /dev/null
+++ b/components/POLTerms/FinancialPrivacyModal.css
@@ -0,0 +1,126 @@
+.fp-modal-container {
+ margin-right: 10px;
+}
+
+.fp-modal-btn-close {
+ cursor: pointer;
+ position: absolute;
+ top: 0;
+ right: 0;
+ margin-top: 17px;
+ margin-right: 20px;
+ width: 31px;
+ height: 31px;
+ background-size: cover;
+}
+
+.fp-modal-content-container {
+ margin: 20px 0;
+ padding: 15px;
+}
+
+.fp-modal-container ul li {
+ list-style: none;
+}
+
+.fp-modal-container ul li:before {
+ content: "";
+ display: inline-block;
+ margin-left: -25px;
+ margin-right: 5px;
+ height: 15px;
+ width: 15px;
+ background: url("/favicon.ico") no-repeat;
+ background-size: 100%;
+}
+
+.fp-modal-content-container .tuck-it-top {
+ margin-top: -6px;
+ border-top: none;
+}
+
+.fp-modal-content-container table {
+ width: 99%;
+ margin: 6px 0.5%;
+ border: 1px solid black;
+ border-spacing: 0px;
+ font-size: 16px;
+ color: black;
+}
+
+.fp-modal-content-container td {
+ padding: 5px 10px 5px 10px;
+ text-align: left;
+ vertical-align: top;
+ font-size: 12px;
+}
+
+.fp-modal-content-container tr:not(:last-child) td {
+ border-bottom: 1px solid black;
+}
+
+.fp-modal-content-container td:not(:last-child) {
+ border-right: 1px solid black;
+}
+
+.fp-modal-table-title {
+ font-size: 12px;
+}
+
+.fp-modal-table-title .left {
+ background-color: #000000;
+ color: #ffffff;
+ width: 27%;
+ font-size: 12px;
+}
+
+.fp-modal-table-title .right {
+ font-weight: 700;
+ width: 73%;
+ color: #000000;
+}
+
+.fp-modal-table-content {
+ font-size: 12px;
+ color: #000000;
+}
+
+.fp-modal-table-content.one-blue {
+ background-color: #00aed9;
+}
+
+.fp-modal-table-content.two .left {
+ background-color: #00aed9;
+ width: 27%;
+}
+
+.fp-modal-table-content.two .right {
+ width: 73%;
+}
+
+.fp-modal-table-content.three.title {
+ background-color: #00aed9;
+}
+
+.fp-modal-table-content.three .left {
+ width: 60%;
+ text-align: left;
+ vertical-align: top;
+}
+
+.fp-modal-table-content.three .middle {
+ width: 20%;
+ text-align: center;
+ vertical-align: middle;
+}
+
+.fp-modal-table-content.three .right {
+ width: 20%;
+ text-align: center;
+ vertical-align: middle;
+}
+
+.fp-revision-and-print {
+ text-align: right;
+ font-size: 14px;
+}
diff --git a/components/POLTerms/FinancialPrivacyModal.tsx b/components/POLTerms/FinancialPrivacyModal.tsx
new file mode 100644
index 00000000..27a0a4ba
--- /dev/null
+++ b/components/POLTerms/FinancialPrivacyModal.tsx
@@ -0,0 +1,77 @@
+/* eslint-disable no-console */
+import React from "react";
+
+// import { Close } from '@carvana/icons';
+
+export const PolFinancialPrivacyModal = () => {
+ const entityName = process.env.ENTITY_NAME;
+ const currYear = new Date().getFullYear();
+ return (
+
+ {/* handleClose} /> */}
+
+ + Please read this carefully and print a copy for your reference. +
+ +Definitions:
++ Aute commodo adipisicing cupidatat elit cupidatat proident. Culpa duis incididunt proident + excepteur. Et tempor aliqua dolor irure pariatur. Non sit esse cupidatat id aliquip tempor + ut ad. Duis aliqua consectetur ullamco elit aliquip non ad culpa. Dolore dolore amet id + culpa fugiat aliquip veniam aute fugiat sit amet elit eu nisi. Aute occaecat adipisicing + laborum velit quis magna. +
+ +Scope of consent:
++ Tempor nisi cillum deserunt ut ex. Incididunt proident voluptate ad sint dolore fugiat. + Eiusmod labore irure sint aute ipsum. Tempor ad eiusmod Lorem amet sint proident nostrud + aute cupidatat adipisicing. +
+ +How to update your contact information:
++ Deserunt ut sit sunt quis elit sint occaecat pariatur duis in consectetur Lorem consequat. + Fugiat irure enim ipsum elit excepteur. Ad sint laborum laboris duis voluptate pariatur + proident et do nostrud. Occaecat nisi sit sit ipsum duis anim cupidatat culpa do + adipisicing aute. +
+ +Obtaining paper copies:
++ Incididunt id dolore et anim duis cillum sint excepteur esse. Aute reprehenderit + consectetur cillum adipisicing ut duis commodo culpa adipisicing. Cupidatat nulla culpa + veniam occaecat est veniam ullamco sint nisi mollit laborum. +
+ +Withdrawing consent:
++ Culpa esse non et aute aliquip fugiat elit sunt occaecat mollit cupidatat ea cillum esse. + Labore nulla eiusmod sit irure quis anim mollit. Voluptate culpa ullamco esse veniam + incididunt culpa aliquip laborum consequat minim mollit. Officia reprehenderit commodo est + labore exercitation sit amet esse duis et adipisicing irure proident aute. Culpa enim + minim id velit ea anim ipsum mollit incididunt tempor pariatur velit. Amet exercitation do + nisi ea. Commodo commodo esse enim proident eiusmod enim ipsum velit sunt. +
++ Aliqua eiusmod amet veniam tempor quis exercitation eiusmod voluptate est sunt voluptate + nostrud. Duis dolor consequat consequat proident aliqua incididunt. Sunt aute magna + consequat elit nulla dolore sunt anim Lorem ullamco ullamco cupidatat. Proident minim + consequat incididunt cupidatat ullamco anim id duis occaecat minim elit cupidatat. Ad + consectetur nisi tempor do consequat incididunt cupidatat. Occaecat est excepteur amet id + pariatur aliquip aliquip anim aliquip occaecat fugiat. +
+ +Hardware and software requirements:
+ ++ In order to use Electronic signatures and Records and retain the electronic + Communications, you will need the following: +
+ +-
+
- A computer or mobile device with Internet or mobile connectivity. +
- + For website-based Communications, a current web browser that supports 128-bit + encryption. Minimum recommended browser standards are Microsoft Internet Explorer + version 11.0 and above (see{" "} + + http://www.microsoft.com/ie + + ), the current version of Microsoft Edge (see + + https://www.microsoft.com/en-us/windows/microsoft-edge + + ), the current version of Mozilla Firefox (see{" "} + + http://www.mozilla.com + + ), the current version of Apple Safari (see{" "} + + http://www.apple.com/safari + + ), or the current version of Google Chrome (see{" "} + + http://www.google.com/chrome + + ). The browser must have cookies enabled. + +
- Access to the email address used to create an account for {window.location}. +
- + Sufficient electronic storage capacity on your computer"s hard drive or other data + storage unit, to store copies of your records. + +
- + A printer that is capable of printing from your Internet browser and email software, if + you desire paper copies of your records. + +
- + An application that can view, save and print PDF files (such as Adobe Reader). You can + download a copy of Adobe Reader here:{" "} + + https://get.adobe.com/reader + + . + +
+ Elit sint non non cillum laborum. Excepteur aliquip laborum id tempor dolor pariatur + cillum quis excepteur id do magna duis incididunt. Veniam quis anim pariatur mollit est + adipisicing. Do irure id Lorem fugiat Lorem dolore do do. Anim ad amet fugiat officia + cillum nulla nulla fugiat. Aliqua aliquip veniam pariatur voluptate nostrud magna veniam + culpa proident commodo nulla ea. +
+ +Rev June 2018
+
+
+ );
+};
+
+// ElectronicSignaturesModal.propTypes = {
+// handleClose: PropTypes.func.isRequired,
+// };
diff --git a/components/POLTerms/index.ts b/components/POLTerms/index.ts
new file mode 100644
index 00000000..2baa07eb
--- /dev/null
+++ b/components/POLTerms/index.ts
@@ -0,0 +1,2 @@
+export { PolElectronicSignaturesModal } from "./ElectronicSignaturesModal";
+export { PolFinancialPrivacyModal } from "./FinancialPrivacyModal";
diff --git a/components/PostList/PostList.tsx b/components/PostList/PostList.tsx
new file mode 100644
index 00000000..953d7571
--- /dev/null
+++ b/components/PostList/PostList.tsx
@@ -0,0 +1,69 @@
+import React, { useState } from "react";
+import { usePosts } from "../../hooks/usePosts";
+import styled from "@emotion/styled";
+import { PostListProps } from "./types";
+
+const Section = styled.section`
+ padding-bottom: 20px;
+`;
+const Li = styled.li`
+ display: block;
+ margin-bottom: 10px;
+`;
+const MyDiv = styled.div`
+ align-items: center;
+ display: flex;
+`;
+const MyLink = styled.a`
+ font-size: 14px;
+ margin-right: 10px;
+ text-decoration: none;
+ padding-bottom: 0;
+ border: 0;
+`;
+const MySpan = styled.span`
+ font-size: 14px;
+ margin-right: 5px;
+`;
+const MyUl = styled.ul`
+ margin: 0;
+ padding: 0;
+`;
+const MyButton = styled.button`
+ &:before {
+ align-self: center;
+ border-style: solid;
+ border-width: 6px 4px 0 4px;
+ border-color: #ffffff transparent transparent transparent;
+ content: "";
+ height: 0;
+ margin-right: 5px;
+ width: 0;
+ }
+`;
+export const PostList: React.FC
+
+ Click HERE to Print
+
+
+ Rev May {currYear} +
+ + Rev May {currYear} +
+
+ + {entityName} respects the privacy of its website's users. The following company privacy + policy is designed to inform you, as a user of the website, about the types of information + that the company may gather from you in connection with your use of the website. +
++ BY USING OR ACCESSING THE WEBSITE, YOU ARE ACCEPTING THE PRACTICES DESCRIBED IN THIS + PRIVACY POLICY. +
++ The company may collect a range of personal information from and about the website's + users. +
++ That information may include each user's name, address, email addresses, telephone number + financial information such as your payment method (valid credit card number, type, + expiration date). +
++ The company uses the personal information in the file we maintain about you, and other + information we obtain from your current and past activities on the website. +
++ (1) to deliver the products that you have requested; (2) to manage your account and + provide you with customer support; (3) to communicate with you by email, telephone and/or + mobile devices about products that may be of interest to you; (4) to inform you of + updates; (5) to detect and protect us against error and fraud. We may use financial + information or payment method to process payment for any purchases made on the website. +
++ The company may in its sole discretion, change this Privacy Policy from time to time. Any + and all changes to the company's Privacy Policy will be reflected on this page. +
++ Unless stated otherwise, our current Privacy Policy applies to all information that we + have about you and your account. +
++ Users should regularly check this page for any changes to this Privacy Policy. However, + company may, as determined in its discretion, decide to notify users of changes made to + this Privacy Policy via email or otherwise. +
++ Accordingly, it is important that users always maintain and update their contact + information. +
++ The company recognizes that it must use customer information responsibly. Your information + is contained behind secured networks and is only accessible by a limited number of + persons, and they are required to keep the information confidential. +
+Loading
;
+
+ return (
+ Loading
;
-
- return (
- -
- {data?.map((post, index) => (
-
-
- - {index + 1}. - {post.title} --
- ))}
-
+ {property.attributes.name} : {property.attributes.value}
+
+ );
+ })}
+
+ );
+ }, [productProperties]);
+
+ const renderPackQtys = useCallback(() => {
+ return packQtys.map((i, index) => {
+ return (
+ {thisProduct?.data?.attributes?.name}
+ {renderVariantSwatches()} +{thisProduct?.data?.attributes?.description}
++ {wholesale &&
Price Per Pack
} +
+
+
+
+
+
+
+ )}
+
+
+ Model Info
+ {renderProperties()}
+
+ ${product.attributes.price}
+Loading
;
-
- return (
-
- {data?.data?.map((product, index) => {
- const source = `http://localhost:8080${
- data.included.find(
- (image) => image.id === product.relationships.images.data[0].id
- ).attributes.styles[2].url
- }`;
- return (
-
-
-
-
-
- );
- })}
- {product.attributes.name}
-
-
- ${product.attributes.price}
-{resetPasswordForm.title}
+Error {status}
++ + *Including, but not limited to, Bridgecrest Credit Company, GO Financial and + SilverRock Automotive. + +
Create your account so you can start browsing, saving, and getting deals!` + }; + }, []); + + return ( +
+ Free Shipping
+ (On your first order)
+
+
+ {shortName} Rewards
+ Cash back on purchases!
+
+
+ LiveStream Shopping
+
+ Chat it up with our models while they show off our new & trending products.
+
+
+ + + *Including, but not limited to, Bridgecrest Credit Company, GO Financial and + SilverRock Automotive. + +
Create your account, and you'll be surfing the latest trends in no-time.` + }; + }, []); + + return ( +
+ Free Shipping
+ (On your first order)
+
+
+ Keep Items Organized
+ Save favorites!
+
+
+ Easy Checkout
+ We accept all payment methods.
+
+ {signupForm.title}
+Need to fix something?
+Welcome! Let's get you started..
} +VALUE: {JSON.stringify(values, null, 2)}
+
+ );
+};
+
+// ElectronicSignaturesModal.propTypes = {
+// handleClose: PropTypes.func.isRequired,
+// };
diff --git a/components/Terms/FinancialPrivacyModal.css b/components/Terms/FinancialPrivacyModal.css
new file mode 100644
index 00000000..00b9dd2a
--- /dev/null
+++ b/components/Terms/FinancialPrivacyModal.css
@@ -0,0 +1,126 @@
+.fp-modal-container {
+ margin-right: 10px;
+}
+
+.fp-modal-btn-close {
+ cursor: pointer;
+ position: absolute;
+ top: 0;
+ right: 0;
+ margin-top: 17px;
+ margin-right: 20px;
+ width: 31px;
+ height: 31px;
+ background-size: cover;
+}
+
+.fp-modal-content-container {
+ margin: 20px 0;
+ padding: 15px;
+}
+
+.fp-modal-container ul li {
+ list-style: none;
+}
+
+.fp-modal-container ul li:before {
+ content: "";
+ display: inline-block;
+ margin-left: -25px;
+ margin-right: 5px;
+ height: 15px;
+ width: 15px;
+ background: url("/favicon.ico") no-repeat;
+ background-size: 100%;
+}
+
+.fp-modal-content-container .tuck-it-top {
+ margin-top: -6px;
+ border-top: none;
+}
+
+.fp-modal-content-container table {
+ width: 99%;
+ margin: 6px 0.5%;
+ border: 1px solid black;
+ border-spacing: 0px;
+ font-size: 16px;
+ color: black;
+}
+
+.fp-modal-content-container td {
+ padding: 5px 10px 5px 10px;
+ text-align: left;
+ vertical-align: top;
+ font-size: 12px;
+}
+
+.fp-modal-content-container tr:not(:last-child) td {
+ border-bottom: 1px solid black;
+}
+
+.fp-modal-content-container td:not(:last-child) {
+ border-right: 1px solid black;
+}
+
+.fp-modal-table-title {
+ font-size: 12px;
+}
+
+.fp-modal-table-title .left {
+ background-color: #000000;
+ color: #ffffff;
+ width: 27%;
+ font-size: 12px;
+}
+
+.fp-modal-table-title .right {
+ font-weight: 700;
+ width: 73%;
+ color: #000000;
+}
+
+.fp-modal-table-content {
+ font-size: 12px;
+ color: #000000;
+}
+
+.fp-modal-table-content.one-blue {
+ background-color: #00aed9;
+}
+
+.fp-modal-table-content.two .left {
+ background-color: #00aed9;
+ width: 27%;
+}
+
+.fp-modal-table-content.two .right {
+ width: 73%;
+}
+
+.fp-modal-table-content.three.title {
+ background-color: #00aed9;
+}
+
+.fp-modal-table-content.three .left {
+ width: 60%;
+ text-align: left;
+ vertical-align: top;
+}
+
+.fp-modal-table-content.three .middle {
+ width: 20%;
+ text-align: center;
+ vertical-align: middle;
+}
+
+.fp-modal-table-content.three .right {
+ width: 20%;
+ text-align: center;
+ vertical-align: middle;
+}
+
+.fp-revision-and-print {
+ text-align: right;
+ font-size: 14px;
+}
diff --git a/components/Terms/FinancialPrivacyModal.tsx b/components/Terms/FinancialPrivacyModal.tsx
new file mode 100644
index 00000000..f67fd8d7
--- /dev/null
+++ b/components/Terms/FinancialPrivacyModal.tsx
@@ -0,0 +1,361 @@
+/* eslint-disable no-console */
+import React from "react";
+
+// import { Close } from '@carvana/icons';
+
+export const FinancialPrivacyModal = () => {
+ return (
+
+ {/* handleClose} /> */}
+
+ + Please read this carefully and print a copy for your reference. +
+ +Definitions:
++ Aute commodo adipisicing cupidatat elit cupidatat proident. Culpa duis incididunt proident + excepteur. Et tempor aliqua dolor irure pariatur. Non sit esse cupidatat id aliquip tempor + ut ad. Duis aliqua consectetur ullamco elit aliquip non ad culpa. Dolore dolore amet id + culpa fugiat aliquip veniam aute fugiat sit amet elit eu nisi. Aute occaecat adipisicing + laborum velit quis magna. +
+ +Scope of consent:
++ Tempor nisi cillum deserunt ut ex. Incididunt proident voluptate ad sint dolore fugiat. + Eiusmod labore irure sint aute ipsum. Tempor ad eiusmod Lorem amet sint proident nostrud + aute cupidatat adipisicing. +
+ +How to update your contact information:
++ Deserunt ut sit sunt quis elit sint occaecat pariatur duis in consectetur Lorem consequat. + Fugiat irure enim ipsum elit excepteur. Ad sint laborum laboris duis voluptate pariatur + proident et do nostrud. Occaecat nisi sit sit ipsum duis anim cupidatat culpa do + adipisicing aute. +
+ +Obtaining paper copies:
++ Incididunt id dolore et anim duis cillum sint excepteur esse. Aute reprehenderit + consectetur cillum adipisicing ut duis commodo culpa adipisicing. Cupidatat nulla culpa + veniam occaecat est veniam ullamco sint nisi mollit laborum. +
+ +Withdrawing consent:
++ Culpa esse non et aute aliquip fugiat elit sunt occaecat mollit cupidatat ea cillum esse. + Labore nulla eiusmod sit irure quis anim mollit. Voluptate culpa ullamco esse veniam + incididunt culpa aliquip laborum consequat minim mollit. Officia reprehenderit commodo est + labore exercitation sit amet esse duis et adipisicing irure proident aute. Culpa enim + minim id velit ea anim ipsum mollit incididunt tempor pariatur velit. Amet exercitation do + nisi ea. Commodo commodo esse enim proident eiusmod enim ipsum velit sunt. +
++ Aliqua eiusmod amet veniam tempor quis exercitation eiusmod voluptate est sunt voluptate + nostrud. Duis dolor consequat consequat proident aliqua incididunt. Sunt aute magna + consequat elit nulla dolore sunt anim Lorem ullamco ullamco cupidatat. Proident minim + consequat incididunt cupidatat ullamco anim id duis occaecat minim elit cupidatat. Ad + consectetur nisi tempor do consequat incididunt cupidatat. Occaecat est excepteur amet id + pariatur aliquip aliquip anim aliquip occaecat fugiat. +
+ +Hardware and software requirements:
+ ++ In order to use Electronic signatures and Records and retain the electronic + Communications, you will need the following: +
+ +-
+
- A computer or mobile device with Internet or mobile connectivity. +
- + For website-based Communications, a current web browser that supports 128-bit + encryption. Minimum recommended browser standards are Microsoft Internet Explorer + version 11.0 and above (see{" "} + + http://www.microsoft.com/ie + + ), the current version of Microsoft Edge (see + + https://www.microsoft.com/en-us/windows/microsoft-edge + + ), the current version of Mozilla Firefox (see{" "} + + http://www.mozilla.com + + ), the current version of Apple Safari (see{" "} + + http://www.apple.com/safari + + ), or the current version of Google Chrome (see{" "} + + http://www.google.com/chrome + + ). The browser must have cookies enabled. + +
- Access to the email address used to create an account for {window.location}. +
- + Sufficient electronic storage capacity on your computer"s hard drive or other data + storage unit, to store copies of your records. + +
- + A printer that is capable of printing from your Internet browser and email software, if + you desire paper copies of your records. + +
- + An application that can view, save and print PDF files (such as Adobe Reader). You can + download a copy of Adobe Reader here:{" "} + + https://get.adobe.com/reader + + . + +
+ Elit sint non non cillum laborum. Excepteur aliquip laborum id tempor dolor pariatur + cillum quis excepteur id do magna duis incididunt. Veniam quis anim pariatur mollit est + adipisicing. Do irure id Lorem fugiat Lorem dolore do do. Anim ad amet fugiat officia + cillum nulla nulla fugiat. Aliqua aliquip veniam pariatur voluptate nostrud magna veniam + culpa proident commodo nulla ea. +
+ +Rev June 2018
+
+
+ );
+};
+
+// ElectronicSignaturesModal.propTypes = {
+// handleClose: PropTypes.func.isRequired,
+// };
diff --git a/components/Terms/index.ts b/components/Terms/index.ts
new file mode 100644
index 00000000..4cde03ce
--- /dev/null
+++ b/components/Terms/index.ts
@@ -0,0 +1,2 @@
+export { ElectronicSignaturesModal } from "./ElectronicSignaturesModal";
+export { FinancialPrivacyModal } from "./FinancialPrivacyModal";
diff --git a/components/TipBot/TipBot.styles.tsx b/components/TipBot/TipBot.styles.tsx
new file mode 100644
index 00000000..bed8b959
--- /dev/null
+++ b/components/TipBot/TipBot.styles.tsx
@@ -0,0 +1,162 @@
+import { keyframes } from "@emotion/react";
+import styled from "@emotion/styled";
+import { boolean } from "yup/lib/locale";
+
+const fadeInOut = keyframes`
+ 0% { opacity: 1; }
+ 50% { opacity: 0.25; margi }
+ 100% { opacity: 1; }
+`;
+
+const FadeInOut = styled.div`
+ animation: 0.33s ${fadeInOut} linear infinite;
+`;
+
+const width = 100;
+const height = width * 0.5;
+
+export const TipBotWrapper = styled.div`
+ position: relative;
+ top: -150px;
+ left: 0px;
+ ${"" /* width: 105%; */}
+`;
+
+export const TipBotImage = styled.div`
+ position: relative;
+ left: 50%;
+ margin-left: -24px;
+ bottom: -20px;
+ background: url("/tip-bot.png") no-repeat;
+ background-size: 48px 48px;
+ width: 48px;
+ height: 48px;
+
+ /* iPhone 6,7,8 Portrait ------- */
+ @media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation: portrait) {
+ position: absolute;
+ left: 0px;
+ bottom: -130px;
+ }
+
+ /* iPhone 11 Portrait ------------ */
+ @media only screen and (device-width: 414px) and (device-height: 896px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2) {
+ position: absolute;
+ left: 0px;
+ bottom: -130px;
+ }
+
+ /* iPhone X Portrait ----------- */
+ @media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait) {
+ position: absolute;
+ left: 0px;
+ bottom: -130px;
+ }
+
+ /* iPad Mini Portrait ------------ */
+ @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
+ position: absolute;
+ left: 0px;
+ bottom: -130px;
+ }
+
+ @media only screen and (max-width: ${(props: any) => props.theme.breakpoints.values.sm}px) {
+ position: absolute;
+ ${
+ "" /* left: 25px;
+ bottom: -35px; */
+ }
+ left: 0px;
+ bottom: -130px;
+ }
+`;
+
+export const BubbleWrapper = styled.div`
+ border-radius: 8px;
+ border: 1px solid ${(props: any) => props.theme.colors.gray.medium};
+ background: ${(props: any) => props.theme.colors.white.primary};
+ margin: 0 0 -35px 0;
+ padding: 15px;
+ &:after {
+ display: block;
+ position: relative;
+ left: 80px;
+ bottom: -30px;
+ content: " ";
+ background: url("images/bubble-arrow.svg") no-repeat;
+ background-size: 29px 16px;
+ width: 29px;
+ height: 16px;
+ }
+`;
+
+interface BubbleWrapperMobileType {
+ speechReady: boolean;
+}
+
+export const BubbleWrapperMobile = styled.div
+
+ Click HERE to Print
+
+
+ Rev May 2018 +
+ + Rev May 2018 +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ | F A C T S | +WHAT DO WE DO WITH YOUR PERSONAL INFORMATION? | +
| Why? | ++ Financial companies choose how they share your personal information. Federal law + gives consumers the right to limit some but not all sharing. Federal law also + requires us to tell you how we collect, share, and protect your personal + information. Please read this notice carefully to understand what we do. + | +
| What? | +
+ The types of personal information we collect and share depend on the product or
+ service you have with us. This information can include:
+
|
+
| How? | ++ All financial companies need to share customers' personal information to run their + everyday business. In the section below, we list the reasons financial companies can + share their customers' personal information; the reasons {process.env.SITE_TITLE}{" "} + chooses to share; and whether you can limit this sharing. + | +
| Reasons we can share your personal information | +Do we share? | +Can you limit this sharing? | +
|
+ + For our every day business purposes – + + such as to process your transactions, maintain your account(s), respond to court + orders and legal investigations, or report to credit bureaus + |
+ Yes | +No | +
|
+ + For our marketing purposes – + + to offer our products and services to you + |
+ Yes | +No | +
|
+ + For joint marketing with other financial companies + + |
+ Yes | +No | +
|
+ + For our affiliates' everyday business purposes – + + information about your transactions and experiences + |
+ Yes | +No | +
|
+ + For our affiliates' everyday business purposes – + + information about your creditworthiness + |
+ Yes | +Yes | +
|
+ + For our affiliates to market to you + + |
+ Yes | +Yes | +
|
+ + For nonaffiliates to market to you + + |
+ Yes | +Yes | +
| To limit our sharing | +
+
+ Please note: If you are a new customer, we can begin sharing your + information 30 days from the date we sent this notice. When you are no longer our + customer, we continue to share your information as described in this notice. + +However, you can contact us at any time to limit our sharing. + |
+
| Questions? | ++ Call {process.env.COMPANY_PHONE} or go to{" "} + www.{process.env.COMPANY_LEGAL_URL} + | +
| + Who we are + | +|
| + Who is providing this notice? + | ++ {process.env.SITE_TITLE} + | +
| + What we do + | +|
| + How do we protect your personal information? + | ++ To protect your personal information from unauthorized access and use, we use + security measures that comply with federal law. These measures include computer + safeguards and secured files and buildings. + | +
| + How do we collect your personal information? + | +
+ We collect your personal information, for example, when you
+
+ We also collect your personal information from others, such as credit bureaus, + affiliates or other companies. + + |
+
| + Why can't I limit all sharing? + | +
+ Federal law gives you the right to limit only
+
+ State laws and individual companies may give you additional rights to limit + sharing. See below for more on your rights under state law. + + |
+
| + + What happens when I limit sharing for an account I hold jointly with someone else? + + | +
+ Your choices will apply to everyone on your account. + |
+
| + + What happens when I limit sharing for an account I hold jointly with someone else? + + | +Your choices will apply to everyone on your account. | +
| + Definitions + | +|
| + Affiliates + | +
+ + Companies related by common ownership or control. They can be financial and + nonfinancial companies. + +
|
+
| + Nonaffiliates + | +
+ + Companies not related by common ownership or control. They can be financial and + nonfinancial companies. + +
|
+
| + Joint Marketing + | +
+ A formal agreement between nonaffiliated financial companies that together market
+ financial products or services to you.
+
|
+
| + Other important information + | +|
|
+ + California residents: We will not share personal information with + nonaffiliates to market to you, except with your express consent. We will not + share your personal and financial information with affiliates or joint marketing + companies, if you instruct us not to do so. To limit our sharing with affiliates + and joint marketing companies, please send an email to{" "} + privacypolicy@company.com and + include the words “Opt Out” in the subject line and body of your email, or call us + at (555)555-5555. + ++ Vermont residents: We will not share personal information with + nonaffiliates to market to you, or share consumer report information about you + with affiliates or joint marketing companies, except with your express consent. + + |
+
+
+ ) : (
+
+
+ )
+ } */}
+ {/*
+ this.setState({ value },
+ () => this.props.handleChangeReverse(value))} />
+
*/}
+
+
+
+ );
+};
diff --git a/components/VideoJS/index.ts b/components/VideoJS/index.ts
new file mode 100644
index 00000000..a63ad589
--- /dev/null
+++ b/components/VideoJS/index.ts
@@ -0,0 +1 @@
+export { VideoJS } from "./VideoJS";
diff --git a/components/components.ts b/components/components.ts
new file mode 100644
index 00000000..d9265052
--- /dev/null
+++ b/components/components.ts
@@ -0,0 +1,29 @@
+export * from "./404";
+export * from "./Alerts";
+export * from "./AuthForm";
+export * from "./ComingSoon";
+export * from "./Footer";
+export * from "./Header";
+export * from "./Home";
+export * from "./InfoBox";
+export * from "./Layout";
+export * from "./Loading";
+export * from "./Login";
+export * from "./MainMenu";
+export * from "./MediaPlayer";
+export * from "./NotifyForm";
+export * from "./PostList";
+export * from "./POLTerms";
+export * from "./ProductCard";
+export * from "./ProductDetails";
+export * from "./ProductList";
+export * from "./ResetPassword";
+export * from "./SignupForm";
+export * from "./SocialLinks";
+export * from "./StreamCard";
+export * from "./StreamList";
+export * from "./StreamViewer";
+export * from "./Terms";
+export * from "./TipBot";
+export * from "./Video";
+export * from "./VideoJS";
diff --git a/components/index.ts b/components/index.ts
index fbd42307..40b494c5 100644
--- a/components/index.ts
+++ b/components/index.ts
@@ -1,9 +1 @@
-export * from "./Layout";
-export * from "./Header";
-export * from "./InfoBox";
-export * from "./PostList";
-export * from "./ProductList";
-export * from "./Home";
-export * from "./Modal";
-export * from "./sidebar";
-export * from "./video";
+export * from "./components";
diff --git a/components/index.tsx b/components/index.tsx
new file mode 100644
index 00000000..40b494c5
--- /dev/null
+++ b/components/index.tsx
@@ -0,0 +1 @@
+export * from "./components";
diff --git a/components/sidebar/index.tsx b/components/sidebar/index.tsx
deleted file mode 100644
index 3f5add27..00000000
--- a/components/sidebar/index.tsx
+++ /dev/null
@@ -1,127 +0,0 @@
-import React, { Component } from 'react'
-import { slide as Menu } from 'react-burger-menu'
-import styled from '@emotion/styled';
-import Link from 'next/link';
-const StyledAnchor = styled.a`
- padding: 1rem 3rem;
- display: flex;
- align-items: center;
- position: relative;
- text-transform: uppercase;
- font-weight: 900;
- font-size: 1em;
- background: none;
- border: 0;
- cursor: pointer;
- color: #FFFAFA;
-`;
-
-interface Props {
-
-}
-interface S {
- menuOpen: boolean;
-}
-class BurgerSideMenu extends Component
-
-
-
-
-
-
-
- );
- }
-}
-export default BurgerSideMenu;
\ No newline at end of file
diff --git a/components/svg/blob-1.svg b/components/svg/blob-1.svg
new file mode 100644
index 00000000..0806f1ba
--- /dev/null
+++ b/components/svg/blob-1.svg
@@ -0,0 +1,18 @@
+
diff --git a/components/video/index.tsx b/components/video/index.tsx
deleted file mode 100644
index 48193624..00000000
--- a/components/video/index.tsx
+++ /dev/null
@@ -1,125 +0,0 @@
-import Image from 'next/image';
-import React, { Component } from 'react'
-import InputRange from 'react-input-range';
-import 'react-input-range/lib/css/index.css'
-import 'react-rangeslider/lib/index.css'
-import ReactPlayer from 'react-player/youtube'
-import styled from '@emotion/styled';
-const Div = styled.div `
- margin-top:5px;
- position:absolute;
- width:100%;
- margin:auto;
- z-index:1;
- display:flex;
- justify-content:center
- `
-const H4 = styled.h4`
- color:#DD9183;
- text-align:center;
-`
-interface Props {
- isPlaying: any;
- mute: boolean;
- mutedPlayer: any;
- handleChangeReverse: any;
- reverse: any;
-}
-interface S {
- player: string;
- playVideo: any;
- value: any;
- reverseValue: any;
-}
-export class YouTubeIframe extends Component
-
- )
- }
-}
-
-export default YouTubeIframe
diff --git a/config/auth.ts b/config/auth.ts
new file mode 100644
index 00000000..f964e59f
--- /dev/null
+++ b/config/auth.ts
@@ -0,0 +1,69 @@
+// src/lib/auth.ts
+
+import { initReactQueryAuth } from "react-query-auth";
+import { IAccount } from "@spree/storefront-api-v2-sdk/types/interfaces/Account";
+import { spreeClient } from "./spree";
+
+interface LoginUser {
+ username: string;
+ password: string;
+}
+
+interface SpreeUser {
+ user: {
+ email: string;
+ password: string;
+ password_confirmation: string;
+ };
+}
+
+const authConfig = {
+ loadUser: async () => {
+ const storage = (await import("./storage")).default;
+ const token = await storage.getToken();
+ // console.warn("TOKEN: ", token);
+ if (token?.access_token && token?.token_type === "Bearer") {
+ const response = await spreeClient.account.accountInfo({ bearerToken: token.access_token });
+ if (response.isSuccess()) {
+ console.warn("USER LOADED: ", response.success());
+ return response.success();
+ }
+ console.warn(response.fail());
+ return null;
+ }
+ return null;
+ },
+ loginFn: async (data: unknown) => {
+ const response = await spreeClient.authentication.getToken(data as LoginUser);
+ if (response.isSuccess()) {
+ const result = response.success();
+ const storage = (await import("./storage")).default;
+ storage.setToken(result);
+ const user = await authConfig.loadUser();
+ return user;
+ } else {
+ console.warn(response.fail());
+ return null;
+ }
+ },
+ registerFn: async (data: unknown) => {
+ const response = await spreeClient.account.create(data as SpreeUser);
+ if (response.isSuccess()) {
+ console.warn("REGISTER SUCCESS: ", response.success());
+ // register does not receive a token
+ // so we can decide to either run the login automatically or ask the user to login
+ // also this is where there should be some notification about confirming their email
+
+ return response.success();
+ } else {
+ console.warn(response.fail());
+ return null;
+ }
+ },
+ logoutFn: async () => {
+ const storage = (await import("./storage")).default;
+ storage.clearToken();
+ }
+};
+
+export const { AuthProvider, useAuth } = initReactQueryAuth
-
- (smokey.fm)
-
-
- ) : (
-
-
- )
- } */}
- {/*
- this.setState({ value },
- () => this.props.handleChangeReverse(value))} />
-
*/}
-