modules/flashbox.pl

   1 #!/usr/bin/env perl
   2 # ====================[ flashbox.pl                        ]====================
   3
   4 =head1 NAME
   5
   6 flashbox - An Oddmuse module for embedding offsite-hosted Flash videos within
   7            an Oddmuse Wiki page - especially those hosted by Google Videos,
   8            YouTube, and SlideShare.
   9
  10 =head1 INSTALLATION
  11
  12 flashbox is easily installable: move this file into the B<wiki/modules/>
  13 directory of your Oddmuse Wiki.
  14
  15 =cut
  16 package OddMuse;
  17
  18 $ModulesDescription .= '<p><a href="http://git.savannah.gnu.org/cgit/oddmuse.git/tree/modules/flashbox.pl">flashbox.pl</a>, see <a href="http://www.oddmuse.org/cgi-bin/oddmuse/Flashbox_Extension">Flashbox Extension</a></p>';
  19
  20 # ....................{ CONFIGURATION                      }....................
  21
  22 =head1 CONFIGURATION
  23
  24 flashbox is easily configurable: set these variables in the B<wiki/config.pl>
  25 file for your Oddmuse Wiki.
  26
  27 =cut
  28 use vars qw($FlashboxWidth
  29             $FlashboxHeight);
  30
  31 =head2 $FlashboxWidth
  32
  33 The width of the HTML object "frame" for Flash videos, in pixels.
  34
  35 The default value for this variable is (usually) fine.
  36
  37 =cut
  38 $FlashboxWidth = 420;
  39
  40 =head2 $FlashboxHeight
  41
  42 The height of the HTML object "frame" for Flash videos, in pixels. For any
  43 specific width, a height roughly 83.33% of that width tends to provide a
  44 respectable frame for viewing Flash videos.
  45
  46 The default value for this variable is (usually) fine.
  47
  48 =cut
  49 $FlashboxHeight = 350;
  50
  51 # ....................{ MARKUP                             }....................
  52
  53 =head1 MARKUP
  54
  55 flashbox provides a few new markup rules. These are:
  56
  57 =over
  58
  59 =item [[GoogleVideo:${GoogleVideoID}]]
  60
  61 =over
  62
  63 =item Embeds the Google Video uniquely identified by ${GoogleVideoID} into the
  64       Oddmuse Wiki page, where ${GoogleVideoID} is the signed integer
  65       following the "docID" parameter in the Google Video URL for that video;
  66       for example, [[GoogleVideo:8649250863235826256]] embeds Derrick Jensen's
  67       "Endgame: Part I" Google Video into the Oddmuse Wiki page.
  68
  69 =back
  70
  71 =item [[YouTube:${YouTubeVideoID}]]
  72
  73 =over
  74
  75 =item Embeds the YouTube video uniquely identified by ${YouTubeVideoID} into the
  76       Oddmuse Wiki page, where ${YouTubeVideoID} is the string following the
  77       "watch?v" parameter in the YouTube URL for that video; for example,
  78       [[YouTube:Q1ZeXnmDZMQ]] embeds James Howard Kunstler's "The Tragedy of
  79       Suburbia TED Talk" YouTube video into the Oddmuse Wiki page.
  80
  81 =back
  82
  83 =item [[SlideShare:${SlideSharePresentationID}]]
  84
  85 =over
  86
  87 =item Embeds the SlideShare presentation uniquely identified by
  88       ${SlideSharePresentationID} into the Oddmuse Wiki page, where
  89       ${SlideSharePresentationID} is a string composed of the title for that
  90       presentation and an arbitrary signed integer. Unfortunately, this string
  91       is more difficult to obtain than for Google Video and YouTube; for any
  92       given presentation, see the small "Embed" box on that presentation's
  93       SlideShare page and the string following the "doc" parameter in that
  94       box. For example,
  95       [[SlideShare:the-tyranny-of-human-civilization-13479]] embeds
  96       huer1278ft's "The Tyranny of Human Civilization" SlideShare presentation
  97       into the Oddmuse Wiki page.
  98
  99 =back
 100
 101 =back
 102
 103 =cut
 104 push(@MyRules, \&FlashboxRule);
 105
 106 # "FlashboxRule" conflicts with "CreoleRule"-style interpretation of "[[...]]"
 107 # syntax; and must, thus, be applied before that rule.
 108 $RuleOrder{\&FlashboxRule} = -11;
 109
 110 sub FlashboxRule {
 111   if    (/\G\[\[googlevideo:([0-9-]+)\]\]/cgi) {
 112     return FlashboxHtml('googlevideo',
 113                         "http://video.google.com/googleplayer.swf?docId=${1}&hl=en");
 114   }
 115   elsif (/\G\[\[slideshare:([a-z0-9-]+)\]\]/cgi) {
 116     return FlashboxHtml('slideshare',
 117                         "http://static.slideshare.net/swf/ssplayer2.swf?doc=${1}");
 118   }
 119   elsif (/\G\[\[youtube:([a-z0-9-_]{11})\]\]/cgi) {
 120     return FlashboxHtml('youtube',
 121                         "http://www.youtube.com/v/${1}");
 122   }
 123   return undef;
 124 }
 125
 126 sub FlashboxHtml {
 127   my ($paragraph_class, $flashbox_url) = @_;
 128   return
 129     ($bol
 130      ? CloseHtmlEnvironments().AddHtmlEnvironment('p', qq~class="flashbox ${paragraph_class}"~)
 131      : '').qq~
 132 <object width="${FlashboxWidth}" height="${FlashboxHeight}">
 133   <param name="movie"     value="${flashbox_url}"/>
 134   <param name="pluginurl" value="http://www.macromedia.com/go/getflashplayer"/>
 135   <param name="quality"   value="high"/>
 136   <param name="wmode"     value="transparent"/>
 137   <param name="allowFullScreen"   value="true"/>
 138   <param name="allowScriptAccess" value="always"/>
 139   <embed type="application/x-shockwave-flash"
 140          width="${FlashboxWidth}" height="${FlashboxHeight}"
 141          src="${flashbox_url}"
 142          wmode="transparent"
 143          allowscriptaccess="always" allowfullscreen="true"/>
 144 </object>~;
 145 }
 146
 147 =head1 CSS
 148
 149 flashbox also provides a few new HTML classes for CSS-stylizing the HTML emitted
 150 by these markup rules. Of necessity, flashbox embeds Flash videos in an
 151 "<object>...</object>" HTML tag-set; technically, therefore, you can stylize
 152 such videos with a CSS selector resembling:
 153
 154   # This CSS selector selects all HTML-embedded objects (e.g., Flash videos).
 155   object {
 156     # These CSS properties are supposed to horizontally center such objects;
 157     # however, they do not.
 158     margin:  1.500em auto;
 159     padding: 1.500em 0.000em 0.500em 0.000em;
 160     text-align:  center;
 161     text-indent: 0.000em;
 162   }
 163
 164 Unfortunately, most browsers ignore most CSS properties on the CSS "object"
 165 selector (including those in the example, above).
 166
 167 To circumvent this, flashbox enwraps all block-level, flashbox-specific markup
 168 (i.e., flashbox-specific markup preceded by at least two newlines) within an
 169 HTML paragraph having two unique classes. This HTML paragraph, unlike the
 170 "<object>...</object>" HTML tag-set, is styleable by all browsers via CSS
 171 selection of these classes:
 172
 173 =over
 174
 175 =item "flashbox"; and
 176
 177 =item "googlevideo", "youtube", or "slideshare" - according to which offsite host
 178       a Flash video is embedded from.
 179
 180 =back
 181
 182 Let's illustrate with a crude example. Suppose some Oddmuse Wiki page contains
 183 this text markup:
 184
 185   In this compelling reading of his, perhaps, most well-read poetry, Carl Sagan
 186   thunders the truth, Vangelis supplies the angel’s harp and music, and YouTube
 187   plies the photo-montage seas of "this pale, blue dot": our Earth, from afar.
 188
 189   [[YouTube:p86BPM1GV8M]]
 190
 191 Then, flashbox transmutes that text markup into HTML markup resembling:
 192
 193   <p>
 194   In this compelling reading of his, perhaps, most well-read poetry, Carl Sagan
 195   thunders the truth, Vangelis supplies the angel’s harp and music, and YouTube
 196   plies the photo-montage seas of "this pale, blue dot": our Earth, from afar.
 197   </p>
 198   <p class="flashbox youtube">
 199     <object width="420" height="350">
 200       <param name="movie"     value="http://www.youtube.com/v/p86BPM1GV8M"/>
 201       <param name="pluginurl" value="http://www.macromedia.com/go/getflashplayer"/>
 202       <embed type="application/x-shockwave-flash"
 203              width="420" height="350"
 204              src="http://www.youtube.com/v/p86BPM1GV8M"/>
 205     </object>
 206   </p>
 207
 208 Then, your CSS stylesheet can style this HTML markup with CSS resembling:
 209
 210   # This CSS selector selects flashbox-embedded Flash videos.
 211   p.flashbox {
 212     # These CSS properties horizontally center such videos.
 213     margin:  1.500em auto;
 214     padding: 1.500em 0.000em 0.500em 0.000em;
 215     text-align:  center;
 216     text-indent: 0.000em;
 217   }
 218
 219   # This CSS selector selects flashbox-embedded, YouTube-specific Flash videos.
 220   p.youtube {
 221     # These CSS properties background and border such videos.
 222     background: #334466;
 223     border:     #112255 0.125em solid;
 224   }
 225
 226 Wew! There; that wasn't so gruesomely detailed, was it?
 227
 228 =head1 SEE ALSO
 229
 230 The oddmuse.org "YouTube" page off which this Oddmuse extension was founded, at:
 231
 232 L<http://www.oddmuse.org/cgi-bin/oddmuse/YouTube>
 233
 234 =head1 COPYRIGHT AND LICENSE
 235
 236 The information below applies to everything in this distribution,
 237 except where noted.
 238
 239 Copyleft 2008 by B.w.Curry <http://www.raiazome.com>.
 240
 241 This file is free software; you can redistribute it and/or
 242 modify it under the terms of the GNU General Public License
 243 as published by the Free Software Foundation; either version 2
 244 of the License, or (at your option) any later version.
 245
 246 This file is distributed in the hope that it will be useful,
 247 but WITHOUT ANY WARRANTY; without even the implied warranty of
 248 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 249 GNU General Public License for more details.
 250
 251 You should have received a copy of the GNU General Public License
 252 along with this file; if not, write to the Free Software
 253 Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA  02111-1307, USA.
 254
 255 =cut