anim-3d-obj 1.1.15 → 1.1.19

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>
-  )
-}

package/src/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/src/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/src/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/src/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/src/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/src/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/src/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/src/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/tests/common.test.tsx

@@ -1,29 +0,0 @@
-//import * as React from 'react'
-import { render } from '@testing-library/react'
-
-import 'jest-canvas-mock'
-
-import { Face, Cuboid, Ribbon, Card } from '../src'
-
-describe('Common render', () => {
-  it('renders without crashing', () => {
-    render(
-      <div>
-        <Cuboid />
-        <Face />
-        <Ribbon />
-        <Card />
-      </div>,
-    )
-  })
-})
-
-/*
-import { MyCounter } from '../src'
-
-describe('Common render', () => {
-  it('renders without crashing', () => {
-    render(<MyCounter />)
-  })
-})
-*/

package/tsconfig.json

@@ -1,29 +0,0 @@
-{
-   "compilerOptions": {
-      "target": "es5",
-      "lib": ["dom", "dom.iterable", "esnext"],
-      "allowJs": true,
-      "skipLibCheck": true,
-      "esModuleInterop": true,
-      "allowSyntheticDefaultImports": true,
-      "strict": true,
-      "forceConsistentCasingInFileNames": true,
-      "noFallthroughCasesInSwitch": true,
-      "module": "esnext",
-      "moduleResolution": "node",
-      "resolveJsonModule": true,
-      "isolatedModules": true,
-      "noEmit": true,
-      "jsx": "react-jsx",
-      "importHelpers": true,
-      "declaration": true,
-      "sourceMap": true,
-      "rootDir": "./src",
-      "outDir": "./dist/esm",
-      "noImplicitReturns": true,
-      "noUnusedLocals": true,
-      "noUnusedParameters": true
-   },
-   "include": ["src"],
-   "exclude": ["dist", "node_modules"]
-}