anim-3d-obj 1.1.16 → 1.1.20

package/.prettierrc.json

@@ -1,10 +0,0 @@
-{
-   "bracketSpacing": true,
-   "singleQuote": true,
-   "trailingComma": "all",
-   "tabWidth": 2,
-   "semi": false,
-   "printWidth": 120,
-   "jsxSingleQuote": true,
-   "endOfLine": "auto"
-}

package/babel.config.json

@@ -1,18 +0,0 @@
-{
-  "presets": [
-    [
-      "@babel/env",
-      {
-        "targets": {
-          "edge": "17",
-          "firefox": "60",
-          "chrome": "67",
-          "safari": "11.1"
-        },
-        "useBuiltIns": "usage",
-        "corejs": "3.6.5"
-      }
-    ],
-    "@babel/preset-react"
-  ]
-}

package/dist/components/Card.tsx

@@ -1,55 +0,0 @@
-import { AnimWrap } from './styles/AnimWrap'
-import { SceneStyle } from './styles/Scene'
-import { ObjProps } from './Faces/FaceInter'
-import Face from './Faces/Face'
-import { ObjWrapper } from './styles/Global'
-
-export const Card = (props: ObjProps): any => {
-  const {
-    anim1Specs,
-    anim2Specs,
-    width = 5,
-    height = 5,
-    faces,
-    global = {},
-    custom = {},
-    tranz = (+height / 2) | 0,
-    perspective,
-    perspectiveOrigin,
-    zIndex,
-  } = props
-
-  const buildFace = (faceType: any): any => {
-    return (
-      <Face
-        width={width}
-        height={height}
-        depth={0.1}
-        faceType={faceType}
-        id={faceType}
-        tranz={tranz}
-        global={global}
-        custom={custom}
-      />
-    )
-  }
-
-  return (
-    <SceneStyle
-      width={width}
-      height={height}
-      perspective={perspective}
-      perspectiveOrigin={perspectiveOrigin}
-      zIndex={zIndex}
-    >
-      <AnimWrap animSpecs={anim1Specs}>
-        <AnimWrap animSpecs={anim2Specs}>
-          <ObjWrapper>
-            {faces && faces.front ? buildFace('front') : null}
-            {faces && faces.back ? buildFace('back') : null}
-          </ObjWrapper>
-        </AnimWrap>
-      </AnimWrap>
-    </SceneStyle>
-  )
-}

package/dist/components/Cuboid.tsx

@@ -1,61 +0,0 @@
-//import React from 'react'
-import { AnimWrap } from './styles/AnimWrap'
-import { SceneStyle } from './styles/Scene'
-import { ObjProps } from './Faces/FaceInter'
-import Face from './Faces/Face'
-import { ObjWrapper } from './styles/Global'
-
-export const Cuboid = (props: ObjProps): any => {
-  const {
-    anim1Specs,
-    anim2Specs,
-    width = 5,
-    height = 5,
-    depth = 5,
-    faces,
-    global = {},
-    custom = {},
-    tranz = (+height / 2) | 0,
-    perspective,
-    perspectiveOrigin,
-    zIndex,
-  } = props
-
-  const buildFace = (faceType: any): any => {
-    return (
-      <Face
-        width={width}
-        height={height}
-        depth={depth}
-        faceType={faceType}
-        id={faceType}
-        tranz={tranz}
-        global={global}
-        custom={custom}
-      />
-    )
-  }
-
-  return (
-    <SceneStyle
-      width={width}
-      height={height}
-      perspective={perspective}
-      perspectiveOrigin={perspectiveOrigin}
-      zIndex={zIndex}
-    >
-      <AnimWrap animSpecs={anim1Specs}>
-        <AnimWrap animSpecs={anim2Specs}>
-          <ObjWrapper>
-            {faces && faces.front ? buildFace('front') : null}
-            {faces && faces.right ? buildFace('right') : null}
-            {faces && faces.back ? buildFace('back') : null}
-            {faces && faces.left ? buildFace('left') : null}
-            {faces && faces.top ? buildFace('top') : null}
-            {faces && faces.bottom ? buildFace('bottom') : null}
-          </ObjWrapper>
-        </AnimWrap>
-      </AnimWrap>
-    </SceneStyle>
-  )
-}

package/dist/components/Faces/Face.tsx

@@ -1,72 +0,0 @@
-import styled from 'styled-components'
-import { FaceProps } from './FaceInter'
-
-const Face = (props: FaceProps): JSX.Element => {
-  let { height = 10, tranz = 80, width = 100 } = props
-
-  const { depth = 10, faceType, global = {}, custom = false } = props
-
-  let transform
-  const styles = custom[faceType] && custom[faceType].css ? custom[faceType].css : global.css
-  const body = custom[faceType] && custom[faceType].body ? custom[faceType].body : global.body
-  if (faceType === 'bottom') {
-    tranz = +height - +depth / 2
-    height = +depth
-    transform = `transform: rotateX(-90deg) translateZ(${tranz}px);`
-    //styles = custom["top"] ? custom : global;
-  } else if (faceType === 'top') {
-    height = +depth
-    if (depth) tranz = +depth / 2
-    transform = `transform: rotateX(90deg) translateZ(${tranz}px);`
-  } else if (faceType === 'front') {
-    if (depth) tranz = +depth / 2
-    transform = `transform: rotateY(0deg) translateZ(${tranz}px);`
-  } else if (faceType === 'back') {
-    if (depth) tranz = +depth / 2
-    transform = `transform: rotateY(180deg) translateZ(${tranz}px);`
-  } else if (faceType === 'right') {
-    if (height > width && !depth) {
-      tranz = -(+height / 2 - +width)
-      width = +height
-    } else if (width > height && !depth) {
-      tranz = +height / 2
-      height = +width
-    } else {
-      tranz = +width - +depth / 2
-      width = +depth
-    }
-    transform = `transform: rotateY(90deg) translateZ(${tranz}px);`
-    // topr is to of Ribbon which points back
-  } else if (faceType === 'topr') {
-    height = +depth
-    if (depth) tranz = +depth / 2
-    //let offset = depth / 2;
-    transform = `transform: rotateX(90deg) translateZ(${tranz}px );  `
-  } else {
-    if (height > width && !depth) {
-      tranz = -(+height / 2 - +width)
-      width = +height
-    } else if (width > height && !depth) {
-      tranz = +height / 2
-      height = +width
-    } else {
-      tranz = +depth / 2
-      width = +depth
-    }
-    transform = `transform: rotateY(-90deg) translateZ(${tranz}px);`
-  }
-
-  //const BackFlip: any = styled.section``;
-
-  const Specs: any = styled.section`
-    ${styles}
-    width: ${width}px;
-    position: absolute;
-    height: ${height}px;
-    ${transform};
-  `
-
-  return <Specs>{body}</Specs>
-}
-
-export default Face

package/dist/components/Faces/FaceInter.d.ts

@@ -1,39 +0,0 @@
-export interface FaceProps {
-  children?: any
-  depth?: number | any
-  faceType?: any
-  custom?: any
-  global?: any
-  height?: number | string
-  id?: string | number | boolean
-  styles?: object | any
-  tranz?: any
-  width?: number | string
-}
-
-export interface ObjProps {
-  anim1Specs?: object | undefined
-  anim2Specs?: object | undefined
-  children?: any
-  depth?: number
-  global?: { border?: string; bgc?: string; opac?: number | string } | any
-  faces?:
-    | {
-        front: boolean
-        back: boolean
-        left: boolean
-        right: boolean
-        top: boolean
-        bottom: boolean
-      }
-    | undefined
-
-  height?: number | string
-  custom?: object | string | undefined
-  perspective?: string | number | undefined
-  perspectiveOrigin?: string | undefined
-  tranz?: number | undefined
-  txt?: string | any
-  width?: number
-  zIndex?: number | undefined
-}

package/dist/components/Ribbon.tsx

@@ -1,57 +0,0 @@
-import { AnimWrap } from './styles/AnimWrap'
-import { SceneStyle } from './styles/Scene'
-import { ObjProps } from './Faces/FaceInter'
-import Face from './Faces/Face'
-import { ObjWrapper } from './styles/Global'
-
-export const Ribbon = (props: ObjProps): any => {
-  const {
-    anim1Specs,
-    anim2Specs,
-    width = 5,
-    height = 5,
-    depth = 5,
-    faces,
-    global = {},
-    custom = {},
-    tranz = (+height / 2) | 0,
-    perspective,
-    perspectiveOrigin,
-    zIndex,
-  } = props
-
-  const buildFace = (faceType: any): any => {
-    return (
-      <Face
-        width={width}
-        height={height}
-        depth={depth}
-        faceType={faceType}
-        id={faceType}
-        tranz={tranz}
-        global={global}
-        custom={custom}
-      />
-    )
-  }
-
-  return (
-    <SceneStyle
-      width={width}
-      height={height}
-      perspective={perspective}
-      perspectiveOrigin={perspectiveOrigin}
-      zIndex={zIndex}
-    >
-      <AnimWrap animSpecs={anim1Specs}>
-        <AnimWrap animSpecs={anim2Specs}>
-          <ObjWrapper>
-            {faces && faces.bottom ? buildFace('bottom') : null}
-            {faces && faces.back ? buildFace('back') : null}
-            {faces && faces.top ? buildFace('topr') : null}
-          </ObjWrapper>
-        </AnimWrap>
-      </AnimWrap>
-    </SceneStyle>
-  )
-}

package/dist/components/styles/Anim.d.ts

@@ -1,16 +0,0 @@
-export interface AnimStylesProps {
-  children?: any
-  animSpecs?: any
-}
-export interface AnimSpecsProps {
-  border?: string | undefined
-  degreesHi?: number | undefined
-  degreesLow?: number | undefined
-  delay: any
-  direction?: string | undefined
-  duration?: number | string | undefined
-  fillMode?: string | undefined
-  iterationCount?: number | string | undefined
-  name?: string | undefined
-  timing?: string | undefined
-}

package/dist/components/styles/AnimWrap.tsx

@@ -1,92 +0,0 @@
-import styled from 'styled-components'
-//import React from 'react'
-import { AnimStylesProps } from './Anim'
-import { allAnims } from './Anims'
-
-export const AnimWrap = (props: AnimStylesProps) => {
-  const { children, animSpecs } = props
-  const AS: any = animSpecs
-
-  const {
-    X360,
-    Y360,
-    fadeInkf,
-    wobY,
-    wobX,
-    fwdx018,
-    fwdx1836,
-    fwdx09,
-    fwdx918,
-    fwdx1827,
-    fwdx2736,
-    fwdy018,
-    fwdy1836,
-    fwdy09,
-    fwdy918,
-    fwdy1827,
-    fwdy2736,
-    floatX,
-    floatShadow,
-    pulseSM,
-    pulseMD,
-    pulseLG,
-    noAnim,
-  } = allAnims({
-    degreesHi: AS && AS.degreesHi ? AS.degreesHi : 0,
-    degreesLow: AS && AS.degreesLow ? AS.degreesLow : 0,
-  })
-
-  let theAnim: any = 'noAnim'
-  // need to iterate through all animation posibilities and not use eval() to satisfy TS
-  if (AS && AS.name) {
-    if (AS.name === 'X360') theAnim = X360
-    else if (AS.name === 'Y360') theAnim = Y360
-    else if (AS.name === 'fadeInkf') theAnim = fadeInkf
-    else if (AS.name === 'wobX') theAnim = wobX
-    else if (AS.name === 'wobY') theAnim = wobY
-    else if (AS.name === 'fwdx018') theAnim = fwdx018
-    else if (AS.name === 'fwdx1836') theAnim = fwdx1836
-    else if (AS.name === 'fwdx09') theAnim = fwdx09
-    else if (AS.name === 'fwdx918') theAnim = fwdx918
-    else if (AS.name === 'fwdx1827') theAnim = fwdx1827
-    else if (AS.name === 'fwdx2736') theAnim = fwdx2736
-    else if (AS.name === 'fwdy018') theAnim = fwdy018
-    else if (AS.name === 'fwdy1836') theAnim = fwdy1836
-    else if (AS.name === 'fwdy09') theAnim = fwdy09
-    else if (AS.name === 'fwdy918') theAnim = fwdy918
-    else if (AS.name === 'fwdy1827') theAnim = fwdy1827
-    else if (AS.name === 'fwdy2736') theAnim = fwdy2736
-    else if (AS.name === 'floatX') theAnim = floatX
-    else if (AS.name === 'floatShadow') theAnim = floatShadow
-    else if (AS.name === 'pulseSM') theAnim = pulseSM
-    else if (AS.name === 'pulseMD') theAnim = pulseMD
-    else if (AS.name === 'pulseLG') theAnim = pulseLG
-  } else theAnim = noAnim
-
-  let AnimWrapDiv: any = styled.div``
-  if (AS) {
-    AnimWrapDiv = styled.div`
-      width: 100%;
-      height: 100%;
-      position: relative;
-      transform-style: preserve-3d;
-      border: ${AS.border || ''};
-      -webkit-animation-duration: ${AS.duration || 1}s;
-      animation-duration: ${AS.duration || 1}s;
-      -webkit-animation-iteration-count: ${AS.iterationCount || 1};
-      animation-iteration-count: ${AS.iterationCount || 1};
-      -webkit-animation-name: ${theAnim || 'noAnim'};
-      animation-name: ${theAnim || 'noAnim'};
-      -webkit-animation-fill-mode: ${AS.fillMode || 'forwards'};
-      animation-fill-mode: ${AS.fillMode || 'forwards'};
-      animation-direction: ${AS.direction || 'normal'};
-      -webkit-animation-direction: ${AS.direction || 'normal'};
-      -webkit-animation-timing-function: ${AS.timing || 'linear'};
-      animation-timing-function: ${AS.timing || 'linear'};
-      -webkit-animation-delay: ${AS.delay || 0}s;
-      animation-delay: ${AS.delay || 0}s;
-    `
-  }
-
-  return <AnimWrapDiv>{children}</AnimWrapDiv>
-}

package/dist/components/styles/Global.ts

@@ -1,7 +0,0 @@
-import styled from 'styled-components'
-export const ObjWrapper = styled.div`
-  width: 100%;
-  height: 100%;
-  position: relative;
-  transform-style: preserve-3d;
-`

package/dist/components/styles/Scene.tsx

@@ -1,30 +0,0 @@
-import styled from 'styled-components'
-//import React from 'react'
-
-interface SceneStyleProps {
-  width?: number | string
-  height?: number | string
-  perspective?: number | string | undefined
-  perspectiveOrigin?: string | undefined
-  zIndex?: number | undefined
-  children: any
-}
-
-export const SceneStyle = (props: SceneStyleProps) => {
-  const { width = 0, height = 0, perspective = 600, perspectiveOrigin = '50% 50%', zIndex = 10, children = {} } = props
-
-  const SceneStyleDiv: any = styled.div`
-    width: ${width}px;
-    height: ${height}px;
-    -webkit-perspective: ${perspective}px;
-    perspective: ${perspective}px;
-    -webkit-perspective-origin: ${perspectiveOrigin};
-    perspective-origin: ${perspectiveOrigin};
-  `
-
-  return (
-    <div style={{ zIndex }}>
-      <SceneStyleDiv>{children}</SceneStyleDiv>
-    </div>
-  )
-}

package/dist/index.ts

@@ -1,9 +0,0 @@
-//import MyCounter from './components/App'
-//export { MyCounter }
-
-import Face from './components/Faces/Face'
-import { Cuboid } from './components/Cuboid'
-import { Ribbon } from './components/Ribbon'
-import { Card } from './components/Card'
-
-export { Face, Cuboid, Ribbon, Card }

package/jestconfig.json

@@ -1,8 +0,0 @@
-{
-  "transform": {
-    "^.+\\.(t|j)sx?$": "ts-jest"
-  },
-  "testRegex": "(/tests/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$",
-  "moduleFileExtensions": ["ts", "tsx", "js", "jsx", "json", "node"],
-  "testEnvironment": "jsdom"
-}

package/public/index.html

@@ -1,43 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <meta name="theme-color" content="#000000" />
-    <meta
-      name="description"
-      content="Web site created using create-react-app"
-    />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
-    <!--
-      manifest.json provides metadata used when your web app is installed on a
-      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
-    <title>React Redux App</title>
-  </head>
-  <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-    <div id="root"></div>
-    <!--
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
-
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
-
-      To begin the development, run `npm start` or `yarn start`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    -->
-  </body>
-</html>

package/public/manifest.json

@@ -1,25 +0,0 @@
-{
-  "short_name": "React App",
-  "name": "Create React App Sample",
-  "icons": [
-    {
-      "src": "favicon.ico",
-      "sizes": "64x64 32x32 24x24 16x16",
-      "type": "image/x-icon"
-    },
-    {
-      "src": "logo192.png",
-      "type": "image/png",
-      "sizes": "192x192"
-    },
-    {
-      "src": "logo512.png",
-      "type": "image/png",
-      "sizes": "512x512"
-    }
-  ],
-  "start_url": ".",
-  "display": "standalone",
-  "theme_color": "#000000",
-  "background_color": "#ffffff"
-}

package/public/robots.txt

@@ -1,3 +0,0 @@
-# https://www.robotstxt.org/robotstxt.html
-User-agent: *
-Disallow:

package/src/components/Card.tsx

@@ -1,55 +0,0 @@
-import { AnimWrap } from './styles/AnimWrap'
-import { SceneStyle } from './styles/Scene'
-import { ObjProps } from './Faces/FaceInter'
-import Face from './Faces/Face'
-import { ObjWrapper } from './styles/Global'
-
-export const Card = (props: ObjProps): any => {
-  const {
-    anim1Specs,
-    anim2Specs,
-    width = 5,
-    height = 5,
-    faces,
-    global = {},
-    custom = {},
-    tranz = (+height / 2) | 0,
-    perspective,
-    perspectiveOrigin,
-    zIndex,
-  } = props
-
-  const buildFace = (faceType: any): any => {
-    return (
-      <Face
-        width={width}
-        height={height}
-        depth={0.1}
-        faceType={faceType}
-        id={faceType}
-        tranz={tranz}
-        global={global}
-        custom={custom}
-      />
-    )
-  }
-
-  return (
-    <SceneStyle
-      width={width}
-      height={height}
-      perspective={perspective}
-      perspectiveOrigin={perspectiveOrigin}
-      zIndex={zIndex}
-    >
-      <AnimWrap animSpecs={anim1Specs}>
-        <AnimWrap animSpecs={anim2Specs}>
-          <ObjWrapper>
-            {faces && faces.front ? buildFace('front') : null}
-            {faces && faces.back ? buildFace('back') : null}
-          </ObjWrapper>
-        </AnimWrap>
-      </AnimWrap>
-    </SceneStyle>
-  )
-}

package/src/components/Cuboid.tsx

@@ -1,61 +0,0 @@
-//import React from 'react'
-import { AnimWrap } from './styles/AnimWrap'
-import { SceneStyle } from './styles/Scene'
-import { ObjProps } from './Faces/FaceInter'
-import Face from './Faces/Face'
-import { ObjWrapper } from './styles/Global'
-
-export const Cuboid = (props: ObjProps): any => {
-  const {
-    anim1Specs,
-    anim2Specs,
-    width = 5,
-    height = 5,
-    depth = 5,
-    faces,
-    global = {},
-    custom = {},
-    tranz = (+height / 2) | 0,
-    perspective,
-    perspectiveOrigin,
-    zIndex,
-  } = props
-
-  const buildFace = (faceType: any): any => {
-    return (
-      <Face
-        width={width}
-        height={height}
-        depth={depth}
-        faceType={faceType}
-        id={faceType}
-        tranz={tranz}
-        global={global}
-        custom={custom}
-      />
-    )
-  }
-
-  return (
-    <SceneStyle
-      width={width}
-      height={height}
-      perspective={perspective}
-      perspectiveOrigin={perspectiveOrigin}
-      zIndex={zIndex}
-    >
-      <AnimWrap animSpecs={anim1Specs}>
-        <AnimWrap animSpecs={anim2Specs}>
-          <ObjWrapper>
-            {faces && faces.front ? buildFace('front') : null}
-            {faces && faces.right ? buildFace('right') : null}
-            {faces && faces.back ? buildFace('back') : null}
-            {faces && faces.left ? buildFace('left') : null}
-            {faces && faces.top ? buildFace('top') : null}
-            {faces && faces.bottom ? buildFace('bottom') : null}
-          </ObjWrapper>
-        </AnimWrap>
-      </AnimWrap>
-    </SceneStyle>
-  )
-}