0.3.0

README.md

@@ -2,23 +2,23 @@
 Observe.js
 
 [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social)](https://twitter.com/intent/tweet?text=Observe.js%2C%20a%20free%20JavaScript%observe%builder&url=https://github.com/williamtroup/Observe.js&hashtags=javascript,html,observe)
-[![npm](https://img.shields.io/badge/npmjs-v0.2.0-blue)](https://www.npmjs.com/package/jobserve.js)
-[![nuget](https://img.shields.io/badge/nuget-v0.2.0-purple)](https://www.nuget.org/packages/jObserve.js/)
+[![npm](https://img.shields.io/badge/npmjs-v0.3.0-blue)](https://www.npmjs.com/package/jobserve.js)
+[![nuget](https://img.shields.io/badge/nuget-v0.3.0-purple)](https://www.nuget.org/packages/jObserve.js/)
 [![license](https://img.shields.io/badge/license-MIT-green)](https://github.com/williamtroup/Observe.js/blob/main/LICENSE.txt)
 [![discussions Welcome](https://img.shields.io/badge/discussions-Welcome-red)](https://github.com/williamtroup/Observe.js/discussions)
 [![coded by William Troup](https://img.shields.io/badge/coded_by-William_Troup-yellow)](https://github.com/williamtroup)
 </h1>
 
 > <p align="center">A lightweight, and easy-to-use, JavaScript library for observing any kind of JS object, or HTML DOM element, to detect changes!</p>
-> <p align="center">v0.2.0</p>
+> <p align="center">v0.3.0</p>
 <br />
 <br>
 
 <h1>What features does Observe.js have?</h1>
 
 - Zero-dependencies and extremely lightweight!
-- JS Object, and HTML DOM Element watching!
-- Cancellation support!
+- JS Object and HTML DOM Element watching!
+- Cancellation and Pausing support!
 - Full API available via public functions.
 - Fully configurable!
 - Fully configurable per watch!

README_NUGET.md

@@ -1,8 +1,8 @@
-# Observe.js v0.2.0
+# Observe.js v0.3.0
 
 [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social)](https://twitter.com/intent/tweet?text=Observe.js%2C%20a%20free%20JavaScript%observe%builder&url=https://github.com/williamtroup/Observe.js&hashtags=javascript,html,observe)
-[![npm](https://img.shields.io/badge/npmjs-v0.2.0-blue)](https://www.npmjs.com/package/jobserve.js)
-[![nuget](https://img.shields.io/badge/nuget-v0.2.0-purple)](https://www.nuget.org/packages/jObserve.js/)
+[![npm](https://img.shields.io/badge/npmjs-v0.3.0-blue)](https://www.npmjs.com/package/jobserve.js)
+[![nuget](https://img.shields.io/badge/nuget-v0.3.0-purple)](https://www.nuget.org/packages/jObserve.js/)
 [![license](https://img.shields.io/badge/license-MIT-green)](https://github.com/williamtroup/Observe.js/blob/main/LICENSE.txt)
 [![discussions Welcome](https://img.shields.io/badge/discussions-Welcome-red)](https://github.com/williamtroup/Observe.js/discussions)
 [![coded by William Troup](https://img.shields.io/badge/coded_by-William_Troup-yellow)](https://github.com/williamtroup)
@@ -13,8 +13,8 @@
 ## What features does Observe.js have?
 
 - Zero-dependencies and extremely lightweight!
-- JS Object, and HTML DOM Element watching!
-- Cancellation support!
+- JS Object and HTML DOM Element watching!
+- Cancellation and Pausing support!
 - Full API available via public functions.
 - Fully configurable!
 - Fully configurable per watch!

dist/observe.js

@@ -1,4 +1,4 @@
-/*! Observe.js v0.2.0 | (c) Bunoon | MIT License */
+/*! Observe.js v0.3.0 | (c) Bunoon | MIT License */
 (function() {
   function collectDOMObjects() {
     var tagTypes = _configuration.domElementTypes;
@@ -110,6 +110,9 @@
             compareWatchObjectProperties(oldValue, newValue, watchOptions);
           }
         }
+        if (watchOptions.pauseTimeoutOnChange > 0) {
+          pauseWatchObject(storageId, watchOptions.pauseTimeoutOnChange);
+        }
         if (watchOptions.cancelOnChange) {
           cancelWatchObject(storageId);
         }
@@ -139,6 +142,14 @@
       }
     }
   }
+  function cancelWatchesForObjects() {
+    var storageId;
+    for (storageId in _watches) {
+      if (_watches.hasOwnProperty(storageId)) {
+        cancelWatchObject(storageId);
+      }
+    }
+  }
   function cancelWatchObject(storageId) {
     if (_watches.hasOwnProperty(storageId)) {
       var watchOptions = _watches[storageId].options;
@@ -147,6 +158,16 @@
       delete _watches[storageId];
     }
   }
+  function pauseWatchObject(storageId, milliseconds) {
+    var result = false;
+    if (_watches.hasOwnProperty(storageId)) {
+      var watchOptions = _watches[storageId].options;
+      watchOptions.starts = new Date();
+      watchOptions.starts.setMilliseconds(watchOptions.starts.getMilliseconds() + milliseconds);
+      result = true;
+    }
+    return result;
+  }
   function getWatchOptions(newOptions) {
     var options = !isDefinedObject(newOptions) ? {} : newOptions;
     options.timeout = getDefaultNumber(options.timeout, 250);
@@ -155,6 +176,7 @@
     options.reset = getDefaultBoolean(options.reset, false);
     options.cancelOnChange = getDefaultBoolean(options.cancelOnChange, false);
     options.maximumChangesBeforeCanceling = getDefaultNumber(options.maximumChangesBeforeCanceling, 0);
+    options.pauseTimeoutOnChange = getDefaultNumber(options.pauseTimeoutOnChange, 0);
     options = getWatchOptionsCustomTriggers(options);
     return options;
   }
@@ -289,6 +311,10 @@
     }
     return result;
   };
+  this.cancelWatches = function() {
+    cancelWatchesForObjects();
+    return this;
+  };
   this.getWatch = function(id) {
     var result = null;
     if (_watches.hasOwnProperty(id)) {
@@ -304,13 +330,31 @@
     }
     return result;
   };
+  this.getWatches = function() {
+    return _watches;
+  };
+  this.pauseWatch = function(id, milliseconds) {
+    var result = false;
+    if (_watches.hasOwnProperty(id)) {
+      result = pauseWatchObject(id, milliseconds);
+    } else {
+      var storageId;
+      for (storageId in _watches) {
+        if (_watches.hasOwnProperty(storageId) && isDefinedString(_watches[storageId].domElementId) && _watches[storageId].domElementId === id) {
+          result = pauseWatchObject(storageId, milliseconds);
+          break;
+        }
+      }
+    }
+    return result;
+  };
   this.setConfiguration = function(newOptions) {
     _configuration = !isDefinedObject(newOptions) ? {} : newOptions;
     buildDefaultConfiguration();
     return this;
   };
   this.getVersion = function() {
-    return "0.2.0";
+    return "0.3.0";
   };
   (function(documentObject, windowObject) {
     _parameter_Document = documentObject;
@@ -319,6 +363,9 @@
     _parameter_Document.addEventListener("DOMContentLoaded", function() {
       collectDOMObjects();
     });
+    _parameter_Window.addEventListener("unload", function() {
+      cancelWatchesForObjects();
+    });
     if (!isDefined(_parameter_Window.$observe)) {
       _parameter_Window.$observe = this;
     }

docs/CHANGE_LOG.md

@@ -1,5 +1,27 @@
 # Observe.js - Change Log:
 
+## Version 0.3.0:
+
+#### **New Features:**
+- Added "Pause Timeout On Change" support, which will force the watch to wait a specific number of milliseconds before detecting changes again when a change is detected.
+
+#### **Binding Options / Function Options:**
+- Added a new binding/option called "pauseTimeoutOnChange", which states the milliseconds to wait for new changes to be detected when a change is detected (defaults to 0, which is off).
+
+#### **Public Functions:**
+- Added new public function "cancelWatches()", which is used to cancel all the watches currently running, or paused.
+- Added new public function "getWatches()", which is used to return all the watches currently running, or paused.
+- Added new public function "pauseWatch()", which is used to pause a running watch for a specific number of milliseconds.
+
+#### **General Improvements:**
+- When the page is unloaded, all active watches are now cancelled.
+
+#### **Documentation:**
+- Fixed some of the documentation spelling/grammar mistakes.
+
+<br>
+
+
 ## Version 0.2.0:
 
 #### **New Features:**

docs/PUBLIC_FUNCTIONS.md

@@ -14,24 +14,46 @@ Adds an object that should be watched for changes.
 <br>
 ***Parameter: options***: '*Object*' - All the options that should be used (refer to ["Configuration Options"](binding/options/OPTIONS.md) documentation for properties).
 <br>
-***Returns***: '*string*' - The ID that object watch is stored under.
+***Returns***: '*string*' - The ID that the object watch is stored under.
 <br>
 
 ### **cancelWatch( *id* )**:
 Cancels the watching of an object for changes.
 <br>
-***Parameter: id***: '*string*' - The Id of the object being watched, or DOM element ID being watched.
+***Parameter: id***: '*string*' - The ID of the object being watched, or DOM element ID being watched.
 <br>
-***Returns***: '*boolean*' - States if the object being watched has been canceled.
+***Returns***: '*boolean*' - States if the object being watched has been cancelled.
+<br>
+
+### **cancelWatches()**:
+Cancels all the watches currently running, or paused.
+<br>
+***Returns***: '*Object*' - The Observe.js class instance.
 <br>
 
 ### **getWatch( *id* )**:
-Returns the properties for an active watch.
+Returns the properties for a running, or paused, watch.
 <br>
-***Parameter: id***: '*string*' - The Id of the object being watched, or DOM element ID being watched.
+***Parameter: id***: '*string*' - The ID of the object being watched, or DOM element ID being watched.
 <br>
 ***Returns***: '*Object*' - The watch properties for an object (null if not found).
 <br>
+
+### **getWatches()**:
+Returns all the watches currently running, or paused.
+<br>
+***Returns***: '*Object*' - The object of watches currently running, or paused.
+<br>
+
+### **pauseWatch( *id*, *milliseconds* )**:
+Pauses the watching of an object for changes for a specific number of milliseconds.
+<br>
+***Parameter: id***: '*string*' - The ID of the object being watched, or DOM element ID being watched.
+<br>
+***Parameter: milliseconds***: '*number*' - The milliseconds to pause the watch for.
+<br>
+***Returns***: '*boolean*' - States if the object being watched has been paused.
+<br>
 <br>
 
 

docs/binding/options/CUSTOM_TRIGGERS.md

@@ -24,9 +24,9 @@ Fires when a change has been detected in an object (states which property change
 ***Parameter:*** newValue: '*object*' - The new value.
 
 ### options.onCancel( *id* ):
-Fires when a watch has been canceled.
+Fires when a watch has been cancelled.
 <br>
-***Parameter:*** id: '*string*' - The ID of the watch that has been canceled.
+***Parameter:*** id: '*string*' - The ID of the watch that has been cancelled.
 
 <br>