*/
// Examples
-$config['article_$method_helpers'] = array();
-$config['article_$method_libraries'] = array();
\ No newline at end of file
+// $config['article_$method_helpers'] = array();
+// $config['article_$method_libraries'] = array();
+
+
+// Help article
+$config['article_help_js'] = array('jquery.ui.imagemap.js');
\ No newline at end of file
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
+$CI =& get_instance();
+
$config['per_page'] = 16;
$config['num_links'] = 2;
$config['full_tag_open'] = '<div class="pagination">';
-$config['full_tag_close'] = '</div>';
\ No newline at end of file
+$config['full_tag_close'] = '</div>';
+
+$config['first_link'] = $CI->lang->line('ui_page_first');
+$config['prev_link'] = $CI->lang->line('ui_page_previous');
+$config['next_link'] = $CI->lang->line('ui_page_next');
+$config['last_link'] = $CI->lang->line('ui_page_last');
\ No newline at end of file
$html_params = array('title' => $this->title.' - '
. $this->config->item('site_name'),
- //'css' => array(),
- //'js' => array(),
+ 'css' => $this->css,
+ 'js' => $this->js,
'metas' =>
array('description'=>$this->metaDescription)
);
// **
// Retrieve video information.
$this->load->model('videos_model');
+ $this->videos_model->inc_video_var($id, 'views');
$data['video'] = $this->videos_model->get_video($id, $name);
$data['plugin_type'] = ($plugin === NULL ? 'auto' : $plugin);
* an entry named "article_${method}_helpers" or "article_${method}_libraries"
* respectively with an array of helpers or libraries to be loaded for the
* article.</li>
+ * <li><strong>CSSs, JSs:</strong> in config file 'article.php':
+ * an entry named "article_${method}_css" or "article_${method}_js"
+ * respectively with an array of .css or .js to be loaded into members $css
+ * and $js. It's up to the programmer to define how this members are going
+ * to be used.</li>
* </ul>
*
* @category Base Controller Library
protected $metaDescription = NULL;
protected $helpers = array();
protected $libraries = array();
+ protected $css = array();
+ protected $js = array();
function __construct()
{
$this->libraries = $this->config->item("article_${method}_library");
if ($this->libraries !== FALSE)
$this->load->library($libraries);
+
+ // CSSs
+ $css =& $this->config->item("article_${method}_css");
+ if ($css !== FALSE)
+ $this->css = $css;
+
+ // JavaScripts
+ $js =& $this->config->item("article_${method}_js");
+ if ($js !== FALSE)
+ $this->js = $js;
}
/**
$lang['ui_categ_events'] = 'Events';
$lang['ui_categ_karaoke'] = 'Karaoke';
+// Pagination
+$lang['ui_page_first'] = 'First';
+$lang['ui_page_previous'] = 'Previous';
+$lang['ui_page_next'] = 'Next';
+$lang['ui_page_last'] = 'Last';
+
// Video asset metrics
$lang['ui_view'] = 'view';
$lang['ui_views'] = 'views';
return $video;
}
+ /**
+ * Increment a video parameter from DB: `views`, `likes` or `dislikes`.
+ *
+ * @param int $id DB video id
+ * @param string $param DB parameter column name.
+ * @return void
+ */
+ public function inc_video_var($id, $var)
+ {
+ // TODO error report if query returns FALSE
+ $this->db->query('UPDATE `videos` '
+ . 'SET `'. $var. '`=`'. $var. '`+1 '
+ . 'WHERE id='. $id);
+ }
+
public function get_thumbs($name, $count)
{
$thumbs = array();
<dd>
<?php echo safe_mailto('p2p-next-contact@cs.pub.ro', 'p2p-next-contact@cs.pub.ro') ?>
</dd>
- <dt><img src="<?php echo site_url('img/redmine-logo.svg') ?>" class="inline" alt="email" width="48" height="33" /> Redmine Issue Tracker: </dt>
+ <dt><img src="<?php echo site_url('img/redmine-logo.svg') ?>" class="inline" alt="redmine" width="48" height="33" /> Redmine Issue Tracker: </dt>
<dd>
<a href="http://p2p-next.cs.pub.ro/redmine/site/issues">http://p2p-next.cs.pub.ro/redmine/site/issues</a>
</dd>
-TODO <em>Help</em>
\ No newline at end of file
+<div id="video-widget-imagemap">
+ <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" />
+ </div></div>
+
+ <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>
+ <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>
+ <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>
+ <div>
+ ...
+ </div>
+
+ <h3><a href="#" class="ui-imagemap-title"
+ data-left="86px" data-top="323px" data-width="57px" data-height="19px"
+ >Total Time</a></h3>
+ <div>
+ ...
+ </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>
+ <div>
+ ...
+ </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>
+ <div>
+ ...
+ </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>
+ <div>
+ ...
+ </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>
+ <div>
+ ...
+ </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>
+ <div>
+ ...
+ </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>
+ <div>
+ ...
+ </div>
+ </div>
+
+</div>
+
+<script type="text/javascript">
+$(function() {
+ $('#video-widget-titles').accordion({
+ collapsible: true,
+ active: false
+ });
+
+ $('#video-widget-imagemap').imagemap({
+
+ });
+});
+</script>
\ No newline at end of file
.nsvideo({
type: "<?php echo $plugin_type ?>",
src: <?php echo json_encode($video['assets']) ?>,
- //width: videoWidth,
- //height: videoHeight
- minWidth: 640,
- maxWidth: 1024,
+
+
+ width: 427,
+ height: 240,
+ showState: false,
+
+
+ //minWidth: 640,
+ //maxWidth: 1024,
initialDuration: "<?php echo $video['duration'] ?>",
resize: function() {
.pagination
{
clear: both;
+ word-spacing: 0.5em;
}
--- /dev/null
+/*
+ * jQuery UI ImageMap 1.0.0 beta
+ *
+ * Copyright 2011, Călin-Andrei Burloiu
+ * Dual licensed under the MIT or GPL Version 2 licenses.
+ * http://jquery.org/license
+ *
+ * Depends:
+ * jquery.ui.core.js
+ * jquery.ui.widget.js
+ */
+(function( $, undefined ) {
+
+$.widget( "ui.imagemap", {
+ version: "1.0.0 beta",
+ options: {
+
+ },
+
+ _create: function() {
+ var widget = this;
+
+ $('div.ui-imagemap-image', widget.element)
+ .css('position', 'relative')
+ .css('width', $('div.ui-imagemap-image > img', widget.element).css('width'))
+ .css('height', $('div.ui-imagemap-image > img', widget.element).css('height'))
+ ;
+
+ widget.$marker = $('<div></div>')
+ .appendTo('div.ui-imagemap-image', widget.element);
+ widget.$marker
+ .css('position', 'absolute')
+ .css('outline', '2px solid red')
+ .css('background', 'transparent');
+
+ $('.ui-imagemap-title', widget.element)
+ .click(function() {
+ var $title = $(this);
+
+ if (typeof $title.data('top') == 'undefined')
+ return false;
+ if (typeof $title.data('left') == 'undefined')
+ return false;
+
+ var top = $title.data('top')
+ var left = $title.data('left');
+ var width, height;
+
+ if (typeof $title.data('width') == 'undefined')
+ width = '1px';
+ else
+ width = $title.data('width');
+ if (typeof $title.data('height') == 'undefined')
+ height = '1px';
+ else
+ height = $title.data('height');
+
+ widget.$marker
+ .css('top', top)
+ .css('left', left)
+ .css('width', width)
+ .css('height', height);
+
+ });
+ },
+
+ _destroy: function() {
+ this.element.html('');
+ },
+
+ _setOption: function( key, value ) {
+ // TODO
+ if ( key === "TODO" ) {
+
+ }
+
+ this._super( "_setOption", key, value );
+ }
+});
+
+})( jQuery );
\ No newline at end of file
widget.$videoContainer.html('');
// Install buttons or not supported message if required
- var $installContainer = $('<div class="container-install-in-widget"></div>')
- .appendTo(widget.$videoContainer);
- $installContainer
- .nsinstall({
- type: widget.options.type,
- hideIfAlreadyInstalled: true
- });
+ if (typeof $.fn.nsinstall == 'function')
+ {
+ widget.$installContainer = $('<div class="container-install-in-widget"></div>')
+ .appendTo(widget.$videoContainer);
+ widget.$installContainer
+ .nsinstall({
+ type: widget.options.type,
+ hideIfAlreadyInstalled: true
+ });
+ if (widget.$installContainer.nsinstall('option', 'error')
+ == 'already installed')
+ widget.$installContainer.hide();
+ }
var width = widget.options.width;
var height = widget.options.height;
widget.html5.refreshVolume();
widget.html5.refreshState();
widget._setWidgetWidth();
+
+ if (widget.$video[0].error != 3
+ && widget.$video[0].error != 4)
+ widget.$installContainer.hide();
},
seeked: function() {
widget.html5.play();
if (widget.$video.width() < 640)
{
widget.element.css('width',
- 640 + 8 + 'px');
+ 427 + 8 + 'px');//TODO 640 + 8
widget.$video.css('left',
Math.round(widget.$videoContainer.width()/2
- widget.$video.width()/2)
},
play: function() {
+ if(typeof widget.$video[0].playlist.isPlaying == 'undefined')
+ return widget;
+
+ widget.$installContainer.hide();
+
if (! widget.$video[0].playlist.isPlaying)
widget.$video[0].playlist.play();