view.js 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  1. /**
  2. * @name View
  3. * @description Used to view single photos with view.php
  4. * @author Tobias Reich
  5. * @copyright 2014 by Tobias Reich
  6. */
  7. var header = $("header"),
  8. headerTitle = $("#title"),
  9. imageview = $("#imageview"),
  10. api_path = "php/api.php",
  11. infobox = $("#infobox");
  12. $(document).ready(function(){
  13. /* Event Name */
  14. if (mobileBrowser()) event_name = "touchend";
  15. else event_name = "click";
  16. /* Window */
  17. $(window).keydown(key);
  18. /* Infobox */
  19. $(document).on(event_name, "#infobox .header a", function() { hideInfobox() });
  20. $(document).on(event_name, "#infobox_overlay", function() { hideInfobox() });
  21. $("#button_info").on(event_name, function() { showInfobox() });
  22. /* Direct Link */
  23. $("#button_direct").on(event_name, function() {
  24. link = $("#imageview #image").css("background-image").replace(/"/g,"").replace(/url\(|\)$/ig, "");
  25. window.open(link,"_newtab");
  26. });
  27. loadPhotoInfo(gup("p"));
  28. });
  29. function key(e) {
  30. code = (e.keyCode ? e.keyCode : e.which);
  31. if (code===27&&visibleInfobox()) { hideInfobox(); e.preventDefault(); }
  32. }
  33. function visibleInfobox() {
  34. if (parseInt(infobox.css("right").replace("px", ""))<0) return false;
  35. else return true;
  36. }
  37. function isPhotoSmall(photo) {
  38. size = [
  39. ["width", false],
  40. ["height", false]
  41. ];
  42. if (photo.width<$(window).width()-60) size["width"] = true;
  43. if (photo.height<$(window).height()-100) size["height"] = true;
  44. if (size["width"]&&size["height"]) return true;
  45. else return false;
  46. }
  47. function showInfobox() {
  48. $("body").append("<div id='infobox_overlay' class='fadeIn'></div>");
  49. infobox.addClass("active");
  50. }
  51. function hideInfobox() {
  52. $("#infobox_overlay").removeClass("fadeIn").addClass("fadeOut");
  53. setTimeout(function() { $("#infobox_overlay").remove() }, 300);
  54. infobox.removeClass("active");
  55. }
  56. function loadPhotoInfo(photoID) {
  57. params = "function=getPhoto&photoID=" + photoID + "&albumID=0&password=''";
  58. $.ajax({type: "POST", url: api_path, data: params, dataType: "json", success: function(data) {
  59. if (!data.title) data.title = "Untitled";
  60. document.title = "Lychee - " + data.title;
  61. headerTitle.html(data.title);
  62. data.url = "uploads/big/" + data.url;
  63. imageview.attr("data-id", photoID);
  64. if (isPhotoSmall(data)) imageview.html("<div id='image' class='small' style='background-image: url(" + data.url + "); width: " + data.width + "px; height: " + data.height + "px; margin-top: -" + parseInt((data.height/2)-20) + "px; margin-left: -" + data.width/2 + "px;'></div>");
  65. else imageview.html("<div id='image' style='background-image: url(" + data.url + ");'></div>");
  66. imageview.removeClass("fadeOut").addClass("fadeIn").show();
  67. infobox.html(build.infoboxPhoto(data, true)).show();
  68. }, error: ajaxError });
  69. }
  70. function ajaxError(jqXHR, textStatus, errorThrown) {
  71. console.log(jqXHR);
  72. console.log(textStatus);
  73. console.log(errorThrown);
  74. }