blob: 1d59275f8af05226c96c301a9df6008d21a44108 [file] [log] [blame]
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8">
<style>
body, html{
background-color:#000;
margin: 0px;
height: 100%;
overflow-x: hidden;
overflow-y: auto;
}
#lottie{
background-color:#fff;
width:100%;
height:100%;
display:block;
overflow: hidden;
transform: translate3d(0,0,0);
margin: auto;
/*display:none;*/
}
.botas_loop_3,.botas_loop_2{
display:none
}
#bird_element.ready, #piano_element.ready, #cat_element.ready {
opacity: 1;
transition: opacity .6s ease-out;
cursor: pointer;
}
#bird_text_element, #piano_text_element, #cat_text_element {
opacity: 0;
transition: opacity .6s ease-out;
}
#bird_element.ready:hover ~ #bird_text_element,
#piano_element.ready:hover ~ #piano_text_element,
#cat_element.ready:hover ~ #cat_text_element {
opacity: 1;
}
#bird_element.ready:hover,
#piano_element.ready:hover,
#cat_element.ready:hover {
opacity: 0.2;
}
button {
padding: 0;
border: none;
background-color: transparent;
}
</style>
<!-- build:js lottie.js -->
<script src="js/main.js"></script>
<script src="js/utils/common.js"></script>
<script src="js/utils/BaseEvent.js"></script>
<script src="js/utils/helpers/arrays.js"></script>
<script src="js/utils/helpers/svg_elements.js"></script>
<script src="js/utils/helpers/html_elements.js"></script>
<script src="js/utils/helpers/dynamicProperties.js"></script>
<script src="js/3rd_party/transformation-matrix.js"></script>
<script src="js/3rd_party/seedrandom.js"></script>
<script src="js/3rd_party/BezierEaser.js"></script>
<script src="js/utils/animationFramePolyFill.js"></script>
<script src="js/utils/functionExtensions.js"></script>
<script src="js/utils/bez.js"></script>
<script src="js/utils/DataManager.js"></script>
<script src="js/utils/FontManager.js"></script>
<script src="js/utils/PropertyFactory.js"></script>
<script src="js/utils/TransformProperty.js"></script>
<script src="js/utils/shapes/ShapePath.js"></script>
<script src="js/utils/shapes/ShapeProperty.js"></script>
<script src="js/utils/shapes/ShapeModifiers.js"></script>
<script src="js/utils/shapes/TrimModifier.js"></script>
<script src="js/utils/shapes/RoundCornersModifier.js"></script>
<script src="js/utils/shapes/RepeaterModifier.js"></script>
<script src="js/utils/shapes/ShapeCollection.js"></script>
<script src="js/utils/shapes/DashProperty.js"></script>
<script src="js/utils/shapes/GradientProperty.js"></script>
<script src="js/utils/shapes/shapePathBuilder.js"></script>
<script src="js/utils/imagePreloader.js"></script>
<script src="js/utils/featureSupport.js"></script>
<script src="js/utils/filters.js"></script>
<script src="js/utils/asset_loader.js"></script>
<script src="js/utils/text/TextAnimatorProperty.js"></script>
<script src="js/utils/text/TextAnimatorDataProperty.js"></script>
<script src="js/utils/text/LetterProps.js"></script>
<script src="js/utils/text/TextProperty.js"></script>
<script src="js/utils/text/TextSelectorProperty.js"></script>
<script src="js/utils/pooling/pool_factory.js"></script>
<script src="js/utils/pooling/pooling.js"></script>
<script src="js/utils/pooling/point_pool.js"></script>
<script src="js/utils/pooling/shape_pool.js"></script>
<script src="js/utils/pooling/shapeCollection_pool.js"></script>
<script src="js/utils/pooling/segments_length_pool.js"></script>
<script src="js/utils/pooling/bezier_length_pool.js"></script>
<script src="js/renderers/BaseRenderer.js"></script>
<script src="js/renderers/SVGRenderer.js"></script>
<script src="js/renderers/CanvasRenderer.js" data-light-skip="true"></script>
<script src="js/renderers/HybridRenderer.js" data-light-skip="true"></script>
<script src="js/mask.js"></script>
<script src="js/elements/helpers/HierarchyElement.js"></script>
<script src="js/elements/helpers/FrameElement.js"></script>
<script src="js/elements/helpers/TransformElement.js"></script>
<script src="js/elements/helpers/RenderableElement.js"></script>
<script src="js/elements/helpers/RenderableDOMElement.js"></script>
<script src="js/elements/helpers/shapes/ProcessedElement.js"></script>
<script src="js/elements/helpers/shapes/SVGStyleData.js"></script>
<script src="js/elements/helpers/shapes/SVGShapeData.js"></script>
<script src="js/elements/helpers/shapes/SVGTransformData.js"></script>
<script src="js/elements/helpers/shapes/SVGStrokeStyleData.js"></script>
<script src="js/elements/helpers/shapes/SVGFillStyleData.js"></script>
<script src="js/elements/helpers/shapes/SVGGradientFillStyleData.js"></script>
<script src="js/elements/helpers/shapes/SVGGradientStrokeStyleData.js"></script>
<script src="js/elements/helpers/shapes/ShapeGroupData.js"></script>
<script src="js/elements/helpers/shapes/SVGElementsRenderer.js"></script>
<script src="js/elements/helpers/shapes/ShapeTransformManager.js"></script>
<script src="js/elements/helpers/shapes/CVShapeData.js" data-light-skip="true"></script>
<script src="js/elements/BaseElement.js"></script>
<script src="js/elements/NullElement.js"></script>
<script src="js/elements/svgElements/SVGBaseElement.js"></script>
<script src="js/elements/ShapeElement.js"></script>
<script src="js/elements/TextElement.js"></script>
<script src="js/elements/CompElement.js"></script>
<script src="js/elements/ImageElement.js"></script>
<script src="js/elements/SolidElement.js"></script>
<script src="js/elements/svgElements/SVGCompElement.js"></script>
<script src="js/elements/svgElements/SVGTextElement.js"></script>
<script src="js/elements/svgElements/SVGShapeElement.js"></script>
<script src="js/elements/svgElements/effects/SVGTintEffect.js"></script>
<script src="js/elements/svgElements/effects/SVGFillFilter.js"></script>
<script src="js/elements/svgElements/effects/SVGStrokeEffect.js"></script>
<script src="js/elements/svgElements/effects/SVGTritoneFilter.js"></script>
<script src="js/elements/svgElements/effects/SVGProLevelsFilter.js"></script>
<script src="js/elements/svgElements/effects/SVGDropShadowEffect.js"></script>
<script src="js/elements/svgElements/effects/SVGMatte3Effect.js"></script>
<script src="js/elements/svgElements/SVGEffects.js"></script>
<script src="js/elements/canvasElements/CVContextData.js" data-light-skip="true"></script>
<script src="js/elements/canvasElements/CVBaseElement.js" data-light-skip="true"></script>
<script src="js/elements/canvasElements/CVImageElement.js" data-light-skip="true"></script>
<script src="js/elements/canvasElements/CVCompElement.js" data-light-skip="true"></script>
<script src="js/elements/canvasElements/CVMaskElement.js" data-light-skip="true"></script>
<script src="js/elements/canvasElements/CVShapeElement.js" data-light-skip="true"></script>
<script src="js/elements/canvasElements/CVSolidElement.js" data-light-skip="true"></script>
<script src="js/elements/canvasElements/CVTextElement.js" data-light-skip="true"></script>
<script src="js/elements/canvasElements/CVEffects.js" data-light-skip="true"></script>
<script src="js/elements/htmlElements/HBaseElement.js" data-light-skip="true"></script>
<script src="js/elements/htmlElements/HSolidElement.js" data-light-skip="true"></script>
<script src="js/elements/htmlElements/HCompElement.js" data-light-skip="true"></script>
<script src="js/elements/htmlElements/HShapeElement.js" data-light-skip="true"></script>
<script src="js/elements/htmlElements/HTextElement.js" data-light-skip="true"></script>
<script src="js/elements/htmlElements/HImageElement.js" data-light-skip="true"></script>
<script src="js/elements/htmlElements/HCameraElement.js" data-light-skip="true"></script>
<script src="js/elements/htmlElements/HEffects.js" data-light-skip="true"></script>
<script src="js/animation/AnimationManager.js"></script>
<script src="js/animation/AnimationItem.js"></script>
<!-- Expressions -->
<script src="js/utils/expressions/Expressions.js" data-light-skip="true"></script>
<script src="js/utils/expressions/ExpressionManager.js" data-light-skip="true"></script>
<script src="js/utils/expressions/ExpressionPropertyDecorator.js" data-light-skip="true"></script>
<script src="js/utils/expressions/ExpressionTextPropertyDecorator.js" data-light-skip="true"></script>
<script src="js/utils/expressions/ShapeInterface.js" data-light-skip="true"></script>
<script src="js/utils/expressions/TextInterface.js" data-light-skip="true"></script>
<script src="js/utils/expressions/LayerInterface.js" data-light-skip="true"></script>
<script src="js/utils/expressions/CompInterface.js" data-light-skip="true"></script>
<script src="js/utils/expressions/TransformInterface.js" data-light-skip="true"></script>
<script src="js/utils/expressions/ProjectInterface.js" data-light-skip="true"></script>
<script src="js/utils/expressions/EffectInterface.js" data-light-skip="true"></script>
<script src="js/utils/expressions/MaskInterface.js" data-light-skip="true"></script>
<script src="js/utils/expressions/ExpressionValue.js" data-light-skip="true"></script>
<script src="js/effects/SliderEffect.js" data-light-skip="true"></script>
<script src="js/effects/EffectsManagerPlaceholder.js" ></script>
<script src="js/EffectsManager.js" data-light-skip="true"></script>
<!-- end Expressions -->
<!-- endbuild -->
<script src="js/module.js" data-skip="true"></script>
<!-- <script src="lottie.js"></script> -->
<!-- <script src="bodymovin_light.js"></script> -->
</head>
<body>
<div id="lottie"></div>
<script>
var anim;
var elem = document.getElementById('lottie');
//elem.style.display = 'none';
var animData = {
container: elem,
renderer: 'svg',
loop: true,
autoplay: true,
rendererSettings: {
progressiveLoad:false,
preserveAspectRatio: 'xMidYMid meet',
imagePreserveAspectRatio: 'xMidYMid meet'
},
path: 'exports/render/dna.json'
};
anim = lottie.loadAnimation(animData);
</script>
</body>
</html>