change resolution everywhere to 1920x1080, fixes

README.md

@@ -27,13 +27,17 @@ Usage is very easy after you have setup the server at local network. The viewer
 5. run `npm start`
 
 # Default usage
-Viewer is located at: http://localhost:8000 <br/>
-Admin interface is located at: http://localhost:8000/admin<br/>
+Viewer is located at: http://127.0.0.1:8000 <br/>
+Admin interface is located at: http://127.0.0.1:8000/admin<br/>
 Defaults to user: `admin`, pass: `admin`<br/>
 It's highly encouraged to change the defaults to something else!
 
 # Local stream support for OBS
-> Works only when config has `mediaServer` set to `true` 
+> Works only when config has `mediaServer` set to `true`
+> if you have changed the default port from 8000, the admin interface can be found port +1
+
+Stream admin interface is located at: http://127.0.0.1:8001/admin
+Defaults to same admin username and password, which you connect to admin interface as well.
 
 at OBS go to: `Settings` -> `Stream`<br/>
 set following options:<br/>
@@ -41,16 +45,14 @@ set following options:<br/>
 |Setting|Value|
 |:---|:---|
 |Stream Type:| Custom Streaming Server|
-|URL:| `rtmp://localhost/live`|
+|URL:| `rtmp://127.0.0.1/live`|
 |Stream key:|`STREAM_NAME`|
 
-Later it is possible to define other stream names/keys too, but for now only this one is supported.
-
 # Environment variables
 |ENV|default|Usage|
 |:---|:---|:---|
 |PORT|8000|Server listen port|
-|HOST|localhost|Host or ip from where to server is externally accessible|
+|HOST|127.0.0.1|Host or ip from where to server is externally accessible|
 |ADMIN_USER|admin|Username to access admin interface|
 |ADMIN_PASS|admin|Password for the admin interface|
 

app.js

@@ -10,8 +10,8 @@ const EventEmitter = require('events');
 let cookieParser = require('cookie-parser')(config.sessionKey);
 
 class Dispatcher extends EventEmitter {}
-
 const eventDispatcher = new Dispatcher();
+const cli = require('./modules/cli');
 
 let app = express();
 let server = require('http').Server(app);
@@ -59,6 +59,7 @@ if (config.mediaServer) {
     const NodeMediaServer = require('node-media-server');
 
     const nodeServerConfig = {
+        logType: 2,
         rtmp: {
             port: 1935,
             chunk_size: 60000,
@@ -69,16 +70,19 @@ if (config.mediaServer) {
         http: {
             port: (parseInt(config.serverListenPort) + 1),
             allow_origin: '*'
+        },
+        auth: {
+            api : true,
+            api_user: config.admins[0].username,
+            api_pass: config.admins[0].password              
         }
     };
 
     let nms = new NodeMediaServer(nodeServerConfig);
-    nms.run();
+    nms.run();    
 }
 
 
-
-
 i18next
     .use(FilesystemBackend)
     .use(i18nextMiddleware.LanguageDetector)

modules/admin.js

@@ -130,11 +130,10 @@ class admin {
 
                 if (serverOptions.isStreaming === false) {
                     serverOptions.loop = false;
-                    serverOptions.streamSource = "http://" + config.serverHost + ":" + (config.serverListenPort + 1) + "/live/" + data.streamName + ".flv";
+                    serverOptions.streamSource = "http://" + config.serverHost + ":" + (parseInt(config.serverListenPort) + 1) + "/live/" + data.streamName + ".flv";
                     serverOptions.isStreaming = true;
                     cli.success("start stream");
                 } else {
-
                     serverOptions.loop = true;
                     serverOptions.isStreaming = false;
                     serverOptions.streamSource = "";

public/js/edit.js

@@ -194,7 +194,7 @@ function undo() {
                 if (bundleData.styleHeader.fontSize !== fontSize) {
                     object.setOptions({fontSize: fontSize});
                 }
-                if (bundleData.styleHeader.fill !== "") {
+                if (bundleData.styleHeader.stroke !== "") {
                     object.setShadow({color: "rgba(0,0,0,0.6)", blur: 5, offsetX: 2, offsetY: 2});
                 }
             } else {
@@ -202,7 +202,7 @@ function undo() {
                 if (bundleData.styleText.fontSize !== fontSize) {
                     object.setOptions({fontSize: fontSize});
                 }
-                if (bundleData.styleText.fill !== "") {
+                if (bundleData.styleText.stroke !== "") {
                     object.setShadow({color: "rgba(0,0,0,0.6)", blur: 5, offsetX: 2, offsetY: 2});
                 }
             }
@@ -476,7 +476,7 @@ function nextSlide(data) {
                 if (bundleData.styleHeader.fontSize !== fontSize) {
                     object.setOptions({fontSize: fontSize});
                 }
-                if (bundleData.styleHeader.fill !== "") {
+                if (bundleData.styleHeader.stroke !== "") {
                     object.setShadow({color: "rgba(0,0,0,0.6)", blur: 5, offsetX: 2, offsetY: 2});
                 }
             } else {
@@ -484,7 +484,7 @@ function nextSlide(data) {
                 if (bundleData.styleText.fontSize !== fontSize) {
                     object.setOptions({fontSize: fontSize});
                 }
-                if (bundleData.styleText.fill !== "") {
+                if (bundleData.styleText.stroke !== "") {
                     object.setShadow({color: "rgba(0,0,0,0.6)", blur: 5, offsetX: 2, offsetY: 2});
                 }
             }
@@ -558,10 +558,12 @@ function addText(content, isHeader) {
         y = 30;
     }
 
+    var needShadow = bundleData.styleText.stroke === "" ? true : false;
     if (isHeader) {
         text.id = "header";
         text.setOptions(bundleData.styleHeader);
         text.setOptions({top: y + 10, left: 150});
+        needShadow = bundleData.styleHeader.stroke === "" ? true : false;
     } else {
         text.setOptions(bundleData.styleText);
         text.setOptions({top: y + 10, left: 250});
@@ -571,8 +573,9 @@ function addText(content, isHeader) {
     text.hasControls = false;
     text.lockUniScaling = true;
     text.hasRotatingPoint = false;
-
-    text.setShadow({color: "#000", blur: 5, offsetX: 2, offsetY: 2});
+    if (needShadow) {
+        text.setShadow({color: "#000", blur: 5, offsetX: 2, offsetY: 2});
+    }
     canvas.add(text);
 }
 
@@ -785,8 +788,8 @@ function saveAsFullScreenImage(name = "untitled", imageData) {
                 objects: [{
                     type: "image",
                     version: "2.6.0",
-                    width: 1280,
-                    height: 720,
+                    width: 1920,
+                    height: 1080,
                     crossOrigin: "",
                     src: dataurl,
                     filters: []

public/js/preview.js

@@ -138,7 +138,7 @@ function fixCanvas() {
         width = con.innerWidth(),
         height = Math.floor(width * aspect);
 
-    canvas.setWidth(1280).setHeight(720);
+    canvas.setWidth(1920).setHeight(1080);
     $("#c").css("width", width + "px").css("height", height + "px");
     canvas.calcOffset();
 }

views/admin/editSlide.twig

@@ -13,10 +13,7 @@
         color: white;
     }
 
-    canvas {
-        -webkit-font-smoothing: antialiased;
-        -moz-osx-font-smoothing: grayscale;
-        -moz-font-smoothing: antialiased;
+    canvas {        
         font-smoothing: antialiased;
         text-rendering: geometricPrecision;
         font-smooth: always;
@@ -189,7 +186,7 @@
 
 <div style="margin:0; padding:0;">
     <div id="matchsize">
-        <canvas id="edit" width="1280" height="720" style="position: fixed; z-index:10;"></canvas>
+        <canvas id="edit" width="1920" height="1080" style="position: fixed; z-index:10;"></canvas>
         <div id="bg">
             <img id="bgimg" class="fsimage" src="" />
         </div>
@@ -234,7 +231,7 @@
     </div>
 </div>
 
-<canvas id="tempCanvas" width="1280" height="720" style="display: none"></canvas>
+<canvas id="tempCanvas" width="1920" height="1080" style="display: none"></canvas>
 
 <script>
     var socket = io.connect("{{ config.serverUrl }}:{{ config.serverListenPort }}/admin-" + displayId);
@@ -283,8 +280,8 @@
 
         var src = e.target.result;
         var tempCanvas = new fabric.StaticCanvas("tempCanvas", {
-            width: 1280,
-            height: 720
+            width: 1920,
+            height: 1080
         });
         tempCanvas.backgroundColor = null;
         tempCanvas.backgroundImage = null;

views/preview.twig

@@ -11,7 +11,7 @@
 
 {% block body %}
 
-    <canvas id="c" width="1280" height="720" style="position: fixed; z-index: 3;"></canvas>
+    <canvas id="c" width="1980" height="1080" style="position: fixed; z-index: 3;"></canvas>
 
     <div id="bg" style="display: none;">
         <img id="bgimg" class="fsimage" src="" />