media.js 6.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184
  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, false),
  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 class="ke-dialog-content-inner">',
  21. //url
  22. '<div class="ke-dialog-row ke-clearfix">',
  23. '<label for="keUrl" class="row-left">' + lang.url + ':</label>',
  24. '<div class="row-right">',
  25. '<input class="ke-input-text" type="text" id="keUrl" name="url" value="" style="width:180px;" /> &nbsp;',
  26. '<input type="button" class="ke-upload-button" value="' + lang.upload + '" /> &nbsp;',
  27. '<span class="ke-button-common ke-button-outer">',
  28. '<input type="button" class="ke-button-common ke-button" name="viewServer" value="' + lang.viewServer + '" />',
  29. '</span>',
  30. '</div>',
  31. '</div>',
  32. //width
  33. '<div class="ke-dialog-row ke-clearfix">',
  34. '<label for="keWidth" class="row-left">' + lang.width + ':</label>',
  35. '<div class="row-right">',
  36. '<input type="text" id="keWidth" class="ke-input-text ke-input-number" name="width" value="550" maxlength="4" />',
  37. '</div>',
  38. '</div>',
  39. //height
  40. '<div class="ke-dialog-row ke-clearfix">',
  41. '<label for="keHeight" class="row-left">' + lang.height + ':</label>',
  42. '<div class="row-right">',
  43. '<input type="text" id="keHeight" class="ke-input-text ke-input-number" name="height" value="400" maxlength="4" />',
  44. '</div>',
  45. '</div>',
  46. //autostart
  47. '<div class="ke-dialog-row ke-clearfix" style="display:none;">',
  48. '<label for="keAutostart" class="row-left">' + lang.autostart + ':</label>',
  49. '<div class="row-right">',
  50. '<input type="checkbox" id="keAutostart" name="autostart" class="ke-input-checkbox" value="" /> ',
  51. '</div>',
  52. '</div>',
  53. '</div>'
  54. ].join('');
  55. var dialog = self.createDialog({
  56. name : name,
  57. width : Math.min(document.body.clientWidth, 450),
  58. height : 260,
  59. title : self.lang(name),
  60. body : html,
  61. yesBtn : {
  62. name : self.lang('yes'),
  63. click : function(e) {
  64. var url = K.trim(urlBox.val()),
  65. width = widthBox.val(),
  66. height = heightBox.val();
  67. var match = url.match(/^<iframe\s(.*?)src=('|")(.*?)('|")/);
  68. if(!match) {
  69. if (url == 'http://' || K.invalidUrl(url)) {
  70. K.options.errorMsgHandler(self.lang('invalidUrl'), "error");
  71. urlBox[0].focus();
  72. return;
  73. }
  74. }
  75. if (!/^\d*[%]?$/.test(width)) {
  76. K.options.errorMsgHandler(self.lang('invalidWidth'), "error");
  77. widthBox[0].focus();
  78. return;
  79. }
  80. if (!/^\d*[%]?$/.test(height)) {
  81. K.options.errorMsgHandler(self.lang('invalidHeight'), "error");
  82. heightBox[0].focus();
  83. return;
  84. }
  85. if(!match) {
  86. var html = K.mediaImg(self.themesPath + 'common/blank.gif', {
  87. src: url,
  88. type: K.mediaType(url),
  89. width: width,
  90. height: height,
  91. autostart: autostartBox[0].checked ? 'true' : 'false',
  92. loop: 'true'
  93. });
  94. } else {
  95. var html = '<iframe src="' + match[3] + '" frameborder="0" style="width:' + width + 'px;height:' + height + 'px;"></iframe>';
  96. }
  97. self.insertHtml(html).hideDialog().focus();
  98. }
  99. }
  100. }),
  101. div = dialog.div,
  102. urlBox = K('[name="url"]', div),
  103. viewServerBtn = K('[name="viewServer"]', div),
  104. widthBox = K('[name="width"]', div),
  105. heightBox = K('[name="height"]', div),
  106. autostartBox = K('[name="autostart"]', div);
  107. urlBox.val('http://');
  108. if (allowMediaUpload) {
  109. var uploadbutton = K.uploadbutton({
  110. button : K('.ke-upload-button', div)[0],
  111. fieldName : filePostName,
  112. extraParams : extraParams,
  113. url : K.addParam(uploadJson, 'fileType=media'),
  114. afterUpload : function(data) {
  115. dialog.hideLoading();
  116. if (data.code == "000") {
  117. var url = data.data.url;
  118. if (formatUploadUrl) {
  119. url = K.formatUrl(url, 'absolute');
  120. }
  121. urlBox.val(url);
  122. if (self.afterUpload) {
  123. self.afterUpload.call(self, url, data, name);
  124. }
  125. K.options.errorMsgHandler(self.lang('uploadSuccess'), "ok");
  126. } else {
  127. K.options.errorMsgHandler(data.message, "error", "error");
  128. }
  129. },
  130. afterError : function(html) {
  131. dialog.hideLoading();
  132. self.errorDialog(html);
  133. }
  134. });
  135. uploadbutton.fileBox.change(function(e) {
  136. dialog.showLoading(self.lang('uploadLoading'));
  137. uploadbutton.submit();
  138. });
  139. } else {
  140. K('.ke-upload-button', div).hide();
  141. }
  142. if (allowMediaUpload && allowFileManager) {
  143. viewServerBtn.click(function(e) {
  144. self.loadPlugin('filemanager', function() {
  145. self.plugin.filemanagerDialog({
  146. dirName : 'media',
  147. clickFn : function(url) {
  148. K('[name="url"]', div).val(url);
  149. if (self.afterSelectFile) {
  150. self.afterSelectFile.call(self, url);
  151. }
  152. }
  153. });
  154. });
  155. });
  156. } else {
  157. K("#keUrl").css("width", "280px");
  158. viewServerBtn.hide();
  159. }
  160. var img = self.plugin.getSelectedMedia();
  161. if (img) {
  162. var attrs = K.mediaAttrs(img.attr('data-ke-tag'));
  163. urlBox.val(attrs.src);
  164. widthBox.val(K.removeUnit(img.css('width')) || attrs.width || 0);
  165. heightBox.val(K.removeUnit(img.css('height')) || attrs.height || 0);
  166. autostartBox[0].checked = (attrs.autostart === 'true');
  167. }
  168. urlBox[0].focus();
  169. urlBox[0].select();
  170. },
  171. 'delete' : function() {
  172. self.plugin.getSelectedMedia().remove();
  173. // [IE] 删除图片后立即点击图片按钮出错
  174. self.addBookmark();
  175. }
  176. };
  177. self.clickToolbar(name, self.plugin.media.edit);
  178. });