media.js 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497
  1. TrexConfig.addTool(
  2. "media",
  3. {
  4. wysiwygonly: _TRUE,
  5. sync: _FALSE,
  6. status: _FALSE
  7. }
  8. );
  9. TrexMessage.addMsg({
  10. '@media.title': "멀티미디어",
  11. '@media.prev.url': "#iconpath/spacer2.gif?v=2",
  12. '@media.prev.url.tvpot': "#iconpath/img_multi_tvpot.gif?v=2",
  13. '@media.prev.url.wmp': "#iconpath/spacer2.gif?v=2"
  14. });
  15. Trex.Tool.Media = Trex.Class.create({
  16. $const: {
  17. __Identity: 'media'
  18. },
  19. $extend: Trex.Tool,
  20. oninitialized: function() {
  21. var _editor = this.editor;
  22. this.weave.bind(this)(
  23. new Trex.Button(this.buttonCfg),
  24. _NULL,
  25. function() {
  26. _editor.getSidebar().getEmbeder("media").execute();
  27. }
  28. );
  29. }
  30. });
  31. TrexConfig.addEmbeder(
  32. "media",
  33. {
  34. wysiwygonly: _TRUE,
  35. useCC: _FALSE,
  36. features: {
  37. left:250,
  38. top:65,
  39. width:458,
  40. height:568,
  41. resizable:"yes"
  42. },
  43. popPageUrl: "#host#path/pages/trex/multimedia.html",
  44. allowNetworkingFilter: _FALSE,
  45. allowNetworkingSites: []
  46. },
  47. function(root) {
  48. var _config = root.sidebar.embeder.media;
  49. _config.popPageUrl = TrexConfig.getUrl(_config.popPageUrl);
  50. _config.features = TrexConfig.getPopFeatures(_config.features);
  51. }
  52. );
  53. (function() {
  54. Trex.Embeder.Media = Trex.Class.create({
  55. $const: {
  56. __Identity: 'media'
  57. },
  58. $extend: Trex.Embeder,
  59. name: 'media',
  60. title: TXMSG("@media.title"),
  61. canResized: _TRUE,
  62. getCreatedHtml: function(data){
  63. var _source = data.code || this.makeSourceByUrl(data.url);
  64. return convertToHtml(_source);
  65. },
  66. getDataForEntry: function(){
  67. //This function is not needed anymore but absence may generate initializing error. So remained...
  68. },
  69. makeSourceByUrl: function(url) {
  70. var ext = this.getUrlExt(url);
  71. var size = getDefaultSizeByUrl(url);
  72. switch (ext) {
  73. case "swf":
  74. return this.generateHTMLForFlash(url, size);
  75. case "mp3":
  76. case "wma":
  77. case "asf":
  78. case "asx":
  79. case "mpg":
  80. case "mpeg":
  81. case "wmv":
  82. case "avi":
  83. return this.generateHTMLForMoviePlayer(url, size);
  84. case "mov":
  85. return this.generateHTMLForQuicktime(url, size);
  86. case 'jpg':
  87. case 'bmp':
  88. case 'gif':
  89. case 'png':
  90. return this.generateHTMLForImage(url, size);
  91. default:
  92. var iframeHtml = this.generateHTMLIfIframeSource(url, size);
  93. if (iframeHtml) {
  94. return iframeHtml;
  95. }
  96. return this.generateHTMLForDefaultEmbed(url, size);
  97. }
  98. },
  99. getUrlExt: function(url) {
  100. return url.split(".").pop().split("?")[0].toLowerCase();
  101. },
  102. getAllowScriptAccess: function(url) {
  103. var allowScriptAccessAttr = " allowScriptAccess='never'";
  104. if (this.config.allowNetworkingFilter && isAllowNetworkingSite(url, this.config) == _FALSE) {
  105. allowScriptAccessAttr += " allowNetworking='internal'";
  106. }
  107. return allowScriptAccessAttr;
  108. },
  109. generateHTMLForDefaultEmbed: function (url, size) {
  110. return "<embed src=\"" + url + "\" width='" + size.width + "' height='" + size.height + "' " + this.getAllowScriptAccess(url) + " ></embed>";
  111. },
  112. generateHTMLForImage: function (url, size) {
  113. return "<img src=\"" + url + "\" border=\"0\"/>";
  114. },
  115. generateHTMLForFlash: function (url, size) {
  116. return "<embed src=\"" + url + "\" quality='high' " + this.getAllowScriptAccess(url) + " type='application/x-shockwave-flash' allowfullscreen='true' pluginspage='http://www.macromedia.com/go/getflashplayer' wmode='transparent' width='" + size.width + "' height='" + size.height + "'></embed>";
  117. },
  118. generateHTMLForMoviePlayer: function (url, size) {
  119. return "<embed src=\"" + url + "\" type=\"application/x-mplayer2\" pluginspage=\"http://www.microsoft.com/Windows/MediaPlayer/\" width='" + size.width + "' height='" + size.height + "'></embed>";
  120. },
  121. generateHTMLForQuicktime: function (url, size) {
  122. return "<embed src=\"" + url + "\" type=\"video/quicktime\" pluginspage=\"http://www.apple.com/quicktime/download/indext.html\" width='" + size.width + "' height='" + size.height + "'></embed>";
  123. },
  124. generateHTMLIfIframeSource: function(url, size) {
  125. var tvpotKey = getTvPotKey(url);
  126. if (tvpotKey) {
  127. return "<iframe src=\"http://videofarm.daum.net/controller/video/viewer/Video.html?play_loc=undefined&vid=" + tvpotKey + "\" width='"+size.width+"' height='"+size.height+"' frameborder=\"0\" allowfullscreen></iframe>";
  128. }
  129. var youtubeMovieKey = getYouTubeMovieKey(url);
  130. if (youtubeMovieKey) {
  131. return "<iframe src=\"http://www.youtube.com/embed/" + youtubeMovieKey + "\" width='"+size.width+"' height='"+size.height+"' frameborder=\"0\" allowfullscreen></iframe>";
  132. }
  133. return _NULL;
  134. }
  135. });
  136. Trex.register("filter > media ", function(editor, toolbar, sidebar){
  137. var _config = sidebar.embeders.media.config;
  138. editor.getDocParser().registerFilter('filter/embeder/media', {
  139. 'text@load': function(contents){
  140. return contents;
  141. },
  142. 'source@load': function(contents){
  143. return convertToHtml(contents);
  144. },
  145. 'html@load': function(contents){
  146. return convertToHtml(contents);
  147. },
  148. 'text4save': function(contents){
  149. return contents;
  150. },
  151. 'source4save': function(contents){
  152. contents = convertFromHtml(contents);
  153. contents = addFlashOptAllowNetworking(contents, _config);
  154. return contents;
  155. },
  156. 'html4save': function(contents){
  157. contents = convertFromHtml(contents);
  158. contents = addFlashOptAllowNetworking(contents, _config);
  159. return contents;
  160. },
  161. 'text2source': function(contents){
  162. return contents;
  163. },
  164. 'text2html': function(contents){
  165. return contents;
  166. },
  167. 'source2text': function(contents){
  168. return contents;
  169. },
  170. 'source2html': function(contents){
  171. return convertToHtml(contents);
  172. },
  173. 'html2text': function(contents){
  174. return convertFromHtml(contents);
  175. },
  176. 'html2source': function(contents){
  177. return convertFromHtml(contents);
  178. }
  179. });
  180. });
  181. function isAllowNetworkingSite(url, config) {
  182. var _matchs, host, i, len;
  183. host = "";
  184. _matchs = /[\/]*\/\/([^\/]+)\//i.exec(url);
  185. if (_matchs && _matchs[1]) {
  186. host = _matchs[1];
  187. }
  188. len = config.allowNetworkingSites.length;
  189. for (i = 0; i < len; i += 1) {
  190. if (host == config.allowNetworkingSites[i].host) {
  191. return _TRUE;
  192. }
  193. }
  194. return _FALSE;
  195. }
  196. function addFlashOptAllowNetworking (content, config) {
  197. var filteredContent;
  198. if (config.allowNetworkingFilter == _FALSE) {
  199. return content;
  200. }
  201. filteredContent = content.replace(/(<object[^>]*>)((?:\n|.)*?)(<\/object>)/gi, function(match, start, param, end) {
  202. var _matchs, _matchsForUrl;
  203. var isBlockContent = _FALSE;
  204. _matchs = /data[\s]*=[\s"']*(http:\/\/[^\/]+\/)[^("'\s)]+/i.exec(start);
  205. if(_matchs && _matchs.length == 2) {
  206. _matchsForUrl = _matchs[1];
  207. if (isAllowNetworkingSite(_matchsForUrl, config) === _FALSE){
  208. isBlockContent = _TRUE;
  209. }
  210. }
  211. _matchs = /<param[^>]*=[^\w]*movie[^\w]+[^>]*>/i.exec(param);
  212. if (_matchs && _matchs[0]) {
  213. _matchsForUrl = /\s+value=["']?([^\s"']*)["']?/i.exec(_matchs[0]);
  214. if (_matchsForUrl && _matchsForUrl[1]) {
  215. if (isAllowNetworkingSite(_matchsForUrl[1], config) === _FALSE) {
  216. isBlockContent = _TRUE;
  217. }
  218. }
  219. }
  220. _matchs = /<param[^>]*=[^\w]*src[^\w]+[^>]*>/i.exec(param);
  221. if (_matchs && _matchs[0]) {
  222. _matchsForUrl = /\s+value=["']?([^\s"']*)["']?/i.exec(_matchs[0]);
  223. if (_matchsForUrl && _matchsForUrl[1]) {
  224. if (isAllowNetworkingSite(_matchsForUrl[1], config) === _FALSE) {
  225. isBlockContent = _TRUE;
  226. }
  227. }
  228. }
  229. if (isBlockContent === _TRUE) {
  230. param = param.replace(/<param[^>]*=[^\w]*allowNetworking[^\w]+[^>]*>/i, "");
  231. param = '<param name="allowNetworking" value="internal" />'.concat(param);
  232. }
  233. return start + param + end;
  234. });
  235. filteredContent = filteredContent.replace(/(<embed)([^>]*)(><\/embed>|\/>)/gi, function(match, start, attr, end) { //NOTE: #FTDUEDTR-1071 -> #FTDUEDTR-1105
  236. var _matchs = /\s+src=["']?([^\s"']*)["']?/i.exec(attr);
  237. if (_matchs && _matchs[1]) {
  238. if (isAllowNetworkingSite(_matchs[1], config)) {
  239. return start + attr + end;
  240. }
  241. }
  242. attr = attr.replace(/\s+allowNetworking=["']?[\w]*["']?/i, "").concat(' allowNetworking="internal"');
  243. return start + attr + end;
  244. });
  245. return filteredContent;
  246. }
  247. function convertFromHtml(content){
  248. var _matchs;
  249. var _regLoad = new RegExp("<(?:img|IMG)[^>]*txc-media[^>]*\/?>", "gim");
  250. var tempContent = content;
  251. while ((_matchs = _regLoad.exec(tempContent)) != _NULL) {
  252. var _html = _matchs[0];
  253. var _source = getSourceByExt(_html);
  254. if (!$tx.msie && _source.indexOf("$") > -1) {
  255. _source = _source.replace(/\$/g, "$$$$");
  256. }
  257. content = content.replace(_html, _source);
  258. }
  259. return content;
  260. }
  261. function convertToHtml(content) {
  262. if ($tx.msie) { //NOTE: #FTDUEDTR-366 + #FTDUEDTR-372 -> #FTDUEDTR-403
  263. if ($tx.msie_ver < 10) {
  264. content = content.replace(/<iframe[^>]*src=("|'|)https?:\/\/www\.youtube\.com\/embed\/(\w+)\1[^>]*><\/iframe>/i, function (html, quote, vid) {
  265. var matched, width, height;
  266. matched = html.match(/\swidth=['"]?(\d+)/);
  267. width = (matched && matched[1]) || "560";
  268. matched = html.match(/\sheight=['"]?(\d+)/);
  269. height = (matched && matched[1]) || "315";
  270. return '<object width="' + width + '" height="' + height + '"><param name="movie" ' + 'value="https://www.youtube.com/v/' + vid + '?version=3&amp;hl=ko_KR" /><param name="allowFullScreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="wmode" value="transparent" /><embed src="https://www.youtube.com/v/' + vid + '?version=3&amp;hl=ko_KR" type="application/x-shockwave-flash" width="' + width + '" height="' + height + '" allowscriptaccess="always" allowfullscreen="true" wmode="transparent"></embed></object>';
  271. });
  272. }
  273. if(/<object/.test(content) && /<embed[^>]*type=['"]application\/x-shockwave-flash['"][^>]*>/i.test(content) &&!/<object[^>]*type=['"]application\/x-shockwave-flash['"][^>]*>/i.test(content)) {
  274. var index = content.indexOf('>');
  275. content = content.substring(0,index)+ ' type="application\/x-shockwave-flash"' + content.substring(index);
  276. }
  277. // content = content.replace(/(<object[^>]*>)((?:\n|.)*?)(<\/object>)/gi, function(match, start, param, end) {
  278. // param = param.replace(/<param[^>]*=[^\w]*wmode[^\w]+[^>]*>/i, "");
  279. // param = param.replace(/<param[^>]*=[^\w]*play[^\w]+[^>]*>/i, "");
  280. // param = '<param name="wmode" value="transparent" />'.concat(param);
  281. // return start + param + end;
  282. // });
  283. // content = content.replace(/(<embed)([^>]*)(>)/gi, function (match, start, attr, end) {
  284. // attr = attr.replace(/\s+wmode=("|'|)\w*\1/i, '');
  285. // attr += ' wmode=transparent';
  286. // return start + attr + end;
  287. // });
  288. return content;
  289. } else {
  290. var _matchs, _source, _html, _embed;
  291. var tempContent = content;
  292. /* Substitute <embed tag within script to <xxembed */
  293. var _regScript = new RegExp("<(?:script)[^>]*>[\\S\\s]*?(<(?:embed|EMBED)[^>]*src=[^>]*>)[\\S\\s]*?<\/(?:script)>", "gim");
  294. while ((_matchs = _regScript.exec(tempContent)) != _NULL) {
  295. _source = _matchs[0];
  296. _html = _source.replace(/<embed/i, "<xxembed");
  297. content = content.replace(_source, _html);
  298. }
  299. var _regLoad = new RegExp("<(?:object|OBJECT)[^>]*>[\\S\\s]*?(<(?:embed|EMBED)[^>]*src=[^>]*>)[\\S\\s]*?<\/(?:object|OBJECT)>", "gim");
  300. while ((_matchs = _regLoad.exec(tempContent)) != _NULL) {
  301. _source = _matchs[0];
  302. _embed = _matchs[1];
  303. _html = getHtmlByExt(_source, _embed);
  304. content = content.replace(_source, _html);
  305. }
  306. _regLoad = new RegExp("<(?:embed|EMBED)[^>]*src=[^>]*(?:\/?>|><\/(?:embed|EMBED)>)", "gim");
  307. while ((_matchs = _regLoad.exec(tempContent)) != _NULL) {
  308. _source = _matchs[0];
  309. _embed = _matchs[0];
  310. _html = getHtmlByExt(_source, _embed);
  311. content = content.replace(_source, _html);
  312. }
  313. content = content.replace(/<xxembed/i, "<embed");
  314. return content;
  315. }
  316. }
  317. function getHtmlByExt(source, embed) {
  318. var _attrs = Trex.Util.getAllAttributesFromEmbed(embed);
  319. var _url = _attrs['src'];
  320. var _width = _attrs['width'].isPercent()?_attrs['width']:(_attrs['width'] || " ").parsePx();
  321. var _height = _attrs['height'].isPercent()?_attrs['height']:(_attrs['height'] || " ").parsePx();
  322. if(parseInt(_width, 10) === 0 || parseInt(_height, 10) ===0) {
  323. var _size = getDefaultSizeByUrl(_url);
  324. _width = _size.width;
  325. _height = _size.height;
  326. }
  327. /* make new embed source */
  328. var _newEmbedSrc = "<embed";
  329. for( var name in _attrs ){
  330. if (_attrs.hasOwnProperty(name)) {
  331. _newEmbedSrc += " " + name + "=\""+_attrs[name]+"\"";
  332. }
  333. }
  334. _newEmbedSrc += ">";
  335. /* If source has 'object' then it is needed to add 'object' TAG */
  336. var arr = source.split(embed);
  337. source = arr[0] + _newEmbedSrc;
  338. for( var i = 1; i < arr.length; i++){
  339. source += arr[i];
  340. }
  341. var _prev = getPreviewByUrl(_url);
  342. return "<img src=\"" + _prev.imageSrc + "\" width=\"" + _width + "\" height=\"" + _height + "\" border=\"0\" class=\"tx-entry-embed txc-media" + _prev.className + "\" ld=\"" + encodeURIComponent(source) + "\"/>";
  343. }
  344. function getSourceByExt(html) {
  345. var _attrs = Trex.Util.getAllAttributes(html);
  346. var _longdesc = _attrs['ld'];
  347. if(!_longdesc || _longdesc.length == 0) {
  348. return "";
  349. }
  350. var _width = _attrs['width'];
  351. var _height = _attrs['height'];
  352. var _source = decodeURIComponent(_longdesc);
  353. var _embed = _source;
  354. if(_source.indexOf("object") > -1 || _source.indexOf("OBJECT") > -1) {
  355. var _matchs;
  356. var _regLoad = new RegExp("<(?:embed|EMBED)[^>]*src=[^>]*(?:\/?>|><\/(?:embed|EMBED)>)", "gim");
  357. while ((_matchs = _regLoad.exec(_source)) != _NULL) {
  358. _embed = _matchs[0];
  359. }
  360. }
  361. _attrs = Trex.Util.getAllAttributes(_embed);
  362. var _url = _attrs['src'];
  363. var _size = getDefaultSizeByUrl(_url);
  364. if(isNaN(_width)) {
  365. _source = Trex.String.changeAttribute(_source, "width", _width, _size.width);
  366. } else {
  367. _source = Trex.String.changeAttribute(_source, "width", _width, _width);
  368. }
  369. if(isNaN(_height)) {
  370. _source = Trex.String.changeAttribute(_source, "height", _height, _size.height);
  371. } else {
  372. _source = Trex.String.changeAttribute(_source, "height", _height, _height);
  373. }
  374. return _source;
  375. }
  376. function getTvPotKey(url) {
  377. return (url.match(/http:\/\/tvpot\.daum\.net\/v\/(.{23})/) || [])[1];
  378. }
  379. function getYouTubeMovieKey(url) {
  380. return (url.match(/(?:http:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=)?(.+)/) || [])[1];
  381. }
  382. function getDefaultSizeByUrl(url) {
  383. var _width, _height;
  384. if(url.indexOf("api.bloggernews.media.daum.net/static/recombox1") > -1) {
  385. _width = 400;
  386. _height = 80;
  387. } else if(url.indexOf("flvs.daum.net/flvPlayer") > -1) {
  388. _width = 502;
  389. _height = 399;
  390. } else if(url.indexOf('youtube') != -1 || url.indexOf('youtu.be') != -1 || url.indexOf('tvpot.daum.net') != -1) {
  391. var size = TrexConfig.get('size');
  392. if (size.contentWidth > 640) {
  393. _width = 640;
  394. _height = 360;
  395. } else {
  396. _width = 560;
  397. _height = 315;
  398. }
  399. // else 853x480
  400. } else {
  401. var _ext = url.split(".").pop().split("?")[0].toLowerCase();
  402. switch (_ext) {
  403. case "mp3":
  404. case "wma":
  405. case "asf":
  406. case "asx":
  407. _width = 280;
  408. _height = 45;
  409. break;
  410. case "mpg":
  411. case "mpeg":
  412. case "wmv":
  413. case "avi":
  414. _width = 320;
  415. _height = 285;
  416. break;
  417. default:
  418. _width = 400;
  419. _height = 300;
  420. break;
  421. }
  422. }
  423. return {
  424. width: _width,
  425. height: _height
  426. };
  427. }
  428. function getPreviewByUrl(url) {
  429. var _class = "";
  430. var _image = "";
  431. if(url.indexOf("api.bloggernews.media.daum.net/static/recombox1") > -1) {
  432. _class = "";
  433. _image = TXMSG("@media.prev.url");
  434. } else if(url.indexOf("flvs.daum.net/flvPlayer") > -1) {
  435. _class = " txc-media-tvpot";
  436. _image = TXMSG("@media.prev.url.tvpot");
  437. } else {
  438. var _ext = url.split(".").pop().split("?")[0].toLowerCase();
  439. switch (_ext) {
  440. case "mp3":
  441. case "wma":
  442. case "asf":
  443. case "asx":
  444. _class = " txc-media-wmp";
  445. _image = TXMSG("@media.prev.url.wmp");
  446. break;
  447. case "mpg":
  448. case "mpeg":
  449. case "wmv":
  450. case "avi":
  451. _class = " txc-media-wmp";
  452. _image = TXMSG("@media.prev.url.wmp");
  453. break;
  454. default:
  455. _class = "";
  456. _image = TXMSG("@media.prev.url");
  457. break;
  458. }
  459. }
  460. return {
  461. className: _class,
  462. imageSrc: _image
  463. };
  464. }
  465. })();