From 3deb8a35bbefa061deabf6d258eec6c6c21e7709 Mon Sep 17 00:00:00 2001
From: Isaac Connor <isaac@zoneminder.com>
Date: Mon, 30 Oct 2017 21:38:27 -0400
Subject: [PATCH] fixes

---
 db/zm_update-1.31.12.sql              | 10 +++++-----
 web/skins/classic/views/js/montage.js | 13 +++++++++++++
 2 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/db/zm_update-1.31.12.sql b/db/zm_update-1.31.12.sql
index 6a43d697c..733541c85 100644
--- a/db/zm_update-1.31.12.sql
+++ b/db/zm_update-1.31.12.sql
@@ -25,7 +25,7 @@ EXECUTE stmt;
 SET @s = ( SELECT IF(
     (SELECT COUNT(*) FROM MontageLayouts WHERE Name='Freeform') > 0,
       "SELECT 'Freeform already in layouts'",
-'INSERT INTO MontageLayouts (`Name`,`Positions`) VALUES (\'Freeform\', \'{"default":{"float":"left"}}\');' 
+'INSERT INTO MontageLayouts (`Name`,`Positions`) VALUES (\'Freeform\', \'{"default":{"float":"left","position":"relative"}}\');' 
 ) );
 PREPARE stmt FROM @s;
 EXECUTE stmt;
@@ -33,7 +33,7 @@ EXECUTE stmt;
 SET @s = ( SELECT IF(
     (SELECT COUNT(*) FROM MontageLayouts WHERE Name='2 Wide') > 0,
 "SELECT '2 Wide already in layouts'",
-'INSERT INTO MontageLayouts (`Name`,`Positions`) VALUES (\'2 Wide\', \'{"default":{"float":"left","width":"49%"}}\');'
+'INSERT INTO MontageLayouts (`Name`,`Positions`) VALUES (\'2 Wide\', \'{"default":{"float":"left","position":"relative","width":"49%"}}\');'
 ) );
 PREPARE stmt FROM @s;
 EXECUTE stmt;
@@ -41,7 +41,7 @@ EXECUTE stmt;
 SET @s = ( SELECT IF(
     (SELECT COUNT(*) FROM MontageLayouts WHERE Name='3 Wide') > 0,
       "SELECT '3 Wide already in layouts'",
-'INSERT INTO MontageLayouts (`Name`,`Positions`) VALUES (\'3 Wide\', \'{"default":{"float":"left","width":"33%"}}\');'
+'INSERT INTO MontageLayouts (`Name`,`Positions`) VALUES (\'3 Wide\', \'{"default":{"float":"left","position":"relative","width":"33%"}}\');'
 ) );
 PREPARE stmt FROM @s;
 EXECUTE stmt;
@@ -49,7 +49,7 @@ EXECUTE stmt;
 SET @s = ( SELECT IF(
     (SELECT COUNT(*) FROM MontageLayouts WHERE Name='4 Wide') > 0,
       "SELECT '4 Wide already in layouts'",
-'INSERT INTO MontageLayouts (`Name`,`Positions`) VALUES (\'4 Wide\', \'{"default":{"float":"left","width":"24.5%"}}\');'
+'INSERT INTO MontageLayouts (`Name`,`Positions`) VALUES (\'4 Wide\', \'{"default":{"float":"left","position":"relative","width":"24.5%"}}\');'
 ) );
 
 PREPARE stmt FROM @s;
@@ -58,7 +58,7 @@ EXECUTE stmt;
 SET @s = ( SELECT IF(
     (SELECT COUNT(*) FROM MontageLayouts WHERE Name='5 Wide') > 0,
       "SELECT '5 Wide already in layouts'",
-      "INSERT INTO MontageLayouts (`Name`,`Positions`) VALUES ('5 Wide', '{\"default\":{\"float\":\"left\",\"width\":\"19%\"}}' );"
+      'INSERT INTO MontageLayouts (`Name`,`Positions`) VALUES (\'5 Wide\', \'{"default":{"float":"left","position":"relative","width":"19%"}}\' );'
 ) );
 
 PREPARE stmt FROM @s;
diff --git a/web/skins/classic/views/js/montage.js b/web/skins/classic/views/js/montage.js
index 72445f453..45c57098c 100644
--- a/web/skins/classic/views/js/montage.js
+++ b/web/skins/classic/views/js/montage.js
@@ -268,6 +268,16 @@ function toGrid(value) {
   return Math.round(value / 80) * 80;
 }
 
+function getOffset( el ) {
+      var _x = 0;
+      var _y = 0;
+      while( el && !isNaN( el.offsetLeft ) && !isNaN( el.offsetTop ) ) {
+                _x += el.offsetLeft - el.scrollLeft;
+                _y += el.offsetTop - el.scrollTop;
+                el = el.offsetParent;
+            }
+      return { top: _y, left: _x };
+}
 
 // Makes monitorFrames draggable.
 function edit_layout(button) {
@@ -282,8 +292,11 @@ function edit_layout(button) {
       console.log("Error finding frame for " + monitor.id );
       continue;
     }
+    var position = getOffset( monitor_frame );
     monitor_frame.css('float','none');
     monitor_frame.css('position','absolute');
+    monitor_frame.css('top', position.top+'px' );
+    monitor_frame.css('left', position.left+'px' );
   } // end foreach monitor
 
   $j('#monitors .monitorFrame').draggable({