[NEW] Livestream tab

.meteor/packages

@@ -83,6 +83,7 @@ rocketchat:katex
 rocketchat:ldap
 rocketchat:lib
 rocketchat:livechat
+rocketchat:livestream
 rocketchat:logger
 rocketchat:login-token
 rocketchat:mailer

.meteor/versions

@@ -170,6 +170,7 @@ rocketchat:katex@0.0.1
 rocketchat:ldap@0.0.1
 rocketchat:lib@0.0.1
 rocketchat:livechat@0.0.1
+rocketchat:livestream@0.0.1
 rocketchat:logger@0.0.1
 rocketchat:login-token@1.0.0
 rocketchat:mailer@0.0.1

packages/rocketchat-channel-settings/server/methods/saveRoomSettings.js

@@ -10,7 +10,7 @@ Meteor.methods({
 				method: 'saveRoomSettings'
 			});
 		}
-		if (!['roomName', 'roomTopic', 'roomAnnouncement', 'roomDescription', 'roomType', 'readOnly', 'reactWhenReadOnly', 'systemMessages', 'default', 'joinCode', 'tokenpass'].some((s) => s === setting)) {
+		if (!['roomName', 'roomTopic', 'roomAnnouncement', 'roomDescription', 'roomType', 'readOnly', 'reactWhenReadOnly', 'systemMessages', 'default', 'joinCode', 'tokenpass', 'streamingOptions'].some((s) => s === setting)) {
 			throw new Meteor.Error('error-invalid-settings', 'Invalid settings provided', {
 				method: 'saveRoomSettings'
 			});
@@ -75,6 +75,9 @@ Meteor.methods({
 					});
 					RocketChat.saveRoomTokenpass(rid, value);
 					break;
+				case 'streamingOptions':
+					RocketChat.saveStreamingOptions(rid, value);
+					break;
 				case 'readOnly':
 					if (value !== room.ro) {
 						RocketChat.saveRoomReadOnly(rid, value, Meteor.user());

packages/rocketchat-livestream/client/tabBar.js

@@ -0,0 +1,16 @@
+Meteor.startup(function() {
+	Tracker.autorun(function() {
+		if (RocketChat.settings.get('Livestream_enabled')) {
+			return RocketChat.TabBar.addButton({
+				groups: ['channel', 'group'],
+				id: 'livestream',
+				i18nTitle: 'Livestream',
+				icon: 'play',
+				template: 'liveStreamTab',
+				order: 3
+			});
+		} else {
+			RocketChat.TabBar.removeButton('livestream');
+		}
+	});
+});

packages/rocketchat-livestream/client/views/liveStreamTab.html

@@ -0,0 +1,29 @@
+<template name="liveStreamTab">
+	<div class="contextual-bar__header flex-tab__header">
+		<div class="title">
+			<h2>{{_ "Livestream_title" }}</h2>
+		</div>
+	</div>
+	<div class="contextual-bar__content flex-tab">
+		{{#if canEdit}}
+			{{#if editing}}
+				<form class="liveStreamTab_form">
+					<input type="text" name="streamingOptions" class="content-background-color editing" placeholder="{{_ "Livestream_url"}}" value="{{ streamingSource }}"/>
+					<button type="button" class="button js-cancel" title="{{_ 'Cancel'}}" >{{_ "Cancel"}}</button>
+					<button type="button" class="button primary js-save">{{_ "Save"}}</button>
+				</form>
+			{{else}}
+				<div class="setting-block">
+					<span class="current-setting streamingSourceSetting"> {{ streamingSource }} </span>
+				</div>
+			{{/if}}
+		{{/if}}
+		{{#if hasSource}}
+			<iframe width="356" height="350" src="{{ streamingSource }}"
+				frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen>
+			</iframe>
+		{{else}}
+			<div> {{_ "Livestream_not_found" }}</div>
+		{{/if}}
+	</div>
+</template>

packages/rocketchat-livestream/client/views/liveStreamTab.js

@@ -0,0 +1,65 @@
+import toastr from 'toastr';
+
+Template.liveStreamTab.helpers({
+	streamingSource() {
+		const streamingOptions = Template.instance().streamingOptions.get();
+		if (streamingOptions == null) {
+			return '';
+		} else {
+			const parsedUrl = streamingOptions.url.match(/(http:|https:|)\/\/(clips.|player.|www.)?(twitch\.tv|vimeo\.com|youtu(be\.com|\.be|be\.googleapis\.com))\/(video\/|embed\/|watch\?v=|v\/|embed\?clip=)?([A-Za-z0-9._%-]*)(\&\S+)?/);
+			let source = streamingOptions.url;
+			if (parsedUrl[3].includes('youtu')) {
+				source = `https://www.youtube.com/embed/${ parsedUrl[6] }`;
+			} else if (parsedUrl[3].includes('vimeo')) {
+				source = `https://player.vimeo.com/video/${ parsedUrl[6] }`;
+			} else if (parsedUrl[3].includes('twitch')) {
+				source = `http://player.twitch.tv/?channel=${ parsedUrl[6] }`;
+			}
+			// @TODO add support for other urls
+
+			return source;
+		}
+
+	},
+	hasSource() {
+		return !!Template.instance().streamingOptions.get() && Template.instance().streamingOptions.get().url !== '';
+	},
+	canEdit() {
+		return RocketChat.authz.hasAllPermission('edit-room', this.rid);
+	},
+	editing() {
+		return Template.instance().editing.get() || !Template.instance().streamingOptions.get();
+	}
+});
+
+Template.liveStreamTab.onCreated(function() {
+	this.editing = new ReactiveVar(false);
+	this.streamingOptions = new ReactiveVar();
+
+	this.autorun(() => {
+		const room = RocketChat.models.Rooms.findOne(this.data.rid, { fields: { streamingOptions : 1 } });
+		this.streamingOptions.set(room.streamingOptions);
+	});
+});
+
+Template.liveStreamTab.events({
+	'click .js-save'(e, i) {
+		e.preventDefault();
+
+		const streamingOptions = {
+			url: i.find('[name=streamingOptions]').value
+		};
+		Meteor.call('saveRoomSettings', this.rid, 'streamingOptions', streamingOptions, function(err) {
+			if (err) {
+				return handleError(err);
+			}
+			i.editing.set(false);
+			i.streamingOptions.set(streamingOptions);
+			return toastr.success(TAPi18n.__('Streaming_source_changed_succesfully'));
+		});
+	},
+	'click .streamingSourceSetting'(e, i) {
+		e.preventDefault();
+		i.editing.set(true);
+	}
+});

packages/rocketchat-livestream/package.js

@@ -0,0 +1,25 @@
+Package.describe({
+	name: 'rocketchat:livestream',
+	version: '0.0.1',
+	summary: 'Embed livestream to Rocket.Chat channels',
+	git: ''
+});
+
+Package.onUse(function(api) {
+	api.use('templating', 'client');
+	api.use([
+		'ecmascript',
+		'rocketchat:lib'
+	]);
+	api.addFiles([
+		'client/views/liveStreamTab.html',
+		'client/views/liveStreamTab.js',
+		'client/tabBar.js'
+	], 'client');
+
+	api.addFiles([
+		'server/models/Rooms.js',
+		'server/functions/saveStreamingOptions.js',
+		'server/settings.js'
+	], 'server');
+});

packages/rocketchat-livestream/server/functions/saveStreamingOptions.js

@@ -0,0 +1,9 @@
+RocketChat.saveStreamingOptions = function(rid, streamingOptions) {
+	if (!Match.test(rid, String)) {
+		throw new Meteor.Error('invalid-room', 'Invalid room', {
+			'function': 'RocketChat.saveStreamingOptions'
+		});
+	}
+
+	return RocketChat.models.Rooms.setStreamingOptionsById(rid, streamingOptions);
+};

packages/rocketchat-livestream/server/models/Rooms.js

@@ -0,0 +1,8 @@
+RocketChat.models.Rooms.setStreamingOptionsById = function(_id, streamingOptions) {
+	const update = {
+		$set: {
+			streamingOptions
+		}
+	};
+	return this.update({ _id }, update);
+};

packages/rocketchat-livestream/server/settings.js

@@ -0,0 +1,9 @@
+Meteor.startup(function() {
+	RocketChat.settings.addGroup('LiveStream', function() {
+		this.add('Livestream_enabled', false, {
+			type: 'boolean',
+			i18nLabel: 'Enabled',
+			public: true
+		});
+	});
+});

server/publications/room.js

@@ -32,7 +32,8 @@ const fields = {
 	ro: 1,
 	reactWhenReadOnly: 1,
 	sentiment: 1,
-	tokenpass: 1
+	tokenpass: 1,
+	streamingOptions: 1
 };
 
 const roomMap = (record) => {

server/startup/roomPublishes.js

@@ -16,7 +16,8 @@ Meteor.startup(function() {
 				jitsiTimeout: 1,
 				description: 1,
 				sysMes: 1,
-				joinCodeRequired: 1
+				joinCodeRequired: 1,
+				streamingOptions: 1
 			}
 		};
 
@@ -49,7 +50,8 @@ Meteor.startup(function() {
 				jitsiTimeout: 1,
 				description: 1,
 				sysMes: 1,
-				tokenpass: 1
+				tokenpass: 1,
+				streamingOptions: 1
 			}
 		};