From 03fef32a3cb2851981056c7b8d81e6ed56e07ac7 Mon Sep 17 00:00:00 2001 From: Calin Crisan Date: Sun, 12 Apr 2015 14:52:59 +0300 Subject: [PATCH] minor effective framerate improvements --- settings_default.py | 2 +- static/js/frame.js | 25 ++++++++++++++++++------- static/js/main.js | 39 +++++++++++++++++++++++++++------------ 3 files changed, 46 insertions(+), 20 deletions(-) diff --git a/settings_default.py b/settings_default.py index 21c42c9..69b3b27 100644 --- a/settings_default.py +++ b/settings_default.py @@ -24,7 +24,7 @@ LOG_PATH = os.path.abspath(os.path.join(PROJECT_PATH, 'log')) MEDIA_PATH = os.path.abspath(os.path.join(PROJECT_PATH, 'media')) # path to motion binary (automatically detected if not set) -MOTION_BINARY = None +MOTION_BINARY = None # set to logging.DEBUG for verbose output LOG_LEVEL = logging.INFO diff --git a/static/js/frame.js b/static/js/frame.js index b403e86..3d77c51 100644 --- a/static/js/frame.js +++ b/static/js/frame.js @@ -46,11 +46,17 @@ function setupCameraFrame() { cameraPlaceholder.css('opacity', 0); cameraProgress.removeClass('visible'); - if (getCookie('motion_detected_' + cameraId) == 'true') { - cameraFrameDiv.addClass('motion-detected'); - } - else { - cameraFrameDiv.removeClass('motion-detected'); + /* there's no point in looking for a cookie update more often than once every second */ + var now = new Date().getTime(); + if (!this.lastCookieTime || now - this.lastCookieTime > 1000) { + if (getCookie('motion_detected_' + cameraId) == 'true') { + cameraFrameDiv.addClass('motion-detected'); + } + else { + cameraFrameDiv.removeClass('motion-detected'); + } + + this.lastCookieTime = now; } if (this.naturalWidth / this.naturalHeight > body.width() / body.height()) { @@ -72,8 +78,13 @@ function refreshCameraFrame() { var img = $cameraFrame.find('img.camera')[0]; var cameraId = cameraFrame.id.substring(6); - /* limit the refresh rate to 20 fps */ - var count = Math.max(1, 1 / cameraFrame.streamingFramerate * 1000 / refreshInterval); + /* at a refresh interval of 50ms, the refresh rate is limited to 20 fps */ + var count = 1000 / (refreshInterval * cameraFrame.streamingFramerate); + if (count <= 2) { + /* skipping frames (showing the same frame twice) at this rate won't be visible, + * while the effective framerate will be as close as possible to the motion's one */ + count -= 1; + } if (img.error) { /* in case of error, decrease the refresh rate to 1 fps */ diff --git a/static/js/main.js b/static/js/main.js index aeaf8a0..9359c69 100644 --- a/static/js/main.js +++ b/static/js/main.js @@ -3426,11 +3426,17 @@ function addCameraFrameUi(cameraConfig) { cameraPlaceholder.css('opacity', 0); cameraProgress.removeClass('visible'); - if (getCookie('motion_detected_' + cameraId) == 'true') { - cameraFrameDiv.addClass('motion-detected'); - } - else { - cameraFrameDiv.removeClass('motion-detected'); + /* there's no point in looking for a cookie update more often than once every second */ + var now = new Date().getTime(); + if (!this.lastCookieTime || now - this.lastCookieTime > 1000) { + if (getCookie('motion_detected_' + cameraId) == 'true') { + cameraFrameDiv.addClass('motion-detected'); + } + else { + cameraFrameDiv.removeClass('motion-detected'); + } + + this.lastCookieTime = now; } if (fullScreenCameraId) { @@ -3504,7 +3510,7 @@ function doConfigureCamera(cameraId) { } function doFullScreenCamera(cameraId) { - if (inProgress || refreshCameraFrames[cameraId]) { + if (inProgress || refreshDisabled[cameraId]) { return; } @@ -3576,7 +3582,7 @@ function refreshCameraFrames() { if (img.loading) { img.loading++; /* increases each time the camera would refresh but is still loading */ - if (img.loading > 2 * 1000 / refreshInterval) { /* limits the retry at one every two seconds */ + if (img.loading > 2 * 1000 / refreshInterval) { /* limits the retries to one every two seconds */ img.loading = 0; } else { @@ -3606,12 +3612,21 @@ function refreshCameraFrames() { } cameraFrames.each(function () { - /* limit the refresh rate to 20 fps */ - var count = Math.max(0, 1 / this.config['streaming_framerate'] * 1000 / refreshInterval); + if (!this.img) { + this.img = $(this).find('img.camera')[0]; + } + + /* at a refresh interval of 50ms, the refresh rate is limited to 20 fps */ + var count = 1000 / (refreshInterval * this.config['streaming_framerate']); var serverSideResize = this.config['streaming_server_resize']; - var img = $(this).find('img.camera')[0]; - if (img.error) { + if (count <= 2) { + /* skipping frames (showing the same frame twice) at this rate won't be visible, + * while the effective framerate will be as close as possible to the motion's one */ + count -= 1; + } + + if (this.img.error) { /* in case of error, decrease the refresh rate to 1 fps */ count = 1000 / refreshInterval; } @@ -3621,7 +3636,7 @@ function refreshCameraFrames() { } else { var cameraId = this.id.substring(6); - refreshCameraFrame(cameraId, img, serverSideResize); + refreshCameraFrame(cameraId, this.img, serverSideResize); this.refreshDivider = 0; } -- 2.39.5