Google Apis Drive push notification not working

I’m using google service account for the push notification to get in my console so I can handle it afterwards ,I’ve set up the credentials, put a watch on my drive root folder and watching any changes happens on my ngrok url which is https url of localhost 3000 but the problem is after I run the program it showed me that it has successfully put a watch but I’m not getting any notification even though I have made changes (uploaded some images)

this is my code for the reference

// googlpis set up 

const { google } = require("googleapis")
const { v4: uuidv4 } = require("uuid")
const path = require("path")
const credentials = path.resolve(__dirname, "../googleKey.json")

const auth = new google.auth.GoogleAuth({
    keyFile: credentials,
    scopes: ["https://www.googleapis.com/auth/drive"]
})
const drive = google.drive({ version: "v3", auth })

//watch on my drive 


async function setUpPushNotification() {
    const response = await drive.files.watch({
        fileId: "root",
        requestBody: {
            id: uuidv4(),
            type: "web_hook",
            address: "https://0642-202-189-239-146.ngrok-free.app/",
            payload: true
        }
    })

    console.log("Push notification channel set up:", response.data)
}


//console log 

Push notification channel set up: {
  kind: 'api#channel',
  id: '57adb753-5ccb-4782-83b3-82532e1e147a',
  resourceId: 'qHo857F_9Dp6NQ-zRAwcxdiGkw4-js',
  resourceUri: 'https://www.googleapis.com/drive/v3/files/root?alt=json&null',
  expiration: '1684133269000'
}

I have tried going through all the document related drive watch but not found any good solution even chat gpt does not able to resolve this problem.
I have tried to use different api for example create file api to upload something on drive and I successfully able to upload a image on my folder, so the set up is correct.

I’m expecting a response when I upload images on my drive, I should able to get the details like which image is uploaded when, where , by who etc.

ultimately I have to get that image which is uploaded and again upload it on my AWS account, but from the document It seems I cannot get the the image directly through notification so I have to run another api to get the image

If checkbox is checked, check another box

I’m trying to create a few checkboxes that when checked, will check another… which I got to work! But, the problem I’m having now is that if multiple are selected and one is unchecked at any point, the additional checkbox get unchecked no matter what. I’d like to find a way to have the additional checkbox stay checked, as long as one of the others is, and uncheck if none are selected.

For example: I have 4 checkboxes, if a user selects #1 I want to check #2. Or if a user selects #1 + #3, check #2, but if #3 is unchecked, #2 stays as long as 1,3, or 4 are. I hope this makes sense. I’ve been trying different things, but this is the code where I landed. Any help, advice on a better way to accomplish this would be greatly appreciated.

var chk1 = $("input[type='checkbox'][value='1']");
var chk2 = $("input[type='checkbox'][value='2']");
var chk3 = $("input[type='checkbox'][value='3']");
var chk4 = $("input[type='checkbox'][value='4']");

chk1.on('change', function(){
  chk2.prop('checked',this.checked);
});
chk3.on('change', function(){
  chk2.prop('checked',this.checked);
});
chk4.on('change', function(){
  chk2.prop('checked',this.checked);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" value="1" class="user_name">1
<br>
<input type="checkbox" value="2" class="user_name">2
<br>
<input type="checkbox" value="3" class="user_name">3
<br>
<input type="checkbox" value="4" class="user_name">4

CouchDB: JavaScript Fetch API Fails To Connects Due To CORS on localhost

Using Chrome browser I navigate to 127.0.0.1:5984 and get response from couchdb server.

When I call the same address using Chrome’s JavaScript it fails:

Access to fetch at 'http://localhost:5984/' from origin 'http://localhost:8080' has been blocked by CORS policy: 
Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

The local.ini file on the couchdb box has:

[chttpd]
enable_cors = true
[cors]
origins = *
credentials = true
methods = GET, POST, PUT, DELETE, OPTIONS, HEAD, TRACE, PATCH
headers = accept, authorization, content-type, origin, referer, cache-control, x-requested-with, X-Couch-Id, X-Couch-Rev

My fetch options currently have:

{
  "headers": {
    "Content-Type": "application/json",
    "method": "GET",
    "credentials": "include",
    "mode": "cors"
  }
}

Change value of ng-model from popup windows

I have input that generates dynamically by ng-repeat. for setting the value the user should click on the button and the popup windows will open. After selecting the value, the user will click on confirm button and I set the value by this code:

function SetLatLng() {
        if (!window.opener || window.opener.closed) {
          
            return;
        }

        var txtLat = window.opener.document.getElementById(latId);
        var txtLng = window.opener.document.getElementById(lngId);

     
        var lat = document.getElementById('latitude').value;
        var lng = document.getElementById('longitude').value;

        if (txtLat) {             
            window.opener.angular.element(txtLat).$rootScope().$apply(function () {
                window.opener.angular.element(txtLat).controller('ngModel').$setViewValue(lat);
            });
        }

        if (txtLng) {
            // Update the value of the ng-model attached to txtLng
            window.opener.angular.element(txtLng).$rootScope().$apply(function () {
                window.opener.angular.element(txtLng).controller('ngModel').$setViewValue(lng);
            });
        }

        window.close();
    }

The value of input visibly changes but the ng-model does not change. I also write a directive but it doesn’t work either.

myapp.directive('setNgModelFromValue', function () {

return {
    restrict: 'A',
    require: '?ngModel',
    link: function (scope, element, attrs, ngModel) {
       
        if (!ngModel) return;
       
        ngModel.$parsers.push(function (value) {
           
            ngModel.$setViewValue(value);
            ngModel.$render();
            return value;
        });

        ngModel.$formatters.push(function (value) {
           
            ngModel.$setViewValue(value);
            ngModel.$render();
            return value;
        });

        element.on('input', function () {
          
            scope.$apply(function () {
                var value = element.val();
                ngModel.$setViewValue(value);
                ngModel.$render();
            });
        });
    }
};

});

I don’t why It’s not working. I also use scope.$apply() instead of $rootScope().$apply but still not working.

How to let values as it is when conditionally rendering from one component to another

I am condinitionally rendering two componenets with the same route. First components has two input field and one next button. After pressing the next button I am rendering to the next page.
But when clicking on the back button how can I get the that I have entered earlier. I am using useRef() but when I am coming to the first page again then all the data that I have entered are not present.
So how can I set the data as it is while I am conditionally rendering between two components

I have tried with the useRef() but the entered values are not there when I am pressing the back button and reaching to that first component again.

How to compare between values in two diffrent JSON array

const fruits = [{id: '1', name: 'Apple'},
{id: '2', name: 'Orange'},
{id: '3', name: 'Cherry'}];

const food=[{id: '1', food_name: 'Orange', deleted="0"},
{id: '2', food_name: 'Bread' ,deleted="0"},
{id: '3', food_name: 'Cheese', deleted="0"},
{id: '4', food_name: 'Apple', deleted="1"},
{id: '5', food_name: 'Salt',deleted="0"}
]
//Code that I tried:
var foodSet = new Set(food.map(item => item.food_name));
for(var j=0; j < fruits.length; j++){
    if(!foodSet.has(fruits[j].name) && fruits[j].deleted!=1){
        dep_data.push({id: fruits[j].id, name: fruits[j].name});
    }
}
console.log(dep_data)

I want to compare between two arrays to get the id and name of the fruits that not exists in the food and deleted not equal to 1 then save the results in new array.

For example here we have the Orange exist in the food array, the results should store the id and name of fruits that doesn’t exist in food and deleted !=1. (orange).

Want to convert this JSONObject into a Hashmap

This is my JSONObject =>
{@@Last Action Taken By@@=Ikshita Sidney Jain, AfilePath=null, @entity_id@=1097, @@Diagram Link@@=View Biz Process : <a class=”imsgLink” style=”cursor: pointer;” id=”5014723″face=”Arial, Helvetica, sans-serif” color=”#FF6633″ href = “https://qaact-g01.tcsion.com:443/LX/INDEXES/AppLaunchSAML?app_id=9505&org_id=13&uid=1&rid=5014723&src=iMessageLogin&isMTOPJS=N&isLoginRequired=1” imsgScrnLink = “https://qaact-g01.tcsion.com:443//UCP/UcpWorkflowLibraryRepresentationAction.do?method=generateDiagramWfLib&etId=150002&srcDiag=WF&dType=4&versionId=1.1&entityId=1097&userId=914047&orgId=13&ucpLaunchKey=527372407909540”>

, @@Delegatee Name@@=Ikshita Sidney Jain, @@Entity Name@@=HRA, RecentOrgTimezone=Asia/Kolkata, creatorID=914047, @@Delegation Status@@=Pending, iMessageLinks=[{“linkLabel”:”Diagram Link”,”webtopUrl”:”/UCP/UcpWorkflowLibraryRepresentationAction.do?methodu003dgenerateDiagramWfLibu0026etIdu003d150002u0026srcDiagu003dWFu0026dTypeu003d4u0026versionIdu003d1.1u0026entityIdu003d1097″,”mTOPUrl”:”N”,”isMTOPJsFunction”:”N”,”isWebtopJsFunction”:”N”,”linkToken”:”Diagram Link”,”linkId”:5014723,”linkType”:”0″,”linkSave”:false,”linkJs”:”NA”,”appId”:9505,”orgId”:13,”isvisibleURL”:”9″,”isLoginRequired”:”1″,”isDiagramLink”:”Y”,”isLabeldynamic”:”0″,”linkHTML”:””,”linkPriority”:”0″}], AfileName=null, @@To Date@@=15-05-2023, @@Last Action Taken On@@=2023-05-14 22:54:26.0, @@Transaction Date@@=14-05-2023 22:54:26, @@From Date@@=15-05-2023, statusName=NEW, @@Solution Name@@=Payroll Solution}

I want a HashMap where keys are starting from @@ or @ and values must be the part after ” = “(equals)

Example :

`*{@@Last Action Taken By@@=Ikshita Sidney Jain,
@entity_id@=1097, 
...,
...,

@@From Date@@=15-05-2023, 
@@Solution Name@@=Payroll Solution
}*`

Please help me to solve this issue.

How to fulfill a JavaScript door unlock requirement using an HTML button?

In this this tutorial, https://www.w3schools.com/nodejs/nodejs_raspberrypi_webserver_websocket.asp , It has even handler that works off of an HTML checkbox. I would like to do the exact same thing, but with a button, so that I can temporarily unlock a door. As long as the button is pressed by the mouse, the door is unlocked. Once the mouse button is released, the door locks. The default position is locked. Below is the code from the link above:

<!DOCTYPE html>
<html>
<body>

<h1>Control LED light</h1>
<p><input type="checkbox" id="light"></p>

<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.3/socket.io.js"></script> <!-- include socket.io client side script -->
<script>
var socket = io(); //load socket.io-client and connect to the host that serves the page
window.addEventListener("load", function(){ //when page loads
  var lightbox = document.getElementById("light");
  lightbox.addEventListener("change", function() { //add event listener for when checkbox changes
    socket.emit("light", Number(this.checked)); //send button status to server (as 1 or 0)
  });
});
socket.on('light', function (data) { //get button status from client
  document.getElementById("light").checked = data; //change checkbox according to push button on Raspberry Pi
  socket.emit("light", data); //send push button status to back to server
});
</script>

</body>
</html> 

Essentially, I would like to use

<input type="button" id="light" value="light">

instead of

<input type="checkbox" id="light">

Thank you!

React onClick doest work correctly on if conditional

I have a problem with React.

I wrote a function:

   function click(event) {
    let element = event.currentTarget.querySelector(".infos__content");
    if (element.style.display) {
        alert("test")
        element.style.display = "none";
    }
    else {
        alert("test1")
        element.style.display = "block";
    }
}

and i called this function successfully in a DIV Container on the “onClick” attribute but it works for just one time, when i click on my div Container again, my if conditional always is true, does anyone know why?

I have google it already but cant find a solution for this

How to avoid reinitializing a useState variable in React Native

I am working on a music app in React Native. This page will be re-opened several times, but I do not want the trackList to reset to [] everything the page is re-rendered, but instead to retain its values. I have included a simplified version of my code:

export default function Host({ navigation }) {
  const [trackList, setTrackList] = useState([]);

  if (!existsTrackListener) {
    setTrackListener(roomID, (t) => {
      if (t != null) {
        const newArray = [...trackList, t.name];
        setTrackList(newArray);
      }
    });
    existsTrackListener = true;
  }

  return (
    <View style={styles.container}>
      <FlatList
        data={trackList}
        renderItem={({ item }) => <Text style={styles.item}>{item}</Text>}
      />
    </View>
  );
}

Calling a returned function gives “not a function”

I have this fake wordle game
I think that the problem is with fetching the api and returning the functions for validation. I get an error that “getData(...).isCorrect is not a function” whenever I press submit and when I try without the parenthesis in index.html, the game won’t display anything. Is there another way to do this, or is this just a simple bug in my code?

async function getData() {
  var response = await fetch("https://all-wordle-words.kobyk1.repl.co/script.js");
  var data = await response.json();

  const wordsArray = data;
  const words = new Set(wordsArray);
  const chosen = wordsArray[Math.floor(Math.random() * wordsArray.length)];

  function check(word) {
    let result = Array(5).fill("gray");
    let chosenChars = [...chosen];
    for (let i = 0; i < 5; i++) {
      if (word[i] === chosenChars[i]) {
        result[i] = "green";
        chosenChars[i] = "G";
      } else {
        for (let j = 0; j < 5; j++) {
          if (word[i] === chosenChars[j]) {
            result[i] = "yellow";
            chosenChars[j] = "Y";
          }
        }
      }
    }
    return result;
  }

  function isCorrect() {
    let word = document.getElementById("guess").value.toLowerCase();

    if (words.has(word)) {
      result = check(word);
      let element = document.getElementById("guesses");
      element.innerHTML += colorResult(word, result);
      if (chosen === word) {
        alert("You found the word!");
      }
    } else {
      alert("Sorry, that word is not in our dictionary!");
    }
  }

  function colorResult(word, result) {
    word = word.toUpperCase();
    let columns = "";
    for (let i = 0; i < 5; i++) {
      columns += `<td style="background-color: ${result[i]};">${word[i]}</td>`;
    }
    return "<tr>" + columns + "</tr>";
  }

  return {
    check,
    isCorrect,
    colorResult
  }
}
<h1>KORDLE</h1>
<table id="guesses">
  <tr></tr>
</table>

<br>

<input type="text" id="guess">
<button onclick="getData().isCorrect()">Submit</button>

How to embed mjpg streams with tag without browser getting out of memory

The reason I’m using an <img> tag for the mjpg stream is that I’m able to size the image with css. However, after letting it run for a while, the browser crashes becuase it’s getting out of memory.

I’m currently using URL.revokeObjectURL(mjpgURLwithOutdatedRandomParam) and add a new random param to the URL every few seconds. But unfortunately, the browser still crashes with Out of Memory.

What simple/optimal solution is there?

PS: I don’t understand how a browser can support mjpg (within an <img> tag) but not be prepared to handle the memory…