Vanilla 1 is no longer supported or maintained. If you need a copy, you can get it here.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.
Options

Anyway to post YouTube videos without using BBCode?

2»

Comments

  • Options
    edited February 2007
    Emm... hi all, I'm newbie in this community and... the first step here is: Sorry, my too bad english :(

    I wrote a too similar code posted by Blizeh ^^ ...with some little differences:
    it's a parameter deprecated for the W3C... Youtube and similar websites publish a wrong and not standard code... IMHO.

    I've added the new presentation code for the 3 websites with a customize rule style from CSS.
    function VideoLink($Matches) { $Type = strtolower(trim($Matches[2])); $ID = $Matches[3]; switch($Type) { case 'google': $link_id = 'http://video.google.com/googleplayer.swf?docId='.$ID.''; $link_video = $link_id; break; case 'youtube': $link_id = 'http://www.youtube.com/v/'.$ID.''; $link_video = $link_id; break; case 'myspace': $link_id = 'http://lads.myspace.com/videos/vplayer.swf" flashvars="m='.$ID.'&type=video'; $link_video = 'http://vids.myspace.com/index.cfm?fuseaction=vids.individual&videoid='.$ID.''; break; default : return $Matches[0]; } return ( '<div class="pre_video">'. '<h3>Your SiteName#Video</h3>'. '<a href="'.$link_video.'">Link to V&iacute;deo</a>'. '<div class="video">'. '<object width="425" height="350" type="application/x-shockwave-flash" data="'.$link_id.'">'. '<param name="movie" value="'.$link_id.'" />'. '<param name="wmode" value="transparent" />'. '</object>'. '</div>'. '</div>'); }

    Also... BBInsertBar write more deprecated tags, f.e:
    <b><i><u><s>
    I changed this tags for XHTML:
    <strong><em><del>
    In case of U tag:
    a class CSS to write a text-decoration:
    CSS:
    /* Underline */ .underline { text-decoration: underline; }
    BBInsertBar:
    echo "<a onclick=\"decoration('underline','".$this->Context->Configuration["BBBAR_DISABLE_VANILLACONS_BAR"]."')\"> <img src='".$this->Context->Configuration["BASE_URL"].$this->Context->Configuration["BBBAR_PATH"]."buttons/text_underline.gif' alt='".$this->Context->GetDefinition('bbunderline')."' title='".$this->Context->GetDefinition('bbunderline')."' /></a>";
    Te new Function for Text-Decoration:
    function decoration(Style,Smilies){ document.getElementById("BBBarColorPicker").style.display = 'none'; document.getElementById("BBBarFontPicker").style.display = 'none'; if (Smilies == 'FALSE') document.getElementById("BBBarSmilies").style.display = 'none'; if(document.getElementById("Radio_BBCode")){ if (document.getElementById('Radio_BBCode').checked) wert = 'BBCode'; } if(document.getElementById("Radio_Html")){ if (document.getElementById('Radio_Html').checked) wert = 'Html'; } if(document.getElementById("Radio_Text")){ if (document.getElementById('Radio_Text').checked) wert = 'Text'; } if (wert != 'Text') { var input = document.getElementById("CommentBox"); input.focus(); var start = input.selectionStart; var end = input.selectionEnd; var insText = input.value.substring(start, end); if (wert == 'Html') input.value = input.value.substr(0, start) + '<span class="'+Style+'">'+insText+'</span>' + input.value.substr(end); }}

    SPAN is another deprecated tag... I think the best way is: instead of SPAN tag, a DIV tag with display inline:
    /* Underline */ .underline { text-decoration: underline; display: inline; }
    and the function:
    if (wert == 'Html') input.value = input.value.substr(0, start) + '<div class="'+Style+'">'+insText+'</div>' + input.value.substr(end);

    Certainly this leads to new possibilities with the function decoration and some class in CSS:
    echo "<a onclick=\"decoration('underline','".$this->Context->Configuration["BBBAR_DISABLE_VANILLACONS_BAR"]."')\"> <img src='".$this->Context->Configuration["BASE_URL"].$this->Context->Configuration["BBBAR_PATH"]."buttons/text_underline.gif' alt='".$this->Context->GetDefinition('bbunderline')."' title='".$this->Context->GetDefinition('bbunderline')."' /></a>";

    ...this is only a little suggestion ^^
    S!

    PD: One more time... sorry lang :__(
  • Options
    edited February 2007
    i do not like how u used one object tag.
    Its better if each case has its own complete object code

    the video sizes of all the services are different
  • Options
    edited February 2007
    Amm... Thx for u correction but...
    I used the object tag according to W3C specifications:
    http://www.w3.org/TR/html4/struct/objects.html#h-13.3.2:
    <OBJECT classid="http://www.miamachina.it/analogclock.py"> <PARAM name="height" value="40" valuetype="data"> <PARAM name="width" value="40" valuetype="data"> This user agent cannot render Python applications. </OBJECT>
    I checked the example on Linux: ffx2.0, Opera9.0, Epiphany and I.E.6(wine) and it works fine.

    Google say:
    <embed style="width:400px; height:326px;" id="VideoPlayback" type="application/x-shockwave-flash" src="http://video.google.com/googleplayer.swf?docId=-3571977876885478487" flashvars=""> </embed>
    U say:
    <object width="425" height="350" type="application/x-shockwave-flash" data="http://video.google.com/googleplayer.swf?docId=-3571977876885478487"> <param name="movie" value="http://video.google.com/googleplayer.swf?docId=-3571977876885478487" /> <param name="wmode" value="transparent" /> </object>
    ... what's the problem? oO'

    ...in any case, I think it's better a code for each video, ok, but...
    I don't know still how the object tag have influence in the size of video oO?, can you post any example m8? ;)
    Thx in avance ^^
  • Options
    edited February 2007
    I'm not objecting to the object code. which is good :)
    just that u have one object code and u pass parameters to it. which might or not be fit other services.

    just make the resolution a variable as well and pass it to the object code.
    Services like Brightcove and Revver allow higher resolutions, and ones like stage6 allow even higher resolutions. ur dropping them all down to 400px.
    why would i want to do that.

    what about services that require classID like from Stage6

    <object classid="clsid:67DABFBF-D0AB-41fa-9C46-CC0F21721616" width="640" height="379" codebase="http://go.divx.com/plugin/DivXBrowserPlugin.cab"> <param name="src" value="http://stage6.divx.com/GBTimelapse/show_video/1083403" /> <embed type="video/divx" src="http://stage6.divx.com/GBTimelapse/show_video/1083403" width="640" height="379" pluginspage="http://go.divx.com/plugin/download/"> </embed> </object>
  • Options
    yeah, I didn't really give any thought to the validity of the markup, I just copied the html code provided on the websites. if you all reach an agreement on it all I can update the extension.
  • Options
    btw the correct way to embed flash is through Javascript so to bypass IE7 double click issues
  • Options
    lylelyle New
    edited February 2007
    I've enabled the video tag in HTML Editor but didn't want to rely on users to remember how to enter the markup, so I've added a button to QuickTags to parse the YouTube video ID out of a URL and enter the markup automatically.

    I'll include the code here in case anyone is interested.

    In quicktags.js, the button declaration:

    edButtons[edButtons.length] = new edButton('ed_youtube' ,'YouTube' ,'' ,'' ,'y' );

    Added case to edShowButton to use my custom onClick:

    function edShowButton(button, i) { if (button.id == 'ed_img') { document.write('<input type="button" id="' + button.id + '" accesskey="' + button.access + '" class="ed_button" onclick="edInsertImage(edCanvas);" value="' + button.display + '" />'); } else if (button.id == 'ed_link') { document.write('<input type="button" id="' + button.id + '" accesskey="' + button.access + '" class="ed_button" onclick="edInsertLink(edCanvas, ' + i + ');" value="' + button.display + '" />'); } else if (button.id == 'ed_youtube') { document.write('<input type="button" id="' + button.id + '" accesskey="' + button.access + '" class="ed_button" onclick="edInsertYouTube(edCanvas, ' + i + ');" value="' + button.display + '" />'); } else { document.write('<input type="button" id="' + button.id + '" accesskey="' + button.access + '" class="ed_button" onclick="edInsertTag(edCanvas, ' + i + ');" value="' + button.display + '" />'); } }

    Utility function used by my onClick handler:

    function getSelected(myField) { var selectedText = ''; if (document.selection) { var sel = document.selection.createRange(); if (sel.text.length > 0) { selectedText = sel.text; } } else if (myField.selectionStart || myField.selectionStart == '0') { var startPos = myField.selectionStart; var endPos = myField.selectionEnd; if (startPos != endPos) { selectedText = myField.value.substring(startPos, endPos); } } return selectedText; }

    And finally, a quick and dirty method to insert the markup:

    function edInsertYouTube(myField, i, defaultValue) { var frm = document.getElementById('frmPostComment'); if (frm) { // Do stuff in here, like... setCheckedValue(document.forms['frmPostComment'].elements['FormatType'], 'Html'); }else{ setCheckedValue(document.forms['frmPostDiscussion'].elements['FormatType'], 'Html'); } // use selected text as the default defaultValue = getSelected(myField); if (!defaultValue) { defaultValue = ''; } if (!edCheckOpenTags(i)) { var URL = prompt('Enter the YouTube link' ,defaultValue); if (URL) { // First try matching the form "youtube.com/v/video_id" videoIdRegex = /youtube\.com\/v\/(\w+)/ matches = videoIdRegex.exec (URL); // if that form wasn't matched if ( (matches == undefined) || (matches[1] == undefined) ) { // try matching the form "youtube.com/watch?v=video_id" videoIdRegex = /youtube\.com\/watch\?v\=(\w+)/; matches = videoIdRegex.exec (URL); } if ( (matches == undefined) || (matches[1] == undefined) ) { alert ('Unable to find a YouTube video in your entry.'); } else { html = '<video type="youtube">' + matches[1] + '</video>'; edInsertContent(myField, html); } } } }
  • Options
    edited September 2007
    MySchizoBuddy # 25
    Sorry, i didn't understand a word of your message xDD
    Again my bad english :__(

    Now, i'm trying to build a plugin for Wordpress with more options, i have included video's size, title, position... and the plugin allow you to insert another objects with a valid markup, like img in the new XHTML 2.0 :D

    About videos, i'm trying to check filetype for Mime-Type, or get html from link... All work in Wordpress but i think it's movable to Vanilla, ATM, i achieved to put valid code for Quicktime and the rest of popular services.

    I'm on it.
    S!
This discussion has been closed.