<commit_before>function Gallery(container, photoArray) { 
    this._galleryHolder = {};
    this._fullsizeGallery = {};
    this._thumbnailCollection = [];

    //Creación de la galería de thumbnails
    var thumbnailGallery = document.createElement("div");
    thumbnailGallery.setAttribute("class", "thumbnailGallery");
    this._galleryHolder = document.getElementById(container);
    if (photoArray.length == 0) {
        thumbnailGallery.innerHTML = "<div class=\"noData\">No hay imágenes asociadas</div>";
    } else {
        for (var image in photoArray)
            thumbnailGallery.innerHTML += "<img src=\"" + photoArray[image] + "\" width=\"200\" height=\"200\" alt=\"" + photoArray[image]
                + "\" class=\"thumbnail\" />";

    }
    this._galleryHolder.appendChild(thumbnailGallery);
    this._thumbnailCollection = this._galleryHolder.getElementsByClassName("thumbnail");

    //Creación de la galería en tamaño grande
    this._fullsizeGallery = document.createElement("div");
    this._fullsizeGallery.setAttribute("id", "fullsizeGallery");
    document.body.appendChild(this._fullsizeGallery);

    //Asociación de evento onClick a los thumbnails
    var currentInstance = this;
    for (var x = 0; x < this._thumbnailCollection.length; x++) {
        this._thumbnailCollection[x].addEventListener("click", function (event) { currentInstance.thumbnailClick(event); });
    }
}

Gallery.prototype.thumbnailClick = function (event) {

    var currentInstance = this; //Esta variable se utilizará para poder acceder a this dentro de los listeners.

    function loadImageLayer(image, imageClass) {
        var thisPhoto = document.createElement("img");
        thisPhoto.setAttribute("src", image.src);
        thisPhoto.setAttribute("class", imageClass);
        if (thisPhoto.height > 600 || thisPhoto.width > 800) {
            thisPhoto.setAttribute("height", 600);
            thisPhoto.setAttribute("width", 800);
        }
        this._fullsizeGallery.appendChild(thisPhoto);
        return thisPhoto;
    }

    function repositionButtons(image) {
        var wDisplacement = (image.width + 50) / 2;
        var hDisplacement = 90 + ((image.height) / 2);
        previousButton.setAttribute("style", "top:" + hDisplacement + "px; left:-" + wDisplacement + "px;");
        nextButton.setAttribute("style", "top:" + hDisplacement + "px; left:" + wDisplacement + "px;");
    }

    //Se carga la foto sobre la que se hace click en la galería de tamaño completo, así como las fotos previa y siguiente
    var currentImage = event.target;
    var previousImage = (currentImage.previousElementSibling != null) ? currentImage.previousElementSibling
        : this._thumbnailCollection[this._thumbnailCollection.length - 1];
    var nextImage = (currentImage.nextElementSibling != null) ? currentImage.nextElementSibling : this._thumbnailCollection[0];
    
    var previousPhoto = loadImageLayer.call(this, previousImage, "previousPhoto");
    var currentPhoto = loadImageLayer.call(this, currentImage, "currentPhoto");
    var nextPhoto = loadImageLayer.call(this, nextImage, "nextPhoto");

    //Se añaden botones para moverse por la galería
    var previousButton = document.createElement("div");
    var nextButton = document.createElement("div");
    previousButton.setAttribute("class", "galleryButton fa fa-chevron-circle-left");
    nextButton.setAttribute("class", "galleryButton fa fa-chevron-circle-right");
    repositionButtons(currentPhoto);

    this._fullsizeGallery.appendChild(previousButton);
    this._fullsizeGallery.appendChild(nextButton);

    //Se hace visible la capa modal de la galería de tamaño completo
    this._fullsizeGallery.style.display = "block";

    //Se añade evento para cerrar la galería cuando se hace click en la capa superior
    this._fullsizeGallery.addEventListener("click", function (event) {
        currentInstance._fullsizeGallery.style.display = "none";
        currentInstance._fullsizeGallery.innerHTML = "";
    });

    //Y otro evento sobre la propia imagen para evitar que el click sobre ella dispare el click superior en la capa y no se cierre<commit_msg>Update gallery.js<commit_after>function Gallery(container, photoArray) {
    this._galleryHolder = {};
    this._fullsizeGallery = {};
    this._thumbnailCollection = [];

    //Método que genera eventos de click sobre la colección de thumbnails
    this.associateThumbEvents = function () {
        this._thumbnailCollection = this._galleryHolder.getElementsByClassName("thumbnail");

        var currentInstance = this;
        for (var x = 0; x < this._thumbnailCollection.length; x++) {
            this._thumbnailCollection[x].addEventListener("click", function (event) { currentInstance.thumbnailClick(event); });
        }
    }

    //Creación de la galería de thumbnails
    var thumbnailGallery = document.createElement("div");
    thumbnailGallery.setAttribute("class", "thumbnailGallery");
    this._galleryHolder = document.getElementById(container);
    this._galleryHolder.appendChild(thumbnailGallery);
    thumbnailGallery.innerHTML = "<div class=\"noData\"><p class=\"fa fa-spinner fa-spin\"></p> Loading...</div>"

    if (photoArray.length == 0) {
        thumbnailGallery.innerHTML = "<div class=\"noData\">No hay imágenes asociadas</div>";
    } else {
        var loadedImages = 0;
        var tempGallery = "";
        var currentThumbnail = [];
        var currentInstance = this;
        for (var image in photoArray) {
            currentThumbnail[image] = new Image();
            currentThumbnail[image].onload = function () {
                loadedImages++;
                tempGallery += "<img src=\"" + this.src + "\" width=\"200\" height=\"200\" alt=\"" + this.src + "\" class=\"thumbnail\" />";
                if (loadedImages >= photoArray.length) {
                    //Una vez cargadas todas las imágenes mostrar la galería y asociar eventos de click a los thumbnails
                    thumbnailGallery.innerHTML = tempGallery;
                    currentInstance.associateThumbEvents();
                }
            }
            currentThumbnail[image].src = photoArray[image];
        }
    }

    //Creación del objeto que contendrá la galería en tamaño grande
    this._fullsizeGallery = document.createElement("div");
    this._fullsizeGallery.setAttribute("id", "fullsizeGallery");
    document.body.appendChild(this._fullsizeGallery);
}

Gallery.prototype.thumbnailClick = function (event) {

    var currentInstance = this; //Esta variable se utilizará para poder acceder a this dentro de los listeners.

    function loadImageLayer(image, imageClass) {
        var thisPhoto = document.createElement("img");
        thisPhoto.setAttribute("src", image.src);
        thisPhoto.setAttribute("class", imageClass);
        if (thisPhoto.height > 600 || thisPhoto.width > 800) {
            thisPhoto.setAttribute("height", 600);
            thisPhoto.setAttribute("width", 800);
        }
        this._fullsizeGallery.appendChild(thisPhoto);
        return thisPhoto;
    }

    function repositionButtons(image) {
        var wDisplacement = (image.width + 50) / 2;
        var hDisplacement = 90 + ((image.height) / 2);
        previousButton.setAttribute("style", "top:" + hDisplacement + "px; left:-" + wDisplacement + "px;");
        nextButton.setAttribute("style", "top:" + hDisplacement + "px; left:" + wDisplacement + "px;");
    }

    //Se carga la foto sobre la que se hace click en la galería de tamaño completo, así como las fotos previa y siguiente
    var currentImage = event.target;
    var previousImage = (currentImage.previousElementSibling != null) ? currentImage.previousElementSibling
        : this._thumbnailCollection[this._thumbnailCollection.length - 1];
    var nextImage = (currentImage.nextElementSibling != null) ? currentImage.nextElementSibling : this._thumbnailCollection[0];

    var previousPhoto = loadImageLayer.call(this, previousImage, "previousPhoto");
    var currentPhoto = loadImageLayer.call(this, currentImage, "currentPhoto");
    var nextPhoto = loadImageLayer.call(this, nextImage, "nextPhoto");

    //Se añaden botones para moverse por la galería
    var previousButton = document.createElement("div");
    var nextButton = document.createElement("div");
    previousButton.setAttribute("class", "galleryButton fa fa-chevron-circle-left");
    nextButton.setAttribute("class", "galleryButton fa fa-chevron-circle-right");
    repositionButtons(currentPhoto);

    this._fullsizeGallery.appendChild(previousButton);
    this._fullsizeGallery.appendChild(nextButton);

    //Se hace visible la capa modal de la galería de tamaño completo
    this._fullsizeGallery.style.display = "block";

    //Se añade evento para cerrar la galería cuando se hace click en la capa superior
    this._fullsizeGallery.addEventListener("click", function (event) {
        currentInstance._fullsizeGallery.style.display = "none";
        currentInstance._fullsizeGallery.innerHTML = "";
    });

    //Y otro evento sobre la propia imagen para evitar que el click sobre ella dispare el click superior en la capa y no se cierre
{'fraction_non_alphanumeric': 0.11373320222877745, 'fraction_numerical': 0.006227466404457555, 'mean_word_length': 3.4393792434529584, 'pattern_counts': {'":': 0, '<': 15, '<?xml version=': 0, '>': 18, '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': '4454969', 'n_tokens_mistral': 2578, 'n_tokens_neox': 2504, 'n_words': 627}