Nothing is showing up when i try it for some reason and i want to know why.

code:

var player = [0, 0, 1, 90]
var raycast = [0, 0]

do {
    raycast[1] = raycast[1] + (Math.sin(player[3]) * 2)
    raycast[2] = raycast[2] +  (Math.cos(player[3]) * 2)
    ctx.fillRect(Math.floor(raycast[1]), Math.floor(raycast[2]), 50, 50)
} while (blocks[Math.floor(raycast[1]*raycast[2])] == 0);

i tried flooring the values, as shown on the code.
i expected to work, but it resulted in nothing.

can someone please tell me if something is wrong, i don’t have more information about it sorry.

I’m having trouble linking my filtered movies to styling.

const searchlist = document.getElementById('search-list'); {
    //looping through db and constructing elements
    for (let index = 0; index < Movies.length; index++) {
    let item = Movies[index]
   //constructing cards elemnets 
   const card = document.createElement('div'); {
   card.className = 'Media-Card';
   searchlist.appendChild(card)
   
   const cover = document.createElement('img');{
    cover.src = item.poster
    cover.className = 'Poster';
    card.appendChild(cover)
    }
    
    const header = document.createElement('h1'); {
    const textNode = document.createTextNode("")
    textNode.nodeValue = item.title
    header.appendChild(textNode);
    header.className = 'Media-Card-Header';
    card.appendChild(header)
    }
   }

   
}

I want to only display movies that match the users input string.

   //Filter through db
search.onkeydown = function filterMovies(e) {
const searchstring = e.target.value.toLowerCase(); {
            
}

const filteredMovies = Movies.filter((item) => {
return (item.title.toLowerCase().includes(searchstring));
})


}

Next, I wish to link a objects page property to the submitted keyword. This should result in a page redirect to its html page.

so far, I have looped through each array object and created its html/css elements. I am having trouble with code organization.

I need to manage one client cookie and server cookies.

The client cookie is managed in the code via javascript(Cookies.js). The function is called in the Default.aspx with the onload event.

I’m trying now to manage some session cookies with one event in Global.asax.vb:

    Sub Application_AuthenticateRequest(ByVal sender As Object, ByVal e As EventArgs)
    ' Fires upon attempting to authenticate the use
    Dim context As HttpContext = HttpContext.Current
    Dim cookies As HttpCookieCollection = context.Request.Cookies
    For Each cookie As String In cookies.AllKeys
        Try
            Dim currentCookie As HttpCookie = cookies(cookie)
            'Remove existent cookie
            If currentCookie.Name.StartsWith("cookieName") Then
                'Remove current cookie
                Dim cookieToExpire As New HttpCookie(cookie)
                cookieToExpire.Expires = DateTime.Now.AddDays(-1)
                cookieToExpire.Path = "/PathName"
                cookieToExpire.Domain = currentCookie.Domain
                context.Response.Cookies.Set(cookieToExpire)
                'Create cookie with hmac
                Dim hmac As String = CalculateHMAC(currentCookie.Value, "Key")
                Dim newCookie As New HttpCookie(cookie, currentCookie.Value & "|" & hmac)
                newCookie.Expires = currentCookie.Expires
                newCookie.Path = "/PathName"
                newCookie.Domain = currentCookie.Domain
                newCookie.HttpOnly = currentCookie.HttpOnly
                newCookie.Secure = currentCookie.Secure
                context.Response.SetCookie(newCookie)
            End If
        Catch ex As Exception
            context.Response.Write("Error:" & ex.Message)
        End Try
    Next
End Sub

Notice that the implementation is successful, but the thing is, after writing this, the client cookie is not created now.
I see in devtools console the following error:

Uncaught ReferenceError: checkCookie is not defined

But without the code in Application_AuthenticateRequest this is running ok.

My wonder is the lifecycle of those events and if can coexists to apply the changes with both.

I have a video tag. I want to appear a button ‘next’ When 5 seconds have passed from the video. Below code but not work.

<script>
var vid1 = document.getElementById("MyVid1");
var btn = document.getElementById("btn");

btn.style.display = "none";

vid1.play();


if(vid1.currentTime==5){
btn.style.display = "block";}
</script>

<video width="320" height="240" id="MyVid1" controls >
  <source src="vid/1.mp4" type="video/mp4">
 
</video>

<button id='btn' >tryit</button>

Am having problems am trying to display an API that is structured as an object but I want whenever I click on an icon it should show a specific part of the API like profile icon should show name but I keep getting issues.

I tried to using if switch but now it’s just displaying empty like the log is just showing blank.

So encryption is being done in Java and decryption was being done in Java but now we have a new service to do it in Javascript. For 90% of the datakeys, it works, but there is one case it hasn’t been working. I have provided the steps below to see if anyone can see what is different or incorrect about the Javascript implementation.

The implementation uses a plaintext datakey that is decrypted using kms. That decryptedDataKey is then used to create a PBEKeySpec which is used to decrypt the string. The failing decrypt ends with the error: Error: error:06065064:digital envelope routines:EVP_DecryptFinal_ex:bad decrypt

Javascript:

import { KMS } from 'aws-sdk';

const kms = new KMS({ region: 'us-east-1' });

async function decryptDataKey(encryptedDataKey) {
  const cipherTextBlob = Buffer.from(encryptedDataKey, 'base64');
  const decryptRequest = {
    CiphertextBlob: cipherTextBlob
  };

  const data = await kms.decrypt(decryptRequest).promise();
  return data.Plaintext.toString('utf8');
}



import * as crypto from 'crypto';


export async function generateSecret(key: string, salt: string): Promise<Buffer> {
  const complexity = 128 / 8;

  return new Promise((resolve, reject) => {
    try {
      crypto.pbkdf2(key, salt, 65536, complexity, 'sha1', (e, s) => {
        if (e) {
          reject(e);
        } else {
          resolve(s);
        }
      });
    } catch (ex) {
      reject(ex);
    }
  });
}



it('should work', async () => {
  const dataKey = 'keyInPlainText';
  const salt = 'salt';
  const encryptedString = 'encryptedString';
  const expectedValue = 'expectedValue'

  const decryptedDatakey = await decryptDataKey(dataKey)
  const secretKeySpec = await generateSecret(decryptedDatakey, salt);
  const res = await decrypt(encryptedString, secretKeySpec, 'AES-128-ECB', 'utf8');
  expect(res).to.equal(expectedValue);
});

Java code:

@Override
public String decryptDataKey(String encryptedDataKey) {
  byte[] cipherTextBlob = Base64.getDecoder().decode(encryptedDataKey);
  DecryptRequest decryptRequest =
    DecryptRequest.builder().ciphertextBlob(SdkBytes.fromByteArray(cipherTextBlob)).build();
  byte[] decryptedDataKey =
    ByteBuffer.wrap(kmsClient.decrypt(decryptRequest).plaintext().asByteArray()).array();
  return new String(decryptedDataKey, StandardCharsets.UTF_8);
}
}


public SecretKeySpec createSecretKeySpec(String dataKey, String saltData) throws CryptoException {
  try {
    SecretKeyFactory factory = SecretKeyFactory.getInstance("PBKDF2WithHmacSHA1");
    PBEKeySpec pbeKeySpec =
      new PBEKeySpec(
        dataKey.toCharArray(),
        saltData.getBytes("UTF-8"),
        65536,
        128);

    SecretKey secretKey = factory.generateSecret(pbeKeySpec);
    byte[] b = secretKey.getEncoded();
    return new SecretKeySpec(secretKey.getEncoded(), "AES");
  } catch (InvalidKeySpecException | NoSuchAlgorithmException | UnsupportedEncodingException ex) {
    throw new CryptoException(ex.getMessage());
  }
}


public void testDecryptSingleEncryptedStringSuccessfully()
throws CryptoException {

  String dataKey = "keyInPlainText";
  String salt = "salt";
  String encryptedString = "encryptedString";
  String expectedValue = "expectedValue";

  String decryptedDataKey =  dataKeyDecryption.decryptDataKey(dataKey);

  SecretKeySpec secretKeySpec = ingestionCrypto.createSecretKeySpec(decryptedDataKey, salt);
  String data = ingestionCrypto.decrypt(encryptedField, secretKeySpec);

  assertNotNull(data);
  assertEquals(expectedDecryptedData, data);
}

Please note the values I have used for the test case are not real and will not work. I do not have a working in this case since I cannot provide the actual keys we use.

I have not provided the decrypt function because I know that is not the culprit. If I convert the Java output in bytes to a Buffer in javascript and use that as that as the secretKeySpec, then decryption works. I think the failure is on decrypting the dataKey cause on the working test, the output matches the Java string but it doesn’t on the non-working test (I only thing that jumps out to me is there is a newline on the failing decrypted string, but they both have it). Also if take the decryptedString output from Java and hardcode that in the javascript code, it works for the working example but not for the non-working example (so not sure if there is some wonkiness with the strings at play).

I develop a JavaScript frontend using w2ui components.

I have a nested w2layout setup like the following

  let layout = new w2layout(outerConfig.layout);
  let grid = new w2grid(outerConfig.grid);
  let formLayout = new w2layout(innerConfig.layout);
  let form = new w2form(innerConfig.form);
  let btn = document.createElement ('button');
  btn.className = "w2ui-btn";
  btn.innerText = "test",
        
  layout.render('#outerdiv');
  layout.html('left', grid);
  layout.html('main', formLayout);
  formLayout.html('main', form);
  formLayout.html('bottom', btn);

In the ‘bottom’ a text is displayed instead of displaying the button itself:
[object HTMLButtonElement]

The same happens if I add a div instead of the button.

However if I add a w2grid object to the ‘bottom’ it is displayed fine. So the layout structure works fine.

(I do not want to use the actions property of the form as I want to dynamically add and remove buttons from the div placed in ‘bottom’)

How can I get w2layout to properly display non w2ui elements?

thank you.

I’m trying to create an infinite vertical scrolling effect for an arrow image (1101px in height) that scrolls from top to bottom without any visible gaps. The image is intended to repeat seamlessly, creating the effect of a continuously scrolling arrow background.

the image i want to infinetly scroll

import { useEffect, useRef } from "react";
import Heading from "../Heading/Heading";
import BodyText from "../BodyText/BodyText";
import infinteArrows from "../../assets/icons/arrowinfinte.png";
import './index.css';

const BusinessSuccess = () => {
    const containerRef = useRef(null);

    useEffect(() => {
        const container = containerRef.current;
        const image = container.querySelector(".scrolling-image");

        // Clone the image and append it at the bottom for a seamless scroll effect
        const clone = image.cloneNode(true);
        container.appendChild(clone);

        // Reset the scroll position when the first image scrolls up fully
        const handleAnimationEnd = () => {
            container.scrollTop = 0;
        };
        container.addEventListener("animationiteration", handleAnimationEnd);

        return () => {
            container.removeEventListener("animationiteration", handleAnimationEnd);
        };
    }, []);

    return (
        <div className="grid md:grid-cols-12 h-screen px-20 gap-10 bg-grayBg">
            {/* Left Column - Spans 8 columns on medium and larger screens */}
            <div className="col-span-12 md:col-span-8 flex flex-col justify-center items-center">
                <Heading
                    text="Formula For Business Success"
                    color="text-neon"
                    font="font-monument"
                    size="text-50px"
                    centered={false}
                />
                <BodyText
                    text="Lorem Ipsum Is Simply Dummy Text Of The Printing And Typesetting Industry. Lorem
                    Ipsum Has Been The Industry's"
                    centered={false}
                />
            </div>

            {/* Right Column - Scrolling Image Effect */}
            <div className="col-span-12 md:col-span-4 flex items-center justify-center overflow-hidden relative h-full">
                <div ref={containerRef} className="scrolling-image-container w-full h-full absolute">
                    <img src={infinteArrows} alt="Infinite Arrows" className="w-full object-contain scrolling-image" />
                </div>
            </div>
        </div>
    );
};

export default BusinessSuccess;

.scrolling-image-container {
    position: relative;
    height: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.scrolling-image {
    flex-shrink: 0;
    height: 130%; /* Adjust to ensure the image goes out of view */
    animation: scrollVertically 5s linear infinite;
}

@keyframes scrollVertically {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-100%); /* Move the image fully out of view */
    }
}

So right now there are gaps, also image should infintely sccroll fine irepsective of screen size

I’m trying to understand the true nature of the prototype pattern by looking at how it presents in radically different programming languages.¹

So I decided to look up at JavaScript, as one of the several non-compiled languages around.

And that’s how I refreshed something that I had known in the past, i.e. that foo = bar in JavaScript is a shallow copy (assuming bar is an object), thus concluding that JavaScript too does need a way of cloning objects, where cloning means deep copying. So I searched for that and bumped into the developer.mozilla.org/ page on “Deep copy”, where I read that

many JavaScript objects are not serializable at all […] So there’s no way to make deep copies of such objects.

[…] And calling structuredClone() to clone a non-serializable object will fail in the same way that calling JSON.stringify() to serialize it will fail.

from which I’d conclude that there is absolutely no one-size-fits-all solution for deep copying in JavaScript.

Is that indeed the case?

(¹) Coming from C++, I looked at that first, and came to the conclusion that the prototype pattern is after all just the solution to the problem of (deep) cloning a polymorphic object, all the rest that is usually presented with the prototype design pattern being just convient stuff one might want to do as well (a factory, a store of common prototypes, and so on).

From the developer.mozilla.org/ page on “Deep copy”:

The copy of an object whose properties all have primitive values fits the definition of both a deep copy and a shallow copy.

I’m not sure I understand this quote.

I know that copies of primitive values are deep copies:

x = 'hello';
y = x;
y = 'world';

console.log(x)
console.log(y)

But as regards objects, that’s not true:

x = { k: 'v' }
y = x;
y.k = 'w';

console.log(x)
console.log(y)

In the latter snippet, doesn’t x match the description of

an object whose properties all have primitive values

given that it has just one property to which a string value 'v' is associated?

That’s enough to show the difference between shallow and deep copy, so what is the quote above referring to?

I’m creating a Chrome extension that grabs information from a browser game to update an overlay that displays team information. To do this, I have injected JS into the browser page to pass data from the browser to the extension through window.postMessage().

Here is the full code for the injected JS

// setInterval(function () {
//     window.postMessage({ data: window.gameInfo.party}, "*")
// }, 1000);
// This worked but felt like an unoptimized solution

let partyData = window.gameInfo.party[0];

let handler = {
    set(target, property, value, receiver) {
      if (value !== target[property]) {
        console.log(`Setting ${property} to ${value}`);
        target[property] = value;
        console.log(property, value);
        return true;
      }
      return false;
    }
  };
  
let proxyParty = new Proxy(partyData, handler);

Right now, if I call partyProxy or partyData , it comes up as undefined. window.gameInfo.party[0] works as intended when entering it into the browser console.

My ultimate goal is to have the function that includes window.postMessage() be triggered when there is a change to window.gameInfo.party[0]. If it matters, window.gameInfo.party[0] is an array that includes “name” and “level” values.

My JS knowledge is limited and I’m much more of a visual learner, so I haven’t found a video that addresses this exactly. I’m having trouble parsing the documentation to get a clear answer on how to accomplish this.

Thank you so much for any help!

I am having a problem with sorting.

By default it is put on the second header line but I want it on the first and not on the second.

The second header row may seem silly when viewed like this, but in reality I will use this to search for each respective column.

Below is a working example of what is happening to me.

$(document).ready( function () {
  var table = $('#example').DataTable({
    colReorder: true,
    "footerCallback": function ( row, data, start, end, display ) {
      var api = this.api(), data;

      // Append footer if it doesn't exist
      if ($('#example').find('tfoot').length ===0) {
        var footer = $('<tfoot><tr><th colspan="6">g</th></tr></tfoot>');
        $('#example').append(footer);
      } 

      // Remove the formatting to get integer data for summation
      var intVal = function ( i ) {
        return typeof i === 'string' ?
          i.replace(/[$,]/g, '')*1 :
        typeof i === 'number' ?
          i : 0;
      };

      // Total over all pages
      total = api
      .column( 5 )
      .data()
      .reduce( function (a, b) {
        return intVal(a) + intVal(b);
      }, 0 );

      // Total over this page
      pageTotal = api
      .column( 5, { page: 'current'} )
      .data()
      .reduce( function (a, b) {
        return intVal(a) + intVal(b);
      }, 0 );

      // Update footer
      $( '#example tfoot th:eq(0)' ).html(
        '$'+pageTotal +' ( $'+ total +' total)'
      );
    }
  });



} );

<!DOCTYPE html>
<html>
  <head>
    <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>

    <link href="https://nightly.datatables.net/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
    <script src="https://nightly.datatables.net/js/jquery.dataTables.js"></script>
<link href="https://cdn.datatables.net/colreorder/1.5.3/css/colReorder.dataTables.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.datatables.net/colreorder/1.5.3/js/dataTables.colReorder.js"></script>

    <meta charset=utf-8 />
    <title>DataTables - JS Bin</title>
  </head>
  <body>
    <div class="container">
      <table id="example" class="display nowrap" width="100%">
        <thead>
          <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
          </tr>
          <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
          </tr>
        </thead>


        <tbody>
          <tr>
            <td>Tiger Nixon</td>
            <td>System Architect</td>
            <td>Edinburgh</td>
            <td>61</td>
            <td>2011/04/25</td>
            <td>$3,120</td>
          </tr>
          <tr>
            <td>Garrett Winters</td>
            <td>Director</td>
            <td>Edinburgh</td>
            <td>63</td>
            <td>2011/07/25</td>
            <td>$5,300</td>
          </tr>
          <tr>
            <td>Ashton Cox</td>
            <td>Technical Author</td>
            <td>San Francisco</td>
            <td>66</td>
            <td>2009/01/12</td>
            <td>$4,800</td>
          </tr>
          <tr>
            <td>Cedric Kelly</td>
            <td>Javascript Developer</td>
            <td>Edinburgh</td>
            <td>22</td>
            <td>2012/03/29</td>
            <td>$3,600</td>
          </tr>
          <tr>
            <td>Jenna Elliott</td>
            <td>Financial Controller</td>
            <td>Edinburgh</td>
            <td>33</td>
            <td>2008/11/28</td>
            <td>$5,300</td>
          </tr>
          <tr>
            <td>Brielle Williamson</td>
            <td>Integration Specialist</td>
            <td>New York</td>
            <td>61</td>
            <td>2012/12/02</td>
            <td>$4,525</td>
          </tr>
          <tr>
            <td>Herrod Chandler</td>
            <td>Sales Assistant</td>
            <td>San Francisco</td>
            <td>59</td>
            <td>2012/08/06</td>
            <td>$4,080</td>
          </tr>
          <tr>
            <td>Rhona Davidson</td>
            <td>Integration Specialist</td>
            <td>Edinburgh</td>
            <td>55</td>
            <td>2010/10/14</td>
            <td>$6,730</td>
          </tr>
          <tr>
            <td>Colleen Hurst</td>
            <td>Javascript Developer</td>
            <td>San Francisco</td>
            <td>39</td>
            <td>2009/09/15</td>
            <td>$5,000</td>
          </tr>
          <tr>
            <td>Sonya Frost</td>
            <td>Software Engineer</td>
            <td>Edinburgh</td>
            <td>23</td>
            <td>2008/12/13</td>
            <td>$3,600</td>
          </tr>
          <tr>
            <td>Jena Gaines</td>
            <td>System Architect</td>
            <td>London</td>
            <td>30</td>
            <td>2008/12/19</td>
            <td>$5,000</td>
          </tr>
          <tr>
            <td>Quinn Flynn</td>
            <td>Financial Controller</td>
            <td>Edinburgh</td>
            <td>22</td>
            <td>2013/03/03</td>
            <td>$4,200</td>
          </tr>
          <tr>
            <td>Charde Marshall</td>
            <td>Regional Director</td>
            <td>San Francisco</td>
            <td>36</td>
            <td>2008/10/16</td>
            <td>$5,300</td>
          </tr>
          <tr>
            <td>Haley Kennedy</td>
            <td>Senior Marketing Designer</td>
            <td>London</td>
            <td>43</td>
            <td>2012/12/18</td>
            <td>$4,800</td>
          </tr>
          <tr>
            <td>Tatyana Fitzpatrick</td>
            <td>Regional Director</td>
            <td>London</td>
            <td>19</td>
            <td>2010/03/17</td>
            <td>$2,875</td>
          </tr>
          <tr>
            <td>Michael Silva</td>
            <td>Senior Marketing Designer</td>
            <td>London</td>
            <td>66</td>
            <td>2012/11/27</td>
            <td>$3,750</td>
          </tr>
          <tr>
            <td>Paul Byrd</td>
            <td>Javascript Developer</td>
            <td>New York</td>
            <td>64</td>
            <td>2010/06/09</td>
            <td>$5,000</td>
          </tr>
          <tr>
            <td>Gloria Little</td>
            <td>Systems Administrator</td>
            <td>New York</td>
            <td>59</td>
            <td>2009/04/10</td>
            <td>$3,120</td>
          </tr>
          <tr>
            <td>Bradley Greer</td>
            <td>Software Engineer</td>
            <td>London</td>
            <td>41</td>
            <td>2012/10/13</td>
            <td>$3,120</td>
          </tr>
          <tr>
            <td>Dai Rios</td>
            <td>System Architect</td>
            <td>Edinburgh</td>
            <td>35</td>
            <td>2012/09/26</td>
            <td>$4,200</td>
          </tr>
          <tr>
            <td>Jenette Caldwell</td>
            <td>Financial Controller</td>
            <td>New York</td>
            <td>30</td>
            <td>2011/09/03</td>
            <td>$4,965</td>
          </tr>
          <tr>
            <td>Yuri Berry</td>
            <td>System Architect</td>
            <td>New York</td>
            <td>40</td>
            <td>2009/06/25</td>
            <td>$3,600</td>
          </tr>
          <tr>
            <td>Caesar Vance</td>
            <td>Technical Author</td>
            <td>New York</td>
            <td>21</td>
            <td>2011/12/12</td>
            <td>$4,965</td>
          </tr>
          <tr>
            <td>Doris Wilder</td>
            <td>Sales Assistant</td>
            <td>Edinburgh</td>
            <td>23</td>
            <td>2010/09/20</td>
            <td>$4,965</td>
          </tr>
          <tr>
            <td>Angelica Ramos</td>
            <td>System Architect</td>
            <td>London</td>
            <td>36</td>
            <td>2009/10/09</td>
            <td>$2,875</td>
          </tr>
          <tr>
            <td>Gavin Joyce</td>
            <td>Developer</td>
            <td>Edinburgh</td>
            <td>42</td>
            <td>2010/12/22</td>
            <td>$4,525</td>
          </tr>
          <tr>
            <td>Jennifer Chang</td>
            <td>Regional Director</td>
            <td>London</td>
            <td>28</td>
            <td>2010/11/14</td>
            <td>$4,080</td>
          </tr>
          <tr>
            <td>Brenden Wagner</td>
            <td>Software Engineer</td>
            <td>San Francisco</td>
            <td>18</td>
            <td>2011/06/07</td>
            <td>$3,750</td>
          </tr>
          <tr>
            <td>Ebony Grimes</td>
            <td>Software Engineer</td>
            <td>San Francisco</td>
            <td>48</td>
            <td>2010/03/11</td>
            <td>$2,875</td>
          </tr>
          <tr>
            <td>Russell Chavez</td>
            <td>Director</td>
            <td>Edinburgh</td>
            <td>20</td>
            <td>2011/08/14</td>
            <td>$3,600</td>
          </tr>
          <tr>
            <td>Michelle House</td>
            <td>Integration Specialist</td>
            <td>Edinburgh</td>
            <td>37</td>
            <td>2011/06/02</td>
            <td>$3,750</td>
          </tr>
          <tr>
            <td>Suki Burks</td>
            <td>Developer</td>
            <td>London</td>
            <td>53</td>
            <td>2009/10/22</td>
            <td>$2,875</td>
          </tr>
          <tr>
            <td>Prescott Bartlett</td>
            <td>Technical Author</td>
            <td>London</td>
            <td>27</td>
            <td>2011/05/07</td>
            <td>$6,730</td>
          </tr>
          <tr>
            <td>Gavin Cortez</td>
            <td>Technical Author</td>
            <td>San Francisco</td>
            <td>22</td>
            <td>2008/10/26</td>
            <td>$6,730</td>
          </tr>
          <tr>
            <td>Martena Mccray</td>
            <td>Integration Specialist</td>
            <td>Edinburgh</td>
            <td>46</td>
            <td>2011/03/09</td>
            <td>$4,080</td>
          </tr>
          <tr>
            <td>Unity Butler</td>
            <td>Senior Marketing Designer</td>
            <td>San Francisco</td>
            <td>47</td>
            <td>2009/12/09</td>
            <td>$3,750</td>
          </tr>
          <tr>
            <td>Howard Hatfield</td>
            <td>Financial Controller</td>
            <td>San Francisco</td>
            <td>51</td>
            <td>2008/12/16</td>
            <td>$4,080</td>
          </tr>
          <tr>
            <td>Hope Fuentes</td>
            <td>Financial Controller</td>
            <td>San Francisco</td>
            <td>41</td>
            <td>2010/02/12</td>
            <td>$4,200</td>
          </tr>
          <tr>
            <td>Vivian Harrell</td>
            <td>System Architect</td>
            <td>San Francisco</td>
            <td>62</td>
            <td>2009/02/14</td>
            <td>$4,965</td>
          </tr>
          <tr>
            <td>Timothy Mooney</td>
            <td>Financial Controller</td>
            <td>London</td>
            <td>37</td>
            <td>2008/12/11</td>
            <td>$4,200</td>
          </tr>
          <tr>
            <td>Jackson Bradshaw</td>
            <td>Director</td>
            <td>New York</td>
            <td>65</td>
            <td>2008/09/26</td>
            <td>$5,000</td>
          </tr>
          <tr>
            <td>Miriam Weiss</td>
            <td>Support Engineer</td>
            <td>Edinburgh</td>
            <td>64</td>
            <td>2011/02/03</td>
            <td>$4,965</td>
          </tr>
          <tr>
            <td>Bruno Nash</td>
            <td>Software Engineer</td>
            <td>London</td>
            <td>38</td>
            <td>2011/05/03</td>
            <td>$4,200</td>
          </tr>
          <tr>
            <td>Odessa Jackson</td>
            <td>Support Engineer</td>
            <td>Edinburgh</td>
            <td>37</td>
            <td>2009/08/19</td>
            <td>$3,600</td>
          </tr>
          <tr>
            <td>Thor Walton</td>
            <td>Developer</td>
            <td>New York</td>
            <td>61</td>
            <td>2013/08/11</td>
            <td>$3,600</td>
          </tr>
          <tr>
            <td>Finn Camacho</td>
            <td>Support Engineer</td>
            <td>San Francisco</td>
            <td>47</td>
            <td>2009/07/07</td>
            <td>$4,800</td>
          </tr>
          <tr>
            <td>Elton Baldwin</td>
            <td>Data Coordinator</td>
            <td>Edinburgh</td>
            <td>64</td>
            <td>2012/04/09</td>
            <td>$6,730</td>
          </tr>
          <tr>
            <td>Zenaida Frank</td>
            <td>Software Engineer</td>
            <td>New York</td>
            <td>63</td>
            <td>2010/01/04</td>
            <td>$4,800</td>
          </tr>
          <tr>
            <td>Zorita Serrano</td>
            <td>Software Engineer</td>
            <td>San Francisco</td>
            <td>56</td>
            <td>2012/06/01</td>
            <td>$5,300</td>
          </tr>
          <tr>
            <td>Jennifer Acosta</td>
            <td>Javascript Developer</td>
            <td>Edinburgh</td>
            <td>43</td>
            <td>2013/02/01</td>
            <td>$2,875</td>
          </tr>
          <tr>
            <td>Cara Stevens</td>
            <td>Sales Assistant</td>
            <td>New York</td>
            <td>46</td>
            <td>2011/12/06</td>
            <td>$4,800</td>
          </tr>
          <tr>
            <td>Hermione Butler</td>
            <td>Director</td>
            <td>London</td>
            <td>47</td>
            <td>2011/03/21</td>
            <td>$4,080</td>
          </tr>
          <tr>
            <td>Lael Greer</td>
            <td>Systems Administrator</td>
            <td>London</td>
            <td>21</td>
            <td>2009/02/27</td>
            <td>$3,120</td>
          </tr>
          <tr>
            <td>Jonas Alexander</td>
            <td>Developer</td>
            <td>San Francisco</td>
            <td>30</td>
            <td>2010/07/14</td>
            <td>$5,300</td>
          </tr>
          <tr>
            <td>Shad Decker</td>
            <td>Regional Director</td>
            <td>Edinburgh</td>
            <td>51</td>
            <td>2008/11/13</td>
            <td>$5,300</td>
          </tr>
          <tr>
            <td>Michael Bruce</td>
            <td>Javascript Developer</td>
            <td>Edinburgh</td>
            <td>29</td>
            <td>2011/06/27</td>
            <td>$4,080</td>
          </tr>
          <tr>
            <td>Donna Snider</td>
            <td>System Architect</td>
            <td>New York</td>
            <td>27</td>
            <td>2011/01/25</td>
            <td>$3,120</td>
          </tr>
        </tbody>
      </table>
    </div>
  </body>
</html>

Can someone please help me?

I’ve created a slider using Slider Revolution and included two elements:

A progress bar that fills up during the slide.
A text layer with a typing animation.
The problem is that the typing animation for the text starts with a noticeable delay (around 3000ms) after the progress bar animation begins. I want both the progress bar and the text typing animation to start simultaneously, but currently, the progress bar animation begins right away, and the text animation only starts about 3 seconds later.

Any advice on how to achieve this synchronization would be greatly appreciated!

note :the delay is 0 , and the start time is 0 [![enter image description here

In Node.js, I created an API to check if a customer exists based on their mobile number or email. However, when I pass values that aren’t present in the database, it still shows a “success” response. How can I write the logic to return an appropriate message if the customer is not found?

Node js – model file code —

export async function existing_customer_check(data){
    const email = data.email;
    const mobile = data.mobile;

    const register_customer_check_query = `SELECT email , mobile FROM users WHERE email = ? || mobile = ? `;
    
    try{
  const result = await new Promise((resolve,reject)=>{
    pool.query(register_customer_check_query,[email,mobile],(error,result,fields)=>{
        if(error){
                reject(error);
        }
        else{
            resolve(result);
        }
    })
  })
  return result;
    }catch(error){
        throw new Error(error.message);
    }
}

controller file

export async function existing_customer_check(data){
    const email = data.email;
    const mobile = data.mobile;

    const register_customer_check_query = `SELECT email , mobile FROM users WHERE email = ? || mobile = ? `;
    
    try{
  const result = await new Promise((resolve,reject)=>{
    pool.query(register_customer_check_query,[email,mobile],(error,result,fields)=>{
        if(error){
                reject(error);
        }
        else{
            resolve(result);
        }
    })
  })
  return result;
    }catch(error){
        throw new Error(error.message);
    }
}

Consider the following simple example.
Two counters are rendering, once with ref that gets updated every second and one static:

<script setup>
import { onMounted } from 'vue';
import { ref } from 'vue'

let staticNumber = 0;
const dynamicNumber = ref(0);

onMounted(() => {
  setInterval(() => dynamicNumber.value++, 1000);
  setTimeout(() => staticNumber = 10);
});
</script>

<template>
  <h1>This should update every second {{ dynamicNumber }}</h1>
  <h1>This should not update at all! {{ staticNumber }}</h1>
</template>

The problem is, after one second pass, the second h1 tag which initially was 0 gets updated and showing 10.

Why? Why Vue is even checking non-ref value and updates them?

I am concerned because on my site I want to support multiple languages so basically the template would look like this:

<template>
  <h1>{{ phrase.greetings }}</h1> <!-- Should be static -->
  <p>{{ phrase.x_visitors(numberOfVisitors) }}</p> <!-- Should be updating -->
  <p>{{ phrase.site_description }}</p> <!-- Should be static -->
</template>

But with the behaviour I metioned above it means every time I update numberOfVisitors variable it will also update all the other elements with text interpolation on the whole site!

Does this mean it will lag and freeze every time something updates?