Implemented self portrait video layout.

src/i18n/messages-de.po

@@ -8,8 +8,8 @@ msgid ""
 msgstr ""
 "Project-Id-Version: Spreed WebRTC 1.0\n"
 "Report-Msgid-Bugs-To: simon@struktur.de\n"
-"POT-Creation-Date: 2014-09-16 10:29+0200\n"
-"PO-Revision-Date: 2014-09-16 10:30+0100\n"
+"POT-Creation-Date: 2014-09-18 20:17+0200\n"
+"PO-Revision-Date: 2014-09-18 20:17+0100\n"
 "Last-Translator: Simon Eisenmann <simon@struktur.de>\n"
 "Language-Team: struktur AG <opensource@struktur.de>\n"
 "Plural-Forms: nplurals=2; plural=(n != 1)\n"
@@ -51,6 +51,9 @@ msgstr "Standardansicht"
 msgid "Kiosk view"
 msgstr "Kiosk-Ansicht"
 
+msgid "Self portrait"
+msgstr "Selbstportrait"
+
 msgid "Start chat"
 msgstr "Chat starten"
 

src/i18n/messages-ja.po

@@ -8,7 +8,7 @@ msgid ""
 msgstr ""
 "Project-Id-Version: Spreed WebRTC 1.0\n"
 "Report-Msgid-Bugs-To: simon@struktur.de\n"
-"POT-Creation-Date: 2014-09-16 10:29+0200\n"
+"POT-Creation-Date: 2014-09-18 20:17+0200\n"
 "PO-Revision-Date: 2014-04-23 22:25+0100\n"
 "Last-Translator: Curt Frisemo <curt.frisemo@spreed.com>\n"
 "Language-Team: Curt Frisemo <curt.frisemo@spreed.com>\n"
@@ -51,6 +51,9 @@ msgstr ""
 msgid "Kiosk view"
 msgstr ""
 
+msgid "Self portrait"
+msgstr ""
+
 msgid "Start chat"
 msgstr "チャットを始める"
 

src/i18n/messages-ko.po

@@ -8,7 +8,7 @@ msgid ""
 msgstr ""
 "Project-Id-Version: Spreed WebRTC 1.0\n"
 "Report-Msgid-Bugs-To: simon@struktur.de\n"
-"POT-Creation-Date: 2014-09-16 10:29+0200\n"
+"POT-Creation-Date: 2014-09-18 20:17+0200\n"
 "PO-Revision-Date: 2014-04-13 20:30+0900\n"
 "Last-Translator: Curt Frisemo <curt.frisemo@spreed.com>\n"
 "Language-Team: Curt Frisemo <curt.frisemo@spreed.com>\n"
@@ -51,6 +51,9 @@ msgstr ""
 msgid "Kiosk view"
 msgstr ""
 
+msgid "Self portrait"
+msgstr ""
+
 msgid "Start chat"
 msgstr "대화시작"
 

src/i18n/messages-zh-cn.po

@@ -8,7 +8,7 @@ msgid ""
 msgstr ""
 "Project-Id-Version: Spreed WebRTC 1.0\n"
 "Report-Msgid-Bugs-To: simon@struktur.de\n"
-"POT-Creation-Date: 2014-09-16 10:29+0200\n"
+"POT-Creation-Date: 2014-09-18 20:17+0200\n"
 "PO-Revision-Date: 2014-05-21 09:54+0800\n"
 "Last-Translator: Michael P.\n"
 "Language-Team: Curt Frisemo <curt.frisemo@spreed.com>\n"
@@ -51,6 +51,9 @@ msgstr ""
 msgid "Kiosk view"
 msgstr ""
 
+msgid "Self portrait"
+msgstr ""
+
 msgid "Start chat"
 msgstr "开始聊天"
 

src/i18n/messages-zh-tw.po

@@ -8,7 +8,7 @@ msgid ""
 msgstr ""
 "Project-Id-Version: Spreed WebRTC 1.0\n"
 "Report-Msgid-Bugs-To: simon@struktur.de\n"
-"POT-Creation-Date: 2014-09-16 10:29+0200\n"
+"POT-Creation-Date: 2014-09-18 20:17+0200\n"
 "PO-Revision-Date: 2014-05-21 09:55+0800\n"
 "Last-Translator: Michael P.\n"
 "Language-Team: Curt Frisemo <curt.frisemo@spreed.com>\n"
@@ -51,6 +51,9 @@ msgstr ""
 msgid "Kiosk view"
 msgstr ""
 
+msgid "Self portrait"
+msgstr ""
+
 msgid "Start chat"
 msgstr "開始聊天"
 

src/i18n/messages.pot

@@ -9,7 +9,7 @@ msgid ""
 msgstr ""
 "Project-Id-Version: Spreed WebRTC 1.0\n"
 "Report-Msgid-Bugs-To: simon@struktur.de\n"
-"POT-Creation-Date: 2014-09-16 10:29+0200\n"
+"POT-Creation-Date: 2014-09-18 20:17+0200\n"
 "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <LL@li.org>\n"
@@ -51,6 +51,9 @@ msgstr ""
 msgid "Kiosk view"
 msgstr ""
 
+msgid "Self portrait"
+msgstr ""
+
 msgid "Start chat"
 msgstr ""
 

src/styles/components/_audiovideo.scss

@@ -123,6 +123,7 @@
     transform: scale(-1, 1);
     transition-property: opacity;
     transition-duration: .5s;
+    z-index: 25;
     &.visible {
       opacity: 1;
     }
@@ -232,7 +233,7 @@
 .audiovideo .overlayActions {
   background: $video-overlayactions;
   bottom: 0;
-  height: 70px;
+  height: 105px;
   left: 0;
   margin:auto 0;
   opacity: 0;
@@ -357,3 +358,23 @@
     }
   }
 }
+
+.renderer-selfportrait {
+  .miniContainer {
+    max-height: 100%;
+    width: 100%;
+    height: 100%;
+    left: 0px;
+    right: 0px;
+    bottom: 0px;
+    top: 0px;
+    .miniVideo {
+      width: 100%;
+      height: 100%;
+    }
+  }
+  .remoteVideos {
+    opacity: 0 !important;
+    display: none;
+  }
+}

static/js/services/videolayout.js

@@ -171,6 +171,17 @@ define(["jquery", "underscore", "modernizr", "injectCSS"], function($, _, Modern
 		Smally.prototype.constructor = Smally;
 		Smally.prototype.name = "smally";
 
+
+		// SelfPortrait inherits from OnePeople
+		var SelfPortrait = function(container, scope, controller) {
+			// Call super.
+			OnePeople.call(this, container, scope, controller);
+		}
+		SelfPortrait.prototype = Object.create(OnePeople.prototype);
+		SelfPortrait.prototype.constructor = SelfPortrait;
+		SelfPortrait.prototype.name = "selfportrait";
+
+
 		// A view with one selectable large video. The others are small.
 		var ConferenceKiosk = function(container, scope, controller) {
 
@@ -274,7 +285,7 @@ define(["jquery", "underscore", "modernizr", "injectCSS"], function($, _, Modern
 		renderers[OnePeople.prototype.name] = OnePeople;
 		renderers[Smally.prototype.name] = Smally;
 		renderers[ConferenceKiosk.prototype.name] = ConferenceKiosk;
-
+		renderers[SelfPortrait.prototype.name] = SelfPortrait;
 
 		// Public api.
 		var current = null;

static/partials/audiovideo.html

@@ -14,5 +14,6 @@
   <div class="overlayActions">
     <button class="btn btn-link" title="{{_('Standard view')}}" ng-click="setRenderer('onepeople')"><i class="fa fa-table" ></i></button>
     <button class="btn btn-link" title="{{_('Kiosk view')}}" ng-click="setRenderer('conferencekiosk')"><i class="fa fa-user"></i></button>
+    <button class="btn btn-link" title="{{_('Self portrait')}}" ng-click="setRenderer('selfportrait')"><i class="fa fa-dot-circle-o"></i></button>
   </div>
 </div>