<commit_before>// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
// See License.txt for license information.

var Client = require('../utils/client.jsx');
var utils = require('../utils/utils.jsx');

module.exports = React.createClass({
    displayName: 'ViewImageModal',
    propTypes: {
        filenames: React.PropTypes.array,
        modalId: React.PropTypes.string,
        channelId: React.PropTypes.string,
        userId: React.PropTypes.string,
        startId: React.PropTypes.number
    },
    canSetState: false,
    handleNext: function() {
        var id = this.state.imgId + 1;
        if (id > this.props.filenames.length - 1) {
            id = 0;
        }
        this.setState({imgId: id});
        this.loadImage(id);
    },
    handlePrev: function() {
        var id = this.state.imgId - 1;
        if (id < 0) {
            id = this.props.filenames.length - 1;
        }
        this.setState({imgId: id});
        this.loadImage(id);
    },
    handleKeyPress: function handleKeyPress(e) {
        if (!e) {
            return;
        } else if (e.keyCode === 39) {
            this.handleNext();
        } else if (e.keyCode === 37) {
            this.handlePrev();
        }
    },
    componentWillReceiveProps: function(nextProps) {
        this.setState({imgId: nextProps.startId});
    },
    loadImage: function(id) {
        var imgHeight = $(window).height() - 100;
        if (this.state.loaded[id] || this.state.images[id]) {
            $('.modal .modal-image .image-wrapper img').css('max-height', imgHeight);
            return;
        }

        var filename = this.props.filenames[id];

        var fileInfo = utils.splitFileLocation(filename);
        var fileType = utils.getFileType(fileInfo.ext);

        if (fileType === 'image') {
            var self = this;
            var img = new Image();
            img.load(this.getPreviewImagePath(filename),
                function() {
                    var progress = self.state.progress;
                    progress[id] = img.completedPercentage;
                    self.setState({progress: progress});
                });
            img.onload = function onload(imgid) {
                return function onloadReturn() {
                    var loaded = self.state.loaded;
                    loaded[imgid] = true;
                    self.setState({loaded: loaded});
                    $(self.refs.image.getDOMNode()).css('max-height', imgHeight);
                };
            }(id);
            var images = this.state.images;
            images[id] = img;
            this.setState({images: images});
        } else {
            // there's nothing to load for non-image files
            var loaded = this.state.loaded;
            loaded[id] = true;
            this.setState({loaded: loaded});
        }
    },
    componentDidUpdate: function() {
        if (this.state.loaded[this.state.imgId]) {
            if (this.refs.imageWrap) {
                $(this.refs.imageWrap.getDOMNode()).removeClass('default');
            }
        }
    },
    componentDidMount: function() {
        var self = this;
        $('#' + this.props.modalId).on('shown.bs.modal', function onModalShow() {
            self.setState({viewed: true});
            self.loadImage(self.state.imgId);
        });

        $(this.refs.modal.getDOMNode()).click(function onModalClick(e) {
            if (e.target === this || e.target === self.refs.imageBody.getDOMNode()) {
                $('.image_modal').modal('hide');
            }
        });

        $(this.refs.imageWrap.getDOMNode()).hover(
            function onModalHover() {
                $(self.refs.imageFooter.getDOMNode()).addClass('footer--show');
            }, function offModalHover() {
                $(self.refs.imageFooter.getDOMNode()).removeClass('footer--show');
            }
        );

        if (this.refs.previewArrowLeft.getDOMNode) {
            $(this.refs.previewArrowLeft.getDOMNode()).hover(
                function onModalHover() {
                    $(self.refs.imageFooter.getDOMNode()).addClass('footer--show');
                }, function offModalHover() {
                    $(self.refs.imageFooter.getDOMNode()).removeClass('footer--show');
                }
            );
        }

        if (this.refs.previewArrowRight.getDOMNode) {
            $(this.refs.previewArrowRight.getDOMNode()).hover(
                function onModalHover() {
                    $(self.refs.imageFooter.getDOMNode()).addClass('footer--show');
                }, function offModalHover() {
                    $(self.refs.imageFooter.getDOMNode()).removeClass('footer--show');
                }
            );
        }

        $(window).on('keyup', this.handleKeyPress);

        // keep track of whether or not this component is mounted so we can safely set the state asynchronously
        this.canSetState = true;
    },
    componentWillUnmount: function() {
        this.canSetState = false;
        $(window).off('keyup', this.handleKeyPress);
    },
    getPublicLink: function() {
        var data = {};
        data.channel_id = this.props.channelId;
        data.user_id = this.props.userId;
        data.filename = this.props.filenames[this.state.imgId];
        Client.getPublicLink(data,
            function sucess(serverData) {
                if (utils.isMobile()) {
                    window.location.href = serverData.public_link;
                } else {
                    window.open(serverData.public_link);
                }<commit_msg>Removing getDOMNode from view_image<commit_after>// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
// See License.txt for license information.

var Client = require('../utils/client.jsx');
var utils = require('../utils/utils.jsx');

module.exports = React.createClass({
    displayName: 'ViewImageModal',
    propTypes: {
        filenames: React.PropTypes.array,
        modalId: React.PropTypes.string,
        channelId: React.PropTypes.string,
        userId: React.PropTypes.string,
        startId: React.PropTypes.number
    },
    canSetState: false,
    handleNext: function() {
        var id = this.state.imgId + 1;
        if (id > this.props.filenames.length - 1) {
            id = 0;
        }
        this.setState({imgId: id});
        this.loadImage(id);
    },
    handlePrev: function() {
        var id = this.state.imgId - 1;
        if (id < 0) {
            id = this.props.filenames.length - 1;
        }
        this.setState({imgId: id});
        this.loadImage(id);
    },
    handleKeyPress: function handleKeyPress(e) {
        if (!e) {
            return;
        } else if (e.keyCode === 39) {
            this.handleNext();
        } else if (e.keyCode === 37) {
            this.handlePrev();
        }
    },
    componentWillReceiveProps: function(nextProps) {
        this.setState({imgId: nextProps.startId});
    },
    loadImage: function(id) {
        var imgHeight = $(window).height() - 100;
        if (this.state.loaded[id] || this.state.images[id]) {
            $('.modal .modal-image .image-wrapper img').css('max-height', imgHeight);
            return;
        }

        var filename = this.props.filenames[id];

        var fileInfo = utils.splitFileLocation(filename);
        var fileType = utils.getFileType(fileInfo.ext);

        if (fileType === 'image') {
            var self = this;
            var img = new Image();
            img.load(this.getPreviewImagePath(filename),
                function() {
                    var progress = self.state.progress;
                    progress[id] = img.completedPercentage;
                    self.setState({progress: progress});
                });
            img.onload = function onload(imgid) {
                return function onloadReturn() {
                    var loaded = self.state.loaded;
                    loaded[imgid] = true;
                    self.setState({loaded: loaded});
                    $(self.refs.image.getDOMNode()).css('max-height', imgHeight);
                };
            }(id);
            var images = this.state.images;
            images[id] = img;
            this.setState({images: images});
        } else {
            // there's nothing to load for non-image files
            var loaded = this.state.loaded;
            loaded[id] = true;
            this.setState({loaded: loaded});
        }
    },
    componentDidUpdate: function() {
        if (this.state.loaded[this.state.imgId]) {
            if (this.refs.imageWrap) {
                $(this.refs.imageWrap.getDOMNode()).removeClass('default');
            }
        }
    },
    componentDidMount: function() {
        var self = this;
        $('#' + this.props.modalId).on('shown.bs.modal', function onModalShow() {
            self.setState({viewed: true});
            self.loadImage(self.state.imgId);
        });

        $(this.refs.modal.getDOMNode()).click(function onModalClick(e) {
            if (e.target === this || e.target === self.refs.imageBody.getDOMNode()) {
                $('.image_modal').modal('hide');
            }
        });

        $(this.refs.imageWrap.getDOMNode()).hover(
            function onModalHover() {
                $(self.refs.imageFooter.getDOMNode()).addClass('footer--show');
            }, function offModalHover() {
                $(self.refs.imageFooter.getDOMNode()).removeClass('footer--show');
            }
        );

        if (this.refs.previewArrowLeft) {
            $(this.refs.previewArrowLeft.getDOMNode()).hover(
                function onModalHover() {
                    $(self.refs.imageFooter.getDOMNode()).addClass('footer--show');
                }, function offModalHover() {
                    $(self.refs.imageFooter.getDOMNode()).removeClass('footer--show');
                }
            );
        }

        if (this.refs.previewArrowRight) {
            $(this.refs.previewArrowRight.getDOMNode()).hover(
                function onModalHover() {
                    $(self.refs.imageFooter.getDOMNode()).addClass('footer--show');
                }, function offModalHover() {
                    $(self.refs.imageFooter.getDOMNode()).removeClass('footer--show');
                }
            );
        }

        $(window).on('keyup', this.handleKeyPress);

        // keep track of whether or not this component is mounted so we can safely set the state asynchronously
        this.canSetState = true;
    },
    componentWillUnmount: function() {
        this.canSetState = false;
        $(window).off('keyup', this.handleKeyPress);
    },
    getPublicLink: function() {
        var data = {};
        data.channel_id = this.props.channelId;
        data.user_id = this.props.userId;
        data.filename = this.props.filenames[this.state.imgId];
        Client.getPublicLink(data,
            function sucess(serverData) {
                if (utils.isMobile()) {
                    window.location.href = serverData.public_link;
                } else {
                    window.open(serverData.public_link);
                }
{'fraction_non_alphanumeric': 0.13721601153984853, 'fraction_numerical': 0.0030652722683014787, 'mean_word_length': 1.7268928220255655, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 5, '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': '6183831', 'n_tokens_mistral': 3159, 'n_tokens_neox': 3041, 'n_words': 535}