Category: javascript

The first ball is absorbed in a circular motion towards the second ball. I want to turn this gravity into a repulsion by holding “space” key in keyboard

I want to display this array value in dropdown using PHP with output like this 10:00 AM to 10:30 AM. The array below is the output of slots. I want to display start time and end time per list in dropdown.

$slots = getTimeSlot(30, ’10:00′, ’13:00′);

Array
(
    [1] => Array
        (
            [slot_start_time] => 10:00
            [slot_end_time] => 10:30
        )

    [2] => Array
        (
            [slot_start_time] => 10:30
            [slot_end_time] => 11:00
        )

    [3] => Array
        (
            [slot_start_time] => 11:00
            [slot_end_time] => 11:30
        )

    [4] => Array
        (
            [slot_start_time] => 11:30
            [slot_end_time] => 12:00
        )

    [5] => Array
        (
            [slot_start_time] => 12:00
            [slot_end_time] => 12:30
        )

    [6] => Array
        (
            [slot_start_time] => 12:30
            [slot_end_time] => 13:00
        )

)

<select name="time" id="time">
    <option value=""></option>
</select>

I want a code to insert either in the function.php file or in a sniper to add a deposit to the final form-pay total.
the plugin I use does not use all the features of woocommerce it just uses the form-pay checkout page; Please help.

Rental fee per day                    × 1                       €1,250.00

Security deposit fee (not included) ×   1                       €8,000.00

One way fee                           × 1                       €1,000.00

After hours return fee                × 1                       €300.00

Subtotal:                                                      €10,550.00

Total:                                                          €2,550.00

I want the total to be like this

Total:.....

to pay:.....

Balance :....

Best regard

How do I efficiently make changes to a string in Javascript without creating a new string every time I make a change? The attached code
illustrates this as each “result +=” operation
will generate a new string.

The idea of using a Unit8Array as a work area appears to fail because converting to a string is just as inefficient.

; Use mask to change characters in string to a
; '-' if mask dictates that. 
function maskOutput(input, mask) {
 let result = '';
 for (let i=0; i < input.length; i++){
    if (mask.charAt(i) === 'X') {
      result += '-';
    } else {
       result += input.charAt(i);
    }
 }
 return result;
}

I have a function that runs before every API request to check if the request is from a valid origin.

I have an array of valid origins

const whitelist = [ 'a.com', 'b.co.uk' ]

const validOrigin = str => {
    const url = new URL( str )
    return whitelist.includes( url.host )
}

console.log(validOrigin('https://www.a.com'))

It returns false because of the www. I dont want to just add a copy with www. to the array of valid origins. I would like a way that covers this and everything else thats unexpected.

I have this jQuery code:

$(`#searchbar`).on(`keyup`, function(){
      var value = $(this).val()
      console.log("Value:", value)
})

Which logs the text in the input in the console.

For example if you write test the console will look like this:

Value: t
Value: te
Value: tes
Value: test

Is this possible to do with just pure JS, no jQuery?

I’ve written a simple .proto file

syntax = "proto3";

message Event {
  optional string name = 1;
}

I’ve downloaded the protoc linux compiler (protoc-3.19.3-linux-x86_64.zip) and installed it in my local machine outside of the project’s folder.

Then I installed the core runtime dependency with

$ npm i google-protobuf

My package.json shows:

"google-protobuf": "^3.19.3",

I then ran this line to generate the JS code from the .proto file

$ protoc –js_out=import_style=commonjs,binary:. protos/event.proto

It outputs some generated code that I can import with

const Schema = require("./protos/event_pb");

by inspecting Schema.Event I can see that my prop .name is in there, but I can’t get any autocomplete going. Is there a way to achieve this?

I would like to call a function which is defined inside src/App.js (callMe) from public folder,

In App.js

import messaging from './firebase-init';
import './App.css';

function App () {
 function callMe() {
   console.log('Call me function called');
 }
  return (
    <div className="App">
      <h1>Hello World</h1>
    </div>
  );
}
export default App;

And I’ve another file firebase-messaging-sw.js located inside public folder,

In firebase-messaging-sw.js

importScripts('https://www.gstatic.com/firebasejs/8.10.0/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/8.10.0/firebase-messaging.js');

self.addEventListener('notificationclick', function (event) {
  console.log('On notification click: ', event);
  event.notification.close();
  event.waitUntil(clients.matchAll({
    includeUncontrolled: true,
    type: "window",
  }).then(function (clientList) {
    console.log('********* clientList: ', clientList);
    for (var i = 0; i < clientList.length; i++) {
      var client = clientList[i];
      if (client.url !== '' && 'focus' in client) {
        client.focus();
        callMe();  // This function is defined in src/App.js
        break;
      }
    }
  }));
});

const firebaseConfig = {
  apiKey: "API_KEY",
  authDomain: "AUTH_DOMAIN",
  projectId: "PROJECT_ID",
  storageBucket: "STORAGE_BUCKET",
  messagingSenderId: "SENDER_ID",
  appId: "APP_ID",
  measurementId: "MEASUREMENT_ID"
};

// Initialize Firebase
const initializedFirebaseApp = firebase.initializeApp(firebaseConfig);

const messaging = firebase.messaging();

Can you please help me, how should I call function callMe() ?

I was building a site and then, when I connect translator embedded code to the site, it changes the color of the website from dark blue to white. I tried using another translator but it still gives same whitish color on the website

I get stuck on this challenge so i need help.

A website needs a list where users can rank their favorite foods. Write the setup function, which should register click handlers on all Up! and Down! buttons. The Up! button should move the list item one place up in the list, while Down! button should move the list item one place down in the list.

For example, consider this code:

document.body.innerHTML = `<ol>
  <li><button>Up!</button>Taco<button>Down!</button></li>
  <li><button>Up!</button>Pizza<button>Down!</button></li>
  <li><button>Up!</button>Eggs<button>Down!</button></li>
</ol>`;

setup();
If the button Up! button in Pizza list item is clicked, Pizza should be the first item in the list, while Taco should be the second item

THIS IS MY CODE

function setup() {
  let list = document.getElementByTagName('li');
  let btnList = document.getElementByTagName('button');
  let up;
  let down;
  
  for (let l = 0; l < list.length; l++){
    for (let b = 0; b< btnList.length; b++){
      btnList[b].addEventListener("click", (item, index)=>{
        if(btnList[b].textContent == "Up!"){
          up = list[l - 1]
        } else if(btnList[b].textContent == "Down!"){
          down = list[l + 1]
        } else{
          return list
        }
      })
    }
  }
    return list;  
      
    })
  }
}

Please no Jquery.

In my project, I have X and Y coordinate motion that allows the car to move. I want to be able to put this data into an array because I want to move a steering wheel to see where the car is going. However, for this, I need to be able to refer to the previous and next data. Can anyone help?

  tag5617.subscribe(function(message{
    let X = document.getElementById('posX');

    X.innerHTML = message.x.toFixed(2);

    let Y = document.getElementById('posY');

    Y.innerHTML = message.y.toFixed(2);

    myChart.data.datasets[0].data.push({x:message.x.toFixed(2), y:message.y.toFixed(2)});

    myChart.update();
        
    });

I have a function that takes in a string but depending on which type of file is coming in i want my html label to switch between each other

ex:

function changename(food: string){
 if(food){
   this.type = this.getcookiesobservable(food);
   this.type = this.getcakeobservable();
  }
}

how would i get these two to swap and say “cookies” || “cakes”

I created a videoTexture using THREEJS but when displaying it, it seems as there are streaks on the video.

const video = document.getElementById('video');
const videoTexture = new THREE.VideoTexture(video)
videoTexture.encoding = THREE.sRGBEncoding;        
videoTexture.flipY = false;

I tried adding magFilter = THREE.LinearFilter;but it didn’t change anything.

Here is the image of my video where we can see the streaks and here is my original image without the streaks showing

I want to add a timer to the page where it starts on page load.

Where it goes up in milliseconds.

Then stops when the mouse is clicked on the button.

How would I create a code example of that?

https://jsfiddle.net/724n1qro/

That is all I am trying to do in the code.

Add a timer that starts on page load.

Goes up in milliseconds.

Then stops when the button is clicked.

.play {
  -webkit-appearance: none;
  appearance: none;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 90px;
  height: 90px;
  border-radius: 50%;
  cursor: pointer;
  border: 9px solid blue;
  background: transparent;
  filter: drop-shadow(3px 3px 3px #000000b3);
}

 <button class="play" type="button" aria-label="Open"></button>

i am trying to do the following, with several reads here and on the web but can’t seem to get it to work. I have two array that consist out of objects (filled dynamically) by two webservices, so I created a timed trigger and loop over them to update the products array.

var products= [
  {idProduct: '1', price: '4.99'}, 
  {idProduct: '2', price: '9.99'}, 
  {idProduct: '3', price: '7.95'}, 
  {idProduct: '4', price: '4.95'}
];

var update = [
  {idProduct: '1', price: '4.99'}, 
  {idProduct: '4', price: '4.95'}
];

what I would like to do is to remove the product from products array that are not in update. I know how to compare and how to add the product but that all checks from the update section. What I can’t seem to get to work is to delete the ones that are no longer in the update.

var i = 0;
   var entry1;
      while (i < products.length) {

       entry1 = products[i];
           
    if (update .some(function(entry2) { return entry1.ProductId === entry2.ProductId; })) {
       // Found, progress to next
       ++i;
    } else {
       // Not found, remove
       products.splice(i, 1);
    }
}

Once processed I will remove the contents of update array and it story starts again.

update = []

Desired result of products Array:

products= [
  {idProduct: '1', price: '4.99'},  
  {idProduct: '4', price: '4.95'}
];

and no, I can’t just use update array as this is a simplified example and part of a bigger code 🙂