resetting a timer on a Google Chrome extension

My goal is to create a Google Chrome extension that monitors mouse movements.

If there is no mouse movement for 5 minutes (I have set it to 0.1 and 0.2 in the code for testing purposes), the extension will open another website (an alert box is displayed in the code).

The issue I am facing is that I cannot reset the alarm if the mouse starts moving again. Everything works correctly, except for resetting or re-setting the alarm that I created.

I believe I made an error somewhere.

This is my first attempt at developing a Google Chrome extension, although I have experience with php, vb.net, html, and vbscript.

However, I cannot get the alarm reset to work on Google Chrome version 63 (I have tried older versions and Chromium as well, but it didn't work).

Thank you for your help ^^

The code starts here:

MANIFEST.JSON

{
  "name": "Chrome-extension",
  "version": "1.0",
  "manifest_version": 2,

  "permissions": [
     "alarms"   
   ],
  "background": {
  "scripts": ["background.js"]
  },
  "content_scripts": [
      {
        "matches": ["http://www.google.hu/*"],
        "js": ["jquery1.7.2.js", "detectclicks.js"]
      }
   ],
  "description": "Chrome-extension",
  "browser_action": {
      "default_icon": "icon.png"
      "default_popup": "popup.html"
     } 
   }

DETECTCLICKS.JS (resets the alarm when the mouse moves)

$('html').on('mousemove', '*',function(event) {
    chrome.alarms.clearAll();
    chrome.alarms.create("myAlarm", {delayInMinutes: 0.1, 
    periodInMinutes: 0.2});
    alert("OK");
});

BACKGROUND.JS (displays a message when the alarm triggers)

chrome.alarms.onAlarm.addListener(function(alarm) {
    alert("Beep");
});

POPUP.JS (Enables and disables the extension with start and stop alarms)

var alarmClock = {

    onHandler : function(e) {
        chrome.alarms.create("myAlarm", {
            delayInMinutes: 0.1, 
            periodInMinutes: 0.2
        });
        window.close();
    },

    offHandler : function(e) {
        chrome.alarms.clear("myAlarm");
        window.close();
    },

    setup: function() {
        var a = document.getElementById('alarmOn');
        a.addEventListener('click', alarmClock.onHandler);
        var a = document.getElementById('alarmOff');
        a.addEventListener('click', alarmClock.offHandler);
    }
};

document.addEventListener('DOMContentLoaded', function() {
    alarmClock.setup();
});

Answer №1

When working in production, it is important to note that setting an alarm for less than 1 minute is not possible. Additionally, the new version of Chrome restricts the ability to set alarms in developer mode.

Chrome has limitations on alarms to prevent overloading the user's machine. Alarms can be set at most once every 1 minute, with the option for delays if needed. Attempting to set a delay or period of less than 1 minute will result in a warning. It is also worth noting that setting the "when" parameter to less than 1 minute after the current time does not trigger the alarm immediately, but rather waits at least 1 minute before activating.

Learn more about chrome.alarms here

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

JQuery transmits null values

I have been troubleshooting my code for what feels like forever, but I just can't seem to find the error... My current project involves experimenting with JQuery and AJAX. I created a simple form with a textarea for submission. The form works perfect ...

Passing a querystring value to a Vue.js component

I am encountering an issue with passing a value from a querystring to my Vue component. The querystring looks like this: https://someurl.com?q=test My component is structured as follows: Vue.component('externalrecipes', { props: ['results&a ...

Serializing list objects with Jackson in Spring Boot

In my Spring Boot ReST controller, I am returning a List of "Personnel" objects. The output is mostly fine, but there is an issue that I need to address. Each Personnel object contains a nested object called PersonnelType. When serializing the first Perso ...

The server is unable to process your request to /graphql

I've encountered an issue while setting up the GraphiQL API. I keep receiving the error message "Cannot POST /graphql" on both the screen and network tab of the console. Despite having similar boilerplate code functioning in another project, I'm ...

Having trouble importing OrbitControls in three.js with an error?

I'm currently working on localhost and I've encountered an issue while trying to import "orbitcontrols()" which is not functioning properly and displaying an error. Here is the error message main.js:1 Uncaught SyntaxError: Cannot use import stat ...

3D Animation for All Browsers

I'm currently working on creating a small browser-based game and I've been experimenting with animations to get the desired effect. So far, the animation works well in Opera and Edge, although there is a slight cropping issue in Edge. Unfortunat ...

Troubleshooting the Create Order Issue: Integrating PayPal Checkout with Smart Payment Buttons using React and Redux

Every time I attempt to process a payment, I encounter a 422 error: Unprocessable entity. The issue arises when I try to dynamically capture the purchased item details received from the redux store. I tried following this example (duplicate): PayPal Check ...

Utilizing Conditional Statements in the @artsy/fresnel Framework

I recently started working on a responsive React application using the @artsy/fresnel npm package. Below is a snippet of the code I have implemented: <Media greaterThanOrEqual='computer'> <div style={{ padding: '20px 50px' ...

Manipulating object information within a nested for loop

I have a variable called jobs in my scope, which is an array containing objects for each department along with their respective data. [ “Accounting”: { “foo” : “foo”, “bar” : "bar" }, “Delivery”: { ...

How about representing a two-dimensional array in a point-free manner?

Exploring functional/tacit style programming, specifically implementing the snake game (example: ) The main issue at hand involves processing an array of strings like: [ ['2 '], ['10'] ] and obtaining a list of coordinates in numer ...

Hide Details tag only on mobile view

How can I easily close the default opened <details> tag on mobile? I am working with Wordpress. Any suggestions on how to achieve this? <details open> <summary>Details</summary> Something small enough to go unnoticed. </ ...

Replacing strings using Regex capture groups in JavaScript

Within my NodeJS application, there is a phone number field containing multiple phone numbers stored in one string. For example: \n\n \n (555) 555-5555 (Main)\n\n, \n\n \n (777) 777-777 (Domestic Fax)\n&bso ...

Is there a way to identify when a <td> element in a table is modified using JavaScript?

Currently, I am working on a Table where the values in the <td> elements change dynamically based on user input from a form. To achieve this, I am utilizing Tangle for creating a reactive document. I am facing a challenge where I need to detect any n ...

Experience the power of Kendo UI Date Picker combined with AngularJS. When the datepicker is initialized, it starts

Check out my code snippet below: When the datepicker loads initially, it appears empty. However, if you remove ng-model from the directive template, the datepicker displays its initial value correctly. Yet, changing the selected date does not mark the fo ...

Ways to split images and text in list items using CSS

Can the text be formatted in a specific location on the page, separate from the image and heading? This is the HTML code I am currently using: <div class="tab-pane container fade" id="environmental"> <div class="row"> <div class="c ...

What is the best way to invoke a function and dynamically load a section of a view using AJAX?

I want to implement a feature where I can hide one div and load another div using an Ajax function. However, I am facing issues with redirecting to the function as intended. My goal is to load the div without having to refresh the page. <script type="t ...

Conditional statements in jQuery for identifying a specific div based on its id

My current setup involves an HTML table that gets populated based on a mysql query. The table is enclosed within: <div id="punchclock" class="timecard"> I also have a jQuery script in place to calculate the totals of the times entered into this tab ...

Tips on incorporating the vue package

I recently started using Vue and decided to incorporate a plugin called vue-toastr. I'm attempting to integrate it with Laravel, which already has Vue set up with the plugin. Unfortunately, I keep encountering an error that says "TypeError: Cannot rea ...

Having trouble parsing an Array of Objects on the backend. When parsed by nodeJS, it is showing as [Object Object]

The POST request body contains the following data: "products": [ { "_id":"5ff08842b6145209e4941f56", "quantity": 2 } ], "frequency":1, "deliveryD ...

Converting multiple rows of data from MySQL into JSON format

Currently, I am working on a project that involves displaying multiple rows of MySQL JSON data in an HTML table using PHP and jQuery. The process includes input from a search box on the front end. The layout of my HTML table on the search page is structur ...