| IDs must be numeric and must preferably start from 1.
|
*/
-$config['categories'] = array(1 => 'movies', 2 => 'tech_talks', 3 => 'events', 4 => 'karaoke');
+$config['categories'] = array(1 => 'movies', 2 => 'tech-talks', 3 => 'events', 4 => 'karaoke');
/*
|--------------------------------------------------------------------------
$this->load->view('html_end');
}
- public function category($category_id, $offset = 0)
+ public function category($category_name, $offset = 0)
{
// **
// ** LOADING MODEL
// **
+ // Video Category
+ $categories = $this->config->item('categories');
+ $category_id = array_search($category_name, $categories);
+ $vs_data['category_name'] = $category_name;
+ $vs_data['category_id'] = $category_id;
+ $vs_data['category_title'] = $category_name ?
+ $this->lang->line("ui_categ_$category_name") : $category_name;
+
// Retrieve videos summary.
$this->load->model('videos_model');
$vs_data['videos'] = $this->videos_model->get_videos_summary(
- $category_id, intval($offset),
+ $vs_data['category_id'], intval($offset),
$this->config->item('videos_per_page'));
- // Video Category
- $categories = $this->config->item('categories');
- $category_name = $categories[$category_id];
- $vs_data['category_title'] = $category_name ?
- $this->lang->line("ui_categ_$category_name") : $category_name;
- $vs_data['category_id'] = $category_id;
-
// Pagination
$this->load->library('pagination');
$pg_config['base_url'] = site_url("catalog/category/$category_id/");
$this->load->model('videos_model');
$this->videos_model->inc_video_var($id, 'views');
$data['video'] = $this->videos_model->get_video($id, $name);
+ $categories = $this->config->item('categories');
+ $data['video']['category_name'] =
+ $categories[ $data['video']['category_id'] ];
$data['plugin_type'] = ($plugin === NULL ? 'auto' : $plugin);
// Display page.
// Video Categories
$lang['ui_categ_movies'] = 'Movies';
-$lang['ui_categ_tech_talks'] = 'TechTalks';
+$lang['ui_categ_tech-talks'] = 'TechTalks';
$lang['ui_categ_events'] = 'Events';
$lang['ui_categ_karaoke'] = 'Karaoke';
// Video Categories
$lang['ui_categ_movies'] = 'Filme';
-$lang['ui_categ_tech_talks'] = 'TechTalks';
+$lang['ui_categ_tech-talks'] = 'TechTalks';
$lang['ui_categ_events'] = 'Evenimente';
$lang['ui_categ_karaoke'] = 'Karaoke';
-<h1>P2P-Next</h1>
-<p><a title="P2P-Next" href="http://www.p2p-next.org/">P2P-Next</a> is an integrated FP7 EU project involving more than 20 partners, including <a title="University Politehnica of Bucharest" href="http://www.upb.ro" ref="nofollow">University Politehnica of Bucharest</a> (UPB).</p>
-<p>P2P-Next aims to build the next generation Peer-to-Peer (P2P) content delivery platform.</p>
+<h1><a id="p2p-next">P2P-Next</a></h1>
+<p><a title="P2P-Next" href="http://www.p2p-next.org/">P2P-Next</a> is an integrated FP7 EU project involving more than 20 partners, including <a title="University Politehnica of Bucharest" href="http://www.upb.ro" rel="nofollow">University Politehnica of Bucharest</a> (UPB).</p>
+<p>P2P-Next aims to build the next generation Peer-to-Peer (P2P) content delivery platform threw through the <a id="next-share"><strong>NextShare</strong></a> technology which enables video-on-demand and live streaming for both computers and digital set-top-boxes (STB).</p>
<p>This site provides information on UPB's contribution to the P2P-Next project activities. We are currently part of WP4 (Work Package 4 - IPvNext Networking Fabric) and WP8 (Work Package 8 - Living Lab Trials).</p>
-<h1>NextShare Video Plugins</h1>
+<h1><a id="next-share-video-plugins">NextShare Video Plugins</a></h1>
<dl>
- <dt><a href="http://www.tribler.org/trac/wiki/BrowserPlugin" target="_blank">NextSharePC</a></dt>
- <dd>a media-player browser plugin which uses <a href="http://www.videolan.org/vlc/" target="_blank" ref="nofollow">VLC</a> libraries for video rendering and incorporates P2P technology for VideoOnDemand (VoD) and LiveStreaming content delivery. The plugin is currently working with Internet Explorer and Firefox on Windows.</dd>
+ <dt><a id="nextsharepc" href="http://www.tribler.org/trac/wiki/BrowserPlugin" target="_blank">NextSharePC</a></dt>
+ <dd>a media-player browser plugin which uses <a href="http://www.videolan.org/vlc/" target="_blank" rel="nofollow">VLC</a> libraries for video rendering and incorporates P2P technology for VideoOnDemand (VoD) and LiveStreaming content delivery. The plugin is currently working with Internet Explorer and Firefox on Windows.</dd>
</dl>
<dl>
- <dt><a href="http://www.tribler.org/trac/wiki/SwarmPlayer" target="_blank">SwarmPlayer</a></dt>
+ <dt><a id="swarmplayer" href="http://www.tribler.org/trac/wiki/SwarmPlayer" target="_blank">SwarmPlayer</a></dt>
<dd>a browser plugin which uses the new HTML5 rendering and incorporates P2P technology for VideoOnDemand (VoD) and LiveStreaming content delivery</dd>
</dl>
<a href="http://www.tribler.org/trac/wiki/BrowserPlugin" target="_blank">NextSharePC</a>
</th>
<td>
- <a href="http://www.videolan.org/vlc/" target="_blank" ref="nofollow"><img src="<?php echo site_url('img/vlc-icon.png') ?>" alt="win" /> VLC</a>
+ <a href="http://www.videolan.org/vlc/" target="_blank" rel="nofollow"><img src="<?php echo site_url('img/vlc-icon.png') ?>" alt="win" /> VLC</a>
</td>
<td>
<p><img src="<?php echo site_url('img/windows-icon.png') ?>" alt="win" /> Windows</p>
<p><img src="<?php echo site_url('img/macosx-icon.png') ?>" alt="win" /> Mac OS X</p>
</td>
<td>
- <p><img src="<?php echo site_url('img/firefox-icon.png') ?>" alt="win" /> <a href="http://www.mozilla.com/" target="_blank" ref="nofollow">Mozilla Firefox</a> 3.5 or greater</p>
- <p><img src="<?php echo site_url('img/ie-icon.png') ?>" alt="win" /> <a href="http://windows.microsoft.com/en-US/internet-explorer/products/ie/home" target="_blank" ref="nofollow">Internet Explorer</a> 7.0 or greater</p>
+ <p><img src="<?php echo site_url('img/firefox-icon.png') ?>" alt="win" /> <a href="http://www.mozilla.com/" target="_blank" rel="nofollow">Mozilla Firefox</a> 3.5 or greater</p>
+ <p><img src="<?php echo site_url('img/ie-icon.png') ?>" alt="win" /> <a href="http://windows.microsoft.com/en-US/internet-explorer/products/ie/home" target="_blank" rel="nofollow">Internet Explorer</a> 7.0 or greater</p>
</td>
</tr>
<tr>
<a href="http://www.tribler.org/trac/wiki/SwarmPlayer" target="_blank">SwarmPlayer</a>
</th>
<td>
- <a href="http://www.w3.org/TR/html5/" target="_blank" ref="nofollow"><img src="<?php echo site_url('img/html5-icon.png') ?>" alt="win" /> HTML5</a>
+ <a href="http://www.w3.org/TR/html5/" target="_blank" rel="nofollow"><img src="<?php echo site_url('img/html5-icon.png') ?>" alt="win" /> HTML5</a>
</td>
<td>
<p><img src="<?php echo site_url('img/windows-icon.png') ?>" alt="win" /> Windows</p>
<p><img src="<?php echo site_url('img/macosx-icon.png') ?>" alt="win" /> Mac OS X</p>
</td>
<td>
- <p><img src="<?php echo site_url('img/firefox-icon.png') ?>" alt="win" /> <a href="http://www.mozilla.com/" target="_blank" ref="nofollow">Mozilla Firefox</a> 3.5 or greater</p>
- <p><img src="<?php echo site_url('img/ie-icon.png') ?>" alt="win" /> <a href="http://windows.microsoft.com/en-US/internet-explorer/products/ie/home" target="_blank" ref="nofollow">Internet Explorer</a> 7.0 or greater</p>
+ <p><img src="<?php echo site_url('img/firefox-icon.png') ?>" alt="win" /> <a href="http://www.mozilla.com/" target="_blank" rel="nofollow">Mozilla Firefox</a> 3.5 or greater</p>
+ <p><img src="<?php echo site_url('img/ie-icon.png') ?>" alt="win" /> <a href="http://windows.microsoft.com/en-US/internet-explorer/products/ie/home" target="_blank" rel="nofollow">Internet Explorer</a> 7.0 or greater</p>
</td>
</tr>
</table>
<li>from <a href="<?php site_url('catalog/category/1') ?>">feature films</a></li>
<li>from <a href="<?php echo site_url('catalog/category/2') ?>"><em>TechTalks</em> technical presentations</a></li>
<li>or from <a href="<?php site_url('catalog/category/3') ?>">various events</a> from our faculty</li>
- <li>from <a href="<?php site_url('catalog/category/4') ?>">karaoke parties</a> in <a href="http://acs.pub.ro/" target="_blank" ref="nofollow">Automatic Control and Computers Faculty</a></li>
+ <li>from <a href="<?php site_url('catalog/category/4') ?>">karaoke parties</a> in <a href="http://acs.pub.ro/" target="_blank" rel="nofollow">Automatic Control and Computers Faculty</a></li>
</ul>
-<p>All available movies are currently seeded by 5 peers with high bandwidth (1Gbit) kindly provided by the<a title="NCIT-Cluster" href="http://cluster.ncit.pub.ro/" target="_blank" ref="nofollow"> NCIT-Cluster</a>. Anyone that watches a movie will take part in the swarm and ensure greater availability to provided content.</p>
+<p>All available movies are currently seeded by 5 peers with high bandwidth (1Gbit) kindly provided by the<a title="NCIT-Cluster" href="http://cluster.ncit.pub.ro/" target="_blank" rel="nofollow"> NCIT-Cluster</a>. Anyone that watches a movie will take part in the swarm and ensure greater availability to provided content.</p>
<h1>The Platform</h1>
<div id="video-widget-imagemap">
+ <h1>Video Widget Snapshot</h1>
<div><div class="ui-imagemap-image" style="margin: 0 auto; margin-bottom: 1em">
- <img src="<?php echo site_url('img/nsvideo-widget.jpg') ?>" alt="NextShare Video Widget Screenshot" width="446" height="353" />
+ <img src="<?php echo site_url('img/nsvideo-widget.jpg') ?>" alt="NextShare Video Widget Screenshot" title="NextShare Video Widget Screenshot" width="446" height="353" />
</div></div>
+ <h4>Click on a component bellow to highlight it on the snapshot above and view a description of it:</h4>
+ <h1>Video Widget Components</h1>
<div id="video-widget-titles">
- <h3><a href="#" class="ui-imagemap-title"
- data-left="5px" data-top="44px" data-width="433px" data-height="246px"
- >Watching Area</a></h3>
+ <h3 class="ui-imagemap-title"
+ data-left="5px" data-top="44px" data-width="433px" data-height="246px">
+ <a href="#">Watching Area</a>
+ </h3>
<div>
Here you can watch the video.
</div>
- <h3><a href="#" class="ui-imagemap-title"
- data-left="3px" data-top="314px" data-width="32px" data-height="34px"
- ><em>Play</em> / <em>Pause</em> button</a></h3>
+ <h3 class="ui-imagemap-title"
+ data-left="3px" data-top="314px" data-width="32px" data-height="34px">
+ <a href="#"><em>Play</em> / <em>Pause</em> button</a>
+ </h3>
<div>
Toggle playing and pausing the video.
</div>
- <h3><a href="#" class="ui-imagemap-title"
- data-left="41px" data-top="321px" data-width="39px" data-height="21px"
- >Current Time</a></h3>
+ <h3 class="ui-imagemap-title"
+ data-left="41px" data-top="321px" data-width="39px" data-height="21px">
+ <a href="#">Current Time</a>
+ </h3>
<div>
- ...
+ View the time elapsed from the beginning of the video.
</div>
- <h3><a href="#" class="ui-imagemap-title"
- data-left="86px" data-top="323px" data-width="57px" data-height="19px"
- >Total Time</a></h3>
+ <h3 class="ui-imagemap-title"
+ data-left="86px" data-top="323px" data-width="57px" data-height="19px">
+ <a href="#">Total Time</a>
+ </h3>
<div>
- ...
+ View video duration.
</div>
- <h3><a href="#" class="ui-imagemap-title"
- data-left="2px" data-top="295px" data-width="439px" data-height="22px"
- >Time Progress Slider</a></h3>
+ <h3 class="ui-imagemap-title"
+ data-left="2px" data-top="295px" data-width="439px" data-height="22px">
+ <a href="#">Time Progress Slider</a>
+ </h3>
<div>
- ...
+ View a graphical representation of the time elapsed from the movie from its duration. You can also use this slider to seek current position in the video to a desired point.
</div>
- <h3><a href="#" class="ui-imagemap-title"
- data-left="213px" data-top="320px" data-width="80px" data-height="24px"
- ><em>Volume</em> Slider</a></h3>
+ <h3 class="ui-imagemap-title"
+ data-left="213px" data-top="320px" data-width="80px" data-height="24px">
+ <a href="#"><em>Volume</em> Slider</a>
+ </h3>
<div>
- ...
+ A graphical representation of the sound volume level which can be manipulated with the mouse in order change current volume.
</div>
- <h3><a href="#" class="ui-imagemap-title"
- data-left="181px" data-top="313px" data-width="32px" data-height="36px"
- ><em>Mute</em> button</a></h3>
+ <h3 class="ui-imagemap-title"
+ data-left="181px" data-top="313px" data-width="32px" data-height="36px">
+ <a href="#"><em>Mute</em> button</a>
+ </h3>
<div>
- ...
+ Use this button to alternatively disable or enable the sound for the video.
</div>
- <h3><a href="#" class="ui-imagemap-title"
- data-left="293px" data-top="313px" data-width="119px" data-height="37px"
- >Switch Video Definition (Resolution)</a></h3>
+ <h3 class="ui-imagemap-title"
+ data-left="293px" data-top="313px" data-width="119px" data-height="37px">
+ <a href="#">Switch Video Definition (Resolution)</a>
+ </h3>
<div>
- ...
+ <p>This group of check buttons show definitions available for the video. The definition characterizes its resolution (number of pixels on horizontal and vertical). A definition is coded here, as in television systems, with a number, representing the number of vertical pixels (height), and a "p", which is an abbreviation from <a href="http://en.wikipedia.org/wiki/Progressive_scan" rel="nofollow" target="_blank"><em>progressive scan</em></a>.</p>
+ <p>The number of vertical pixels depends on the <a href="http://en.wikipedia.org/wiki/Display_aspect_ratio" rel="nofollow" target="_blank"><em>display aspect ratio</em></a> which is usually 4:3 or 16:9. Because the video needs to fit in your browser its actual size (when not in Full Screen mode) will be between 640 and 1024 horizontal pixels.</p>
</div>
- <h3><a href="#" class="ui-imagemap-title"
- data-left="6px" data-top="6px" data-width="134px" data-height="42px"
- >Switch Video Plugin</a></h3>
+ <h3 class="ui-imagemap-title"
+ data-left="6px" data-top="6px" data-width="134px" data-height="42px">
+ <a href="#">Switch Video Plugin</a>
+ </h3>
<div>
- ...
+ Use this two check buttons to switch between <a href="<?php echo site_url('about#next-share-video-plugins') ?>">the two NextShare plug-ins available</a>. Choose <em>HTML5</em> for <a href="<?php echo site_url('about#swarmplayer') ?>">SwarmPlayer</a> and <em>VLC</em> for <a href="<?php echo site_url('about#nextsharepc') ?>">NextSharePC</a>.
</div>
- <h3><a href="#" class="ui-imagemap-title"
- data-left="407px" data-top="315px" data-width="35px" data-height="34px"
- ><em>Full Screen</em> button</a></h3>
+ <h3 class="ui-imagemap-title"
+ data-left="407px" data-top="315px" data-width="35px" data-height="34px">
+ <a href="#"><em>Full Screen</em> button</a>
+ </h3>
<div>
- ...
+ Displays the video on the whole screen without having to be limited by the web page.
</div>
</div>
$(function() {
$('#video-widget-titles').accordion({
collapsible: true,
+ autoHeight: false,
active: false
});
<li><a href="#NextSharePC">NextSharePC (based on VLC)</a></li>
</ol>
-<h1><a name="SwarmPlayer">SwarmPlayer</a></h1>
+<h1><a id="SwarmPlayer">SwarmPlayer</a></h1>
<p>To install the SwarmPlayer video plugin (based on <a href="http://www.w3.org/TR/html5/">HTML5</a>) visit P2P-Next's <a href="http://swarmplayer.p2p-next.org/" target="_blank">SwarmPlayer Site</a>. You'll find a page such as the one in the screenshot below.
</p>
<p>
Find the green button labeled "Add Swarmplayer ...". Click it and follow the instructions.</p>
-<h1><a name="NextSharePC">NextSharePC</a></h1>
+<h1><a id="NextSharePC">NextSharePC</a></h1>
<p>To install the NextSharePC video plugin (based on <a href="http://www.videolan.org/vlc/">VLC</a>) follow the steps below:</p>
<ol>
<li>If you are using ...
<label for="quick-search-box"><?php echo $this->lang->line('ui_search') . ': ' ?></label>
<input type="text" id="quick-search-box" name="quick-search-box" disabled="disabled" value="not yet implemented" />
</form>
-</div>
+</div>
\ No newline at end of file
siteUrl = '<?php echo site_url() ?>';
</script>
-<div id="watch-main">
+<div id="main">
<?php // Invalid name in URL ?>
<?php if (isset($video['err'])):
if ($video['err'] == 'INVALID_NAME'):
<?php // Correct URL ?>
<?php else: ?>
- <h1><?php echo $video['title'] ?></h1>
+ <h1><a href="<?php echo site_url('catalog/category/'. $video['category_name']) ?>"><?php echo $video['category_title'] ?></a> › <?php echo $video['title'] ?></h1>
<div id="video-widget-tabs">
<ul>
type: "<?php echo $plugin_type ?>",
src: <?php echo json_encode($video['assets']) ?>,
-
- width: 427,
- height: 240,
showState: false,
-
- //minWidth: 640,
- //maxWidth: 1024,
+ minWidth: 640,
+ maxWidth: 1024,
initialDuration: "<?php echo $video['duration'] ?>",
resize: function() {
width: 100%;*/
/* padding: 12px; */
margin: 0 auto;
- width: 1024px;
+ width: 1056px;
text-align: justify;
}
.ui-widget .ui-widget { font-size: 1em; }
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Arial, Helvetica, sans-serif; font-size: 1em; }
.ui-widget-content { border: 1px solid #dddddd; background: #eeeeee url(images/ui-bg_highlight-soft_100_eeeeee_1x100.png) 50% top repeat-x; color: #333333; }
-.ui-widget-content a { color: #333333; }
+.ui-widget-content a { rgb(0,90,192); }
.ui-widget-header { border: 1px solid #abd1ff; background: #005ac0 url(images/ui-bg_gloss-wave_80_005ac0_500x100.png) 50% 50% repeat-x; color: #ffffff; font-weight: bold; }
.ui-widget-header a { color: #ffffff; }
widget.$marker = $('<div></div>')
.appendTo('div.ui-imagemap-image', widget.element);
widget.$marker
+ .hide()
.css('position', 'absolute')
.css('outline', '2px solid red')
.css('background', 'transparent');
if (typeof $title.data('left') == 'undefined')
return false;
- var top = $title.data('top')
+ var top = $title.data('top');
var left = $title.data('left');
var width, height;
height = $title.data('height');
widget.$marker
+ .show()
.css('top', top)
.css('left', left)
.css('width', width)
if (widget.$video.width() < 640)
{
widget.element.css('width',
- 427 + 8 + 'px');//TODO 640 + 8
+ 640 + 8 + 'px');
widget.$video.css('left',
Math.round(widget.$videoContainer.width()/2
- widget.$video.width()/2)