YOUTUBE iframe

[Zuben45]

Hi, I added this code:

data[fields[i].getAttribute(ATTRIBUTE_FIELDS)] = fields[i].value.replace("watch?v=","embed/");

(wysihtml5);(function(wysihtml5) {
  var NODE_NAME = "IFRAME";

  wysihtml5.commands.insertIframe = {
    exec: function(composer, command, value) {
      value = typeof(value) === "object" ? value : { src: value };

      var doc     = composer.doc,
          iframe   = this.state(composer),
          textNode,
          i,
          parent;             
      if (iframe) {
        // Image already selected, set the caret before it and delete it
        composer.selection.setBefore(iframe);
        parent = iframe.parentNode;
        parent.removeChild(iframe);

        // and it's parent <a> too if it hasn't got any other relevant child nodes
        wysihtml5.dom.removeEmptyTextNodes(parent);
        if (parent.nodeName === "A" && !parent.firstChild) {
          composer.selection.setAfter(parent);
          parent.parentNode.removeChild(parent);
        }

        // firefox and ie sometimes don't remove the image handles, even though the image got removed
        wysihtml5.quirks.redraw(composer.element);
        return;
      }


      iframe = doc.createElement(NODE_NAME);

      for (i in value) {
        iframe[i] = value[i];
      }

      composer.selection.insertNode(iframe);
      if (wysihtml5.browser.hasProblemsSettingCaretAfterIframe()) {
        textNode = doc.createTextNode(wysihtml5.INVISIBLE_SPACE);
        composer.selection.insertNode(textNode);
        composer.selection.setAfter(textNode);
      } else {
        composer.selection.setAfter(iframe);
      }
    },

    state: function(composer) {
      var doc = composer.doc,
          selectedNode,
          text,
          iframesInSelection;

      if (!wysihtml5.dom.hasElementWithTagName(doc, NODE_NAME)) {
        return false;
      }

      selectedNode = composer.selection.getSelectedNode();
      if (!selectedNode) {
        return false;
      }

      if (selectedNode.nodeName === NODE_NAME) {
        // This works perfectly in IE
        return selectedNode;
      }

      if (selectedNode.nodeType !== wysihtml5.ELEMENT_NODE) {
        return false;
      }

      text = composer.selection.getText();
      text = wysihtml5.lang.string(text).trim();
      if (text) {
        return false;
      }

      iframesInSelection = composer.selection.getNodes(wysihtml5.ELEMENT_NODE, function(node) {
        return node.nodeName === "IFRAME";
      });

      if (iframesInSelection.length !== 1) {
        return false;
      }

      return iframesInSelection[0];
    },

    value: function(composer) {
      var iframe = this.state(composer);  

      return iframe && iframe.src;     
    }
  };
})

<li data-wysihtml5-command="insertIframe" title="Insert an iframe" class="command"></li>

<div data-wysihtml5-dialog="insertIframe" style="display: none;">
  <label>
    iFrame:
    <input data-wysihtml5-dialog-field="src" class="text">
  </label>
  <a data-wysihtml5-dialog-action="save" id="youtubelink">OK</a> <a data-wysihtml5-dialog-action="cancel">Cancel</a>
</div>

I want ask you, if is it ok (its function) or is better way ? Thank you

[richardsondx]

@Zuben45 Your code returns Uncaught TypeError: wysihtml5.browser.hasProblemsSettingCaretAfterIframe is not a function