autodoc/www/js/autodoc.js

/* AutoDoc Javascript */

var conf = {
  default_hash: "home",
  openapi: "/v1",
  pageinit: {
    home: "page_load_home()"
  },
  home: {
    width: 4,
    curpage: 0,
    end: 0
  }
};

var temp = {
  upload: [],
  documentid: null
};

$(document).ready(function () {

  change_page();
  upload_zone_init();

  $(document).scroll(function () {
    page_home_scroll();
  });
});

$(window).bind("hashchange", function () {
  change_page();
});

function change_page() {
  var hash = document.location.hash.substr(1) || conf.default_hash;

  if (!$("#autodoc_tab_" + hash).length) {
    hash = conf.default_hash;
  }

  /* change menu highlights and content visibility */
  $("#autodoc_navbar")
    .find("a")
    .each(function (id, obj) {
      var curhash = $(obj)
        .attr("href")
        .substr(1);
      if (curhash == hash) {
        $(obj)
          .parent()
          .addClass("active");
        $("#autodoc_tab_" + curhash).removeClass("d-none");
      } else {
        $(obj)
          .parent()
          .removeClass("active");
        $("#autodoc_tab_" + curhash).addClass("d-none");
      }
    });

  if (conf.pageinit[hash]) {
    eval(conf.pageinit[hash]);
  }
}

function isvisible(obj) {
  var top_of_fileent = $(obj).offset().top;
  var bottom_of_fileent = $(obj).offset().top + $(obj).outerHeight();
  var bottom_of_screen = $(window).scrollTop() + $(window).innerHeight();
  var top_of_screen = $(window).scrollTop();

  if (bottom_of_screen > top_of_fileent && top_of_screen < bottom_of_fileent) {
    return true;
  }
  return false;
}

function page_load_home() {
  document_load();
}

function document_load() {
  if (conf.home.curpage == 0) {
    $("#autodoc_home_body").html("");
  }

  var tmpl = $("#autodoc_template_home");
  var row = $(tmpl)
    .find(".autodoc_template_home_row")
    .clone();

  $.getJSON(
    conf.openapi +
    "/documents?pageSize=" +
    conf.home.width +
    "&pageIndex=" +
    conf.home.curpage,
    null,
    function (data, textStatus, jqXHR) {
      // last document was loaded, stop scrolling
      if (data.length < conf.home.width) {
        conf.home.end = 1;
      }
      $.each(data, function (id, doc) {
        var col = $(tmpl)
          .find(".autodoc_template_home_col")
          .clone();
        $(col)
          .find(".autodoc_template_home_img")
          .attr(
            "src",
            conf.openapi +
            "/documents/" +
            doc.id +
            "/image?maxWidth=" +
            Math.floor(1000 / conf.home.width)
          );

        $(col)
          .find(".autodoc_template_home_owner")
          .html(doc.owner);

        $(col)
          .find(".autodoc_template_home_created")
          .html(doc.created);

        $(col)
          .find(".autodoc_template_home_name")
          .html(doc.name);

        $.each(doc.tags, function (id, tag) {
          $(col)
            .find(".autodoc_template_home_tag")
            .after(
              $(col)
                .find(".autodoc_template_home_tag")
                .clone()
                .html(tag)
            );
        });
        $(row).append(col);
      });
      $("#autodoc_home_body").append(row);
      // continue to load until out of browser.
      page_home_scroll();
    }
  );
}

function page_home_scroll() {
  // don't scroll if we've loaded the last document
  if (conf.home.end) {
    return;
  }
  if (isvisible($(".autodoc_template_home_col").last())) {
    console.log("scroll to page " + conf.home.curpage);
    conf.home.curpage++;
    document_load();
  }
}

function upload_zone_init() {
  $(window).on("dragover dragleave drop", function (e) { e.preventDefault() });

  $('.autodoc_upload_zone').on({
    dragenter: upload_zone_highlight,
    dragleave: upload_zone_normal,
    dragover: upload_zone_over,
    drop: upload_zone_drop
  });
}

function upload_zone_highlight(e) {
  $(e.target).addClass('autodoc_upload_zone_hover');
}

function upload_zone_over(e) {
  return true;
}

function upload_zone_normal(e) {
  $(e.target).removeClass('autodoc_upload_zone_hover');
}

function upload_zone_drop(e) {
  var ev = e.originalEvent;

  $.each(ev.dataTransfer.files, function (id, file) {
    console.log(file);
    var fileid = temp.upload.length;
    temp.upload.push({
      progress: 0,
      error: null,
      obj: file
    });
  });

  upload_handler();

}

function upload_handler() {

  if (temp.documentid == null) {
    $.post(conf.openapi + "/documents", {}, function (data) {
      temp.documentid = data.id;
    });
  }
  else {
    for(var id=0; id<temp.upload.length; id++) {
      var file = temp.upload[id];

      if ( file.progress != 100 ) {
        if ( file.progress == 0 ) {
          if (file.obj.type != 'application/pdf' && file.obj.type != 'image/png' && file.obj.type != 'image/jpeg') {
            file['progress'] = 100;
            file['error'] = 'invalid file type';
          }
          else {
            var reader = new FileReader();
            file['progress'] = 1;

            $(reader).on('load',      id, upload_read_event);
            $(reader).on('loadstart', id, upload_read_event);
            $(reader).on('loadend',   id, upload_read_event);
            $(reader).on('progress',  id, upload_read_event);
            $(reader).on('error',     id, upload_read_event);
            $(reader).on('abort',     id, upload_read_event);

            reader.readAsArrayBuffer(file.obj);
          }
        }
        break;
      }
    }
  }

  setTimeout(upload_handler, 1000);
}

function upload_read_event(e) {
  if ( e.type == 'progress' ) {
    if ( e.lengthComputable ) {
    var progress = Math.floor(e.originalEvent.loaded / e.originalEvent.total * 50);
    if ( progress < 1 ) { progress = 1; }
    if ( progress > 49 ) { progress = 49; }
    temp.upload[e.data]['progress'] = progress;
    }
  }
  else if ( e.type == 'load' ) {
    var xhr = new XMLHttpRequest();
    
    temp.upload[e.data]['progress'] = 50;
    
    $.ajax({
      type: 'POST',
      url: conf.openapi + "/documents/" + temp.documentid + "/data",
      data: e.target.result,
      context: e.data,
      beforeSend: function(XMLHttpRequest)
      {
        XMLHttpRequest.upload.addEventListener("progress", function(evt){
          if (evt.lengthComputable) {  
            var percentComplete = evt.loaded / evt.total;
            console.log("upload_progress_event", evt);
          }
        }, false); 
        
      },
      success: function(data){
        console.log("upload_complete",data);
      }
    });
    

    $(xhr.upload).on('progress', e.id, function(e) {
      if ( e.lengthComputable ) {
        var progress = Math.floor(e.originalEvent.loaded / e.originalEvent.total * 50);
        if ( progress < 1 ) { progress = 1; }
        if ( progress > 49 ) { progress = 49; }
        temp.upload[e.data]['progress'] = 50 + progress;
      }
    });

    $(xhr.upload).on('load', e.id, function(e) {
      temp.upload[e.data]['progress'] = 100;
      console.log(e);
    });

    xhr.open("POST", conf.openapi + "/documents/" + temp.documentid + "/data");
    xhr.send(e.target.result);

  }

  console.log(e);
}

function upload_status() {

  $.each(temp.upload, function (id, file) {
    if ($('.autodoc_upload_status_' + id) === 'undefined') {
      var obj = $(".autodoc_template_progress").children().clone();
      $('.autodoc_upload_status').append(obj);
    }

    var obj = $('.autodoc_upload_status_' + id).children();

    if (file.error != null) {
      $(obj).html(file.obj.name + ': ' + file.error);
      $(obj).css('width', '100%');
      $(obj).addClass('bg-danger');
      $(obj).removeClass("progress-bar-animated");
    }
    else if (file.progress == 100) {
      $(obj).html(file.obj.name);
      $(obj).addClass('bg-success');
      $(obj).removeClass('progress-bar-animated');
      $(obj).css('width', '100%');
    }
    else if (file.progress < 50) {
      $(obj).html(file.obj.name + ': ' + 'reading file');
      $(obj).css('width', file.progress + '%');
    }
    else {
      $(obj).html(file.obj.name + ': ' + 'sending file');
      $(obj).css('width', file.progress + '%');

    }
  });
  setTimeout(upload_status, 1000);
}