<commit_before>var clientApp = clientApp || {};
var editor = editor || {};
var helpers = clientApp.helpers || {};
var upload = clientApp.upload || {};
var zoomController = zoomController || {};
var scrollController = scrollController || {};

var editorBlobs;
var crop_info;

editor.printEditor = function(crop) {
  if (helpers.getOrigin() === 'upload') checkTiff();
  $("#inputEditorContainer").load("editor.html", function() {
    if (helpers.getOrigin() === "blobSet")
      editorBlobs = helpers.getFromStorage("demoSet");
    crop_info = crop;
    printEditorPanel();
  });
};

function printEditorPanel() {
  $(".editor-container").removeClass("di-none");
  var blobs = Object.keys(editorBlobs);

  printBlobSetList(blobs);

  $("#left-container").printEditorBlob(editorBlobs[blobs[0]], "left");
  $("#right-container").printEditorBlob(editorBlobs[blobs[0]], "right");

  if (areAllImages()) displayImagesControls(blobs, editorBlobs[blobs[0]])

  saveSelectedInput("right", blobs[0]);
  saveSelectedInput("left", blobs[0]);

  $(".editor-input-left-0, .editor-input-right-0").addClass("editor-input-selected");

  scrollController.addScrollingEvents();

  $("#left-container").attachDragger("left");
  $("#right-container").attachDragger("right");
}

function displayImagesControls(blobs, blob){
  $("#zoom-container").removeClass("di-none");
  if (blobs.length > 1) loadMultiBlobControls();
  else if (blobs.length == 1 && ((blob.format == "image" && !isTiff(blob)) || blob.vr)) loadSingleBlobControls($("#editor-blob-left"));
}

function saveSelectedInput(side, index) {
  blobsKeys = Object.keys(editorBlobs);
  helpers.addToStorage("selectedInput-" + side, {
    text: "editor-input-" + side + "-" + index,
    src: blobsKeys[blobsKeys.indexOf(index)],
    format: editorBlobs[index].format
  });
}

function isTiff(blob){
  var type = blob.blob.split(";")[0].split("/")[1];
  if (type === "tiff" || type === "tif") return true;
  return false;
}

// Print the chosen set blob list
function printBlobSetList(blobs) {
  for (let i = 0; i < blobs.length; i++) {
    $(".inputListContainerLeft").append(
      "<span class=editor-input-left-" +
        i +
        ">" +
        ddl.inputs[i].description +
        "</span>"
    );
    $(".editor-input-left-" + i).addClass("editor-input");
    $(".editor-input-left-" + i).loadInputEvents(
      Object.keys(editorBlobs)[i],
      "left"
    );
    $(".inputListContainerRight").append(
      "<span class=editor-input-right-" +
        i +
        ">" +
        ddl.inputs[i].description +
        "</span>"
    );
    $(".editor-input-right-" + i).addClass("editor-input");
    $(".editor-input-right-" + i).loadInputEvents(
      Object.keys(editorBlobs)[i],
      "right"
    );
  }
  $(".inputListContainerLeft").loadInputsContainerEvent("left");
  $(".inputListContainerRight").loadInputsContainerEvent("right");
}

// Single blob sets controls
function loadSingleBlobControls($img) {
  if (ddl.inputs[0].type == "image") displayCrop($img)
  zoomController.singleBlob();
}

function displayCrop($img){
  $(".blobsList-left").append(
    "<input type=checkbox id=crop-btn class=hand><label for=crop-btn class=hand>Crop</label>"
  );
  if (crop_info == null) {
    $img.cropper({
      viewMode: 1,
      autoCrop: false,
      dragMode: "move",
      wheelZoomRatio: 0.1,
      responsive: true,
      toggleDragModeOnDblclick: false,
      ready: setNaturalZoom
    });
  } else {
    $img.cropper({
      viewMode: 1,
      autoCrop: true,
      dragMode: "move",
      wheelZoomRatio: 0.1,
      responsive: true,
      data: crop_info,
      ready: getData,
      toggleDragModeOnDblclick: false
    });
    $("#crop-btn").prop("checked", true);
    $("#canvas-container").removeClass("di-none");
  }
  $img.on("cropmove cropstart cropend", function (e) {
    if ($("#crop-btn").prop("checked")) {
      var croppedImage = $("#left-container > img").cropper("getCroppedCanvas");
      $("#canvas-container").html($(croppedImage));
    }
  });
  $img.on("zoom", function (e) {
    if (e.ratio >= 0.25 && e.ratio <= 16) {
      let selector = "#canvas-container > canvas, .blobEditorImage, .cropper-container img";
      helpers.checkInterpolation(e.ratio, selector);

      $("#editor-zoom").val(e.ratio);
      $("#editor-zoom-value").html(e.ratio.toFixed(2) + "x");
      if ($("#crop-btn").prop("checked")) {
        var croppedImage = $("#left-container > img").cropper(
          "getCroppedCanvas"
        );
        $("#canvas-container").html($(croppedImage));
      }
    } else {
      e.preventDefault();
    }
  });
  addCropEvent();
}

function setNaturalZoom() {
  $("#editor-blob-left").cropper('zoomTo', 1);
}

function getData() {
  var imgData = $("#editor-blob-left").cropper("getImageData");
  var zoom = imgData.height / imgData.naturalHeight;
  $("#editor-zoom").val(zoom);
  $("#editor-zoom-value").html(zoom.toFixed(2) + "px");
  $("#editor-blob-left").cropper('zoomTo', zoom);
}

// Multiple blob sets controls
function loadMultiBlobControls() {
  $(".blobsList-left").append(
    "<input type=checkbox id=compare-btn class=hand><label for=compare-btn>Compare</label>"
  );
  zoomController.multiBlob();
  addCompareEvent();
}

// Check if all blobs are images or have visual representation (image)
function areAllImages() {
  var blobs = Object.keys(editorBlobs);
  for (var i = 0; i < blobs.length; i++) {
    if ((editorBlobs[blobs[i]].format != "image" && !editorBlobs[blobs[i]].vr) || editorBlobs[blobs[i]].format == "audio" ||  editorBlobs[blobs[i]].format == "video")
      return false;
  }
  return true;
}

$.fn.printEditorBlob = function(editorBlob, side) {
  var blobType = editorBlob.format;
  var blobSrc = editorBlob.vr ? editorBlob.vr : editorBlob.blob;
  if (blobType == "video") {
    $(this).empty();
    $(this).append("<video src=" + blobSrc + " id=editor-blob-" + side + " class=blobEditorVideo controls></video>");
  } else if (blobType == "audio") {
    $(this).empty();
    var audioThumbnail = editorBlob.thumbnail ? editorBlob.thumbnail : "assets/non_viewable_data.png";
    $(this).append("<img src=" + audioThumbnail + " class=audioThumbnail><br><audio src=" + editorBlob.blob + " id=editor-blob-" + side + " class=blobEditorAudio controls></audio>");
  } else {
    if (isPreviousBlobImg(side)) {
      $("#editor-blob-" + side).attr("src", blobSrc);
      $("#editor-blob-" + side).on('load', function(e) {
        $("#editor-blob-" + side).width($(this)[0].naturalWidth * $("#editor-zoom").val());
        $("#editor-blob-" + side).height($(this)[0].naturalHeight * $("#editor-zoom").val());
      });
      $("#editor-blob-" + side).displayImageSize();
    } else {
      $(this).empty();
      var img = "<img src=" + blobSrc + " id=editor-blob-" + side + " class=blobEditorImage draggable=false >";
      $(img).appendTo($(this));
      $(img).displayImageSize();
      $("#editor-blob-left").on("error", function() {
        $(this).attr("src", "assets/non_viewable_data.png");
        $("#editor-blob-left").css({ width: "auto", height: "auto" });
        $('.inputEditorContainer > .zoom-container').hide();
      });
      $("#editor-blob-left").css({ width: "auto", height: "auto" });
    }<commit_msg>[clientApp] Video blobs vr fixed in editor<commit_after>var clientApp = clientApp || {};
var editor = editor || {};
var helpers = clientApp.helpers || {};
var upload = clientApp.upload || {};
var zoomController = zoomController || {};
var scrollController = scrollController || {};

var editorBlobs;
var crop_info;

editor.printEditor = function(crop) {
  if (helpers.getOrigin() === 'upload') checkTiff();
  $("#inputEditorContainer").load("editor.html", function() {
    if (helpers.getOrigin() === "blobSet")
      editorBlobs = helpers.getFromStorage("demoSet");
    crop_info = crop;
    printEditorPanel();
  });
};

function printEditorPanel() {
  $(".editor-container").removeClass("di-none");
  var blobs = Object.keys(editorBlobs);

  printBlobSetList(blobs);

  $("#left-container").printEditorBlob(editorBlobs[blobs[0]], "left");
  $("#right-container").printEditorBlob(editorBlobs[blobs[0]], "right");

  if (areAllImages()) displayImagesControls(blobs, editorBlobs[blobs[0]])

  saveSelectedInput("right", blobs[0]);
  saveSelectedInput("left", blobs[0]);

  $(".editor-input-left-0, .editor-input-right-0").addClass("editor-input-selected");

  scrollController.addScrollingEvents();

  $("#left-container").attachDragger("left");
  $("#right-container").attachDragger("right");
}

function displayImagesControls(blobs, blob){
  $("#zoom-container").removeClass("di-none");
  if (blobs.length > 1) loadMultiBlobControls();
  else if (blobs.length == 1 && ((blob.format == "image" && !isTiff(blob)) || blob.vr)) loadSingleBlobControls($("#editor-blob-left"));
}

function saveSelectedInput(side, index) {
  blobsKeys = Object.keys(editorBlobs);
  helpers.addToStorage("selectedInput-" + side, {
    text: "editor-input-" + side + "-" + index,
    src: blobsKeys[blobsKeys.indexOf(index)],
    format: editorBlobs[index].format
  });
}

function isTiff(blob){
  var type = blob.blob.split(";")[0].split("/")[1];
  if (type === "tiff" || type === "tif") return true;
  return false;
}

// Print the chosen set blob list
function printBlobSetList(blobs) {
  for (let i = 0; i < blobs.length; i++) {
    $(".inputListContainerLeft").append(
      "<span class=editor-input-left-" +
        i +
        ">" +
        ddl.inputs[i].description +
        "</span>"
    );
    $(".editor-input-left-" + i).addClass("editor-input");
    $(".editor-input-left-" + i).loadInputEvents(
      Object.keys(editorBlobs)[i],
      "left"
    );
    $(".inputListContainerRight").append(
      "<span class=editor-input-right-" +
        i +
        ">" +
        ddl.inputs[i].description +
        "</span>"
    );
    $(".editor-input-right-" + i).addClass("editor-input");
    $(".editor-input-right-" + i).loadInputEvents(
      Object.keys(editorBlobs)[i],
      "right"
    );
  }
  $(".inputListContainerLeft").loadInputsContainerEvent("left");
  $(".inputListContainerRight").loadInputsContainerEvent("right");
}

// Single blob sets controls
function loadSingleBlobControls($img) {
  if (ddl.inputs[0].type == "image") displayCrop($img)
  zoomController.singleBlob();
}

function displayCrop($img){
  $(".blobsList-left").append(
    "<input type=checkbox id=crop-btn class=hand><label for=crop-btn class=hand>Crop</label>"
  );
  if (crop_info == null) {
    $img.cropper({
      viewMode: 1,
      autoCrop: false,
      dragMode: "move",
      wheelZoomRatio: 0.1,
      responsive: true,
      toggleDragModeOnDblclick: false,
      ready: setNaturalZoom
    });
  } else {
    $img.cropper({
      viewMode: 1,
      autoCrop: true,
      dragMode: "move",
      wheelZoomRatio: 0.1,
      responsive: true,
      data: crop_info,
      ready: getData,
      toggleDragModeOnDblclick: false
    });
    $("#crop-btn").prop("checked", true);
    $("#canvas-container").removeClass("di-none");
  }
  $img.on("cropmove cropstart cropend", function (e) {
    if ($("#crop-btn").prop("checked")) {
      var croppedImage = $("#left-container > img").cropper("getCroppedCanvas");
      $("#canvas-container").html($(croppedImage));
    }
  });
  $img.on("zoom", function (e) {
    if (e.ratio >= 0.25 && e.ratio <= 16) {
      let selector = "#canvas-container > canvas, .blobEditorImage, .cropper-container img";
      helpers.checkInterpolation(e.ratio, selector);

      $("#editor-zoom").val(e.ratio);
      $("#editor-zoom-value").html(e.ratio.toFixed(2) + "x");
      if ($("#crop-btn").prop("checked")) {
        var croppedImage = $("#left-container > img").cropper(
          "getCroppedCanvas"
        );
        $("#canvas-container").html($(croppedImage));
      }
    } else {
      e.preventDefault();
    }
  });
  addCropEvent();
}

function setNaturalZoom() {
  $("#editor-blob-left").cropper('zoomTo', 1);
}

function getData() {
  var imgData = $("#editor-blob-left").cropper("getImageData");
  var zoom = imgData.height / imgData.naturalHeight;
  $("#editor-zoom").val(zoom);
  $("#editor-zoom-value").html(zoom.toFixed(2) + "px");
  $("#editor-blob-left").cropper('zoomTo', zoom);
}

// Multiple blob sets controls
function loadMultiBlobControls() {
  $(".blobsList-left").append(
    "<input type=checkbox id=compare-btn class=hand><label for=compare-btn>Compare</label>"
  );
  zoomController.multiBlob();
  addCompareEvent();
}

// Check if all blobs are images or have visual representation (image)
function areAllImages() {
  var blobs = Object.keys(editorBlobs);
  for (var i = 0; i < blobs.length; i++) {
    if ((editorBlobs[blobs[i]].format != "image" && !editorBlobs[blobs[i]].vr) || editorBlobs[blobs[i]].format == "audio" ||  editorBlobs[blobs[i]].format == "video")
      return false;
  }
  return true;
}

$.fn.printEditorBlob = function(editorBlob, side) {
  var blobType = editorBlob.format;
  var blobSrc = editorBlob.vr ? editorBlob.vr : editorBlob.blob;
  if (blobType == "video") {
    $(this).empty();
    if (editorBlob.vr) {
      $(this).append("<img src=" + blobSrc + " id=editor-blob-" + side + " class=blobEditorVideo controls></img>");
    } else {
      $(this).append("<video src=" + blobSrc + " id=editor-blob-" + side + " class=blobEditorVideo controls></video>");
    }
  } else if (blobType == "audio") {
    $(this).empty();
    var audioThumbnail = editorBlob.thumbnail ? editorBlob.thumbnail : "assets/non_viewable_data.png";
    $(this).append("<img src=" + audioThumbnail + " class=audioThumbnail><br><audio src=" + editorBlob.blob + " id=editor-blob-" + side + " class=blobEditorAudio controls></audio>");
  } else {
    if (isPreviousBlobImg(side)) {
      $("#editor-blob-" + side).attr("src", blobSrc);
      $("#editor-blob-" + side).on('load', function(e) {
        $("#editor-blob-" + side).width($(this)[0].naturalWidth * $("#editor-zoom").val());
        $("#editor-blob-" + side).height($(this)[0].naturalHeight * $("#editor-zoom").val());
      });
      $("#editor-blob-" + side).displayImageSize();
    } else {
      $(this).empty();
      var img = "<img src=" + blobSrc + " id=editor-blob-" + side + " class=blobEditorImage draggable=false >";
      $(img).appendTo($(this));
      $(img).displayImageSize();
      $("#editor-blob-left").on("error", function() {
        $(this).attr("src", "assets/non_viewable_data.png");
        $("#editor-blob-left").css({ width: "auto", height: "auto" });
        $('.inputEditorContainer > .zoom-container').hide();
      });
      $("#editor-blob-left").css({ width: "auto", height: "auto" });
    }
{'fraction_non_alphanumeric': 0.20252473558512454, 'fraction_numerical': 0.0040941658137154556, 'mean_word_length': 3.6764518187619655, 'pattern_counts': {'":': 0, '<': 45, '<?xml version=': 0, '>': 51, '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': '3731077', 'n_tokens_mistral': 4805, 'n_tokens_neox': 4770, 'n_words': 828}