Upgrades to summit video pages

Conflicts:

	openstack/code/Presentation.php
	openstack/code/PresentationCategoryPage.php
	openstack/code/summit/SchedToolsPage.php
	themes/openstack/templates/Layout/PresentationCategoryPage.ss
	themes/openstack/templates/Layout/PresentationCategoryPage_presentation.ss
This commit is contained in:
Todd Morey 2014-10-31 12:48:27 -05:00 committed by Sebastian Marcet
parent 0b7ca90b7c
commit 885cc431c9
8 changed files with 801 additions and 353 deletions

View File

@ -1,4 +1,5 @@
<?php
/**
* Copyright 2014 Openstack Foundation
* Licensed under the Apache License, Version 2.0 (the "License");
@ -11,7 +12,8 @@
* See the License for the specific language governing permissions and
* limitations under the License.
**/
class Presentation extends DataObject {
class Presentation extends DataObject
{
static $db = array(
'Name' => 'HTMLText',
@ -28,14 +30,15 @@ class Presentation extends DataObject {
'Type' => 'Text',
'Day' => 'Int',
'Speakers' => 'Text',
'SlidesLink' => 'Varchar(255)'
'SlidesLink' => 'Varchar(255)',
'event_key' => 'Varchar(255)'
);
Static $defaults = array(
'DisplayOnSite' => TRUE,
'Country' => 'United States'
);
static $has_one = array(
'PresentationCategoryPage' => 'PresentationCategoryPage',
'Summit' => 'Summit'
@ -47,110 +50,144 @@ class Presentation extends DataObject {
static $singular_name = 'Presentation';
static $plural_name = 'Presentations';
static $summary_fields = array(
'Name' => 'Presentation Name'
);
function getCMSFields() {
static $summary_fields = array(
'Name' => 'Presentation Name'
);
function getCMSFields()
{
$fields = new FieldList (
new TextField('Name','Name of Presentation'),
new TextField('Speakers','Speakers'),
new DropdownField('Day','Day', array('1' => '1', '2' => '2', '3' => '3', '4' => '4')),
new TextField('URLSegment','URL Segment'),
new LiteralField('Break','<p>(Automatically filled in on first save.)</p>'),
new LiteralField('Break','<hr/>'),
new TextField('YouTubeID','YouTube Vidoe ID'),
new TextField('SlidesLink','Link To Slides (if available)'),
new TextField('StartTime','Video Start Time'),
new TextField('EndTime','Video End Time'),
new HTMLEditorField('Description','Description')
new TextField('Name', 'Name of Presentation'),
new TextField('Speakers', 'Speakers'),
new DropdownField('Day', 'Day', array('1' => '1', '2' => '2', '3' => '3', '4' => '4')),
new TextField('URLSegment', 'URL Segment'),
new LiteralField('Break', '<p>(Automatically filled in on first save.)</p>'),
new LiteralField('Break', '<hr/>'),
new TextField('YouTubeID', 'YouTube Vidoe ID'),
new TextField('SlidesLink', 'Link To Slides (if available)'),
new TextField('StartTime', 'Video Start Time'),
new TextField('EndTime', 'Video End Time'),
new HTMLEditorField('Description', 'Description')
);
return $fields;
}
function onBeforeWrite() {
function FormattedStartTime()
{
$Date = new DateTime($this->StartTime);
return $Date->format('l h:i a');
}
function PresentationDay()
{
$Date = new DateTime($this->StartTime);
return $Date->format('M d');
}
function onBeforeWrite()
{
parent::onBeforeWrite();
// If there is no URLSegment set, generate one from Title
if((!$this->URLSegment || $this->URLSegment == 'new-presentation') && $this->Title != 'New Presentation')
{
$this->URLSegment = SiteTree::generateURLSegment($this->Title);
}
else if($this->isChanged('URLSegment'))
{
// Make sure the URLSegment is valid for use in a URL
$segment = preg_replace('/[^A-Za-z0-9]+/','-',$this->URLSegment);
$segment = preg_replace('/-+/','-',$segment);
// If after sanitising there is no URLSegment, give it a reasonable default
if(!$segment) {
$segment = "presentation-".$this->ID;
}
$this->URLSegment = $segment;
}
// Ensure that this object has a non-conflicting URLSegment value by appending number if needed
$count = 2;
while($this->LookForExistingURLSegment($this->URLSegment))
{
$this->URLSegment = preg_replace('/-[0-9]+$/', null, $this->URLSegment) . '-' . $count;
$count++;
}
if ((!$this->URLSegment || $this->URLSegment == 'new-presentation') && $this->Title != 'New Presentation') {
$this->URLSegment = SiteTree::generateURLSegment($this->Title);
} else if ($this->isChanged('URLSegment')) {
// Make sure the URLSegment is valid for use in a URL
$segment = preg_replace('/[^A-Za-z0-9]+/', '-', $this->URLSegment);
$segment = preg_replace('/-+/', '-', $segment);
// If after sanitising there is no URLSegment, give it a reasonable default
if (!$segment) {
$segment = "presentation-" . $this->ID;
}
$this->URLSegment = $segment;
}
// Ensure that this object has a non-conflicting URLSegment value by appending number if needed
$count = 2;
while ($this->LookForExistingURLSegment($this->URLSegment)) {
$this->URLSegment = preg_replace('/-[0-9]+$/', null, $this->URLSegment) . '-' . $count;
$count++;
}
// If there's no PresentationCategoryPage, add the current summit
if (!$this->PresentationCategoryPageID) {
$SummitPageID = 0;
$SummitRedirector = DataObject::get_by_id('RedirectorPage', 154);
If ($SummitRedirector) {
$SummitPageID = $SummitRedirector->LinkToID;
$VideoPage = DataObject::get_one('PresentationCategoryPage', '`ParentID` = ' . $SummitPageID);
}
if ($VideoPage) $this->PresentationCategoryPageID = $VideoPage->ID;
}
}
//Test whether the URLSegment exists already on another Video
function LookForExistingURLSegment($URLSegment)
{
return Company::get()->filter(array('URLSegment' => $URLSegment, 'ID:not' => $this->ID))->first();
}
// Pull video thumbnail from YouTube API
function ThumbnailURL() {
if ($this->YouTubeID) {
/* $response = @file_get_contents("http://gdata.youtube.com/feeds/api/videos/".$this->YouTubeID."?v=2&alt=jsonc");
if ($response) {
$json = json_decode($response);
if (isset($json->data->thumbnail->sqDefault)) {
return $json->data->thumbnail->sqDefault;
}
} */
return "http://i.ytimg.com/vi/".$this->YouTubeID."/default.jpg";
//Test whether the URLSegment exists already on another Video
function LookForExistingURLSegment($URLSegment)
{
return (DataObject::get_one('Company', "URLSegment = '" . $URLSegment . "' AND ID != " . $this->ID));
}
// Pull video thumbnail from YouTube API
function ThumbnailURL()
{
if ($this->YouTubeID) {
return "http://i.ytimg.com/vi/" . $this->YouTubeID . "/default.jpg";
}
}
}
//Generate the link for this product
function ShowLink()
{
$ParentPage = $this->PresentationCategoryPage();
//Generate the link for this product
function ShowLink()
{
$ParentPage = $this->PresentationCategoryPage();
if ($ParentPage) {
return $ParentPage->Link()."presentation/".$this->URLSegment;
}
}
// See if the presentation slides can be embedded
function EmbedSlides()
{
// Slides can be emdedded if they are hosted on crocodoc. Otherwise, there's only a download button displayed by the template
if (strpos($this->SlidesLink,'crocodoc.com') !== false) {
return true;
if ($ParentPage) {
return $ParentPage->Link() . "presentation/" . $this->URLSegment;
}
}
}
function SchedEventImport($ParentPageID) {
$Events = SchedEvent::get();
foreach ($Events as $Event) {
// See if the presentation slides can be embedded
function EmbedSlides()
{
// Slides can be emdedded if they are hosted on crocodoc. Otherwise, there's only a download button displayed by the template
if (strpos($this->SlidesLink, 'crocodoc.com') !== false) {
return true;
}
}
function PopulateFromSchedEvent($SchedEventID)
{
$SchedEvent = DataObject::get_by_id('SchedEvent', $SchedEventID);
$this->Name = $SchedEvent->eventtitle;
$this->DisplayOnSite = TRUE;
$this->Description = $SchedEvent->description;
$this->StartTime = $SchedEvent->event_start;
$this->EndTime = $SchedEvent->event_end;
$this->Type = $SchedEvent->event_type;
$this->Speakers = $SchedEvent->speakers;
$this->event_key = $SchedEvent->event_key;
$this->write();
}
function AddYouTubeID($YouTubeID)
{
$this->YouTubeID = $YouTubeID;
$this->write();
}
function SchedEventImport($ParentPageID)
{
$Events = DataObject::get_one('SchedEvent', '');
foreach ($Events as $Event) {
$Presentation = new Presentation();
// Bring over existing data
@ -161,82 +198,20 @@ class Presentation extends DataObject {
$Presentation->EndTime = $Event->event_end;
$Presentation->Type = $Event->event_type;
$Presentation->Speakers = $Event->speakers;
// Determine day
$day = 1;
// Assign parent page
$Presentation->PresentationCategoryPageID = $ParentPageID;
$Presentation->write();
switch ($Event->event_start) {
case '2013-11-05':
$day = 1;
break;
case '2013-11-06':
$day = 2;
break;
case '2013-11-07':
$day = 3;
break;
case '2013-11-08':
$day = 4;
break;
case '2013-11-09':
$day = 5;
break;
}
if ($Event->UploadedMedia()) {
$Presentation->SlidesLink = $Event->UploadedMedia()->link();
} elseif ($Event->HostedMediaURL()) {
$Presentation->SlidesLink = $Event->HostedMediaURL();
}
$Presentation->Day = $day;
$Presentation->write();
// Assign parent page
$Presentation->PresentationCategoryPageID = $ParentPageID;
$Presentation->write();
}
}
}
if($Event->UploadedMedia()) {
$Presentation->SlidesLink = $Event->UploadedMedia()->link();
} elseif ($Event->HostedMediaURL()) {
$Presentation->SlidesLink = $Event->HostedMediaURL();
}
$Presentation->write();
}
}
function AddMedia($ParentPageID) {
$Presentations = Presentation::get()->filter('PresentationCategoryPageID', $ParentPageID);
foreach ($Presentations as $Presentation) {
if(!$Presentation->SlidesLink) {
$SchedEventMatch = SchedEvent::get()->filter('eventtitle',$Presentation->Name)->first();
if($SchedEventMatch && $SchedEventMatch->UploadedMedia()) {
$Presentation->SlidesLink = $SchedEventMatch->UploadedMedia()->link();
$Presentation->write();
echo 'Added slides to "' . $Presentation->Name . '" <br/>';
} elseif ($SchedEventMatch && $SchedEventMatch->HostedMediaURL()) {
$Presentation->SlidesLink = $SchedEventMatch->HostedMediaURL();
$Presentation->write();
echo 'Added slides to "' . $Presentation->Name . '" <br/>';
}
}
}
}
function AdjustDates() {
$Events = SchedEvent::get();
foreach ($Events as $Event) {
$Presentation = Presentation::get()->filter('Name', $Event->eventtitle)->first();
if($Presentation) {
$Presentation->StartTime = $Event->event_start;
$Presentation->EndTime = $Event->event_end;
$Presentation->write();
}
}
}
}

View File

@ -23,7 +23,7 @@ class PresentationCategoryPage extends Page {
static $has_many = array(
'Presentations' => 'Presentation'
);
static $allowed_children = array('PresentationCategoryPage');
/** static $icon = "icon/path"; */
@ -44,52 +44,46 @@ class PresentationCategoryPage extends Page {
}
}
class PresentationCategoryPage_Controller extends Page_Controller {
static $allowed_actions = array(
'presentation',
'updateURLS' => 'admin'
);
);
public function Presentations(){
if(isset($_GET['day'])){
$sessions = "";
$day = Convert::raw2xml($_GET['day']);
$day = (int)$day;
if (is_numeric($day)) {
$sessions = Presentation::get()->filter(array( 'PresentationCategoryPageID' => $this->ID , 'Day' => $day))->sort('StartTime','ASC');
} else {
$sessions = Presentation::get()->filter(array( 'PresentationCategoryPageID' => $this->ID , 'Day' => 1))->sort('StartTime','ASC');
}
} else {
$sessions = Presentation::get()->filter(array( 'PresentationCategoryPageID' => $this->ID , 'Day' => 1))->sort('StartTime','ASC');
}
$sessions = dataobject::get('Presentation','`YouTubeID` IS NOT NULL AND PresentationCategoryPageID = '.$this->ID,'StartTime DESC');
return $sessions;
}
}
function init() {
parent::init();
if(isset($_GET['day'])) {
Session::set('Day', $_GET['day']);
} else {
Session::set('Day', 1);
Session::set('Day', 1);
}
if (Director::urlParam("OtherID") != "presentation") Session::set('Autoplay',TRUE);
}
//Show the Presentation detail page using the PresentationCategoryPage_presentation.ss template
function presentation()
{
function presentation()
{
if($Presentation = $this->getPresentationByURLSegment())
{
$Data = array(
'Presentation' => $Presentation
);
$this->Title = $Presentation->Name;
$this->Title = $Presentation->Name;
$this->Autoplay = Session::get('Autoplay');
// Clear autoplay so it only happens when you come directly from videos index
Session::set('Autoplay',FALSE);
//return our $Data to use on the page
return $this->Customise($Data);
@ -101,6 +95,15 @@ class PresentationCategoryPage_Controller extends Page_Controller {
}
}
function PresentationDayID($PresentationDay) {
return trim($PresentationDay,' ');
}
function LatestPresentation()
{
return $this->Presentations()->first();
}
// Check to see if the page is being accessed in Chinese
// We use this in the templates to tell Chinese visitors how to obtain the videos on a non-youtube source
@ -119,8 +122,8 @@ class PresentationCategoryPage_Controller extends Page_Controller {
{
$Params = $this->getURLParams();
$Segment = convert::raw2sql($Params['ID']);
if($Params['ID'] && $Presentation = Presentation::get()->filter(array('URLSegment' => $Segment, 'PresentationCategoryPageID' => $this->ID))->first())
{
if($Params['ID'] && $Presentation = DataObject::get_one('Presentation', "`URLSegment` = '".$Segment."' AND `PresentationCategoryPageID` = ".$this->ID))
{
return $Presentation;
}
}
@ -141,7 +144,6 @@ class PresentationCategoryPage_Controller extends Page_Controller {
}
}
echo "Presentation URLS updated.";
}
}
}

View File

@ -1,4 +1,5 @@
<?php
/**
* Copyright 2014 Openstack Foundation
* Licensed under the Apache License, Version 2.0 (the "License");
@ -33,19 +34,20 @@ class SchedToolsPage extends Page
class SchedToolsPage_Controller extends Page_Controller
{
public static $allowed_actions = array (
'ImportSpeakersFromSched' => 'ADMIN',
'ImportSessionsFromSched' => 'ADMIN',
'ListSpeakers' => 'ADMIN',
'SpeakerTable' => 'ADMIN',
'Presentations',
'Upload',
'Form',
'Success',
'LinkTo',
'LinkToForm',
'EmailSpeakers' => 'ADMIN'
);
public static $allowed_actions = array(
'ImportSpeakersFromSched' => 'ADMIN',
'ImportSessionsFromSched' => 'ADMIN',
'ListSpeakers' => 'ADMIN',
'SpeakerTable' => 'ADMIN',
'Presentations',
'Upload',
'Form',
'Success',
'LinkTo',
'LinkToForm',
'EmailSpeakers' => 'ADMIN',
'AssignYouTubeID'
);
function init()
{
@ -81,13 +83,50 @@ class SchedToolsPage_Controller extends Page_Controller
");
}
function AssignYouTubeID()
{
if (isset($_GET['token']) &&
$_GET['token'] == "fcv4x7Nl8v" &&
isset($_GET['youtubeid']) &&
isset($_GET['schedid'])
) {
$CleanedYoutubeID = Convert::raw2sql($_GET['youtubeid']);
$CleanedSchedID = Convert::raw2sql($_GET['schedid']);
$Presentation = DataObject::get_one('Presentation', "`event_key` = '" . $CleanedSchedID . "'");
If ($Presentation) {
// Add the YouTubeID to an existing presentation
$Presentation->YouTubeID = $CleanedYoutubeID;
$Presentation->write();
} else {
// Create a new presentation with this sched event and add the youtube id
$SchedEvent = DataObject::get_one('SchedEvent', "`event_key` = '" . $CleanedSchedID . "'");
if ($SchedEvent) {
$Presentation = new Presentation();
$Presentation->PopulateFromSchedEvent($SchedEvent->ID);
$Presentation->YouTubeID = $CleanedYoutubeID;
$Presentation->sched_key = $SchedEvent->sched_key;
$Presentation->write();
}
}
}
}
function ImportSpeakersFromSched()
{
$feed = new RestfulService('http://openstacksummitnovember2014paris.sched.org/api/role/export?api_key=41caf3c5cafc24e286ade21926eaeb41&role=speaker&format=xml&fields=username,name,email',7200);
$feed = new RestfulService('http://openstacksummitnovember2014paris.sched.org/api/role/export?api_key=41caf3c5cafc24e286ade21926eaeb41&role=speaker&format=xml&fields=username,name,email', 7200);
$feedXML = $feed->request()->getBody();
@ -167,7 +206,7 @@ class SchedToolsPage_Controller extends Page_Controller
$key = Convert::raw2sql($_GET['key']);
$username = SchedSpeaker::HashToUsername($key);
$Speaker = SchedSpeaker::get()->filter('username',$username)->first();
$Speaker = SchedSpeaker::get()->filter('username', $username)->first();
} elseif ($speakerID = Session::get('UploadMedia.SpeakerID')) {
@ -232,7 +271,7 @@ class SchedToolsPage_Controller extends Page_Controller
if ( // make sure the data is numeric
is_numeric($PresentationID) &&
// make sure there's a presentation by that id
($Presentation = SchedEvent::get()->byID( $PresentationID)) &&
($Presentation = SchedEvent::get()->byID($PresentationID)) &&
// pull the speaker from the session and make sure they are a speaker for this presentation
($SpeakerID = Session::get('UploadMedia.SpeakerID')) &&
($Presentation->IsASpeaker($SpeakerID))
@ -260,7 +299,7 @@ class SchedToolsPage_Controller extends Page_Controller
{
$PresentationID = Session::get('UploadMedia.PresentationID');
$Presentation = SchedEvent::get()->byID( $PresentationID);
$Presentation = SchedEvent::get()->byID($PresentationID);
$Form = new PresentationLinkToForm($this, 'LinkToForm');
if ($Presentation && $Presentation->Metadata()) $Form->loadDataFrom($Presentation->Metadata());
@ -309,7 +348,7 @@ class SchedToolsPage_Controller extends Page_Controller
$Speakers = SchedSpeaker::get();
foreach ($Speakers as $Speaker) {
if ($Speaker->PresentationsForThisSpeaker() &&
if ($Speaker->PresentationsForThisSpeaker() &&
!$Speaker->GeneralOrKeynote() &&
!SchedSpeakerEmailLog::BeenEmailed($Speaker->email) &&
$this->validEmail($Speaker->email)

View File

@ -0,0 +1,403 @@
/*Videos Home Page*/
.main-video-wrapper {
width: 100%;
background: #222;
height: auto;
margin: 0 0 30px;
text-align: center;
box-sizing: border-box; }
a.main-video {
position: relative;
display: block;
max-width: 617px;
margin: 0 auto;
border-left: 1px solid #eee;
border-right: 1px solid #eee; }
a.main-video .video-description-wrapper {
position: absolute;
display: block;
background: rgba(0, 0, 0, 0.7);
bottom: 0;
left: 0;
right: 0;
top: 230px;
text-align: left;
z-index: 1000;
padding: 20px; }
@media (max-width: 767px) {
a.main-video .video-description-wrapper {
top: 60%; } }
@media (max-width: 480px) {
a.main-video .video-description-wrapper {
top: 50%; } }
a.main-video .video-description-wrapper .video-description {
width: 80%;
float: left; }
a.main-video .video-description-wrapper .video-description h3 {
color: white;
font-size: 22px;
font-weight: 600;
width: 100%;
height: 25px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis; }
a.main-video .video-description-wrapper .video-description p {
color: white;
font-size: 13px;
line-height: 1.2;
font-weight: 400;
padding: 0;
display: block;
width: 100%;
height: 15px;
margin: 0 auto;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis; }
a.main-video:hover .video-description-wrapper {
top: 0; }
a.main-video:hover .video-description-wrapper .video-description h3 {
height: 10%;
white-space: normal; }
a.main-video:hover .video-description-wrapper .video-description p {
height: 90%;
white-space: normal; }
@media (max-width: 480px) {
a.main-video:hover .video-description-wrapper {
top: 50%; }
a.main-video:hover .video-description-wrapper .video-description h3 {
height: 25px;
white-space: nowrap; }
a.main-video:hover .video-description-wrapper .video-description p {
height: 15px;
white-space: nowrap; } }
.main-video img {
margin: 0 auto;
width: 100%;
max-width: 615px;
max-height: 100%;
display: block;
position: relative;
z-index: 1; }
.play-btn {
float: right;
color: white;
font-size: 40px;
width: 20%;
margin-top: 5px;
text-align: center; }
.play-btn img#play {
max-width: 70px;
max-height: 70px; }
.featured-row {
width: 100%;
background: #2A4E68;
padding: 0;
position: relative;
display: block;
margin-bottom: 50px; }
.featured-row h2 {
color: white;
font-weight: 400;
font-size: 24px; }
.featured-row h2 span {
font-weight: 400;
font-size: 12px;
color: #edf2f7;
margin-left: 20px; }
.featured-row:after {
top: 100%;
left: 10%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(42, 78, 104, 0);
border-top-color: #2A4E68;
border-width: 15px;
margin-left: -15px; }
.daily-recap-wrapper .video-thumb-title {
text-align: center; }
.video-thumb {
/*background: $lightblue;*/
text-align: center;
width: 100%;
height: 0;
position: relative;
display: table;
overflow: hidden;
margin-bottom: 20px;
box-sizing: border-box; }
.thumb-play {
display: none;
background-image: url("//www.openstack.org/themes/openstack/images/landing-pages/auto/play-button.png");
background-repeat: no-repeat;
background-position: center center;
background-color: rgba(0, 0, 0, 0.3);
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0; }
.video-thumb:hover .thumb-play {
display: block; }
@media (max-width: 767px) {
.video-thumb .thumb-play {
display: block;
background-color: transparent; } }
.video-thumb img.video-thumb-img {
max-width: 100%;
width: 100%; }
.video-thumb p {
color: #C6CDD6;
font-size: 14px;
font-weight: 700;
display: table-cell;
vertical-align: middle; }
.sort-row {
background: #edf2f7;
width: 100%;
min-height: 50px;
padding: 25px 0;
position: relative;
display: block;
margin: 50px 0;
color: #2A4E68; }
.sort-left {
float: left; }
.sort-left i {
color: #b4c5d6;
line-height: 1;
margin-right: 10px; }
.sort-left i:hover {
color: #2A4E68;
cursor: pointer; }
.sort-left i.active {
color: #2A4E68; }
.sort-right {
float: right;
font-size: 12px;
text-transform: uppercase;
font-weight: 600; }
.sort-right i {
margin-left: 10px;
font-weight: 700;
font-size: 14px; }
.video-thumb-title {
margin: -10px 0 0;
color: #30739C;
font-size: 12px;
font-weight: 400;
width: 100%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis; }
.video-thumb-speaker {
color: #30739C;
font-size: 12px;
font-weight: 600;
margin-bottom: 40px;
width: 100%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis; }
@media (max-width: 767px) {
.daily-recap-wrapper .video-thumb-title {
margin-bottom: 40px; }
.video-thumb-title, .video-thumb-speaker {
text-align: center; } }
.video-dropdown > .dropdown-menu {
margin: 20px -20px 0;
padding: 10px 0;
min-width: 230px;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
left: -99%;
right: 100%;
background-color: #edf2f7;
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0);
box-shadow: none; }
/*.video-dropdown>.dropdown-menu:after, .video-dropdown>.dropdown-menu:before {
bottom: 100%;
right: 25%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.video-dropdown>.dropdown-menu:after {
border-color: rgba(255, 255, 255, 0);
border-bottom-color: #fff;
border-width: 15px;
margin-left: -15px;
}
.video-dropdown>.dropdown-menu:before {
border-color: rgba(170, 170, 170, 0);
border-bottom-color: #aaaaaa;
border-width: 15px;
margin-left: -16px;
}*/
.video-dropdown > .dropdown-menu li a {
text-transform: uppercase;
padding: 13px 20px;
font-size: 12px;
color: #2A4E68; }
.video-dropdown > .dropdown-menu li a:hover {
color: white;
background: #2A4E68; }
.video-dropdown > .dropdown-menu li a:focus {
outline: none; }
/*End Videos Home Page*/
/*Video Inner Page*/
.single-video-details {
margin: 60px auto; }
.single-video-details h3 {
text-align: left; }
.single-video-details strong {
color: #2A4E68; }
.video-share {
text-align: right;
float: right; }
.video-share a i {
font-size: 22px;
margin-left: 20px;
vertical-align: middle;
color: #759bb7; }
.video-share a i:hover {
color: #2A4E68; }
@media (max-width: 767px) {
.video-share {
float: none;
text-align: center;
margin: -20px 0 20px;
padding-top: 20px;
padding-bottom: 20px;
border-top: 1px solid #eee;
border-bottom: 1px solid #eee; }
.video-share a i {
margin: 0 10px; } }
.video-share a i.fa-twitter {
font-size: 24px;
margin-bottom: -1px; }
p.single-video-description {
margin: 10px 0 40px; }
.video-categories a {
margin-left: 10px;
text-decoration: underline; }
.video-tags {
margin-top: 15px; }
.video-tags a {
background: #edf2f7;
font-size: 10px;
font-weight: 600;
border-radius: 3px;
margin-left: 10px;
padding: 5px 10px; }
.video-speakers {
margin-top: 15px;
display: block; }
.video-speakers p a {
margin-left: 0;
text-decoration: underline; }
.video-speakers .twitter-follow-button {
margin-left: 10px; }
.video-media-title {
margin: 0 0 10px;
display: block; }
@media (max-width: 767px) {
.video-media-wrapper {
margin-top: 30px; } }
.media-btn-wrapper {
float: left;
margin-top: 10px; }
a.media-btn {
background: #2A4E68;
color: white;
padding: 10px 20px;
border-radius: 4px;
border: 0; }
a.media-btn:hover {
text-decoration: none;
background: #16283A; }
a.media-btn i {
margin-right: 10px; }
a.media-btn.right {
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
margin-left: -2px;
border-left: 1px solid #3E71A4; }
a.media-btn.left {
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
margin-right: -2px;
border-right: 1px solid #122231; }
/*End Video Inner Page*/

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.1 KiB

View File

@ -0,0 +1,57 @@
<div class="sort-row">
<div class="container">
<div class="sort-left">
<i class="fa fa-th active"></i>
<i class="fa fa-th-list"></i>
</div>
<div class="sort-right">
<div class="dropdown video-dropdown">
<a data-toggle="dropdown" href="#">Select A Day <i class="fa fa-caret-down"></i></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
<% control Presentations.GroupedBy(PresentationDay) %>
<li role="presentation"><a role="menuitem" tabindex="-1" href="{$Top.Link}#day-{$Pos}">$PresentationDay</a></li>
<% end_control %>
</ul>
</div>
</div>
</div>
</div>
<div class="container">
<!-- Start Videos -->
<div class="row">
<div class="col-lg-12">
<% control Presentations.GroupedBy(PresentationDay) %>
<div class="row">
<h2 id="day-{$Pos}">$PresentationDay</h2>
<ul>
<% control Children %>
<!-- Video Block -->
<div class="col-lg-3 col-md-3 col-sm-3">
<a href="{$Top.Link}presentation/{$URLSegment}">
<div class="video-thumb">
<div class="thumb-play"></div>
<img class="video-thumb-img" src="//img.youtube.com/vi/{$YouTubeID}/0.jpg">
</div>
<p class="video-thumb-title">
$Name
</p>
<p class="video-thumb-speaker">
$Speakers
</p>
</a>
</div>
<% end_control %>
</ul>
</div>
<% end_control %>
</div>
</div>
<!-- End Videos -->
</div>
<!-- End Page Content -->

View File

@ -1,86 +1,74 @@
<% require themedCSS(conference) %>
<% require themedCSS(videos) %>
<% loop Parent %>
$HeaderArea
<div class="container">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="eventTitleArea">
<h1>Paris Summit 2014: Videos</h1>
</div>
</div>
</div>
</div>
<% loop LatestPresentation %>
<div class="main-video-wrapper">
<a href="{$Top.Link}presentation/{$URLSegment}" class="main-video">
<div class="video-description-wrapper">
<div class="video-description">
<h3>$Name</h3>
<p>$FormattedStartTime GMT<p>
<p>$Description</p>
</div>
<div class="play-btn">
<img id="play" src="//www.openstack.org/themes/openstack/images/landing-pages/auto/play-button.png">
</div>
</div>
<img src="//img.youtube.com/vi/{$YouTubeID}/maxresdefault.jpg">
</a>
</div>
<% end_loop %>
<div class="span-5">
<p><strong>The OpenStack Summit</strong><br />$Parent.MenuTitle.XML</p>
<ul class="navigation">
<% loop Parent %>
<li><a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode"><span>Overview</span></a></li>
<% end_loop %>
<% loop Menu(3) %>
<li><a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode"><span>$MenuTitle.XML</span></a></li>
<% end_loop %>
</ul>
<% loop Parent %>
<% include HeadlineSponsors %>
<% end_loop %>
</div>
<!-- Content Area -->
<div class="prepend-1 span-11" id="news-feed">
<% if StillUploading %>
<div class="span-18 last siteMessage" id="SuccessMessage">
<p>Note: Presentations are still being uploaded. If you do not see the presentation you are looking for, please check back soon.</p>
<div class="featured-row">
<div class="container">
<h2>
Daily Recaps
<span>Highlights from the OpenStack Summit in Paris</span>
</h2>
</div>
<% end_if %>
<div class="span-18 last">
<ul class="day-picker">
<li><a href="{$Link}?day=1" <% if currentDay=1 %>class="selected"<% end_if %> >Day 1</a></li>
<li><a href="{$Link}?day=2" <% if currentDay=2 %>class="selected"<% end_if %> >Day 2</a></li>
<li><a href="{$Link}?day=3" <% if currentDay=3 %>class="selected"<% end_if %> >Day 3</a></li>
<li><a href="{$Link}?day=4" <% if currentDay=4 %>class="selected"<% end_if %> >Day 4</a></li>
</ul>
<h1>Videos of Sessions From Day $currentDay</h1>
<hr/>
<% if Presentations %>
<% loop Presentations %>
<% if DisplayOnSite %>
<% if YouTubeID %>
<div class="presentation">
<div class="span-4"><a href="{$Top.Link}presentation/{$URLSegment}"><img src="$ThumbnailURL" /></a></div>
<div class="span-14 last">
<h2><a href="{$Top.Link}presentation/{$URLSegment}">$Title</a></h2>
<% if Speakers %><p><strong>$Speakers</strong></p><% end_if %>
$RAW_val(Description)
<p>
<a href="{$Top.Link}presentation/{$URLSegment}" class="roundedButton">Watch Now</a>
<% if SlidesLink %>
&nbsp;<a href="$SlidesLink" class="roundedButton">Slides</a>
<% end_if %>
</p>
</div>
<hr/>
</div>
<% end_if %>
<% end_if %>
<% end_loop %>
<% else %>
<p>Sorry, no presentations are available for the day you've selected. Please check back soon.</p>
<% end_if %>
</div>
<ul class="day-picker">
<li><a href="{$Link}?day=1" <% if currentDay=1 %>class="selected"<% end_if %> >Day 1</a></li>
<li><a href="{$Link}?day=2" <% if currentDay=2 %>class="selected"<% end_if %> >Day 2</a></li>
<li><a href="{$Link}?day=3" <% if currentDay=3 %>class="selected"<% end_if %> >Day 3</a></li>
<li><a href="{$Link}?day=4" <% if currentDay=4 %>class="selected"<% end_if %> >Day 4</a></li>
</ul>
</div>
<div class="container daily-recap-wrapper">
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-3">
<div class="video-thumb">
<img class="video-thumb-img" src="/themes/openstack/images/no-video.jpg">
</div>
<p class="video-thumb-title">
Day 1 - Coming Soon
</p>
</div>
<div class="col-lg-3 col-md-3 col-sm-3">
<div class="video-thumb">
<img class="video-thumb-img" src="/themes/openstack/images/no-video.jpg">
</div>
<p class="video-thumb-title">
Day 2 - Coming Soon
</p>
</div>
<div class="col-lg-3 col-md-3 col-sm-3">
<div class="video-thumb">
<img class="video-thumb-img" src="/themes/openstack/images/no-video.jpg">
</div>
<p class="video-thumb-title">
Day 3 - Coming Soon
</p>
</div>
<div class="col-lg-3 col-md-3 col-sm-3">
<div class="video-thumb">
<img class="video-thumb-img" src="/themes/openstack/images/no-video.jpg">
</div>
<p class="video-thumb-title">
Day 4 - Coming Soon
</p>
</div>
</div>
</div>
<% include VideoThumbnails %>

View File

@ -1,69 +1,53 @@
<% require themedCSS(presentation) %>
<% require themedCSS(videos) %>
<h3>OpenStack Summit Presentations</h3>
<hr/>
<% loop Presentation %>
<p></p>
<div>
<div class="span-18">
<h1>"$Presentation.Name"</h1>
<h4 class="speakers">By: $Presentation.Speakers</h4>
<% if Presentation.Description %>
$Presentation.Description
<% end_if %>
<hr/>
<a name="video"></a>
<h3>Watch Presentation</h3>
<iframe width="700" height="436" src="//www.youtube.com/embed/{$Presentation.YouTubeID}" frameborder="0" allowfullscreen></iframe>
<% loop Presentation %>
<% if SlidesLink %>
<p></p>
<hr/>
<a name="slides"></a>
<% if EmbedSlides %>
<h3>View Slides</h3>
<iframe src="{$SlidesLink}?embedded=true" width="700" height="480" style="border:1px solid #ddd;"></iframe>
<% else %>
<h3>Download The Presentation Slides</h3>
<p><a href="$SlidesLink" class="roundedButton">Download Slides</a></p>
<% end_if %>
<% end_if %>
<% end_loop %>
</div>
<div class="prepend-1 span-5 last">
<div class="share-box">
<p><strong>Media:</strong><br/>
<a href="{$Top.Link}presentation/{$Presentation.URLSegment}/#video" class="roundedButton">Video</a> &nbsp;
<% if Presentation.SlidesLink %>
<a href="{$Top.Link}presentation/{$Presentation.URLSegment}/#slides" class="roundedButton">Slides</a>
<% end_if %>
</p>
<hr/>
<p><strong>Share This Presentation:</strong><br/>
<a href="https://twitter.com/share" class="twitter-share-button" data-related="jasoncosta" data-lang="en" data-size="large" data-count="none">Tweet</a></p>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
<hr/>
<p><strong>Discover More Content:</strong><br/>
<a href="{$Top.Link}?day=$Presentation.Day" class="roundedButton">More Presentations</a></p>
<div class="main-video-wrapper">
<iframe width="853" height="480" src="//www.youtube.com/embed/{$YouTubeID}?rel=0<% if Top.Autoplay %>&autoplay=1<% end_if %>" frameborder="0" allowfullscreen></iframe>
</div>
<div class="container single-video-details">
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-3 video-share">
<a href="https://twitter.com/share" data-related="jasoncosta" data-lang="en" data-size="large" data-count="none"><i class="fa fa-twitter"></i></a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</div>
<div class="col-lg-9 col-md-9 col-sm-9">
<h3>$Name</h3>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<p class="single-video-description">
$Description
</p>
<div class="row">
<div class="col-lg-7 col-md-5 col-sm-7">
<div class="video-speakers">
<strong>Speakers:</strong> $Speakers
</div>
</div>
<div class="col-lg-5 col-md-5 col-sm-5">
<!-- Slides -->
<% if SlidesLink %>
<div class="video-media-wrapper">
<p>
<strong>Related Media:</strong>
</p>
<p class="video-media-title">
superuser-slides.zip
</p>
<div class="media-btn-wrapper">
<a href="{$SlidesLink}" class="media-btn"><i class="fa fa-cloud-download"></i> Download</a>
</div>
</div>
<% end_if %>
</div>
</div>
</div>
</div>
</div>
<% end_loop %>
</div>
<% include VideoThumbnails %>