Skip to content

Instantly share code, notes, and snippets.

@sionjlewis
Last active Aug 29, 2015
Embed
What would you like to do?
Example of how to embedding a video within a Script Editor Webpart (SharePoint Online), using the Office 365 Video Portal REST API
var PlayVideo = function (chid, vid) {
var rootURL = window.location.protocol + "//" + window.location.host;
var siteURL = rootURL + '/portals/hub'
var wsPath = '/_api/VideoService/Channels(guid\'' + chid + '\')/Videos(guid\'' + vid + '\')?$Select=Title,Description,CreatedDate,DefaultEmbedCode,VideoDurationInSeconds,ID,VideoProcessingStatus,ThumbnailUrl';
var followAPI = siteURL + wsPath;
var getVideo = function () {
jQuery.ajax({
url: followAPI,
headers: {
"accept": "application/json;odata=verbose"
},
success: videoContentRetrieved,
error: requestFailed
});
}
var videoContentRetrieved = function (data) {
var stringData = JSON.stringify(data);
var jsonObject = JSON.parse(stringData);
var videoTitle = jsonObject.d.Title;
var videoEmbed = jsonObject.d.DefaultEmbedCode;
var videoStatus = jsonObject.d.VideoProcessingStatus
var htmlBody = '';
htmlBody += '<h3>' + videoTitle + '</h3>';
if (videoStatus === 2) {
htmlBody += '<div>' + videoEmbed + '</div>';
} else {
/*
VideoProcessingStatus -- The status of the video processing. Can take the following values:
0 -- (default) -- The video has not yet been processed for playback.
1 -- The video has been picked up and is being processed.
2 -- The video is ready to play.
3 -- The video encountered an error while it was being uploaded to Azure Media Services for processing.
4 -- Error -- Generic error--Unable to process the video for streaming.
5 -- Error -- Timeout error--Unable to process the video for streaming.
6 -- Error -- Unsupported format --The video file type is not supported for streaming playback by Azure Media Services.
*/
htmlBody += '<div>Unable to process the video for streaming, please try again later.</div>';
}
jQuery("div.highlightedVideo").html(htmlBody);
}
var requestFailed = function (xhr, ajaxOptions, thrownError) {
alert('Error:\n' + xhr.status + '\n' + thrownError + '\n' + xhr.responseText);
}
SP.SOD.executeFunc('sp.js', 'SP.ClientContext', getVideo);
}
<webParts>
<webPart xmlns="http://schemas.microsoft.com/WebPart/v3">
<metaData>
<type name="Microsoft.SharePoint.WebPartPages.ScriptEditorWebPart, Microsoft.SharePoint, Version=16.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" />
<importErrorMessage>Cannot import this Web Part.</importErrorMessage>
</metaData>
<data>
<properties>
<property name="ExportMode" type="exportmode">All</property>
<property name="HelpUrl" type="string" />
<property name="Hidden" type="bool">False</property>
<property name="Description" type="string">Display a video within a webpart.</property>
<property name="Content" type="string">
&lt;script type="text/javascript" src="/Style%20Library/_Custom/VideoPlayer.js" /&gt;
&lt;div class="highlightedVideo"&gt;&lt;/div&gt;
&lt;script type="text/javascript"&gt;
jQuery(document).ready(function() {
var chid = '00000000-0000-0000-0000-000000000000';
var vid = '00000000-0000-0000-0000-000000000000';
PlayVideo(chid, vid);
});
&lt;/script&gt;
</property>
<property name="CatalogIconImageUrl" type="string" />
<property name="Title" type="string">Video player</property>
<property name="AllowHide" type="bool">True</property>
<property name="AllowMinimize" type="bool">True</property>
<property name="AllowZoneChange" type="bool">True</property>
<property name="TitleUrl" type="string" />
<property name="ChromeType" type="chrometype">TitleAndBorder</property>
<property name="AllowConnect" type="bool">True</property>
<property name="Width" type="unit" />
<property name="Height" type="unit" />
<property name="HelpMode" type="helpmode">Navigate</property>
<property name="AllowEdit" type="bool">True</property>
<property name="TitleIconImageUrl" type="string" />
<property name="Direction" type="direction">NotSet</property>
<property name="AllowClose" type="bool">True</property>
<property name="ChromeState" type="chromestate">Normal</property>
</properties>
</data>
</webPart>
</webParts>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment