<commit_before>import React from 'react';
import classNames from 'classnames';
import Velocity from 'velocity-animate';

class Logo extends React.Component {
    constructor(props) {
        super(props);
        this.displayName = 'Logo';
        this.toggleLogoSize = this.toggleLogoSize.bind(this);
        this.triggerTransitionAnimation = this.triggerTransitionAnimation.bind(this);
    }

    componentWillUpdate(nextProps, nextState) {
        if (nextProps.isFullsize !== this.props.isFullsize) 
            this.triggerTransitionAnimation();
    }
    
    componentDidMount() {
        this.triggerLogoDropdownAnimation(this.refs.logoImg)
    }

    render() {
    	const { isFullsize, loadingText } = this.props;
		const logoClasses = classNames("logo", {"logo-fullsize": isFullsize});

		const text = !isFullsize ? <span>{loadingText}</span> : ""  // create action for logo toggle, changes isFullsize, changes text

        return (
        	<div id="logo" ref="logo" className="logo-fullsize">
                <img ref="logoImg" src='./logo.png' className={logoClasses}/>
                {text}
            </div>
		)
    }

    triggerTransitionAnimation(){
        console.log("isFullsize?", this.props.isFullsize);
        console.log("Triggering logo");
        this.toggleLogoSize()
        console.log("Triggering header");
        this.props.toggleHeader()
    }

    toggleLogoSize() {
    	const {logo, logoImg} = this.refs;
    	if (this.props.isFullsize) {
    		const distance = window.innerWidth - 90 + "px"

	    	Velocity(logo, {right: distance, top: "10px", width: "50px"}, {
                duration: 1250,
                easing: "ease-out"
            })

            Velocity(logoImg, {width: "50px"}, {
                duration: 1250,
            })

    	} else {
    		Velocity(logo, {right: 0, top: "70px", width: "200px"}, {
                duration: 1250,
                easing: "[0.25, 0.8, 0.25, 1]"
            })

            Velocity(logoImg, {width: "200px"}, {
                duration: 1250,
            })
    	}

    	this.props.toggleHeader()
    }

    triggerLogoDropdownAnimation(logo) {
        console.log("triggerLogoDropdownAnimation()", logo)
        Velocity(logo, {opacity: 1, top: "+10px"}, {duration: 1000})

    }
}

export default Logo;<commit_msg>Replace animations with actions. add logo click scroll to top<commit_after>import React, { Component } from "react";

import classNames from 'classnames';
import Velocity from 'velocity-animate';

class Logo extends Component {
    constructor(props) {
        super(props);
        this.displayName = 'Logo';
    }
    
    componentDidMount() {
        this.triggerLogoDropdownAnimation(this.refs.logoImg)
    }

    render() {
    	const { isFullsize, loadingText, expandHeader} = this.props;
		const logoClasses = classNames("logo", {"logo-fullsize": isFullsize});

		const text = !isFullsize ? <span>{loadingText}</span> : ""  // create action for logo toggle, changes isFullsize, changes text

        return (
        	<div id="logo" ref="logo" className="logo-fullsize">
                <img ref="logoImg" src='./logo.png' className={logoClasses} onClick={expandHeader}/>
                {text}
            </div>
		)
    }

    triggerLogoDropdownAnimation(logo) {
        console.log("triggerLogoDropdownAnimation()", logo)
        Velocity(logo, {opacity: 1, top: "+10px"}, {duration: 1000})

    }
}

export default Logo;
{'fraction_non_alphanumeric': 0.1323273360417876, 'fraction_numerical': 0.01625072547881602, 'mean_word_length': 2.495943204868154, 'pattern_counts': {'":': 2, '<': 13, '<?xml version=': 0, '>': 13, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3934803', 'n_tokens_mistral': 1093, 'n_tokens_neox': 1005, 'n_words': 217}