如何使用媒体插件(而不是HTML选项)上传vimeo视频

Question

我正在开发Rails 2.3.8和最后一个版本的rails tinyMCE插件。

我希望用户有能力添加所有类型的视频到文本编辑器。就像现在一样，他们可以添加Youtube视频，也可以从电脑上传视频。

问题是Vimeo视频不仅创建了一个普通的HTML <object>代码，而且还为它们创建了一个iframe，如果我试图使用媒体插件导入其中一个，我将不得不粘贴这个视频，例如：http://vimeo.com/16430948，它将生成以下HTML (这是不起作用的)：

<object width="100" height="100" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000">
<param value="http://vimeo.com/16430948" name="src"><embed width="100" height="100" type="application/x-shockwave-flash" src="http://vimeo.com/16430948">
</object>

而Vimeo视频需要以下HTML才能显示：

<p><iframe frameborder="0" height="225" src="http://player.vimeo.com/video/16430948" width="400"></iframe></p>
<p>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" height="100" width="100">
<param name="src" value="http://vimeo.com/16430948" /><embed src="http://vimeo.com/16430948" width="100" height="100" type="application/x-shockwave-flash"></embed>
</object>

现在，--这是这两个生成的HTML?之间的区别--在我发布的第一段代码中缺少了iframe，所以它不能工作。

因此，问题是：如何将iframe添加到tinyMCE可编程性中，以便在嵌入Vimeo视频时自动添加？

Answer 1

那么，您应该使用编写自己的插件(非常简单)来检查用户所做的更改。当用户输入vimeo链接时，您只需从编辑器获取相关内容并将其放入一个新元素( iframe)。

您的代码应该如下所示(您必须修改它，但我相信您会得到正确的方向)：

// you may choose an other event to check for
ed.onChange.add(function(ed){

  var body = ed.getBody();

  // check for vimeo using jquery object
  $(body).find('param').each(function(index, Element){
    // vimeo adress is found in value
    if (this.value.search('http://vimeo.com') == -1) return;
    var node = this;
    var iframe_not_parent = 1;    
    while(node.nodeName !== 'body'){
      node = node.parentNode;
      if (node.nodeName !== 'iframe'){
        iframe_not_parent = 0; 
        break;
      }
    }

    // ok, this vimeo thing is not inside an iframe - put it inside
    if (iframe_not_parent){

        with(document.getElementById(iframe_id).contentWindow){         
          var new_iframe = document.createElement("iframe");
          this.parentNode.parentNode.append(new_iframe);
          new_iframe.append(this.parentNode);
        }
    }
  });
});