Capturing video in the background on an Android device using PhoneGap with a reduced size recording interface

I attempted the given code above in an effort to record video in the background and save it to an SD card. I am looking for a way to automate the process without manually starting and stopping the recording. Can video be recorded using PhoneGap with or without an API? I specifically aim to record video in the background.

<html>
<head>
<title>Capture Video</title>
<script type="text/javascript" charset="utf-8" src="js/cordova.js"></script>
<script type="text/javascript" charset="utf-8" src="js/json2.js"></script>
<script type="text/javascript" charset="utf-8">
    // A button will call this function
    function captureVideo() {
        // Launch device video recording application, 
        // allowing user to capture up to 3 video clips
        alert("captureVideo");
        var options = {
            limit : 2,
            duration : 10
        };
        navigator.device.capture.captureVideo(captureSuccess, captureError,
                options);
    }
    // Called when capture operation is finished
    function captureSuccess(
    mediaFiles) {
        alert("captureSuccess   ");
        var i, len;
        alert(mediaFiles.length);
        for (i = 0, len = mediaFiles.length; i < len; i += 1) {
            uploadFile(mediaFiles[i]);
        }
    }
    // Called if something bad happens.
    function captureError(error) {
        var msg = 'An error occurred during capture: ' + error.code;
        navigator.notification.alert(msg, null, 'Uh oh!');

    }
    // Upload files to server
    function uploadFile(mediaFile) {
        alert("uploadFile");
        var ft = new FileTransfer(), path = mediaFile.fullPath, name = mediaFile.name;
        alert("path:" + path);
        alert("name:" + name);
        ft.upload(path, "http://my.domain.com/upload.php", function(result) {
            console.log('Upload success: ' + result.responseCode);
            console.log(result.bytesSent + ' bytes sent');
        }, function(error) {
            console.log('Error uploading file ' + path + ': ' + error.code);
        }, {
            fileName : name
        });
    }
</script>
</head>
<body>
    <button onclick="captureVideo();">Capture Video</button>
    <br>
</body>
</html>

Answer №1

document.addEventListener("deviceready", initializeApp, false);

function initializeApp(){startRecording();}

This function is triggered whenever the app is launched, initiating the automatic video recording feature.
After sending the video, it will start recording again automatically.

    function uploadVideo(mediaFile) {
           alert("uploadVideo");
            var fileTransfer = new FileTransfer(), filePath = mediaFile.fullPath, fileName = mediaFile.name;
            alert("filePath:" + filePath);
            alert("fileName:" + fileName);
            fileTransfer.upload(filePath, "http://my.domain.com/upload.php", function(result) {
                console.log('Upload success: ' + result.responseCode);
                console.log(result.bytesSent + ' bytes sent');
            }, function(error) {
                console.log('Error uploading file ' + filePath + ': ' + error.code);
            }, {
                fileName : fileName
            });
initializeApp;   /*calling the function to start the process*/       
}

Answer №2

Experience the ability to record videos using a minimized app or even while your screen is turned off with the help of this groundbreaking cordova\phonegap\ionic plugin

This plugin is a unique fork that allows video recording in the background, despite its name suggesting otherwise.

Upon activation, it intelligently selects the storage location for the video based on available space on both SD card and internal disk.

cordova plugin add cordova-backgroundvideo

var fileName = new Date().getTime() + '';
cordova.plugins.backgroundvideo.start(fileName, 'back', true, null, null);

cordova.plugins.backgroundvideo.stop(function (filePath) {
    alert(filePath);
  }, function (error) {
    alert('Error ' + JSON.stringify(error));
  }
);

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Add objects to a web address that leads nowhere but can still be linked to

It has come to my realization that the vagueness of my question might be obstructing my search efforts online. Here is the scenario: I am aiming to create a URL structure like this: http://app.myurl.com/8hhse92 The identifier "8hhse92" does not correspo ...

Incorporating additional options onto the menu

I recently designed a menu on https://codepen.io/ettrics/pen/ZYqKGb with 5 unique menu titles. However, I now have the need to add a sixth title to the menu. After attempting to do so by adding "strip6" in my CSS, the menu ended up malfunctioning and looki ...

Submitting forms through Vanilla JavaScript using AJAX

Can anyone assist me in implementing an AJAX form submission using Vanilla JavaScript instead of jQuery? I have the following jQuery code that needs to be converted: document.addEventListener('DOMContentLoaded', function() { document.querySelec ...

Making API calls using JavaScript

I'm struggling with understanding how to approach this problem in javascript. Here is the question along with the details. I would appreciate any assistance. QUERY We have a server backend that provides two endpoints: /GetLocalPressReleases and /Get ...

What is the best way to have an image trail another in JavaScript coding for my game?

Hey, can someone help me create a zombie game where a zombie image moves towards a player image (zs.png) at a specific speed and decreases the player's health upon contact? This game is designed for the 3ds browser, so it must be coded in JavaScript ...

CSS - starting fresh with animations

I am facing an issue with a CSS animation that I created. Everything seems to be working correctly, but I need to complete it by setting the input type to reset the animation. Below is the CSS code snippet that should reset the animation: $('button& ...

Utilizing numerous instances of setInterval

I've created a jsFiddle which can be found here: http://jsfiddle.net/dztGA/22/ Main Objective: My aim is to have two independent timers on the same page that can be stopped and restarted either by hovering or manually. The Issue: The problem illustr ...

What is the best way to obtain the present date in Nuxt directly from the server?

While conducting code tests, I realized that I required the current time from the server to run the tests effectively. In JavaScript, you can easily obtain the current date on the client side using the command: new Date();. However, when working with Nuxt ...

What are the steps to develop a progress bar using PHP and JavaScript?

In the application I'm developing, PHP and JavaScript are being used extensively. One of my tasks involves deleting entries from the database, which is a time-consuming process. To keep the end-user informed, I would like to provide updates on the pr ...

Modifying the array structure will deselect all individual <Input> elements that have been iterated

Hoping to create a system for adding/removing sub-items with buttons that increment/decrement slots in an array, where input fields are automatically added and removed: <div *ngFor="let item of itemsInNewOrder; let i = index"> <input [(ngModel) ...

Finding a workaround for the absence of a leftToggle feature in ListItem component of Material-UI

Is there a way to move the toggle element to the other side in Material-UI's listItem without using the leftToggle option? The documentation does not specify a leftToggle attribute, so I am looking for alternative solutions. I would like to align the ...

Issue encountered when trying to retrieve a database variable from a mapReduce operation in MongoDB

Greetings! I am currently developing an application that utilizes a MongoDB database. Within this database, there exists a user collection where all user data is stored. The structure of a document in this collection is as follows: { "_id" : ObjectId( ...

Spotlight barn doors in Three.js are an innovative feature that

I have been experimenting with three.js to build a scene featuring spotlights. Is there a way to achieve the barn door effect for the lights in three.js? I attempted using small cubes as barn doors to block the light, but it was not successful. I am look ...

Is there a way to access the Express parameters within my React component?

Currently, I am in the process of developing a React application that utilizes Express as its back-end infrastructure My express route is configured as follows app.get('/manage/:id', (req, res) => { // redirect to react application }); ...

Discovering the method to incorporate a data-icon attribute within select options using vue.js

UPDATE before modification dataIcon: " @/images/flag-ukraine.svg" after modification dataIcon: require("@/assets/svg/flag-ukraine.svg"), notable change with require() I am using Materialize CSS select. When I use a URL for dataIcon ...

Jquery's intermittent firing of .ajax within if statement

So, I've inherited a rather messy codebase that I need to modernize. The task involves upgrading from an old version of prototype to the latest jQuery 3.2.1 within a dated website built on php and smarty templates (not exactly my favorite). When a lo ...

Sorting alphabetically, either by JAVA, JavaScript, or Idoc script

Currently, I have a task at hand that requires sorting items within categories alphabetically, with the exception of Examples. Special characters and numbers should be prioritized over letters in the sorting order. I've encountered an issue where mos ...

Confirmation dialog with user-defined button text

When the confirm prompt box is used, it typically displays "ok" and "cancel" buttons. I am looking to customize the label text for the buttons to read as Agree and Not Agree instead. If you have any suggestions on how to achieve this modification, please ...

Is there a way to eliminate the header and footer from a Flutter WebView?

Here is the code snippet I tried to implement: I found a video tutorial by Joannes Mike on YouTube demonstrating how to remove the header and footer in Flutter WebView. However, it seems that Flutter has updated their library and the functions no longer w ...

Leveraging and utilizing TypeScript npm packages

My goal is to create shared code in TypeScript, package it as an npm package, and easily install it. I attempted to create an external library like this: export class Lib { constructor(){ } getData(){ console.log('getting data from l ...