Blancer.com Tutorials and projects – Page 2 – Freelance Projects, Design and Programming Tutorials

Detecting In App WebViews in GTM: Filtering Android/iOS WebViews from Browser List

We are trying to accurately detect whether a user is viewing our customers site through an in-app WebView (like Android WebView or Safari in-app) versus a normal browser. The goal is to filter in-app WebViews from GA4 browser reports using Google Tag Manager.

We originally wrote a Custom JavaScript variable in GTM to detect the browser:

function() {
  var ua = navigator.userAgent;

  if (ua.indexOf("Chrome") > -1 && ua.indexOf("Edge") === -1 && ua.indexOf("OPR") === -1) {
    return "Chrome";
  } else if (ua.indexOf("Firefox") > -1) {
    return "Firefox";
  } else if (ua.indexOf("Safari") > -1 && ua.indexOf("Chrome") === -1) {
    return "Safari";
  } else if (ua.indexOf("MSIE") > -1 || ua.indexOf("Trident/") > -1) {
    return "IE";
  } else if (ua.indexOf("Edge") > -1) {
    return "Edge";
  } else if (ua.indexOf("OPR") > -1) {
    return "Opera";
  } else if (ua.indexOf("wv") > -1) {
    return "Android Webview";
  } else {
    return "Other";
  }
}

A suggested improvement added detection for iOS WebViews and some common in-app browsers:

function() {
  var ua = navigator.userAgent || "";

  // Detect common in-app environments
  if (/bFBAN|FBAV|Instagram|Line|Twitter|LinkedInApp|TikTok/i.test(ua)) {
    return "In-App Browser";
  }

  // Android WebView
  if (ua.indexOf("wv") > -1 || (ua.indexOf("Android") > -1 && ua.indexOf("Version/") > -1 && ua.indexOf("Chrome") === -1)) {
    return "Android WebView";
  }

  // iOS WebView
  if (/iPhone|iPod|iPad/i.test(ua) && !/Safari/i.test(ua)) {
    return "iOS WebView";
  }

  // Regular browsers
  if (ua.indexOf("Chrome") > -1 && ua.indexOf("Edge") === -1 && ua.indexOf("OPR") === -1) {
    return "Chrome";
  } else if (ua.indexOf("Firefox") > -1) {
    return "Firefox";
  } else if (ua.indexOf("Safari") > -1 && ua.indexOf("Chrome") === -1) {
    return "Safari";
  } else if (ua.indexOf("MSIE") > -1 || ua.indexOf("Trident/") > -1) {
    return "IE";
  } else if (ua.indexOf("Edge") > -1) {
    return "Edge";
  } else if (ua.indexOf("OPR") > -1) {
    return "Opera";
  } else {
    return "Other";
  }
}

We want to detect in-app WebViews reliably (Android/iOS and common social apps) and Use this detection in GTM triggers to filter out in-app WebViews from GA4 browser reports.

Example of the intended GTM trigger configuration:

Example of current GA4 Browser report showing Android/iOS WebViews:

We plan to implement a Custom JavaScript variable to detect these WebViews and then configure triggers like:

{{JS - Browser Type}} does not match RegEx (ignore case) Android Webview.*Safari.*

Our question are,

Will either of codes work as intended?
If not is there a better way to reliably detect in-app WebViews in GTM?

Synthetic event becomes stale after async operation

I’m experiencing an issue with a TextField where e.target.value
becomes stale after an async operation(FileReader API) in the onChange handler.

When I capture e.target.value in a variable before the async operation and
use that variable to update state, everything works fine. However, if I try to
access e.target.value after the async operation completes, it always contains
the old value instead of the current input value.

Why does e.target.value lose its current value after an async operation, and
why does storing it in a variable beforehand solve the problem?

React version 19.0.0

import React from 'react';
import TextField from '@mui/material/TextField';

export default function BasicCard() {

  const [a, setA] = React.useState("place");
  
  return <TextField 
        value={a} 
        onChange={async (e) => {
          const value = e.target.value; // Storing in variable - WORKS
          await new Promise((resolve) => { resolve(true) }); // FileReader API
          
          console.log(2, e.target.value); // This logs the OLD value, not current
          
          // setA(e.target.value); // This DOESN'T work - uses stale value
          setA(value); // This WORKS - uses captured value
        }}
      />
}

Expected: e.target.value should contain the current input value even after
the async operation.

Actual: e.target.value reverts to the previous value after the async operation
completes, causing the state update to fail.

Workaround: Capturing e.target.value in a const before the async operation works
correctly.

React synthetic event becomes stale after async operation

I’m experiencing an issue with a TextField where e.target.value
becomes stale after an async operation(FileReader API) in the onChange handler.

Why does e.target.value lose its current value after an async operation, and
why does storing it in a variable beforehand solve the problem?

React version 19.0.0

import React from 'react';
import TextField from '@mui/material/TextField';

export default function BasicCard() {

  const [a, setA] = React.useState("place");
  
  return <TextField 
        value={a} 
        onChange={async (e) => {
          const value = e.target.value; // Storing in variable - WORKS
          await new Promise((resolve) => { resolve(true) }); // FileReader API
          
          console.log(2, e.target.value); // This logs the OLD value, not current
          
          // setA(e.target.value); // This DOESN'T work - uses stale value
          setA(value); // This WORKS - uses captured value
        }}
      />
}

Expected: e.target.value should contain the current input value even after
the async operation.

Actual: e.target.value reverts to the previous value after the async operation
completes, causing the state update to fail.

Workaround: Capturing e.target.value in a const before the async operation works
correctly.

When I click on button the Javascript data result out HTML Source Code [duplicate]

I have tried but not work.
When I click on button then result out as a html source code.

Text

I want to view all html as a design.
Text

MY CODES

<form class="example">

    <input type="text" id="myInput" placeholder="Enter https url">
    <button id="myButton">Extract</button>
    </form>

    <div id="loadingSpinner" class="spinner"></div>
    <div id="result"></div>

When fetch result from fetch.php then It will result out data as html source code. Here I want to view all html as a style.

<script>
document.addEventListener('DOMContentLoaded', () => {
    const myInput = document.getElementById('myInput');
    const myButton = document.getElementById('myButton');
    const loadingSpinner = document.getElementById('loadingSpinner');
    const resultDiv = document.getElementById('result');

    myButton.addEventListener('click', () => {
        const inputValue = myInput.value;

        // Show loading spinner
        loadingSpinner.style.display = 'block';
        myButton.disabled = true; // Disable button during loading

        // Create a new XMLHttpRequest object
        const xhr = new XMLHttpRequest();

        // Configure the request
        xhr.open('POST', 'fetch.php', true);
        xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

        // Define what happens on successful data reception
        xhr.onload = () => {
            if (xhr.status === 200) {
                resultDiv.textContent = xhr.responseText;
            } else {
                resultDiv.textContent = 'Error: ' + xhr.status;
            }
            // Hide loading spinner and re-enable button
            loadingSpinner.style.display = 'none';
            myButton.disabled = false;
        };

        // Define what happens in case of an error
        xhr.onerror = () => {
            resultDiv.textContent = 'Network error.';
            loadingSpinner.style.display = 'none';
            myButton.disabled = false;
        };

        // Send the request with the input value
        xhr.send('data=' + encodeURIComponent(inputValue));
    });
});
</script>

Anyone Change the above code? Please edit it and send me.

How does gtag.js actually send events?

We have a react web application and we use gtag.js. I’m a backend developer and
I found some inconsistencies in our BigQuery events table. I would like to
understand how GA4 events are being sent from my browser to google’s analytics
infrastructure.

Here are some things I tried.

In the GA4 API documentation, and some articles on the web, and ChatGPT, it says
to look at the browser’s network debugger and search for POST requests to the
/collect endpoint. I do see two to three page_view events to this endpoint for
every page load (Which is also weird, why more than one? Why sometimes two,
sometimes three? Never mind for now), but we have a lot more analytics events,
for all sorts of interactions with different widgets.

I can see the events being added to dataLayer. As I use our web app, the events
keep being pushed there. But I don’t see how they leave my browser.

I installed a GA4 Debugger addon in my browser. The output of this addon seems
to be hooked in the calls to gtag(), which I already verified works, due to
changes in dataLayer. This did not give me the answer I’m seeking.

I connected our app with https://tagassistant.google.com/ and I see all the
events in there. When tagassistant is active, I can see interaction events in
the network tab leaving my browser as I interact with our app, but I guess this
is only to communicate with the tagassistant.

How does gtag.js actually send events to google? Can I observe this somehow?

Why does useEffect on [] gets called on hot reload?

app/page.tsx

"use client";

import { useEffect, useRef } from "react";
import { foo } from "./OrdersModuleFoo";
import React from "react";
const OrdersModule: React.FC = () => {
  const firstRun = useRef<boolean>();
  useEffect(() => {
    console.log("Fetching orders in OrdersModule...", firstRun.current);
    firstRun.current = true;
  }, []);
  console.log("Rendering OrdersModule");
  console.log("Foo is ", foo);
  return <div>OrdersModule Component test</div>;
};
const OrdersModuleMemo = React.memo(OrdersModule);
export default function Home() {
  return <OrdersModuleMemo />;
}

app/OrdersModuleFoo.tsx

export let foo = {
  bar: 123351354,
};
let foz = {
  bar: 15253775, // update this
};

When I update foz.bar and save the file, the next.JS app Hot Reloads. To my surprise, Fetching orders in OrdersModule... true is always printed on Hot Reload. This does not make sense to me because I thought useEffect on empty [] is called only once when components builds the first time.

Why does it do that? I am expecting that my it should not be re-rendered at all since 1) I use React.memo, 2) without props to OrdersModule 3) foz is not even exported.

Nextjs15 + agentcooper/react-pdf-highlighter , Runtime TypeError : Object.defineProperty called on non-object

Currently in My NextJs Project I am Using agentcooper/react-pdf-highlighter agentcooper/react-pdf-highlighter But Now I have to extend functionality of that.

we want to Focus on highlight from PDF it’s Needs to do 3 Clicks , we want that it’s on Single Click. because of that I imported agentcooper/react-pdf-highlighter code into My code. but now it’s Give me Error of Runtime TypeError – Object.defineProperty called on non-object

How To Handle This Error ?

I want to run extract react-pdf-highlighter Component and Use it into My from My code.

This My Folder Structure. the why i Used Their Code.

Git Repo : https://github.com/agentcooper/react-pdf-highlighter

Thank You

Securely Authenticating a React Native App with an Osclass Backend Lacking a Password Verification API Endpoint [closed]

I’m developing a React Native (Expo) app for an Osclass (PHP) backend, and I’m facing a critical authentication issue. The website’s REST API plugin has no login endpoint; it does not provide a method to verify a plain-text password against the stored Bcrypt ($2y$) hash.

I need to implement a secure login flow, but I have strict project constraints:

No Client-Side Verification: This is insecure as it would expose the hash, and it’s non-functional because it wouldn’t generate the required API token for subsequent requests.

No Server-Side Middleware: I cannot add a custom gateway (e.g., Laravel/Node.js) to handle the login logic.

No WebView: I cannot use a WebView to wrap the website’s existing login form.

Given this technical impasse, is there any established, secure pattern to authenticate a native app under these conditions? Or is the only viable solution to modify the backend PHP plugin to add the missing login functionality?

Securely Authenticating a React Native App with an Osclass Backend Lacking a Password Verification API Endpoint

I need to implement a secure login flow, but I have strict project constraints:

No Client-Side Verification: This is insecure as it would expose the hash, and it’s non-functional because it wouldn’t generate the required API token for subsequent requests.

No Server-Side Middleware: I cannot add a custom gateway (e.g., Laravel/Node.js) to handle the login logic.

No WebView: I cannot use a WebView to wrap the website’s existing login form.

No rule to make target ‘/opt/homebrew/Cellar/openssl@3/3.4.1/include/openssl/opensslv.h’ installing php 8.4.11

I’m trying to install PHP 8.4.11 from source–please don’t tell me I should just be installing it from homebrew–on a M1 MacMini running Sequoia 15.5.

When issuing the make command, I get the following output:

/bin/sh /Users/jnorris/Downloads/php/php-8.4.11/libtool --silent --preserve-dup-deps --tag=CC --mode=compile cc -Iext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/main -I/Users/jnorris/Downloads/php/php-8.4.11 -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib -I/opt/homebrew/Cellar/openssl@3/3.4.1/include -I/opt/homebrew/opt/libiconv/include -I/opt/homebrew/Cellar/oniguruma/6.9.10/include -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl/mbfl -I/Users/jnorris/Downloads/php/php-8.4.11/TSRM -I/Users/jnorris/Downloads/php/php-8.4.11/Zend  -D_GNU_SOURCE -pthread  -fno-common -Wstrict-prototypes -Wformat-truncation -Wall -Wextra -Wno-unused-parameter -Wno-sign-compare -g -O2 -ffp-contract=off -fvisibility=hidden -pthread -O0 -DZTS -DZEND_SIGNALS    -Wno-implicit-fallthrough -Iext/date/lib -DZEND_ENABLE_STATIC_TSRMLS_CACHE=1 -DHAVE_TIMELIB_CONFIG_H=1 -c /Users/jnorris/Downloads/php/php-8.4.11/ext/date/php_date.c -o ext/date/php_date.lo  -MMD -MF ext/date/php_date.dep -MT ext/date/php_date.lo
/bin/sh /Users/jnorris/Downloads/php/php-8.4.11/libtool --silent --preserve-dup-deps --tag=CC --mode=compile cc -Iext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/main -I/Users/jnorris/Downloads/php/php-8.4.11 -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib -I/opt/homebrew/Cellar/openssl@3/3.4.1/include -I/opt/homebrew/opt/libiconv/include -I/opt/homebrew/Cellar/oniguruma/6.9.10/include -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl/mbfl -I/Users/jnorris/Downloads/php/php-8.4.11/TSRM -I/Users/jnorris/Downloads/php/php-8.4.11/Zend  -D_GNU_SOURCE -pthread  -fno-common -Wstrict-prototypes -Wformat-truncation -Wall -Wextra -Wno-unused-parameter -Wno-sign-compare -g -O2 -ffp-contract=off -fvisibility=hidden -pthread -O0 -DZTS -DZEND_SIGNALS    -Wno-implicit-fallthrough -Iext/date/lib -DZEND_ENABLE_STATIC_TSRMLS_CACHE=1 -DHAVE_TIMELIB_CONFIG_H=1 -c /Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib/astro.c -o ext/date/lib/astro.lo  -MMD -MF ext/date/lib/astro.dep -MT ext/date/lib/astro.lo
/bin/sh /Users/jnorris/Downloads/php/php-8.4.11/libtool --silent --preserve-dup-deps --tag=CC --mode=compile cc -Iext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/main -I/Users/jnorris/Downloads/php/php-8.4.11 -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib -I/opt/homebrew/Cellar/openssl@3/3.4.1/include -I/opt/homebrew/opt/libiconv/include -I/opt/homebrew/Cellar/oniguruma/6.9.10/include -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl/mbfl -I/Users/jnorris/Downloads/php/php-8.4.11/TSRM -I/Users/jnorris/Downloads/php/php-8.4.11/Zend  -D_GNU_SOURCE -pthread  -fno-common -Wstrict-prototypes -Wformat-truncation -Wall -Wextra -Wno-unused-parameter -Wno-sign-compare -g -O2 -ffp-contract=off -fvisibility=hidden -pthread -O0 -DZTS -DZEND_SIGNALS    -Wno-implicit-fallthrough -Iext/date/lib -DZEND_ENABLE_STATIC_TSRMLS_CACHE=1 -DHAVE_TIMELIB_CONFIG_H=1 -c /Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib/dow.c -o ext/date/lib/dow.lo  -MMD -MF ext/date/lib/dow.dep -MT ext/date/lib/dow.lo
/bin/sh /Users/jnorris/Downloads/php/php-8.4.11/libtool --silent --preserve-dup-deps --tag=CC --mode=compile cc -Iext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/main -I/Users/jnorris/Downloads/php/php-8.4.11 -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib -I/opt/homebrew/Cellar/openssl@3/3.4.1/include -I/opt/homebrew/opt/libiconv/include -I/opt/homebrew/Cellar/oniguruma/6.9.10/include -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl/mbfl -I/Users/jnorris/Downloads/php/php-8.4.11/TSRM -I/Users/jnorris/Downloads/php/php-8.4.11/Zend  -D_GNU_SOURCE -pthread  -fno-common -Wstrict-prototypes -Wformat-truncation -Wall -Wextra -Wno-unused-parameter -Wno-sign-compare -g -O2 -ffp-contract=off -fvisibility=hidden -pthread -O0 -DZTS -DZEND_SIGNALS    -Wno-implicit-fallthrough -Iext/date/lib -DZEND_ENABLE_STATIC_TSRMLS_CACHE=1 -DHAVE_TIMELIB_CONFIG_H=1 -c /Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib/parse_date.c -o ext/date/lib/parse_date.lo  -MMD -MF ext/date/lib/parse_date.dep -MT ext/date/lib/parse_date.lo
/bin/sh /Users/jnorris/Downloads/php/php-8.4.11/libtool --silent --preserve-dup-deps --tag=CC --mode=compile cc -Iext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/main -I/Users/jnorris/Downloads/php/php-8.4.11 -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib -I/opt/homebrew/Cellar/openssl@3/3.4.1/include -I/opt/homebrew/opt/libiconv/include -I/opt/homebrew/Cellar/oniguruma/6.9.10/include -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl/mbfl -I/Users/jnorris/Downloads/php/php-8.4.11/TSRM -I/Users/jnorris/Downloads/php/php-8.4.11/Zend  -D_GNU_SOURCE -pthread  -fno-common -Wstrict-prototypes -Wformat-truncation -Wall -Wextra -Wno-unused-parameter -Wno-sign-compare -g -O2 -ffp-contract=off -fvisibility=hidden -pthread -O0 -DZTS -DZEND_SIGNALS    -Wno-implicit-fallthrough -Iext/date/lib -DZEND_ENABLE_STATIC_TSRMLS_CACHE=1 -DHAVE_TIMELIB_CONFIG_H=1 -c /Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib/parse_tz.c -o ext/date/lib/parse_tz.lo  -MMD -MF ext/date/lib/parse_tz.dep -MT ext/date/lib/parse_tz.lo
/bin/sh /Users/jnorris/Downloads/php/php-8.4.11/libtool --silent --preserve-dup-deps --tag=CC --mode=compile cc -Iext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/main -I/Users/jnorris/Downloads/php/php-8.4.11 -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib -I/opt/homebrew/Cellar/openssl@3/3.4.1/include -I/opt/homebrew/opt/libiconv/include -I/opt/homebrew/Cellar/oniguruma/6.9.10/include -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl/mbfl -I/Users/jnorris/Downloads/php/php-8.4.11/TSRM -I/Users/jnorris/Downloads/php/php-8.4.11/Zend  -D_GNU_SOURCE -pthread  -fno-common -Wstrict-prototypes -Wformat-truncation -Wall -Wextra -Wno-unused-parameter -Wno-sign-compare -g -O2 -ffp-contract=off -fvisibility=hidden -pthread -O0 -DZTS -DZEND_SIGNALS    -Wno-implicit-fallthrough -Iext/date/lib -DZEND_ENABLE_STATIC_TSRMLS_CACHE=1 -DHAVE_TIMELIB_CONFIG_H=1 -c /Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib/parse_posix.c -o ext/date/lib/parse_posix.lo  -MMD -MF ext/date/lib/parse_posix.dep -MT ext/date/lib/parse_posix.lo
/bin/sh /Users/jnorris/Downloads/php/php-8.4.11/libtool --silent --preserve-dup-deps --tag=CC --mode=compile cc -Iext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/main -I/Users/jnorris/Downloads/php/php-8.4.11 -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib -I/opt/homebrew/Cellar/openssl@3/3.4.1/include -I/opt/homebrew/opt/libiconv/include -I/opt/homebrew/Cellar/oniguruma/6.9.10/include -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl/mbfl -I/Users/jnorris/Downloads/php/php-8.4.11/TSRM -I/Users/jnorris/Downloads/php/php-8.4.11/Zend  -D_GNU_SOURCE -pthread  -fno-common -Wstrict-prototypes -Wformat-truncation -Wall -Wextra -Wno-unused-parameter -Wno-sign-compare -g -O2 -ffp-contract=off -fvisibility=hidden -pthread -O0 -DZTS -DZEND_SIGNALS    -Wno-implicit-fallthrough -Iext/date/lib -DZEND_ENABLE_STATIC_TSRMLS_CACHE=1 -DHAVE_TIMELIB_CONFIG_H=1 -c /Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib/timelib.c -o ext/date/lib/timelib.lo  -MMD -MF ext/date/lib/timelib.dep -MT ext/date/lib/timelib.lo
/bin/sh /Users/jnorris/Downloads/php/php-8.4.11/libtool --silent --preserve-dup-deps --tag=CC --mode=compile cc -Iext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/main -I/Users/jnorris/Downloads/php/php-8.4.11 -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib -I/opt/homebrew/Cellar/openssl@3/3.4.1/include -I/opt/homebrew/opt/libiconv/include -I/opt/homebrew/Cellar/oniguruma/6.9.10/include -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl/mbfl -I/Users/jnorris/Downloads/php/php-8.4.11/TSRM -I/Users/jnorris/Downloads/php/php-8.4.11/Zend  -D_GNU_SOURCE -pthread  -fno-common -Wstrict-prototypes -Wformat-truncation -Wall -Wextra -Wno-unused-parameter -Wno-sign-compare -g -O2 -ffp-contract=off -fvisibility=hidden -pthread -O0 -DZTS -DZEND_SIGNALS    -Wno-implicit-fallthrough -Iext/date/lib -DZEND_ENABLE_STATIC_TSRMLS_CACHE=1 -DHAVE_TIMELIB_CONFIG_H=1 -c /Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib/tm2unixtime.c -o ext/date/lib/tm2unixtime.lo  -MMD -MF ext/date/lib/tm2unixtime.dep -MT ext/date/lib/tm2unixtime.lo
/bin/sh /Users/jnorris/Downloads/php/php-8.4.11/libtool --silent --preserve-dup-deps --tag=CC --mode=compile cc -Iext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/main -I/Users/jnorris/Downloads/php/php-8.4.11 -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib -I/opt/homebrew/Cellar/openssl@3/3.4.1/include -I/opt/homebrew/opt/libiconv/include -I/opt/homebrew/Cellar/oniguruma/6.9.10/include -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl/mbfl -I/Users/jnorris/Downloads/php/php-8.4.11/TSRM -I/Users/jnorris/Downloads/php/php-8.4.11/Zend  -D_GNU_SOURCE -pthread  -fno-common -Wstrict-prototypes -Wformat-truncation -Wall -Wextra -Wno-unused-parameter -Wno-sign-compare -g -O2 -ffp-contract=off -fvisibility=hidden -pthread -O0 -DZTS -DZEND_SIGNALS    -Wno-implicit-fallthrough -Iext/date/lib -DZEND_ENABLE_STATIC_TSRMLS_CACHE=1 -DHAVE_TIMELIB_CONFIG_H=1 -c /Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib/unixtime2tm.c -o ext/date/lib/unixtime2tm.lo  -MMD -MF ext/date/lib/unixtime2tm.dep -MT ext/date/lib/unixtime2tm.lo
/bin/sh /Users/jnorris/Downloads/php/php-8.4.11/libtool --silent --preserve-dup-deps --tag=CC --mode=compile cc -Iext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/main -I/Users/jnorris/Downloads/php/php-8.4.11 -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib -I/opt/homebrew/Cellar/openssl@3/3.4.1/include -I/opt/homebrew/opt/libiconv/include -I/opt/homebrew/Cellar/oniguruma/6.9.10/include -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl/mbfl -I/Users/jnorris/Downloads/php/php-8.4.11/TSRM -I/Users/jnorris/Downloads/php/php-8.4.11/Zend  -D_GNU_SOURCE -pthread  -fno-common -Wstrict-prototypes -Wformat-truncation -Wall -Wextra -Wno-unused-parameter -Wno-sign-compare -g -O2 -ffp-contract=off -fvisibility=hidden -pthread -O0 -DZTS -DZEND_SIGNALS    -Wno-implicit-fallthrough -Iext/date/lib -DZEND_ENABLE_STATIC_TSRMLS_CACHE=1 -DHAVE_TIMELIB_CONFIG_H=1 -c /Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib/parse_iso_intervals.c -o ext/date/lib/parse_iso_intervals.lo  -MMD -MF ext/date/lib/parse_iso_intervals.dep -MT ext/date/lib/parse_iso_intervals.lo
/bin/sh /Users/jnorris/Downloads/php/php-8.4.11/libtool --silent --preserve-dup-deps --tag=CC --mode=compile cc -Iext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/ -I/Users/jnorris/Downloads/php/php-8.4.11/main -I/Users/jnorris/Downloads/php/php-8.4.11 -I/Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib -I/opt/homebrew/Cellar/openssl@3/3.4.1/include -I/opt/homebrew/opt/libiconv/include -I/opt/homebrew/Cellar/oniguruma/6.9.10/include -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl -I/Users/jnorris/Downloads/php/php-8.4.11/ext/mbstring/libmbfl/mbfl -I/Users/jnorris/Downloads/php/php-8.4.11/TSRM -I/Users/jnorris/Downloads/php/php-8.4.11/Zend  -D_GNU_SOURCE -pthread  -fno-common -Wstrict-prototypes -Wformat-truncation -Wall -Wextra -Wno-unused-parameter -Wno-sign-compare -g -O2 -ffp-contract=off -fvisibility=hidden -pthread -O0 -DZTS -DZEND_SIGNALS    -Wno-implicit-fallthrough -Iext/date/lib -DZEND_ENABLE_STATIC_TSRMLS_CACHE=1 -DHAVE_TIMELIB_CONFIG_H=1 -c /Users/jnorris/Downloads/php/php-8.4.11/ext/date/lib/interval.c -o ext/date/lib/interval.lo  -MMD -MF ext/date/lib/interval.dep -MT ext/date/lib/interval.lo
make: *** No rule to make target `/opt/homebrew/Cellar/openssl@3/3.4.1/include/openssl/opensslv.h', needed by `ext/openssl/openssl.lo'.  Stop.

I think the issue is that in each line of the above output, there is /opt/homebrew/Cellar/openssl@3/3.4.1/include when this is not the version of openssl@3 I have installed–when I issue the command:

$ openssl version

the response is:

LibreSSL 3.3.6

I have, in this order:

$ brew link --force openssl@3
Linking /opt/homebrew/Cellar/openssl@3/3.6.0... 6547 symlinks created.

$ brew uninstall libressl
Error: No such keg: /opt/homebrew/Cellar/libressl

$ sudo rm -rf /usr/local/lib/libressl*
[no response]

$ sudo rm -rf /usr/local/bin/libressl*
[no response]

$ brew reinstall openssl@3
brew install openssl@3
Warning: openssl@3 3.6.0 is already installed and up-to-date.

$ openssl version
LibreSSL 3.3.6

https://formulae.brew.sh/formula/openssl@3 does not mention “LibreSSL”–is this what homebrew should install? I was expecting openssl (or something like this, not LibreSSL).

Any ideas as to what is going wrong will be greatly appreciated!

Cant compose container [closed]

2025/10/12 18:41:05 [error] 25#25: *5 FastCGI sent in stderr: “PHP message: PHP Fatal error: Composer detected issues in your platform: Your Composer dependencies require a PHP version “>= 7.2.5”. You are running 5.6.40-86+ubuntu22.04.1+deb.sury.org+1. in /var/www/php/vendor/composer/platform_check.php on line 25″ while reading response header from upstream, client: 127.0.0.1, server: , request: “GET / HTTP/1.1”, upstream: “fastcgi://127.0.0.1:9000”, host: “localhost”
[nginx] time=2025-10-12T18:41:05+00:00|status=500|server_name=|hostn
ame=dev_upi.cb9a1wkrt2pc1kesh8b3dqqfm.local|remote_addr=127.0.0.1|request_method=GET|request=GET / HTTP/1.1|referer=-|request_length=73|request_time=0.001|bytes_sent=464|EOL
Shutdown container

When composing container, this error shows, docker nginx php56 on ubuntu

I except a compose of container, tried Cursor AI, i was migrating docker container sources from php83 to php56

How to prevent scroll the parent website when mouse is inside a webview

I have a webview iframe inside a parent web. The webview is scrollable. My problem is when scroll to bottom of webview, if you still scroll the mouse, the parent content is also scrolled.

What I tried: when mouse enter the webview, disable the wheel event of the parent, but not work. There’s solution add class name like overflow-hidden to parent is not possible because this would make parent flicked.

I have made a demo here: https://codesandbox.io/p/sandbox/9wc4v3?file=%2Findex.html%3A7%2C33

I also tried these advice but not work:
Prevent parent page from scrolling when mouse is over embedded iframe in Firefox

const target = document.getElementById("webview");

if (target) {
  // Define event handler
  const preventScroll = (e) => e.preventDefault();

  // Track mouse position relative to the div
  target.addEventListener("mouseenter", () => {
    // Disable scroll globally
    window.addEventListener("wheel", preventScroll, { passive: false });
    window.addEventListener("touchmove", preventScroll, { passive: false });
    window.addEventListener("keydown", preventKeyScroll, { passive: false });
  });

  target.addEventListener("mouseleave", () => {
    // Re-enable scroll
    window.removeEventListener("wheel", preventScroll);
    window.removeEventListener("touchmove", preventScroll);
    window.removeEventListener("keydown", preventKeyScroll);
  });
}

function preventKeyScroll(e) {
  const keys = [32, 33, 34, 35, 36, 37, 38, 39, 40];
  if (keys.includes(e.keyCode)) {
    e.preventDefault();
  }
}

What I expecting: when mouse is inside the webview, disable the scroll of parent

How to show currently pointed series values in LightningChart JS legend

I am using LightningChart JS library (https://www.npmjs.com/package/@lightningchart/lcjs) to display several line trends with scrolling time window. The data is coming over from websocket in real-time.

In the library, there is built-in functionality that I can place my mouse over the chart and there is a popup showing the nearest values from all the trends. This is very good, but I need it to behave a bit differently. Instead of an obstructive popup, I need the values to be displayed on the side. To understand better, please see this interactive chart as a starting point for my problem:

const {
  lightningChart, Themes, LegendPosition,
  AxisScrollStrategies, AxisTickStrategies
} = lcjs

const lc = lightningChart()
const chart = lc.ChartXY({ 
    theme: Themes.light,
    defaultAxisX: {
        type: 'linear-highPrecision'
    },
    legend: {
        position: LegendPosition.TopLeft
    }
})
chart.setTitle('')
chart.axisX
    .setScrollStrategy(AxisScrollStrategies.scrolling)    
    .setTickStrategy(AxisTickStrategies.DateTime)
    .setInterval({ start: 0, end: 10000, stopAxisAfter: false })

const series1 = chart.addLineSeries({ schema: { x: { pattern: 'progressive' }, y: { pattern: null } } }).setName('Trend 1')
const series2 = chart.addLineSeries({ schema: { x: { pattern: 'progressive' }, y: { pattern: null } } }).setName('Trend 2')
const series3 = chart.addLineSeries({ schema: { x: { pattern: 'progressive' }, y: { pattern: null } } }).setName('Trend 3')

setInterval(() => {
    const x = Date.now()
    series1.appendSample({ x, y: Math.random() })
    series2.appendSample({ x, y: Math.random() * 10 })
    series3.appendSample({ x, y: -Math.random() * 5 })
}, 1000/60)

<script src="https://cdn.jsdelivr.net/npm/@lightningchart/[email protected]/dist/lcjs.iife.js"></script>

Note the legend in top left. Ideally I would want the currently pointed values to be displayed there. Currently it says “Trend 1”, “Trend 2”, etc. always. When mouse is over the chart, I’d want them to show like this “Trend 1: 10.1”

I found the cursor documentation here https://lightningchart.com/js-charts/docs/features/cursor/#custom-cursors
Most notably there is “Custom cursors” section, which does mention the availability of an API to plug in custom cursor logic. I tried adding this:

chart.setCustomCursor((event) => {
    console.log(event)
})

The result is something like this:

{
   hits: [
      cursorPosition,
      iSample,
      x,
      y,
      sample,
      ...
   ]
}

The y value is everything I need, so this is good. But I haven’t been able to find the way to connect this to the legend. I found the following potential APIs but didn’t really even know what parameters to give them:

chart.legend.setEntryOptions – https://lightningchart.com/js-charts/api-documentation/v8.0.2/classes/Legend.html#setEntryOptions
chart.legend.setOptions – https://lightningchart.com/js-charts/api-documentation/v8.0.2/classes/Legend.html#setOptions
series.setCursorFormattingOverride – https://lightningchart.com/js-charts/api-documentation/v8.0.2/classes/Series2D.html#setCursorFormattingOverride

The cursor formatting override seemed most promising but I don’t think it works together with setCustomCursor as it doesn’t seem to affect anything in the console debug.

I think the right solution is something under chart.legend.setOptions but I can’t seem to find the right syntax.

Left side link click, need to scroll right side element [closed]

Left side link click, need to scroll right side element.

Image

I have actual content in right side div. Also have link in left side like ‘scroll 1’, ‘scroll 2’, ‘scroll 3’. While clicking that left side link actual right side content need to scroll up within the parent container.

Image

How can I load different styles for different pages in Angular 20 and when all assets are also different?

I’m currently working on an Angular v20+ project and facing an issue during the initial setup stage.

I have two different UI parts in my project:

Home (Landing Page and related public pages)
Dashboard (User/Admin section)

Both have separate asset sets — meaning their own CSS, JS, jQuery, Bootstrap, and other resource files.
The folder structure looks something like this:

/src/assets/
   /home/
      css/
      js/
      images/
   /dashboard/
      css/
      js/
      images/

However, the problem is that some CSS classes and JS function names are the same in both sets.
When I include both in the Angular app (even when kept in separate folders), they conflict with each other, causing the UI to break completely.

So far I’ve tried:

On-demand lazy loading of styles and scripts
Loading assets dynamically through Angular services
Using component-level script injection
Rendering and unmounting logic with conditional asset loading

Despite multiple approaches, I’m still unable to isolate both UI sections without conflicts.

I want to load Home and Dashboard assets independently —
so that when I switch between routes, their respective CSS/JS load and unload cleanly without interfering with each other.

Has anyone handled a similar structure — or can share a best practice or a GitHub example on how to manage multiple UI themes or layouts (with separate assets) in a single Angular v20+ project?