diff --git a/CHANGES.txt b/CHANGES.txt
index ae3c9e75..bd59141f 100644
--- a/CHANGES.txt
+++ b/CHANGES.txt
@@ -1,5 +1,8 @@
 Change List
 =========
+Version 3.1.48 (Build 2021062800)
+- added screen recorder
+
 Version 3.1.47 (Build 2021061100)
 -updated native video template
 -tweaked the file extension parser in uploader.js
diff --git a/amd/src/dlg_devicesettings.js b/amd/src/dlg_devicesettings.js
index d54b9818..5a72fdbe 100644
--- a/amd/src/dlg_devicesettings.js
+++ b/amd/src/dlg_devicesettings.js
@@ -31,6 +31,11 @@ define(['jquery', 'core/log', 'filter_poodll/dlg_poodll'], function ($, log, dia
             this.dlgbox = dlgbox;
             this.dlg.set_dialogue_box(dlgbox);
 
+        },
+        set_media_type: function (mediatype) {
+            //used by screen recorder skin to overide default media type in order to not show video
+            this.mediatype = mediatype;
+
         },
         open: function () {
             var self = this;
@@ -67,7 +72,7 @@ define(['jquery', 'core/log', 'filter_poodll/dlg_poodll'], function ($, log, dia
                     //register events for the select boxes
                     self.registerEvents();
 
-                    if (self.instanceprops.config.mediatype == 'video') {
+                    if (self.mediatype == 'video') {
                         self.dlg.onclose = function () {
                             self.resetVideoUserInterface();
                         };
diff --git a/amd/src/poodll_mediarecorder.js b/amd/src/poodll_mediarecorder.js
index e329ecb5..a4f654b8 100644
--- a/amd/src/poodll_mediarecorder.js
+++ b/amd/src/poodll_mediarecorder.js
@@ -160,8 +160,8 @@ define(['jquery', 'core/log', 'filter_poodll/utils_amd',
 
                     this.register_events_video(controlbarid);
 
-                    //if this is the uploader skin, then we do not bother to get mediaDevices
-                    if (ip.config.media_skin == 'upload' || ip.config.media_skin == 'warning') {
+                    //if this is any of the uploader/warning/screen skins, then we do not bother to get mediaDevices
+                    if (ip.config.media_skin == 'upload' || ip.config.media_skin == 'warning' || ip.config.media_skin == 'screen') {
                         break;
                     }
 
@@ -279,6 +279,7 @@ define(['jquery', 'core/log', 'filter_poodll/utils_amd',
 
         },
 
+
         warmup_context: function (ip) {
             var ctx = ip.audioctx;
             //for chrome oct 2018
@@ -336,6 +337,49 @@ define(['jquery', 'core/log', 'filter_poodll/utils_amd',
             });
 
         },
+
+
+        do_start_screen: function (ip, onMediaSuccess) {
+
+            var that = this;
+            // we warm up the context object
+            this.warmup_context(ip);
+
+            // warmup. the preview object
+            this.warmup_preview(ip);
+
+            //mute the preview
+            ip.controlbar.preview[0].muted=true;
+
+            ip.blobs = [];
+            //get media constraints
+            var mediaConstraints = {
+                audio: {'echoCancellation': true},
+                video: {cursor: "motion"}
+            };
+
+            //set aspect ratio and I think the "exact" below should be "ideal"
+            //  mediaConstraints.video = {aspectRatio: 1920/1080};
+
+
+            //do all our stream stuff
+            navigator.mediaDevices.getDisplayMedia(mediaConstraints)
+                .then(async function(displayStream){
+                    // check for a user audio selected device
+                    if (ip.useraudiodeviceid) {
+                        var audiodeviceid = ip.useraudiodeviceid.valueOf();
+                        mediaConstraints.audio.deviceId = audiodeviceid ? {exact: audiodeviceid} : undefined;
+                    }
+                    var voiceStream = await navigator.mediaDevices.getUserMedia({ audio: mediaConstraints.audio, video: false });
+                    var tracks = [...displayStream.getTracks(), ...voiceStream.getAudioTracks()]
+                    var stream = new MediaStream(tracks);
+                    onMediaSuccess(stream);
+                })
+                .catch(function (e) {
+                    that.onMediaError(e, ip);
+            });
+        },
+
         do_start_video: function (ip, onMediaSuccess) {
 
         },
@@ -448,7 +492,10 @@ define(['jquery', 'core/log', 'filter_poodll/utils_amd',
             ip.config.hermes.postMessage(messageObject);
         },
         do_stop_video: function (ip) {
-
+            //just use do_stop_audio
+        },
+        do_stop_screen: function (ip) {
+         //just use do_stop_audio
         },
         do_pause_audio: function (ip) {
             //if its paused we need to resume it before pausing again.
@@ -466,7 +513,7 @@ define(['jquery', 'core/log', 'filter_poodll/utils_amd',
 
         },
 
-        /* fetch the audio constraints for passing to mediastream */
+        /* fetch the video constraints for passing to mediastream */
         fetch_video_constraints: function (ip) {
             var mediaConstraints = {
                 audio: !utils.is_opera() && !utils.is_edge(),
@@ -493,6 +540,33 @@ define(['jquery', 'core/log', 'filter_poodll/utils_amd',
             return mediaConstraints;
         },
 
+        /* fetch the screen constraints for passing to mediastream */
+        fetch_screen_constraints: function (ip) {
+            var mediaConstraints = {
+                audio: !utils.is_opera() && !utils.is_edge(),
+                video: true
+            };
+
+            //set aspect ratio and I think the "exact" below should be "ideal"
+            //  mediaConstraints.video = {aspectRatio: 1920/1080};
+            //alert('set');
+
+            // check for a user video selected device
+            if (ip.uservideodeviceid) {
+                var videodeviceid = ip.uservideodeviceid.valueOf();
+                var constraints = {deviceId: videodeviceid ? {exact: videodeviceid} : undefined};
+
+                mediaConstraints.video = constraints;
+            }
+            // check for a user audio selected device
+            if (ip.useraudiodeviceid) {
+                var audiodeviceid = ip.useraudiodeviceid.valueOf();
+                var constraints = {deviceId: audiodeviceid ? {exact: audiodeviceid} : undefined};
+                mediaConstraints.audio = constraints;
+            }
+            return mediaConstraints;
+        },
+
         /* fetch the audio constraints for passing to mediastream */
         fetch_audio_constraints: function (ip) {
 
diff --git a/amd/src/poodll_mediaskins.js b/amd/src/poodll_mediaskins.js
index 9cd80a17..296c4bba 100644
--- a/amd/src/poodll_mediaskins.js
+++ b/amd/src/poodll_mediaskins.js
@@ -13,7 +13,10 @@ define(['jquery', 'core/log',
     'filter_poodll/poodll_oncemediaskin',
     'filter_poodll/poodll_freshmediaskin',
     'filter_poodll/poodll_uploadmediaskin',
-    'filter_poodll/poodll_warningmediaskin'], function ($, log, baseskin, onetwothreeskin, goldskin, bmrskin, shadowskin, splitskin, fluencybuilderskin, pushskin, readaloudskin, readseedskin, onceskin, freshskin, uploadskin, warningskin) {
+    'filter_poodll/poodll_screenmediaskin',
+    'filter_poodll/poodll_warningmediaskin'],
+    function ($, log, baseskin, onetwothreeskin, goldskin, bmrskin, shadowskin, splitskin, fluencybuilderskin,
+              pushskin, readaloudskin, readseedskin, onceskin, freshskin, uploadskin, screenskin, warningskin) {
 
     "use strict"; // jshint ;_;
 
@@ -64,6 +67,9 @@ define(['jquery', 'core/log',
                 case 'upload':
                     the_skin = uploadskin.clone();
                     break;
+                case 'screen':
+                    the_skin = screenskin.clone();
+                    break;
                 case 'warning':
                     the_skin = warningskin.clone();
                     break;
diff --git a/amd/src/poodll_onetwothreemediaskin.js b/amd/src/poodll_onetwothreemediaskin.js
index 112e755e..f29d7a8b 100644
--- a/amd/src/poodll_onetwothreemediaskin.js
+++ b/amd/src/poodll_onetwothreemediaskin.js
@@ -1,4 +1,6 @@
-define(['jquery', 'jqueryui', 'core/log', 'filter_poodll/utils_amd', 'filter_poodll/anim_progress_bar', 'filter_poodll/speech_poodll', 'filter_poodll/dlg_devicesettings', 'filter_poodll/upskin_bar'], function ($, jqui, log, utils, anim_progress_bar, browserrecognition, settings, upskin_bar) {
+define(['jquery', 'jqueryui', 'core/log', 'filter_poodll/utils_amd', 'filter_poodll/anim_progress_bar',
+    'filter_poodll/speech_poodll', 'filter_poodll/dlg_devicesettings', 'filter_poodll/upskin_bar'],
+    function ($, jqui, log, utils, anim_progress_bar, browserrecognition, settings, upskin_bar) {
     /* jshint ignore:start */
 
     "use strict"; // jshint ;_;
@@ -278,15 +280,16 @@ define(['jquery', 'jqueryui', 'core/log', 'filter_poodll/utils_amd', 'filter_poo
             controls += '<div class="modal-box poodll_mediarecorderbox_onetwothree one-two-three-wrap" id="' + controlbarid + '">';
             controls += '<div class="style-holder ' + skin_style + '">';
             var status = this.fetch_status_bar('onetwothree');
-            controls += status,
-                controls += '<div class="hp_slide" id="slide_' + controlbarid + '">';
+            controls += status;
+            controls += '<div class="hp_slide" id="slide_' + controlbarid + '">';
             controls += '<div class="hp_timer"></div><canvas class="hp_range"></canvas></div>';
-            controls += preview,
-                controls += '<div class="settingsicon" id="settingsicon_' + controlbarid + '"><button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal"><i class="fa fa-cogs" aria-hidden="true"></i></button></div>';
-            controls += '<button type="button" class="poodll_mediarecorder_button_onetwothree poodll_start-recording_onetwothree"><i class="fa fa-microphone" aria-hidden="true"></i></button> ';
+            controls += preview;
+            controls += '<div class="settingsicon" id="settingsicon_' + controlbarid + '"><button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal"><i class="fa fa-cogs" aria-hidden="true"></i></button></div>';
+            if(mediatype == 'video'){var recicon='video-camera';}else{recicon='microphone';}
+            controls += '<button type="button" class="poodll_mediarecorder_button_onetwothree poodll_start-recording_onetwothree"><i class="fa fa-'+ recicon +'" aria-hidden="true"></i></button> ';
             controls += '<button type="button" class="poodll_mediarecorder_button_onetwothree poodll_stop-recording_onetwothree pmr_disabled" style="display: none;" disabled><i class="fa fa-stop" aria-hidden="true"></i></button>';
             controls += '<button type="button" class="poodll_mediarecorder_button_onetwothree poodll_pause-recording_onetwothree pmr_disabled" style="display: none;" disabled><i class="fa fa-pause" aria-hidden="true"></i></button>';
-            controls += ' <button type="button" class="poodll_mediarecorder_button_onetwothree poodll_resume-recording_onetwothree pmr_disabled" style="display: none;" disabled><i class="fa fa-microphone" aria-hidden="true"></i></button>';
+            controls += ' <button type="button" class="poodll_mediarecorder_button_onetwothree poodll_resume-recording_onetwothree pmr_disabled" style="display: none;" disabled><i class="fa fa-'+ recicon +'" aria-hidden="true"></i></button>';
             controls += '<button type="button" class="poodll_mediarecorder_button_onetwothree poodll_play-recording_onetwothree pmr_disabled" disabled><i class="fa fa-play" aria-hidden="true"></i></button> ';
             controls += '<button type="button" class="poodll_mediarecorder_button_onetwothree poodll_stop-playing_onetwothree pmr_disabled" style="display: none;" disabled><i class="fa fa-stop" aria-hidden="true"></i></button>';
             controls += '<button type="button" class="poodll_mediarecorder_button_onetwothree poodll_save-recording_onetwothree pmr_disabled" disabled><i class="fa fa-upload" aria-hidden="true"></i></button>';
diff --git a/amd/src/poodll_screenmediaskin.js b/amd/src/poodll_screenmediaskin.js
new file mode 100644
index 00000000..c9810b66
--- /dev/null
+++ b/amd/src/poodll_screenmediaskin.js
@@ -0,0 +1,424 @@
+define(['jquery', 'jqueryui', 'core/log', 'filter_poodll/utils_amd', 'filter_poodll/anim_progress_bar', 'filter_poodll/speech_poodll', 'filter_poodll/dlg_devicesettings', 'filter_poodll/upskin_bar'], function ($, jqui, log, utils, anim_progress_bar, browserrecognition, settings, upskin_bar) {
+    /* jshint ignore:start */
+
+    "use strict"; // jshint ;_;
+
+    log.debug('PoodLL ScreenRecorder Skin: initialising');
+
+    return {
+
+        instanceprops: null,
+        pmr: null,
+        stage: 'none',
+        uploaded: false,
+        devsettings: null,
+
+        //for making multiple instances
+        clone: function () {
+            return $.extend(true, {}, this);
+        },
+
+        init: function (ip, pmr) {
+            this.instanceprops = ip;
+            this.pmr = pmr;
+            this.devsettings = settings.clone();
+            this.devsettings.init(pmr, ip);
+            //we do not actually want to show the video camera selection
+            this.devsettings.set_media_type('audio');
+        },
+
+
+        fetch_instanceprops: function () {
+            return this.instanceprops;
+        },
+
+
+        onUploadSuccess: function (controlbarid) {
+            $('#' + controlbarid + ' > .poodll_save-recording').hide();
+            $('#' + controlbarid + ' > .poodll_savedsuccessfully').show();
+        },
+
+        onUploadFailure: function (controlbarid) {
+            return;
+        },
+
+        fetch_status_bar: function (skin) {
+            var status = '<div class="poodll_status_' + skin + '" height="50">00:00:00</div>';
+            return status;
+        },
+
+        fetch_preview_audio: function (skin) {
+            var preview = '<audio class="audio_preview_screen poodll_preview_' + skin + '" style="display: none;" width="100%" height="100%" controls playsinline="playsinline" muted></audio>';
+            return preview;
+        },
+        fetch_preview_video: function (skin) {
+            var preview = '<video class="video_preview_screen poodll_preview_' + skin + '" width="100%" height="300px" playsinline="playsinline" muted></video>';
+            return preview;
+        },
+        fetch_resource_audio: function (skin) {
+            var resourceplayer = '<audio class="poodll_resourceplayer_' + skin + '" style="display: none;" playsinline="playsinline"></audio>';
+            return resourceplayer;
+        },
+        fetch_resource_video: function (skin) {
+            var resourceplayer = '<video class="poodll_resourceplayer_' + skin + '" style="display: none;" playsinline="playsinline"></video>';
+            return resourceplayer;
+        },
+        fetch_uploader_skin: function (controlbarid, element) {
+            var ip = this.fetch_instanceprops(controlbarid);
+            var upskin = upskin_bar.clone();
+            upskin.init(ip.config, element, ip.controlbar.progresscanvas, ip.controlbar.timer);
+            return upskin;
+        },
+
+
+        onMediaError: function (e) {
+            console.error('media error', e);
+        },
+
+        onMediaSuccess_video: function (controlbarid) {
+            var ip = this.fetch_instanceprops(controlbarid);
+
+            //clear messages
+            ip.uploader.Output('');
+
+            this.set_visual_mode('recordmode', controlbarid);
+            //timer and status bar
+            ip.timer.reset();
+            ip.timer.start();
+            this.update_status(controlbarid);
+
+            //set recording stage
+            this.stage = "recorded";
+        },
+
+
+        handle_timer_update: function (controlbarid) {
+            var ip = this.fetch_instanceprops(controlbarid);
+            ip.controlbar.status.html(ip.timer.fetch_display_time());
+            if (ip.timer.seconds == 0 && ip.timer.initseconds > 0) {
+                ip.controlbar.stoprecbutton.click();
+            }
+        },
+
+        update_status: function (controlbarid) {
+            var ip = this.fetch_instanceprops(controlbarid);
+            ip.controlbar.status.html(ip.timer.fetch_display_time());
+        },
+
+        //set visuals for different states (ie recording or playing)
+        set_visual_mode: function (mode, controlbarid) {
+            var self = this;
+            var ip = this.fetch_instanceprops(controlbarid);
+
+            switch (mode) {
+
+                case 'recordmode':
+                    ip.controlbar.progress.hide();
+                    ip.controlbar.preview.addClass('poodll_recording');
+                    ip.controlbar.status.addClass('poodll_recording');
+                    ip.controlbar.status.removeClass('hide');
+                    self.disable_button(this);
+                    self.disable_button(ip.controlbar.playbutton);
+                    ip.controlbar.playbutton.show();
+                    self.disable_button(ip.controlbar.stopbutton);
+                    ip.controlbar.stopbutton.hide();
+                    self.disable_button(ip.controlbar.savebutton);
+                    ip.controlbar.savebutton.show();
+                    self.enable_button(ip.controlbar.stoprecbutton);
+                    ip.controlbar.stoprecbutton.show();
+                    ip.controlbar.startbutton.hide();
+
+
+                    break;
+
+                case 'previewmode':
+                    ip.controlbar.playbutton.hide();
+                    self.enable_button(ip.controlbar.stopbutton);
+                    ip.controlbar.stopbutton.show();
+                    self.disable_button(ip.controlbar.startbutton);
+                    ip.controlbar.startbutton.show();
+                    self.disable_button(ip.controlbar.resumebutton);
+                    ip.controlbar.resumebutton.hide();
+                    self.disable_button(ip.controlbar.playbutton);
+                    ip.controlbar.preview.removeClass('poodll_recording');
+                    ip.controlbar.status.removeClass('poodll_recording');
+                    ip.controlbar.status.removeClass('hide');
+
+
+                    ip.controlbar.status.addClass('hide');
+                    if (ip.controlbar.progresscanvas.hasClass("hide")) {
+                        ip.controlbar.progresscanvas.removeClass('hide');
+                        ip.controlbar.progresscanvas.show();
+                    }
+
+                    if (!$(this).hasClass('played')) {
+                        $(this).addClass('played');
+                        ip.controlbar.steptwo.empty();
+                        ip.controlbar.steptwo.append('<i class="fa fa-check" aria-hidden="true"></i>').hide().fadeIn(1000);
+                    }
+
+
+                    break;
+
+                case 'pausedmode':
+
+                    self.enable_button(ip.controlbar.startbutton);
+                    ip.controlbar.startbutton.show();
+                    self.enable_button(ip.controlbar.playbutton);
+                    ip.controlbar.playbutton.show();
+                    self.disable_button(ip.controlbar.savebutton);
+                    ip.controlbar.savebutton.show();
+                    ip.controlbar.preview.removeClass('poodll_recording');
+                    ip.controlbar.status.removeClass('poodll_recording');
+                    ip.controlbar.stoprecbutton.hide();
+
+
+                    ip.controlbar.timer.html('00:00:00');
+
+                    ip.controlbar.status.addClass('hide');
+                    ip.controlbar.progress.show();
+
+                    ip.controlbar.stepone.empty();
+                    ip.controlbar.stepone.append('<i class="fa fa-check" aria-hidden="true"></i>').hide().fadeIn(1000);
+
+                    self.disable_button(ip.controlbar.stoprecbutton);
+
+                    break;
+
+
+                case 'stopplayingmode':
+                    if (!self.uploaded) {
+                        self.enable_button(ip.controlbar.savebutton);
+                        self.enable_button(ip.controlbar.startbutton);
+                    }
+
+                    if (!ip.controlbar.progresscanvas.hasClass('hide')) {
+                        ip.controlbar.timer.html('00:00:00');
+                        ip.controlbar.progresscanvas.addClass('hide');
+                        ip.controlbar.progresscanvas.hide();
+                    }
+                    ip.controlbar.stopbutton.hide();
+                    ip.controlbar.playbutton.show();
+                    ip.controlbar.startbutton.show();
+                    self.enable_button(ip.controlbar.playbutton);
+                    self.disable_button(ip.controlbar.stopbutton);
+                    break;
+
+                case 'uploadmode':
+
+                    self.disable_button(ip.controlbar.startbutton);
+                    ip.controlbar.progresscanvas.removeClass('hide');
+                    ip.controlbar.progresscanvas.show();
+
+                    break;
+
+                case 'savemode':
+
+                    self.disable_button(ip.controlbar.savebutton);
+                    ip.controlbar.stepthree.empty();
+                    ip.controlbar.stepthree.append('<i class="fa fa-check" aria-hidden="true"></i>').hide().fadeIn(1000);
+                    break;
+            }
+
+        },
+
+        //insert the control bar and return it to be reused
+        insert_controlbar_video: function (element, controlbarid, preview, resource) {
+            var controlbar = this.prepare_controlbar(element, controlbarid, preview, resource, 'video');
+            return controlbar;
+        },
+
+        //insert the control bar and return it to be reused
+        prepare_controlbar: function (element, controlbarid, preview, resource, mediatype) {
+            var ip = this.fetch_instanceprops(controlbarid);
+            var skin_style = ip.config.media_skin_style;
+
+            var recorder_class =  'poodll_mediarecorder_video' ;
+
+            var size_class = 'poodll_mediarecorder_size_auto';
+            switch (ip.config.size) {
+                case 'small':
+                    size_class = 'poodll_mediarecorder_size_small';
+                    break;
+                case 'big':
+                    size_class = 'poodll_mediarecorder_size_big';
+                    break;
+                case 'auto':
+                    size_class = 'poodll_mediarecorder_size_auto';
+            }
+            var ss = this.pmr.fetch_strings();
+            var controls = '<div class="screen-main-wrapper poodll_mediarecorderholder_screen ' + recorder_class + ' ' + size_class + '" id="holder_' + controlbarid + '">';
+
+            controls += '<div class="modal-box poodll_mediarecorderbox_screen screen-wrap" id="' + controlbarid + '">';
+            controls += '<div class="style-holder ' + skin_style + '">';
+            var status = this.fetch_status_bar('screen');
+            controls += status,
+                controls += '<div class="hp_slide" id="slide_' + controlbarid + '">';
+            controls += '<div class="hp_timer"></div><canvas class="hp_range"></canvas></div>';
+            controls += preview,
+                controls += '<div class="settingsicon" id="settingsicon_' + controlbarid + '"><button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal"><i class="fa fa-cogs" aria-hidden="true"></i></button></div>';
+            controls += '<button type="button" class="poodll_mediarecorder_button_screen poodll_start-recording_screen"><i class="fa fa-desktop" aria-hidden="true"></i></button> ';
+            controls += '<button type="button" class="poodll_mediarecorder_button_screen poodll_stop-recording_screen pmr_disabled" style="display: none;" disabled><i class="fa fa-stop" aria-hidden="true"></i></button>';
+            controls += '<button type="button" class="poodll_mediarecorder_button_screen poodll_pause-recording_screen pmr_disabled" style="display: none;" disabled><i class="fa fa-pause" aria-hidden="true"></i></button>';
+            controls += ' <button type="button" class="poodll_mediarecorder_button_screen poodll_resume-recording_screen pmr_disabled" style="display: none;" disabled><i class="fa fa-microphone" aria-hidden="true"></i></button>';
+            controls += '<button type="button" class="poodll_mediarecorder_button_screen poodll_play-recording_screen pmr_disabled" disabled><i class="fa fa-play" aria-hidden="true"></i></button> ';
+            controls += '<button type="button" class="poodll_mediarecorder_button_screen poodll_stop-playing_screen pmr_disabled" style="display: none;" disabled><i class="fa fa-stop" aria-hidden="true"></i></button>';
+            controls += '<button type="button" class="poodll_mediarecorder_button_screen poodll_save-recording_screen pmr_disabled" disabled><i class="fa fa-upload" aria-hidden="true"></i></button>';
+            controls += '<div style="clear:both;">';
+            controls += '<div class="task-helper">';
+            controls += '<p class="step-1">' + ss['recui_record'] + '</p>';
+            controls += '<p class="step-2">' + ss['recui_play'] + '</p>';
+            controls += '<p class="step-3">' + ss['recui_save'] + '</p>';
+            controls += '</div>';
+            controls += '</div>';
+            controls += '</div>';
+            controls += this.devsettings.fetch_dialogue_box();
+            controls += ip.downloaddialog.fetch_dialogue_box();
+            controls += ip.errordialog.fetch_dialogue_box();
+            controls += '</div>';
+
+            $(element).prepend(controls);
+
+            var controlbar = {
+                settingsdialog: $('#' + controlbarid + ' .poodll_dialogue_box_settings'),
+                downloaddialog: $('#' + controlbarid + ' .poodll_dialogue_box_download'),
+                errorsdialog: $('#' + controlbarid + ' .poodll_dialogue_box_errors'),
+                settingsicon: $('#' + controlbarid + ' .settingsicon'),
+                stepone: $('#' + controlbarid + ' .step-1'),
+                steptwo: $('#' + controlbarid + ' .step-2'),
+                stepthree: $('#' + controlbarid + ' .step-3'),
+                progresscanvas: $('#' + controlbarid + ' .hp_range'),
+                progress: $('#' + controlbarid + ' .hp_slide'),
+                timer: $('#' + controlbarid + ' .hp_timer'),
+                status: $('#' + controlbarid + ' .poodll_status_screen'),
+                preview: $('#' + controlbarid + ' .poodll_preview_screen'),
+                startbutton: $('#' + controlbarid + ' .poodll_start-recording_screen'),
+                stoprecbutton: $('#' + controlbarid + ' .poodll_stop-recording_screen'),
+                stopbutton: $('#' + controlbarid + ' .poodll_stop-playing_screen'),
+                pausebutton: $('#' + controlbarid + ' .poodll_pause-recording_screen'),
+                resumebutton: $('#' + controlbarid + ' .poodll_resume-recording_screen'),
+                playbutton: $('#' + controlbarid + ' .poodll_play-recording_screen'),
+                savebutton: $('#' + controlbarid + ' .poodll_save-recording_screen')
+            };
+
+            //settings and error and download dialogs
+            //settings is on 'this' because it is shown from skkn events, but errors are from pmr stuff
+            ip.downloaddialog.set_dialogue_box(controlbar.downloaddialog);
+            ip.errordialog.set_dialogue_box(controlbar.errorsdialog);
+            this.devsettings.set_dialogue_box(controlbar.settingsdialog);
+
+            return controlbar;
+        }, //end of fetch_control_bar_screen
+
+
+        register_controlbar_events_video: function (onMediaSuccess, controlbarid) {
+            var self = this;
+            var pmr = this.pmr;
+            var stage = this.stage;
+            var ip = this.fetch_instanceprops(controlbarid);
+
+            //init linear progress
+            var hprogress = anim_progress_bar.clone();
+            hprogress.init(ip.controlbar.progresscanvas);
+
+            ip.controlbar.settingsicon.click(function () {
+                if (!self.uploaded) {
+                    self.devsettings.open();
+                } else {
+                    ip.downloaddialog.open();
+                }
+            });
+
+            ip.controlbar.startbutton.click(function () {
+                pmr.do_start_screen(ip, onMediaSuccess);
+            });
+
+            ip.controlbar.stoprecbutton.click(function () {
+                pmr.do_stop_audio(ip);
+                self.set_visual_mode('pausedmode', controlbarid);
+                //timer and status bar
+                ip.timer.stop();
+                ip.timer.reset();
+                self.update_status(controlbarid);
+            });
+
+
+            ip.controlbar.stopbutton.click(function () {
+                self.set_visual_mode('stopplayingmode', controlbarid);
+                //stop playing
+                var preview = ip.controlbar.preview.get(0);
+                pmr.do_stopplay_audio(ip, preview);
+                hprogress.stop();
+            });
+
+            ip.controlbar.playbutton.click(function () {
+
+                var preview = ip.controlbar.preview.get(0);
+                pmr.do_play_audio(ip, preview);
+
+                ip.controlbar.preview.on('timeupdate', function () {
+                    var currentTime = this.currentTime;
+                    ip.controlbar.timer.html(ip.timer.fetch_display_time(currentTime));
+                });
+
+
+                //do visuals
+                self.set_visual_mode('previewmode', controlbarid);
+
+                //set recording stage
+                stage = "played";
+
+                //start animation
+                hprogress.clear();
+                hprogress.fetchCurrent = function () {
+                    var ct = ip.controlbar.preview.prop('currentTime');
+                    var duration = ip.controlbar.preview.prop('duration');
+                    if (!isFinite(duration)) {
+                        duration = ip.timer.finalseconds;
+                    }
+                    return ct / duration;
+                };
+                hprogress.start();
+
+            });
+
+            ip.controlbar.savebutton.click(function () {
+                self.set_visual_mode('savemode', controlbarid);
+                log.debug('save');
+                if (ip.blobs && ip.blobs.length > 0) {
+                    pmr.do_save_audio(ip);
+                    self.uploaded = true;
+                    self.set_visual_mode('uploadmode', controlbarid);
+                    //set recording stage
+                    stage = "saved";
+                } else {
+                    ip.uploader.Output(M.util.get_string('recui_nothingtosaveerror', 'filter_poodll'));
+                }//end of if self.blobs
+                //probably not necessary  ... but getting odd ajax errors occasionally
+                return false;
+            });//end of save recording
+
+            window.onbeforeunload = function () {
+                self.enable_button(ip.controlbar.startbutton);
+                var preview = ip.controlbar.preview;
+                if (preview && preview.get(0)) {
+                    preview.get(0).pause();
+                }
+            };
+
+        }, //end of register_control_bar_events_screen
+
+
+        enable_button: function (button) {
+            $(button).attr('disabled', false);
+            $(button).removeClass('pmr_disabled');
+        },
+        disable_button: function (button) {
+            $(button).attr('disabled', true);
+            $(button).addClass('pmr_disabled');
+        },
+
+    };//end of returned object
+
+});//total end
+
diff --git a/classes/settingstools.php b/classes/settingstools.php
index c1fdd1e4..9b1d539c 100644
--- a/classes/settingstools.php
+++ b/classes/settingstools.php
@@ -396,6 +396,7 @@ public static function fetch_html5_recorder_items($mediatype = "audio") {
                 $items['onetwothree'] = get_string('onetwothree_recorder', 'filter_poodll');
                 $items['once'] = get_string('once_recorder', 'filter_poodll');
                 $items['upload'] = get_string('upload_recorder', 'filter_poodll');
+                $items['screen'] = get_string('screen_recorder', 'filter_poodll');
                 break;
 
             case "audio":
diff --git a/lang/en/filter_poodll.php b/lang/en/filter_poodll.php
index 2e51abf8..9a15756a 100644
--- a/lang/en/filter_poodll.php
+++ b/lang/en/filter_poodll.php
@@ -304,6 +304,7 @@
 $string['split_recorder'] = "Split";
 $string['readaloud_recorder'] = "Read Aloud";
 $string['fresh_recorder'] = "Fresh";
+$string['screen_recorder'] = "Screen Recorder";
 $string['fluencybuilder_recorder'] = "Fluency Builder";
 $string['html5recorder_skin_audio'] = "HTML5 Recorder Skin(Audio)";
 $string['html5recorder_skin_video'] = "HTML5 Recorder Skin(Video)";
diff --git a/styles.css b/styles.css
index a9f2f3ae..648837b0 100644
--- a/styles.css
+++ b/styles.css
@@ -108,6 +108,184 @@ Base Media skin Setting Integration
 .poodll_dialogue_box .poodll_dialogue_content h6 {
     margin-bottom: 0px;
 }
+/* Screen Recorder */
+.screen-main-wrapper {
+    position: relative;
+}
+
+.screen-main-wrapper .settingsicon {
+    position: absolute;
+    right: -3px;
+    bottom: -13px;
+}
+
+.screen-main-wrapper .settingsicon button {
+    border: none;
+    background: transparent;
+}
+
+.screen-main-wrapper .settingsicon button i {
+    font-size: 18px !important;
+    color: brown;
+}
+
+.screen-main-wrapper .settingsicon button:focus {
+    border: none;
+    background: transparent;
+}
+
+.screen-main-wrapper .settingsicon button i:hover {
+    cursor: pointer;
+}
+
+.poodll_mediarecorder_size_small .screen-wrap button {
+    height: 60px !important;
+    width: 25% !important;
+}
+
+.poodll_mediarecorder_size_small .screen-wrap button i.fa {
+    font-size: 35px;
+    color: #333;
+}
+
+@media (max-width: 768px) {
+
+    .video_preview_screen {
+        height: 150px;
+    }
+}
+
+.screen-main-wrapper .screen-wrap {
+    text-align: center;
+}
+
+.screen-main-wrapper {
+    width: 320px;
+}
+
+.screen-main-wrapper .screen-wrap button {
+    height: 60px !important;
+    width: 30% !important;
+}
+
+.screen-main-wrapper .task-helper {
+    display: inline-flex;
+    width: 100%;
+}
+
+.screen-main-wrapper .task-helper p {
+    width: 33%;
+    float: left;
+    font-size: 18px;
+    margin-bottom: 0px;
+}
+
+.screen-main-wrapper .task-helper i.fa {
+    color: green;
+    font-size: 45px;
+}
+
+.screen-main-wrapper .task-helper p.step-1 {
+    margin-left: 5px;
+}
+
+.screen-main-wrapper .task-helper p.step-3 {
+    margin-right: 5px;
+}
+
+.screen-main-wrapper .screen-wrap button i.fa {
+    font-size: 45px;
+    color: #333;
+}
+
+
+.poodll_mediarecorderbox_standard .poodll_mediarecorderholder_screen .pmr_disabled {
+    background: rgba(194, 194, 194, 0.7);
+    color: #333 !important;
+    opacity: 1 !important;
+}
+
+.poodll_mediarecorderholder_screen {
+    width: 300px;
+    padding: 20px;
+    border: 3px solid #333;
+}
+
+.poodll_mediarecorder_button_screen {
+    width: 83% !important;
+    margin: 5px auto;
+    border: 3px solid #333;
+    background: none !important;
+    color: #333 !important;
+    text-shadow: 1px 2px 1px #c2c2c2;
+}
+
+.poodll_mediarecorderbox_screen .poodll_preview_screen {
+    border: 3px solid #333;
+    background-color: transparent;
+    width: 100%;
+    margin-bottom: 10px;
+}
+
+.poodll_mediarecorderbox_screen .poodll_status_screen {
+    text-align: center;
+    margin-bottom: 10px;
+    width: 100%;
+    border: 3px solid #333;
+}
+
+.poodll_mediarecorderholder_screen input[type="checkbox"] {
+    width: 30px;
+    height: 15px;
+    margin-top: 10px;
+
+}
+
+.poodll_mediarecorderbox_screen .poodll_status_standard {
+    background-color: rgba(0, 0, 0, 0.4);
+    height: 40px;
+    width: 100%;
+    border-radius: 20px;
+    color: #fff;
+    border: 2px solid seagreen;
+    font-weight: 900;
+    text-shadow: 1px 2px 1px #ccc;
+    font-size: 20px;
+    line-height: 35px;
+}
+
+.poodll_mediarecorderbox_screen .poodll_mediarecorder_button_standard {
+    padding: 0px 10px;
+    border: none;
+    background-color: #fff;
+    border-radius: 0px !important;
+    color: red;
+    margin-top: 20px;
+    margin-bottom: 20px;
+    height: 40px;
+}
+
+.poodll_mediarecorderbox_screen .poodll_save-recording_standard {
+    height: 40px;
+    background-color: #fff;
+    border: none;
+    width: 100% !important;
+}
+
+.poodll_mediarecorderbox_screen button.pmr_disabled {
+    color: #BBB;
+}
+
+.poodll_mediarecorderbox_screen .poodll_mediarecorderbox_standard {
+    width: 280px !important;
+}
+
+.poodll_mediarecorderbox_screen .poodll_preview_standard {
+    width: 100% !important;
+}
+
+
+/* One Two Three Recorder */
 
 .one-two-three-main-wrapper {
     position: relative;
@@ -3965,6 +4143,7 @@ audio.poodll_preview_bmr {
     .video_preview_123 {
         height: 150px;
     }
+
 }
 
 .one-two-three-main-wrapper .one-two-three-wrap {
diff --git a/version.php b/version.php
index 52d9137d..28171af6 100644
--- a/version.php
+++ b/version.php
@@ -25,9 +25,9 @@
 
 defined('MOODLE_INTERNAL') || die();
 
-$plugin->version = 2021061100;
+$plugin->version = 2021062800;
 $plugin->requires = 2016052300;//moodle 3.1.0
 $plugin->component = 'filter_poodll';
 $plugin->maturity = MATURITY_STABLE;
-$plugin->release = '3.1.47 (Build 2021061100)';
+$plugin->release = '3.1.48 (Build 2021062800)';