Global JS Settings

HENGSHI SENSE provides a global JS setting feature, allowing users to customize the system to meet their personalized needs through custom JS code, such as using third-party statistical tools to monitor PV and UV on the system platform.

Usage Scenarios

Scenario 1: Add Baidu Statistics

Below is an example that uses JavaScript code to reference Baidu's website statistics to analyze the system. After enabling the JS feature, you can view the system's traffic analysis and website analysis data in the Baidu system.

Scenario 2: Text Replacement

In the following example, the no-data text of the chart in the system is replaced by custom JS code.

/**
 * Replace text
 */
var replaceTimer;
function replace(element, from, to) {
    const cont = element.textContent;
    if (cont) element.textContent = cont.replace(from, to);
};
function setTimer() {
  if (!window.location.pathname.includes('dashboard')) return;
  clearInterval(replaceTimer);
  replaceTimer = setInterval(function () {
    var elements = document.querySelectorAll('.hst__chart__no__data hr ~ span');
    var len = elements.length;
    console.log('In timer');
    while (len--) {
      replace( 
        elements[len],  
        new RegExp("Chart has no data that meets the conditions", "g"), 
        "No data available", 
      ); 
    }
  }, 300);
}
document.addEventListener('hs_urlchange', setTimer);
setTimer();

Recover from Uncontrolled JS Code

The ability to customize JS code is very powerful, but it also comes with risks. If you encounter code errors or other JS-related issues while customizing JS code, it is highly likely that the system will become inaccessible.

To address this, we have provided the ability to recover from runaway JS code using URL parameters. You can visit https://{host}/setting/global-js?no-global-js=true to disable JS code and access the configuration page, allowing you to regain access to the system.