OneDirect AutoRefresh Chats

OneDirect.js

// ==UserScript==
// @name         OneDirect AutoRefresh Chats
// @namespace    https://theunpaiddev.tumblr.com/
// @version      1.0
// @description  Auto refresh Onedirect Chats
// @author       Omkar Kirpan
// @match        https://*.onedirect.in/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Your code here...
})();

waitForKeyElements ("body > app-root > app-home > main > article > div > app-chat-inbox > div > section > app-views-sidebar > article > section > section.header-section > div.header-icons", actionFunction);

function clickRefresh(){
  document.querySelector("body > app-root > app-home > main > article > div > app-chat-inbox > div > section > app-views-sidebar > article > section > section.header-section > div.header-icons > i").click();
    console.log("Refresh Clicked");
}

function actionFunction (jNode) {
    //-- DO WHAT YOU WANT TO THE TARGETED ELEMENTS HERE.
    //jNode.css ("background", "yellow"); // example
    console.log(jNode);
    var myInterval = 300;
    var myStopTxt = `<svg id="pause" style="color: green; width: 10px" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="pause" class="svg-inline--fa fa-pause fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M144 479H48c-26.5 0-48-21.5-48-48V79c0-26.5 21.5-48 48-48h96c26.5 0 48 21.5 48 48v352c0 26.5-21.5 48-48 48zm304-48V79c0-26.5-21.5-48-48-48h-96c-26.5 0-48 21.5-48 48v352c0 26.5 21.5 48 48 48h96c26.5 0 48-21.5 48-48z"></path></svg>`;
    var myStartTxt =`<svg id="play" style="color: red; width: 10px" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="play" class="svg-inline--fa fa-play fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M424.4 214.7L72.4 6.6C43.8-10.3 0 6.1 0 47.9V464c0 37.5 40.7 60.1 72.4 41.3l352-208c31.4-18.5 31.5-64.1 0-82.6z"></path></svg>`;
    var myinter = setInterval(clickRefresh, myInterval);
    addButton(jNode, myStopTxt, {
      "margin-right": "10px",
      "padding": "0px 8px 0px 8px"
    });

function addButton(elem, text, cssObj, onclick) {
    cssObj = cssObj || {
      position: "fixed",
      top: "15%",
      right: "4%",
      "z-index": 3,
      fontWeight: "600",
      fontSize: "14px",
      backgroundColor: "#00cccc",
      color: "white",
      border: "none",
      padding: "10px 20px"
    };
    let button = document.createElement("button"),
      btnStyle = button.style;
    // document.body.appendChild(button);
    elem.prepend(button);
    button.innerHTML = text;
    // Settin function for button when it is clicked.
    button.onclick = selectReadFn;
    button.setAttribute ('togle', 'true');
    Object.keys(cssObj).forEach(key => (btnStyle[key] = cssObj[key]));
    //start intervel
    // console.log(elem);
    return button;
  }

  function selectReadFn() {
    var txt = document.getElementById("ember3822");
    // Just to show button is pressed
    // this.innerHTML += "!";
    var condd = this.getAttribute('togle');
    // console.log(condd);
    if(condd == 'true'){
      this.innerHTML = myStartTxt;
      console.log(myinter);
      clearInterval(myinter);
      this.setAttribute ('togle', 'false');
    }
    else{
      this.innerHTML = myStopTxt;
      myinter = setInterval(clickRefresh, myInterval);
      this.setAttribute ('togle', 'true');
    }

  }

}