media.js 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171
  1. /*******************************************************************************
  2. * KindEditor - WYSIWYG HTML Editor for Internet
  3. * Copyright (C) 2006-2011 kindsoft.net
  4. *
  5. * @author Roddy <luolonghao@gmail.com>
  6. * @site http://www.kindsoft.net/
  7. * @licence http://www.kindsoft.net/license.php
  8. *******************************************************************************/
  9. KindEditor.plugin('media', function(K) {
  10. var self = this, name = 'media', lang = self.lang(name + '.'),
  11. allowMediaUpload = K.undef(self.allowMediaUpload, true),
  12. allowFileManager = K.undef(self.allowFileManager, false),
  13. formatUploadUrl = K.undef(self.formatUploadUrl, true),
  14. extraParams = K.undef(self.extraFileUploadParams, {}),
  15. filePostName = K.undef(self.filePostName, 'imgFile'),
  16. uploadJson = K.undef(self.uploadJson, self.basePath + 'php/upload_json.php');
  17. self.plugin.media = {
  18. edit : function() {
  19. var html = [
  20. '<div style="padding:20px;">',
  21. //url
  22. '<div class="ke-dialog-row">',
  23. '<label for="keUrl" style="width:60px;">' + lang.url + '</label>',
  24. '<input class="ke-input-text" type="text" id="keUrl" name="url" value="" style="width:160px;" /> &nbsp;',
  25. '<input type="button" class="ke-upload-button" value="' + lang.upload + '" /> &nbsp;',
  26. '<span class="ke-button-common ke-button-outer">',
  27. '<input type="button" class="ke-button-common ke-button" name="viewServer" value="' + lang.viewServer + '" />',
  28. '</span>',
  29. '</div>',
  30. //width
  31. '<div class="ke-dialog-row">',
  32. '<label for="keWidth" style="width:60px;">' + lang.width + '</label>',
  33. '<input type="text" id="keWidth" class="ke-input-text ke-input-number" name="width" value="550" maxlength="4" />',
  34. '</div>',
  35. //height
  36. '<div class="ke-dialog-row">',
  37. '<label for="keHeight" style="width:60px;">' + lang.height + '</label>',
  38. '<input type="text" id="keHeight" class="ke-input-text ke-input-number" name="height" value="400" maxlength="4" />',
  39. '</div>',
  40. //autostart
  41. '<div class="ke-dialog-row">',
  42. '<label for="keAutostart">' + lang.autostart + '</label>',
  43. '<input type="checkbox" id="keAutostart" name="autostart" value="" /> ',
  44. '</div>',
  45. '</div>'
  46. ].join('');
  47. var dialog = self.createDialog({
  48. name : name,
  49. width : 450,
  50. height : 230,
  51. title : self.lang(name),
  52. body : html,
  53. yesBtn : {
  54. name : self.lang('yes'),
  55. click : function(e) {
  56. var url = K.trim(urlBox.val()),
  57. width = widthBox.val(),
  58. height = heightBox.val();
  59. if (url == 'http://' || K.invalidUrl(url)) {
  60. alert(self.lang('invalidUrl'));
  61. urlBox[0].focus();
  62. return;
  63. }
  64. if (!/^\d*$/.test(width)) {
  65. alert(self.lang('invalidWidth'));
  66. widthBox[0].focus();
  67. return;
  68. }
  69. if (!/^\d*$/.test(height)) {
  70. alert(self.lang('invalidHeight'));
  71. heightBox[0].focus();
  72. return;
  73. }
  74. var html = K.mediaImg(self.themesPath + 'common/blank.gif', {
  75. src : url,
  76. type : K.mediaType(url),
  77. width : width,
  78. height : height,
  79. autostart : autostartBox[0].checked ? 'true' : 'false',
  80. loop : 'true'
  81. });
  82. self.insertHtml(html).hideDialog().focus();
  83. }
  84. }
  85. }),
  86. div = dialog.div,
  87. urlBox = K('[name="url"]', div),
  88. viewServerBtn = K('[name="viewServer"]', div),
  89. widthBox = K('[name="width"]', div),
  90. heightBox = K('[name="height"]', div),
  91. autostartBox = K('[name="autostart"]', div);
  92. urlBox.val('http://');
  93. if (allowMediaUpload) {
  94. var uploadbutton = K.uploadbutton({
  95. button : K('.ke-upload-button', div)[0],
  96. fieldName : filePostName,
  97. extraParams : extraParams,
  98. url : K.addParam(uploadJson, 'dir=media'),
  99. afterUpload : function(data) {
  100. dialog.hideLoading();
  101. if (data.error === 0) {
  102. var url = data.url;
  103. if (formatUploadUrl) {
  104. url = K.formatUrl(url, 'absolute');
  105. }
  106. urlBox.val(url);
  107. if (self.afterUpload) {
  108. self.afterUpload.call(self, url, data, name);
  109. }
  110. alert(self.lang('uploadSuccess'));
  111. } else {
  112. alert(data.message);
  113. }
  114. },
  115. afterError : function(html) {
  116. dialog.hideLoading();
  117. self.errorDialog(html);
  118. }
  119. });
  120. uploadbutton.fileBox.change(function(e) {
  121. dialog.showLoading(self.lang('uploadLoading'));
  122. uploadbutton.submit();
  123. });
  124. } else {
  125. K('.ke-upload-button', div).hide();
  126. }
  127. if (allowFileManager) {
  128. viewServerBtn.click(function(e) {
  129. self.loadPlugin('filemanager', function() {
  130. self.plugin.filemanagerDialog({
  131. viewType : 'LIST',
  132. dirName : 'media',
  133. clickFn : function(url, title) {
  134. if (self.dialogs.length > 1) {
  135. K('[name="url"]', div).val(url);
  136. if (self.afterSelectFile) {
  137. self.afterSelectFile.call(self, url);
  138. }
  139. self.hideDialog();
  140. }
  141. }
  142. });
  143. });
  144. });
  145. } else {
  146. viewServerBtn.hide();
  147. }
  148. var img = self.plugin.getSelectedMedia();
  149. if (img) {
  150. var attrs = K.mediaAttrs(img.attr('data-ke-tag'));
  151. urlBox.val(attrs.src);
  152. widthBox.val(K.removeUnit(img.css('width')) || attrs.width || 0);
  153. heightBox.val(K.removeUnit(img.css('height')) || attrs.height || 0);
  154. autostartBox[0].checked = (attrs.autostart === 'true');
  155. }
  156. urlBox[0].focus();
  157. urlBox[0].select();
  158. },
  159. 'delete' : function() {
  160. self.plugin.getSelectedMedia().remove();
  161. // [IE] 删除图片后立即点击图片按钮出错
  162. self.addBookmark();
  163. }
  164. };
  165. self.clickToolbar(name, self.plugin.media.edit);
  166. });