Custom tags (YouTube, Vimeo, Stream.cz)

I've created a plugin that allows you to use custom tags and use them in the editor. The idea is that these tags will be preprocessed by a php (or any other) script before they are actually displayed on the page. This particular file currently handles inclusion of videos from YouTube, Vimeo, and Czech Stream.cz. I've uploaded this file in the general "ckeditor 3" thread but I feel it rather belongs here.

The plugin now processes <youtube /> tags (works for vimeo and stream.cz as well) by default but you can create new optional tags by editing the config file (as of version 1.1).

The dialog currently relies on text fields only (I didn't need checkboxes so I didn't bother to include them yet) but in general, it works as expected.

To add an icon to the main menu, simply add 'youtube' to the toolbar definition in your config file.
To add a custom tag of your own, edit the config file (if you want to keep the youtube tag as well):

   config.pubMeCustomTags = {
      youtube : {
         dtd : [ '$empty','$inline','$body','div' ]
      },
      testtag : {
         dtd : [ '$empty','$inline','$body','div' ]
      }
   }; 

Then create relevant icons (images/testtag-icon.png and images/testtag-placeholder.png) and dialg file (dialogs/testtag-dialog.js). Add the icon to the toolbar as well and voila, it should be working now.

BTW: there there is a bug in the fakeobject handling. As it uses images as fakeobject placeholders, it forces paragraphs around any custom tag. I haven't been able to override this behavior yet. So block custom tags would need a little more php processing.

The appended file contains the plugin itself. You will also want to update the language file and add some php preprocessing so I've added the needed codes too:

Append the language file with:

// ... here is the original language file
   pubme :
   {
// ... here I have some more language definitions for my cms system
      _pubme_extratags :
      {
         youtube :
         {
            fakeObjectTitle : "Video object (YouTube, Vimeo, Stream.cz)",
            mainMenu : "Video (YouTube, Vimeo, Stream.cz)",
            properties : "Video properties (YouTube, Vimeo, Stream.cz)",
            source : "Video source",
            explainsource : "YouTube: link generated by the 'Share' button<br />Others: url of the website with the video<br />&nbsp;",
            width : 'Video width (px)',
            height : 'Video height (px)',
            title : 'Title (name of the video)'
         }
      }
   }

PHP post-processing of the custom tag:

preg_match_all ("/<youtube([^>]*)>/i",$Article,$Matches);
   if (!empty($Matches[0]))
   {
      $DefaultWidth = 640; // 16/9 default
      $DefaultHeight = 360;      
      $i=0;
      while (isset($Matches[0][$i]))
      {
         $inner = $Matches[1][$i];
         $attributes = Array ();
         while ( strpos($inner,"=") !== false )
         {
            $pos = strpos($inner,"=");
            $attribute = substr ( $inner, 0, $pos );
            if (strpos($inner," ") !== false )
               $attribute = substr($attribute,strrpos($attribute," ")+1);
               
            $attribute = trim ($attribute);

            $pos = false;
            $pos1 =  strpos($inner,"'");
            $pos2 =  strpos($inner,'"');
            $pos3 =  strpos($inner,'>');                  

            if ($pos1 !== false)
               $pos = $pos1;

            if ($pos2 !== false && ($pos2<$pos || $pos === false) )
               $pos = $pos2;

            if ($pos3 !== false && ($pos3<$pos || $pos === false) )
               $inner = "";
               
            $useChar = substr ( $inner, $pos, 1 );
            $inner = substr ( $inner , $pos + 1 );

            if ( strpos ( $inner, $useChar ) !== false )
            {
               $pos = strpos ($inner, $useChar );
               $attributeValue = trim (substr ( $inner, 0, $pos ));
               $inner = substr ( $inner, $pos + 1 );
               $attributes [ $attribute ] = $attributeValue;
            }
            else
               $inner = "";            
         }
         
         if ( empty ($attributes["width"]) && empty ($attributes["height"]) )
         {
            $attributes["width"] = $DefaultWidth;
            $attributes["height"] = $DefaultHeight;
         }
         elseif ( empty ($attributes["width"]) )
            $attributes["width"] = round ( $DefaultWidth / $DefaultHeight * $attributes["height"] );
         elseif ( empty ($attributes["height"]) )
            $attributes["height"] = round ( $DefaultHeight / $DefaultWidth * $attributes["width"] );
            
         $usePlayer = "default";
         
         if ( strpos ( $attributes["src"], "vimeo.com" ) !== false )
            $usePlayer = "vimeo";
         elseif ( strpos ( $attributes["src"], "stream.cz" ) !== false )
            $usePlayer = "stream";
          
         if ( strpos ($attributes["src"],"/") === false )
            $attributes["src"] = "/" . $attributes["src"];
            
         $attributes["src"] = substr ( $attributes["src"], strrpos ( $attributes["src"], "/" ) + 1 );
         
         $title = "";
         if ( !empty ($attributes["title"]) )
            $title = " title = \"" . cms_htmlspecialchars ($attributes["title"]) . "\"";

         switch ( $usePlayer )
         {
            case "vimeo":
               $youtubeTag = "<iframe src=\"http://player.vimeo.com/video/{$attributes["src"]}?title=0&amp;byline=0&amp;portrait=0\" width=\"{$attributes["width"]}\" height=\"{$attributes["height"]}\"{$title}  class=\"pubmevideo pubmevideo_vimeo\" frameborder=\"0\" webkitAllowFullScreen=\"true\" mozallowfullscreen=\"true\" allowFullScreen=\"true\"></iframe>";
               break;
            case "stream":
               $youtubeTag = "<object value=\"http://www.stream.cz/object/{$attributes["src"]}\" width=\"{$attributes["width"]}\" height=\"{$attributes["height"]}\"{$title} class=\"pubmevideo pubmevideo_stream\">"
                  . "<param name=\"movie\" id=\"VideoSpot\">"
                  . "<param name=\"allowfullscreen\" value=\"true\">"
                  . "<param name=\"allowscriptaccess\" value=\"always\">"
                  . "<embed src=\"http://www.stream.cz/object/{$attributes["src"]}\" width=\"{$attributes["width"]}\" height=\"{$attributes["height"]}\" type=\"application/x-shockwave-flash\" allowfullscreen=\"true\" allowscriptaccess=\"always\">"
                  . "</object>"
                  ;
               break;
            default:
               if ( strpos ( $attributes["src"], "watch?" ) === 0 && strpos ( $attributes["src"], "=" ) !== false )
                  $attributes["src"] = substr ( $attributes["src"], strpos ( $attributes["src"], "=" ) + 1 );                  
               $youtubeTag = "<iframe src=\"http://www.youtube.com/embed/{$attributes["src"]}\" width=\"{$attributes["width"]}\" height=\"{$attributes["height"]}\"{$title} frameborder=\"0\" allowfullscreen=\"true\" class=\"pubmevideo pubmevideo_youtube\"></iframe>"; 
               break;
         }

         $Article = str_replace ( $Matches[0][$i], $youtubeTag, $Article );
         $i++;
      }
   }

Enjoy it!

Malis @ Pub-Me Content Management System