Mehdi's questions

Tenho lutado ultimamente ao passar um array de dados no WordPress para ser processado via admin-ajax.php. Adicionei um botão no hook do WooCommerce 'woocommerce_after_shop_loop_item' que contém um data-product_id com uma classe de compare-button. Meu problema é que estou recebendo uma espécie de array stringificado 'muitas vezes' (com aspas de escape, imagens mostradas). Meu objetivo é passar um array de IDs de produtos clicados para admin-ajax.php e lá processar esse array. Não consigo fazer isso provavelmente devido ao formato do array como string. Se eu usar json_decode, também recebo um erro (embora dessa forma funcione se testado em localhost, não em ambiente WordPress). Se eu decodificar JSON primeiro e verificar se um ID está no array novamente, não está funcionando. O que estou fazendo errado?

function ps_compare_products_add_enqueue(){
    wp_enqueue_script('ps_script1', plugin_dir_url(__FILE__).'../script/script.js');
    wp_localize_script('ps_script1','ps_object', array(
      "ajax_url" => admin_url("admin-ajax.php")
   ));
 }

function process_array_ids(){

  if(isset($_POST['my_string_array']) && !empty($_POST['my_string_array'])){
    $array = $_POST['my_string_array'];
    //$array = json_decode($array); // if I add this I get null in my console which in not wordpress environment works
    echo json_encode($array); // the only way I found to send back the array but in string format again
    
  }

  wp_die();
}

add_action('wp_enqueue_scripts','ps_compare_products_add_enqueue');

add_action('wp_ajax_my_array_ids_action', 'process_array_ids');

add_action('wp_ajax_nopriv_my_array_ids_action', 'process_array_ids');

Javascript

document.addEventListener('DOMContentLoaded', function() {
    let compareProducts = []
    var compareButtons = document.querySelectorAll('.compare-button');
    document.addEventListener('click', (e) => {
        if(e.target.matches('.compare-button')){
            var productId = e.target.dataset.product_id; 
            if (!compareProducts.includes(productId)) {
                compareProducts.push(productId);
            }
            fetch_my_array(ps_object.ajax_url, 'POST', compareProducts)
        }
    });
})

async function fetch_my_array(url, post, myArray){
    let myForm = new FormData()
    let my_string_array = JSON.stringify(myArray)
    myForm.append('action', 'my_array_ids_action')
    myForm.append('my_string_array', my_string_array)
   
    const options={
        method: post,
        body: myForm
    }
    const response = await fetch(url, options)
    let result =  await response.json()
    console.log(response)
    console.log(result)
    // console.log(JSON.parse(result.replaceAll('\\"','')))
}

Então abaixo está o que tenho no meu DevTools

No contexto de fazer uma plataforma B2B baseada apenas em um site de e-commerce wordpress, preciso alterar o e-mail enviado aos clientes após fazer um pedido removendo a lista de itens pedidos, pois pode ser uma lista longa), mas ainda enviando o total do carrinho (pedido). Segui a resposta fornecida por @LoicTheAztec que funciona perfeitamente, aqui está a função e o hook usados

function pkdb2b_remove_order_details_from_emails(){

        $mailer = WC()->mailer();
        remove_action('woocommerce_email_order_details', array($mailer, 'order_details'), 10);

}


add_action('woocommerce_email_order_details','pkdb2b_remove_order_details_from_emails', 5, 4);

Isso remove os detalhes do pedido. Para adicionar o total do carrinho, estou usando outra função e hook como este.

function pkdb2b_add_cart_total_email(){
;
    $cart_total =  WC()->cart->cart_contents_total;
    echo "<p> Votre Commande montant Total = "."<strong>".$cart_total." DT"."</strong> est bien reçue</p>";

}

add_action('woocommerce_email_order_details','pkdb2b_add_cart_total_email', 5, 4);

Isso também funciona quando o pedido é validado. No entanto, quando o pedido é cancelado, no e-mail recebido não é mais visto o total do carrinho (o que é esperado, pois não temos mais um carrinho).

Eu tentei usar este $order = WC_Emails()->order_details(); $total = $order-> get_total(); ou este

$total = WC_Order()->obter_total()

Tentei ler o documento do woocommerce , mas ainda não consegui encontrar uma maneira de acessar o total do pedido ou mesmo a variável $order

Estou adicionando um botão em produtos na página da loja somente quando o administrador estiver conectado. Este botão, quando pressionado, redefinirá o estoque do produto para zero (0). Às vezes, pode ser mais fácil limpar produtos fora de estoque do site usando imagens de produtos do que pesquisá-los com seu sku. Eu fiz este código com base na resposta do @LoicTheAztec e @Víctor González SO para atualizar tabelas de banco de dados nesse sentido e funciona perfeitamente. Abaixo está o código de trabalho

function createStockZeroButton(){
    global $product;
    $theId = $product-> get_id();
    if(current_user_can( 'administrator' )){
        echo "<form action='' method='POST'>
                    <button type='submit' class='stockZeroButtonClass' name="."name"."$theId".">set Stock To 0 for id".$theId."</button>
             </form>";
        if(isset($_POST["name".$theId])){
            $con = mysqli_connect($server, $username, $password, $database);
            $database_request = "UPDATE wp_postmeta pm
            INNER JOIN wp_wc_product_meta_lookup pml
                ON pm.post_id =  pml.product_id
            SET pm.meta_value = '0', pml.stock_quantity = '0'
            WHERE pm.meta_key = '_stock' AND pm.post_id = '$theId'";
            $database_query = mysqli_query($con, $database_request);
            $database_request ="UPDATE wp_postmeta pm
                INNER JOIN wp_wc_product_meta_lookup pml
                    ON pm.post_id =  pml.product_id
                SET pm.meta_value = 'outofstock', pml.stock_status = 'outofstock'
                WHERE pm.meta_key = '_stock_status' AND pm.post_id = '$theId'";
            $database_query = mysqli_query($con, $database_request);
            $database_query = "INSERT IGNORE INTO wp_term_relationships (object_id, term_taxonomy_id)
            SELECT pml.product_id, (SELECT term_id FROM wp_terms WHERE slug = 'outofstock')
            FROM wp_wc_product_meta_lookup pml
            WHERE pml.stock_status = 'outofstock' AND pm.post_id = '$theId'";
            $database_query = mysqli_query($con, $database_request);
        }
    }
}



add_action('woocommerce_shop_loop_item_title','createStockZeroButton');

Gostaria agora de usar a classe $wpdb para fazer isso. Tentei este código abaixo 'de acordo' com esta resposta do SO , mas não consegui fazê-lo funcionar.

function createStockZeroButton(){
    global $product;
    $theId = $product-> get_id();
    if(current_user_can( 'administrator' )){
        echo "<form action='' method='POST'>
                    <button type='submit' class='stockZeroButtonClass' name="."name"."$theId".">set Stock To 0 for id".$theId."</button>
             </form>";
        if(isset($_POST["name".$theId])){
$update1 = $wpdb->query($wpdb->prepare("UPDATE wp_postmeta pm
            INNER JOIN wp_wc_product_meta_lookup pml
                ON pm.post_id =  pml.product_id
            SET pm.meta_value = '0', pml.stock_quantity = '0'
            WHERE pm.meta_key = '_stock' AND pm.post_id = '$theId'"));

$update2 = $wpdb->query($wpdb->prepare("UPDATE wp_postmeta pm
                INNER JOIN wp_wc_product_meta_lookup pml
                    ON pm.post_id =  pml.product_id
                SET pm.meta_value = 'outofstock', pml.stock_status = 'outofstock'
                WHERE pm.meta_key = '_stock_status' AND pm.post_id = '$theId'"));

$update3 = $wpdb->query($wpdb->prepare("INSERT IGNORE INTO wp_term_relationships (object_id, term_taxonomy_id)
            SELECT pml.product_id, (SELECT term_id FROM wp_terms WHERE slug = 'outofstock')
            FROM wp_wc_product_meta_lookup pml
            WHERE pml.stock_status = 'outofstock' AND pm.post_id = '$theId'"));
        }
    }
}

add_action('woocommerce_shop_loop_item_title','createStockZeroButton');

Como podemos obter uma consulta correta usando INNER JOIN e $wpdb como neste caso?

Também dei uma olhada no link do documento oficial , mas não consegui entender.

Eu tenho essas três entradas do tipo número onde você só pode adicionar um número e pode substituí-lo pressionando qualquer outro número entre 0 e 9. Eu tenho 2 eventlisteners nessas entradas o primeiro é poder alterar o valor das entradas pressionando um número entre 0 e 9 (usando 'keyup').
O segundo eventlistener existe para detectar a entrada e então calcular o total das três entradas, quando o total correto é calculado, um alerta é lançado. O que percebi é que se eu quiser um total de 27 por exemplo preciso somar 9 + 9 + 9 nas entradas.
Porém, se eu adicionar 9 + 8 + 9, mas sem excluir o 8 e apenas substituí-lo pressionando 9, não recebo o alerta. Para obter o total, melhor parece fazê-lo no ouvinte de eventos com 'keyup'.
Então por que isso? Ao pressionar o botão 9 ainda é um evento de entrada?

const element1 = document.querySelector('.element1')
let total = 0
let desiredTotal = 27

    let allInputs = Array.from(element1.getElementsByTagName('input'))
    allInputs.forEach((input)=>{
        input.style.border = '2px solid blue'
        input.addEventListener('keyup', (e)=>{
            if(e.target.value.length === 1 && parseFloat(e.key) >= 0 && parseFloat(e.key) <=9){
                    e.target.value = e.key
            }
        })
    })


    allInputs.forEach((input)=>{
        let value
        input.addEventListener('input', (e)=>{
            let value = parseFloat(input.value)
            total += value
            console.log(total)
            if(total === 27) alert('you won!')
        })

    })

input{
    width: 2ch;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  appearance: textfield;
}

<body>
    <div class="element1">
        <input type="number" name="" id="input1" onKeyPress="if(this.value.length===1 || event.key == 'e') {return false}">
        <input type="number" name="" id="input2" onKeyPress="if(this.value.length===1 || event.key == 'e') {return false}">
        <input type="number" name="" id="input3"onKeyPress="if(this.value.length===1 || event.key == 'e') {return false}">
    </div>
    <p>Try to obtain a total of 27</p>
    <p>Try to place 9 9 and then 9 you get the alert</p>
    <p>Try to place 9 6 and then 9 but then change(without deleting) but pressing on the 6 containing input the number 9 you won't get the alert</p>
</body>

Conforme indicado na pergunta (talvez não formulado corretamente), estou tentando obter o índice de uma matriz para a qual a diferença entre cada um de seus elementos e o elemento correspondente ao índice da segunda matriz é <0. Talvez o código abaixo explique mais o que estou tentando obter. Consegui obter os índices desejados usando a função flatMap() mas não consegui usando a função filter() que acho mais apropriada neste caso (sempre pegando aqui o elemento mas não o índice)

let array1 = ['524', '587', '034', '816', '65', '7']
let array2 = ['3', '0', '33', '4', '193', '13']



function getSumOfArrays(array1, array2){
    let sumArray = array1.map((elem,idx)=>parseFloat(elem) - parseFloat(array2[idx]))
    return sumArray
}

function getIdxNegativeDiff1(array1, array2){   //this function works   
    let negatifIdx1 = array1.flatMap((elem,idx)=>{return parseFloat(elem)-parseFloat(array2[idx]) < 0 ? idx : [] })
    return negatifIdx1
}

function getIdxNegativeDiff2(array1, array2){          
    let negatifIdx2 = array1.filter((elem,idx)=>{ return (parseFloat(elem)-parseFloat(array2[idx]) < 0 ? idx : '')})
    return negatifIdx2
}



console.log(array1)
console.log(array2)
console.log(getSumOfArrays(array1, array2))
console.log(getIdxNegativeDiff1(array1, array2))
console.log(getIdxNegativeDiff2(array1, array2))

Tentei muitas possibilidades, mas não consegui chegar à solução com filtro. Alguém poderia com a solução

Estou usando um display:list-item para o pseudoelemento div::before. Podemos estilizar a forma do marcador como disco ou quadrado...

.calendar{
    display: block;
    position: relative;
    width: 100px;
    aspect-ratio: 1;
    background-color: green;
}

.calendar::before{
    content:"Reserved";
    display: list-item;
    position: absolute;
    bottom: 0;
    right: -100%;
    color: black;
    list-style-type: disc;      /* or list-style-type: square; */
}

<div class="calendar"></div>

Podemos alterar a cor do marcador sem alterar a cor do conteúdo (sem usar imagem em estilo de lista)?

Gostaria de fazer 2 chamadas de API Fetch para transferir dados do meu arquivo JS para o meu arquivo PHP. A primeira chamada é condicional e transfere um array de dados (que é tratado corretamente no meu arquivo PHP). A segunda chamada de API é uma espécie de timer (usando a função setInterval) que desejo usar para verificar se o cliente ainda está no navegador ( sim, esse é o objetivo final!). As 2 chamadas estão funcionando corretamente (não recebem erros e podem obter dados corretamente do primeiro array). O problema é que não sei como obter os dados do timer separadamente em uma variável no meu arquivo PHP (que irei em seguida enviar no array)! Você pode mostrar o caminho (ainda sou iniciante no Fetch ..)

Aqui está o código no meu arquivo JS

primeira chamada

if(...Button pressed...){
    fetch("cart.php",{
        "method":"POST",
        "Headers":{
            "content-type":"application/json; charset=utf-8"
        },
        "body":JSON.stringify(arrayOrderedProducts)
    })
    .then(function(response){
        return response.text()
    })
    .then(function(data){
        console.log(data)
    })
}

Segunda Chamada

setInterval(()=>{
    timer+=1
},1000)


function checkConnection(){
    fetch ("cart.php",{
        method:"Post",
        body :timer
    })
    .then(
        response=>{
        return response.text()})
    .then(
        response=>{
            console.log(timer)
    })
    .catch(
        error=>{
            console.log(error)
    })
}

let intervalConCheck = setInterval(()=>checkConnection(),1000)

Aqui está o código no meu arquivo PHP

<?php

if(isset($_POST)){
    $data = file_get_contents("php://input");
    $orders = json_decode($data);
    ...rest of code that retrieve data in arrayOrderedProducts...

}
?>

Estou tentando alterar as cores usando uma função e seus parâmetros com string de modelo, não consigo descobrir a maneira correta de fazer isso. Alguém pode ajudar?

function colorize(choice,color){
    choice.style.transition = 'all 450ms'
    choice.style.borderColor = `"${color}"`
    setTimeout(()=> choice.style.borderColor = 'rgba(60, 70, 127, 0.2)','700')
}
colorize(userDomChoice,green)