@vixoniccom/aniversarios 1.2.1 → 1.2.3-dev.0

package/src/components/anniversary-item/shared/anniversary-date/flat/FlatDate.tsx

@@ -1,79 +0,0 @@
-import React, { useContext } from "react";
-import { ConfigureContext } from "../../../../../contex/configureContext/ConfigureContext";
-import { AnniveraryDateUtil } from "../DateUtils";
-
-interface Props {
-  month: number;
-  day: number;
-}
-
-export const FlatDate = ({ month, day }: Props) => {
-  const { configureState } = useContext(ConfigureContext);
-  const {
-    abbreviatedMonths,
-    dateDayFormat,
-    dateMonthFormat,
-    orientation,
-    datePrimaryColor,
-  } = configureState.parameters;
-
-  const sizeProp = AnniveraryDateUtil.utils(orientation);
-  let monthSize = ((dateMonthFormat?.fontSize || 18.5) * 400) / 100;
-  let daySize = ((dateDayFormat?.fontSize || 57.5) * 400) / 100;
-  const getFontFamily = (format: any) => {
-    if (format && format.font && format.font.filename) {
-      return format.font.filename.replace(".", "-");
-    }
-    return "";
-  };
-  return (
-    <svg {...sizeProp} viewBox="0 0 400 400" xmlSpace="preserve">
-      <g>
-        <path
-          fill={datePrimaryColor}
-          d="M349.5,393.5h-299c-24.3,0-44-19.7-44-44v-299c0-24.3,19.7-44,44-44h299c24.3,0,44,19.7,44,44v299C393.5,373.8,373.8,393.5,349.5,393.5z"
-        />
-        <path
-          fill="#FFFFFF"
-          d="M349.5,389.5h-299c-22,0-40-18-40-40v-299c0-22,18-40,40-40h299c22,0,40,18,40,40v299C389.5,371.5,371.5,389.5,349.5,389.5z"
-        />
-        <path
-          fill={datePrimaryColor}
-          d="M9,99.9V50.5c0-22.2,18.1-40.3,40.3-40.3h301.4c22.2,0,40.3,18.1,40.3,40.3v49.4H9z"
-        />
-        <text
-          fontFamily={`"${getFontFamily(dateMonthFormat)}"`}
-          textAnchor="middle"
-          alignmentBaseline="central"
-          x="200"
-          y="55"
-          fontSize={monthSize}
-          preserveAspectRatio="none"
-          fill={dateMonthFormat?.fontColor || "#fff"}
-          fontSizeAdjust=""
-        >
-          {AnniveraryDateUtil.getMonth(month, abbreviatedMonths)}
-        </text>
-        <text
-          fontFamily={`"${getFontFamily(dateDayFormat)}"`}
-          textAnchor="middle"
-          alignmentBaseline="central"
-          x="200"
-          y="245"
-          fontSize={daySize}
-          preserveAspectRatio="none"
-          fill={dateDayFormat?.fontColor || "#fff"}
-          fontSizeAdjust=""
-        >
-          {AnniveraryDateUtil.getZeroLeadedText(day)}
-        </text>
-      </g>
-    </svg>
-  );
-};
-
-FlatDate.defaultProps = {
-  datePrimaryColor: "#5B5959",
-};
-
-FlatDate.propTypes = AnniveraryDateUtil.commonPropTypes();

package/src/components/anniversary-item/shared/utils.ts

@@ -1,10 +0,0 @@
-export const utils =  (orientation:string, size:number) => {
-    const sizeAttr = orientation === 'v' ? 'width' : 'height'
-    const percentage = size
-      ? `${size}`
-      : orientation === 'v' ? '40%' : '80%'
-    return {
-      [sizeAttr]: percentage
-    }
-  }
- 

package/src/components/items-container/animation.ts

@@ -1,125 +0,0 @@
-import anime from 'animejs'
-
-
-interface Options {
-    mode: keyof typeof animationModes
-    duration: number
-    speed: number
-    stagger: number
-    reverse: boolean
-}
-
-const animationModes = {
-    fade: {
-      in: {
-        opacity: [0, 1],
-        easing: 'linear',
-      },
-      out: {
-        opacity: [1, 0],
-        easing: 'linear',
-      },
-      init: {
-        opacity: 0,
-      },
-    },
-    slideRight: {
-      in: {
-        translateX: () => {
-          return [`-100vw`, '0vw']
-        },
-        easing: 'easeOutQuad',
-      },
-      out: {
-        translateX: () => {
-          return ['0vw', `100vw`]
-        },
-        easing: 'easeInQuad',
-      },
-      init: {
-        transform: 'translateX(-100vw)',
-      },
-    },
-    slideLeft: {
-      in: {
-        translateX: () => {
-          return [`100vw`, '0vw']
-        },
-        easing: 'easeOutQuad',
-      },
-      out: {
-        translateX: () => {
-          return ['0vw', `-100vw`]
-        },
-        easing: 'easeInQuad',
-      },
-      init: {
-        transform: 'translateX(100vw)',
-      },
-    },
-  }
-
-class Animation {
-
-    public mode: any
-    public duration: number
-    public speed: number
-    public stagger: number
-    public reverse: boolean
-
-    constructor() {
-        this.mode = animationModes.fade
-        this.duration = 5000
-        this.speed = 1000
-        this.stagger = 1000 / 4
-        this.reverse = true
-    }
-
-    configure(options: Options) {
-        this.mode = animationModes.hasOwnProperty(options.mode) ? animationModes[options.mode] : animationModes.fade
-        this.duration = options.duration || 10000
-        this.speed = 1000 * (options.speed || 1)
-        this.stagger = this.speed / (options.stagger || 4)
-        this.reverse = options.reverse
-    }
-
-    getInitialStyle() {
-        return this.mode.init
-    }
-
-    animate(listNodes: any, finished: any) {
-        let self = this
-        let els = [].slice.call(listNodes, 0)
-        if (this.reverse) els = els.reverse()
-        if (!els || els.length < 1) return
-        let offset = this.duration - (((els.length - 1) * this.stagger) + this.speed) * 2
-        offset = offset < 0 ? 0 : offset
-        let animation = anime.timeline({
-            autoplay: false
-        })
-        animation.add(Object.assign({
-            targets: els,
-            duration: this.speed,
-            delay: function (_el: any, i: any, _l: any) {
-                return i * self.stagger
-            }
-        }, this.mode.in))
-        animation.add(Object.assign({
-            targets: els,
-            duration: this.speed,
-            delay: function (_el: any, _i: any, _l: any) {
-                return _i * self.stagger
-            },
-            complete: () => {
-                finished()
-            },
-            },
-            this.mode.out
-        ),
-        `+=${offset}`
-        )
-        animation.play()
-    }
-}
-
-module.exports = exports = Animation

package/src/contex/configureContext/ConfigureContext.tsx

@@ -1,8 +0,0 @@
-import { createContext } from "react";
-
-type ConfigureContext = {
-    configureState: VixonicData
-    addConfiguration: (configure:VixonicData)=>void
-}
- 
-export const ConfigureContext = createContext<ConfigureContext>({} as ConfigureContext);

package/src/contex/configureContext/ConfigureProvider.tsx

@@ -1,77 +0,0 @@
-import React, { useReducer } from "react";
-import { ConfigureContext } from './ConfigureContext';
-import { anniversaryReducer } from "./configureReducer";
-
-
-
-const INITIAL_STATE: VixonicData = {
-    downloadsPath: '',
-    parameters: {
-        abbreviatedMonths: false,
-        animationMode: "",
-        animationOrder: false,
-        animationSpeed: 1.5,
-        animationTime: "",
-        backgroundImage: { id: "", filename: "", _isAsset: true },
-        apiDomain: "",
-        containerColumns: "",
-        containerRows: "",
-        containerRowsGap: "",
-        containerColumnsGap:"",
-        dataMode: "",
-        dateAlignment: "center",
-        dateDayFormat: { font: { filename: '', id: '' ,_isAsset: true }, fontSize: 55, alignment: { horizontal: "center" }, fontColor: "" ,  },
-        dateEnabled: true,
-        dateMonthFormat: { font: { filename: '', id: '',_isAsset: true }, fontSize: 20, alignment: { horizontal: "center" }, fontColor: "" },
-        datePosition: 1,
-        datePrimaryColor: "",
-        dateStyle: "circle",
-        descriptionEnabled: true,
-        descriptionFormat: { font: { filename: '', id: '',_isAsset: true }, fontSize: 3.8, alignment: { horizontal: "center" }, fontColor: "" },
-        optionalEnabled: true,  
-        optionalFormat: { font: { filename: '', id: '',_isAsset: true }, fontSize: 3.8, alignment: { horizontal: "center" }, fontColor: "" },
-        excludePast: false,
-        imageAlignment: "center",
-        imageEnabled: true,
-        imagePosition: 0,
-        imageStyle: "normal",
-        imageSize: 50,
-        itemMargins: "",
-        msj0: "",
-        nameFormat: { font: { filename: '', id: '' ,_isAsset: true}, fontSize: 3.8, alignment: { horizontal: "center" }, fontColor: "" },
-        orientation: "",
-        padding: "",
-        photosMode: "",
-        photosZip: { id: "0fb559ec-5da3-4b2d-95c4-d9623754c841", filename: "0fb559ec-5da3-4b2d-95c4-d9623754c841.zip", extension: "zip",_isAsset: true },
-        template: "",
-        textAlignment: "center",
-        textPosition: 0,
-        updateTime: 600000,
-        urlBaseApi: "",
-        imageMargin: "",
-        textMargin: "",
-        dateMargin: "",
-        separator: false
-    }
-}
-
-interface props {
-    children: JSX.Element | JSX.Element[]
-}
-
-export const AnniversaryProvider = ({ children }: props) => {
-
-    const [configureState, dispatch] = useReducer(anniversaryReducer, INITIAL_STATE)
-
-
-    const addConfiguration = (configure: VixonicData) => {
-        dispatch({ type: "addConfigure", payload: configure })
-    }
-
-    return (
-        <ConfigureContext.Provider value={{ configureState, addConfiguration }}>
-            {children}
-        </ConfigureContext.Provider>
-    )
-}
-

package/src/contex/configureContext/configureReducer.ts

@@ -1,67 +0,0 @@
-
-type ConfigureAction =
-    | { type: 'addConfigure', payload: VixonicData }
-
-
-export const anniversaryReducer = (state: VixonicData, action: ConfigureAction) => {
-
-    const { downloadsPath, parameters } = action.payload
-    switch (action.type) {
-        case 'addConfigure':
-            return {
-                downloadsPath: downloadsPath,
-                parameters: {
-                    abbreviatedMonths: parameters.abbreviatedMonths,
-                    animationMode: parameters.animationMode,
-                    animationOrder: parameters.animationOrder,
-                    animationSpeed: parameters.animationSpeed,
-                    animationTime: parameters.animationTime,
-                    apiDomain: parameters.apiDomain,
-                    backgroundImage: parameters.backgroundImage,
-                    containerColumns: parameters.containerColumns,
-                    containerColumnsGap:parameters.containerColumnsGap,
-                    containerRows: parameters.containerRows,
-                    containerRowsGap: parameters.containerRowsGap,
-                    dataMode: parameters.dataMode,
-                    dateAlignment: parameters.dateAlignment,
-                    dateDayFormat: parameters.dateDayFormat,
-                    dateEnabled: parameters.dateEnabled,
-                    dateMonthFormat: parameters.dateMonthFormat,
-                    datePosition: parameters.datePosition,
-                    datePrimaryColor: parameters.datePrimaryColor,
-                    dateStyle: parameters.dateStyle,
-                    descriptionEnabled: parameters.descriptionEnabled,
-                    descriptionFormat: parameters.descriptionFormat,
-                    optionalEnabled: parameters.optionalEnabled,
-                    optionalFormat: parameters.optionalFormat,
-                    excludePast: parameters.excludePast,
-                    imageAlignment: parameters.imageAlignment,
-                    imageEnabled: parameters.imageEnabled,
-                    imagePosition: parameters.imagePosition,
-                    imageSize: parameters.imageSize,
-                    imageStyle: parameters.imageStyle,
-                    itemMargins: parameters.itemMargins,
-                    msj0: parameters.msj0,
-                    nameFormat: parameters.nameFormat,
-                    orientation: parameters.orientation,
-                    padding: parameters.padding,
-                    photosMode: parameters.photosMode,
-                    photosZip: parameters.photosZip,
-                    template: parameters.template,
-                    textAlignment: parameters.textAlignment,
-                    textPosition: parameters.textPosition,
-                    updateTime: parameters.updateTime,
-                    urlBaseApi: parameters.urlBaseApi,
-                    imageMargin: parameters.imageMargin,
-                    textMargin: parameters.textMargin,
-                    dateMargin: parameters.dateMargin,
-                    separator: parameters.separator,
-                    nameMaxChar: parameters.nameMaxChar,
-                    descriptionMaxChar: parameters.descriptionMaxChar    
-                }
-            }
-        default:
-            return state;
-    }
-
-}

package/src/contex/dataContext/DataContex.tsx

@@ -1,8 +0,0 @@
-import { createContext } from 'react';
-
-type DataContext = {
-    dataEmployee: any,
-    addEmployee: (employee: DataEmployee[]) => void
-}
-
-export const DataContext = createContext<DataContext>({} as DataContext);

package/src/contex/dataContext/DataProvider.tsx

@@ -1,31 +0,0 @@
-import React, { useReducer } from 'react'
-import { DataContext } from './DataContex';
-import { dataReducer } from './dataReducer';
-
-const INITIAL_STATE: Employees = {
-     dataEmployee:[]
-}
-
-interface props {
-    children: JSX.Element | JSX.Element[]
-}
-
-
-export const DataProvider = ({ children }: props) => {
-
-    const [dataEmployee, dispatch] = useReducer(dataReducer, INITIAL_STATE)
-
-    const addEmployee = (employee: DataEmployee[]) => {
-         dispatch({type:'addAnniversary', payload: employee})
-    }
-
-    return (
-        <DataContext.Provider value={{
-            dataEmployee,
-            addEmployee
-
-        }}>
-            {children}
-        </DataContext.Provider>
-    )
-}

package/src/contex/dataContext/dataReducer.ts

@@ -1,19 +0,0 @@
-
-
-type DataAction =
-    | { type: 'addAnniversary', payload: DataEmployee[] }
-
-
-export const dataReducer = (state: Employees, action: DataAction): Employees => {
-    
-
-    switch (action.type) {
-        case 'addAnniversary':
-            return {
-                dataEmployee: action.payload
-            }
-        default:
-            return state;
-    }
-
-}

package/src/helpers/parseMonthAndDay.ts

@@ -1,38 +0,0 @@
-import moment from "moment"
-
-
-const getAnniversaryFromMonth = (apiData: any, month: any) => {
-    let monthArray = []
-    for (let i = 0; i < apiData.length; i++) {
-        let monthA = Number(moment(apiData[i].fechaInic, 'YYYY-MM-DD').format('M')) - 1
-        if (monthA === month) {
-            let dayA = Number(moment(apiData[i].fechaInic, 'YYYY-MM-DD').format('D'))
-            apiData[i].day = dayA
-            apiData[i].month = month
-            apiData[i].name = `${apiData[i].nombre} ${apiData[i].apellidoPate}`
-            apiData[i].position = apiData[i].nombreCargo
-            apiData[i].image = apiData[i].foto
-            monthArray.push(apiData[i])
-        }
-    }
-    monthArray.sort((a, b) => {
-        if (a.day < b.day) return -1
-        else if (a.day === b.day) return 0
-        else return 1
-    })
-
-
-    return monthArray
-}
-
-export const parseFromApi = (apiData: any) => {
-    let monthsArray = []
-    for (let month = 0; month < 12; month++) {
-        let monthArray = getAnniversaryFromMonth(apiData, month)
-        if (monthArray.length > 0) monthsArray.push(...monthArray)
-    }
-
-
-    return monthsArray
-}
-

package/src/helpers/setToken.ts

@@ -1,69 +0,0 @@
-import localforage from 'localforage'
-import axios from 'axios'
-
-const urlCF = 'https://us-central1-vixoniccloudcom.cloudfunctions.net/rexTokenCentralizer'
-const tokenCF = 'd2dca806-4f70-41a3-ab70-0fe9bf051d2e'
-let updateTimer: any
-
-function setUpdateTime(milliseconds: any, requestData: any) {
-    clearTimeout(updateTimer)
-    if (milliseconds === null) return
-    updateTimer = setTimeout(requestData, milliseconds)
-}
-
-function getToken(apiDomain: any) {
-    try {
-        const config = { 'Authorization': tokenCF }
-        const response = axios({
-            method: 'post',
-            url: urlCF,
-            headers: config,
-            data: {
-                orgDomain: apiDomain // This is the body part
-            }
-        })
-        return response
-    } catch (error) {
-        console.error(error);
-        return error
-    }
-}
-
-function setTokenLocal(token: any, apiDomain: any) {
-    localforage.config({ name: `request_${apiDomain}` })
-    localforage.setItem('rexmas', {
-        token: token,
-        apiDomain: apiDomain,
-        date: Date.now()
-    }, (err) => { if (err) console.log(err) })
-}
-
-
-
-
-export default function setToken(apiDomain: any, requestData: any) {
-    let pt: any = getToken(apiDomain)
-    pt.then(function (response: any) {
-        console.log('rr...', response)
-        let token = response.data.token
-        if (token === '') {
-            console.log(response.data.msg)
-            // renderLog(response.data.msg)
-            setUpdateTime(null, requestData)
-        } else {
-            console.log('Access granted to Rex+ API')
-            setTokenLocal(token, apiDomain)
-            setUpdateTime(2000, requestData)
-        }
-        return
-    })
-        .catch(function (error: any) {
-            console.log(error);
-            console.log(`Error getting token ${error.response.data && error.response.data.detalle}`)
-            //   setUpdateTime(null)
-            return
-        })
-}
-
-
-

package/src/hooks/useFetch.ts

@@ -1,47 +0,0 @@
-import { useEffect, useRef, useState } from "react"
-
-type State = {
-    data: string | null
-    loading: boolean,
-    error: boolean | null
-}
-
-
-export const useFetch = (url: string): State => {
-
-    const isMounted = useRef(true);
-    const [state, setState] = useState<State>({ data: null, loading: true, error: null })
-
-    useEffect(() => {
-        return () => {
-            isMounted.current = false;
-        }
-    }, [])
-
-
-    useEffect(() => {
-
-        setState({ data: null, loading: true, error: null });
-
-        fetch(url, {
-            headers: {
-                'Authorization': `Token`
-            }
-        })
-            .then(resp => resp.json())
-            .then(data => {
-
-                if (isMounted.current) {
-                    setState({
-                        loading: false,
-                        error: null,
-                        data
-                    });
-                }
-
-            });
-
-    }, [url])
-
-    return state;
-}