091.viewImage.js 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191
  1. /** This file is part of KCFinder project
  2. *
  3. * @desc Image viewer
  4. * @package KCFinder
  5. * @version 3.12
  6. * @author Pavel Tzonkov <sunhater@sunhater.com>
  7. * @copyright 2010-2014 KCFinder Project
  8. * @license http://opensource.org/licenses/GPL-3.0 GPLv3
  9. * @license http://opensource.org/licenses/LGPL-3.0 LGPLv3
  10. * @link http://kcfinder.sunhater.com
  11. */
  12. _.viewImage = function(data) {
  13. var ts = new Date().getTime(),
  14. dlg = false,
  15. images = [],
  16. showImage = function(data) {
  17. _.lock = true;
  18. $('#loading').html(_.label("Loading image...")).show();
  19. var url = $.$.escapeDirs(_.uploadURL + "/" + _.dir + "/" + data.name) + "?ts=" + ts,
  20. img = new Image(),
  21. i = $(img),
  22. w = $(window),
  23. d = $(document);
  24. onImgLoad = function() {
  25. _.lock = false;
  26. $('#files .file').each(function() {
  27. if ($(this).data('name') == data.name) {
  28. _.ssImage = this;
  29. return false;
  30. }
  31. });
  32. i.hide().appendTo('body');
  33. var o_w = i.width(),
  34. o_h = i.height(),
  35. i_w = o_w,
  36. i_h = o_h,
  37. goTo = function(i) {
  38. if (!_.lock) {
  39. var nimg = images[i];
  40. _.currImg = i;
  41. showImage(nimg);
  42. }
  43. },
  44. nextFunc = function() {
  45. goTo((_.currImg >= images.length - 1) ? 0 : (_.currImg + 1));
  46. },
  47. prevFunc = function() {
  48. goTo((_.currImg ? _.currImg : images.length) - 1);
  49. },
  50. t = $('<div></div>');
  51. i.detach().appendTo(t);
  52. t.addClass("img");
  53. if (!dlg) {
  54. var ww = w.width() - 60,
  55. closeFunc = function() {
  56. d.unbind('keydown').keydown(function(e) {
  57. return !_.selectAll(e);
  58. });
  59. dlg.dialog('destroy').detach();
  60. };
  61. if ((ww % 2)) ww++;
  62. dlg = _.dialog($.$.htmlData(data.name), t.get(0), {
  63. width: ww,
  64. height: w.height() - 36,
  65. position: [30, 30],
  66. draggable: false,
  67. nopadding: true,
  68. close: closeFunc,
  69. show: false,
  70. hide: false,
  71. buttons: [
  72. {
  73. text: _.label("Previous"),
  74. icons: {primary: "ui-icon-triangle-1-w"},
  75. click: prevFunc
  76. }, {
  77. text: _.label("Next"),
  78. icons: {secondary: "ui-icon-triangle-1-e"},
  79. click: nextFunc
  80. }, {
  81. text: _.label("Select"),
  82. icons: {primary: "ui-icon-check"},
  83. click: function(e) {
  84. d.unbind('keydown').keydown(function(e) {
  85. return !_.selectAll(e);
  86. });
  87. if (_.ssImage) {
  88. _.selectFile($(_.ssImage), e);
  89. }
  90. dlg.dialog('destroy').detach();
  91. }
  92. }, {
  93. text: _.label("Close"),
  94. icons: {primary: "ui-icon-closethick"},
  95. click: closeFunc
  96. }
  97. ]
  98. });
  99. dlg.addClass('kcfImageViewer').css('overflow', "hidden").parent().find('.ui-dialog-buttonpane button').get(2).focus();
  100. } else {
  101. dlg.prev().find('.ui-dialog-title').html($.$.htmlData(data.name));
  102. dlg.html(t.get(0));
  103. }
  104. dlg.unbind('click').click(nextFunc).disableTextSelect();
  105. var d_w = dlg.innerWidth(),
  106. d_h = dlg.innerHeight();
  107. if ((o_w > d_w) || (o_h > d_h)) {
  108. i_w = d_w;
  109. i_h = d_h;
  110. if ((d_w / d_h) > (o_w / o_h))
  111. i_w = parseInt((o_w * d_h) / o_h);
  112. else if ((d_w / d_h) < (o_w / o_h))
  113. i_h = parseInt((o_h * d_w) / o_w);
  114. }
  115. i.css({
  116. width: i_w,
  117. height: i_h
  118. }).show().parent().css({
  119. display: "block",
  120. margin: "0 auto",
  121. width: i_w,
  122. height: i_h,
  123. marginTop: parseInt((d_h - i_h) / 2)
  124. });
  125. $('#loading').hide();
  126. d.unbind('keydown').keydown(function(e) {
  127. if (!_.lock) {
  128. var kc = e.keyCode;
  129. if ((kc == 37)) prevFunc();
  130. if ((kc == 39)) nextFunc();
  131. }
  132. });
  133. };
  134. img.src = url;
  135. if (img.complete)
  136. onImgLoad();
  137. else {
  138. img.onload = onImgLoad;
  139. img.onerror = function() {
  140. _.lock = false;
  141. $('#loading').hide();
  142. _.alert(_.label("Unknown error."));
  143. d.unbind('keydown').keydown(function(e) {
  144. return !_.selectAll(e);
  145. });
  146. _.refresh();
  147. };
  148. }
  149. };
  150. $.each(_.files, function(i, file) {
  151. var i = images.length;
  152. if (file.thumb || file.smallThumb)
  153. images[i] = file;
  154. if (file.name == data.name)
  155. _.currImg = i;
  156. });
  157. showImage(data);
  158. return false;
  159. };