WordPress.org
Get WordPress

Plugin Directory

Changeset 3312721


Ignore:
Timestamp:
06/16/2025 07:10:06 PM (10 months ago)
Author:
Harmonic_Design
Message:

update to 1.6

Location:
hdforms
Files:
22 added
5 edited

Legend:

Unmodified
Added
Removed

  • hdforms/trunk/includes/css/style-full.css

    r2462445 r3312721  
    77}
    88.hdf-form {
    9     overflow: hidden;
    109    max-width: 800px;
    1110    margin: 0 auto;
    … …  
    8281    border: 2px dashed red;
    8382}
    84 .hdf-item-checkbox .hdf-options-check input[type="checkbox"]:focus + label::after,
    85 .hdf-item-radio .hdf-options-check input[type="checkbox"]:focus + label::after {
    86     box-shadow: 0 0 0 2px #007cba;
    87     outline: 0;
    88 }
    89 .hdf-check-row {
    90     margin-top: 1em;
    91     line-height: 1;
    92     display: grid;
    93     grid-template-columns: max-content 1fr;
    94     grid-gap: 1em;
    95 }
    96 .hdf-item-checkbox .hdf-options-check,
    97 .hdf-item-radio .hdf-options-check {
    98     font-size: 24px;
    99 }
    100 .hdf-item-checkbox .hdf-options-check input[type="checkbox"],
    101 .hdf-item-radio .hdf-options-check input[type="checkbox"] {
     83
     84.hdf_label_row {
     85    display: block;
     86    cursor: pointer;
     87    color: #2d2d2d !important;
     88    line-height: 1.4;
     89    padding: 0.15em 0;
     90    max-width: max-content;
     91}
     92
     93.hdf-options-radio {
     94    display: inline-block;
     95    margin-right: 12px;
     96    top: 4px;
     97    position: relative;
     98}
     99
     100.hdf-options-radio input[type="checkbox"] {
    102101    position: absolute;
    103102    opacity: 0;
    104103}
    105 .hdf-item-checkbox .hdf-options-check label,
    106 .hdf-item-radio .hdf-options-check label {
     104
     105.hdf-options-radio .hdf_toggle {
    107106    width: 2em;
    108107    height: 1em;
    109108    position: relative;
    110109    cursor: pointer;
    111     display: block;
    112     font-size: 22px !important;
    113 }
    114 .hdf-item-radio .hdf-options-check label:before {
     110    display: block !important;
     111    font-size: 1em !important;
     112    margin: 0;
     113}
     114
     115.hdf-options-radio .hdf_toggle::before {
    115116    content: "";
    116117    position: absolute;
    … …  
    123124    box-shadow: inset 0 1px 1px rgb(0 0 0 / 50%);
    124125}
    125 .hdf-item-radio .hdf-options-check label:after {
     126
     127.hdf-options-radio .hdf_toggle::after {
    126128    content: "";
    127129    position: absolute;
    … …  
    136138    z-index: 2;
    137139}
    138 .hdf-item-radio .hdf-options-check input[type="checkbox"]:checked + label:before {
     140
     141.hdf-options-radio input[type="checkbox"]:checked + .hdf_toggle::before {
    139142    background: #72c474;
    140     box-shadow: inset 0 1px 1px rgba(84, 152, 140, 0.5);
    141 }
    142 .hdf-item-radio .hdf-options-check input[type="checkbox"]:checked + label:after {
     143    box-shadow: inset 0px 1px 1px rgba(84, 152, 140, 0.5);
     144}
     145
     146.hdf-options-radio input[type="checkbox"]:checked + .hdf_toggle::after {
    143147    animation: hdf_switch-on 0.2s ease-out;
    144148    left: 1.1em;
    145149    background: #efefef;
    146150}
    147 .hdf-item-checkbox .hdf-options-check label:before {
     151
     152.hdf-options-checkbox {
     153    display: inline-block;
     154    margin-right: 12px;
     155    top: 4px;
     156    position: relative;
     157}
     158
     159.hdf-options-checkbox input[type="checkbox"] {
     160    position: absolute;
     161    opacity: 0;
     162}
     163
     164.hdf-options-checkbox .hdf_toggle {
     165    width: 2em;
     166    height: 1em;
     167    position: relative;
     168    cursor: pointer;
     169    display: block !important;
     170    font-size: 1em !important;
     171    margin: 0;
     172}
     173
     174.hdf-options-checkbox .hdf_toggle::before {
    148175    content: "";
    149176    position: absolute;
    150177    width: 2em;
    151     height: 1.2em;
     178    height: 1em;
    152179    left: 0.1em;
    153180    transition: background 0.1s ease;
    … …  
    156183    box-shadow: inset 0 1px 1px rgb(0 0 0 / 50%);
    157184}
    158 .hdf-item-checkbox .hdf-options-check label:after {
     185
     186.hdf-options-checkbox .hdf_toggle::after {
    159187    content: "";
    160188    position: absolute;
    161     width: 1em;
    162     height: 1em;
     189    width: 0.8em;
     190    height: 0.8em;
    163191    border-radius: 3px;
    164192    left: 0.2em;
    … …  
    170198    z-index: 2;
    171199}
    172 .hdf-item-checkbox .hdf-options-check input[type="checkbox"]:checked + label:before {
     200
     201.hdf-options-checkbox input[type="checkbox"]:checked + .hdf_toggle::before {
    173202    background: #72c474;
    174     box-shadow: inset 0 1px 1px rgba(84, 152, 140, 0.5);
    175 }
    176 .hdf-item-checkbox .hdf-options-check input[type="checkbox"]:checked + label:after {
     203    box-shadow: inset 0px 1px 1px rgba(84, 152, 140, 0.5);
     204}
     205
     206.hdf-options-checkbox input[type="checkbox"]:checked + .hdf_toggle::after {
    177207    animation: hdf_switch-on 0.2s ease-out;
     208    left: initial;
    178209    right: 0.1em;
    179     left: inherit;
    180210    background: #efefef;
    181211}
     212
     213@keyframes hdf_switch-on {
     214    50% {
     215        transform: scaleX(1.5);
     216    }
     217}
     218
     219@keyframes hdf_switch-off {
     220    50% {
     221        transform: scaleX(1.3);
     222    }
     223}
     224
    182225.hdf-item-date div label {
    183226    font-size: 0.9em;

  • hdforms/trunk/includes/functions.php

    r3024231 r3312721  
    134134    }
    135135
     136
    136137    $hdf_id = $_POST["hdf"];
    137138    $hdf_id = str_replace("hdf-", "", $hdf_id);
    138139    $hdf_id = intVal($hdf_id);
    139140
    140     $data = $_POST["data"];
     141    $data = stripslashes($_POST["data"]);
     142    $data = json_decode($data, true);
    141143
    142144    $hdf_form = get_post_meta($hdf_id, "form_data", true);
    … …  
    156158    $data = hdf_sanitize_by_type($data, $hdf_blocks);
    157159
    158     do_action("hdf_after_server", $data, $hdf_form);
    159     $action_data = apply_filters("hdf_after_server", $data, $hdf_form);
     160    $action_data = do_action("hdf_after_server", $data, $hdf_form);
     161    //$action_data = apply_filters("hdf_after_server", $data, $hdf_form);
    160162
    161163    if (!$action_data["hdf_form"]) {
    … …  
    546548        'hdf_script',
    547549        plugins_url('js/script.js', __FILE__),
    548         array('jquery'),
     550        array(),
    549551        HDF_PLUGIN_VERSION,
    550552        true

  • hdforms/trunk/includes/js/script.js

    r3001345 r3312721  
    634634                if (typeof (d.options != "undefined")) {
    635635                    for (let i = 0; i < d.options.length; i++) {
    636                         options += `<div class="hdf-options-check">
    637                             <input type="checkbox" id="${d.name}_${i}" class = "hdf-radio-input" data-id = "${d.name}" value="${d.options[i].value}" name="${d.name}_${i}"/>
    638                             <label for="${d.name}_${i}" data-title="null" title="null"></label>
    639                         </div>
    640                         <label class="non-block" for="${d.name}_${i}" data-title="null" title="null">${d.options[i].label}</label>`;
     636                        options += `<label class="hdf_label_row" id="hdf_label_${d.name}_${i}" data-type="radio" for="hdf_option_${d.name}_${i}">
     637    <div class="hdf-options-radio">
     638        <input type="checkbox" aria-labelledby="hdf_label_${d.name}_${i}" data-id = "${d.name}" autocomplete="off" title="${d.options[i].label}" class="hdf_option hdf-radio-input" data-type="radio" value="${d.options[i].value}" name="hdf_option_${d.name}_${i}" id="hdf_option_${d.name}_${i}" />
     639        <span class="hdf_toggle"></span>
     640    </div>
     641    <span class="hdf_aria_label"> ${d.options[i].label} </span>
     642</label>`;
    641643                    }
    642644                }
    … …  
    648650                if (typeof (d.options != "undefined")) {
    649651                    for (let i = 0; i < d.options.length; i++) {
    650                         options += `<div class="hdf-options-check">
    651                             <input type="checkbox" id="${d.name}_${i}" class = "hdf-checkbox-input" data-id = "${d.name}" value="${d.options[i].value}" name="${d.name}_${i}"/>
    652                             <label for="${d.name}_${i}" data-title="null" title="null"></label>
    653                         </div>
    654                         <label class="non-block" for="${d.name}_${i}" data-title="null" title="null">${d.options[i].label}</label>`;
     652                        // ${d.name}_${i}
     653                        // ${d.options[i].label}
     654                        // ${d.options[i].value}
     655
     656                        options += `<label class="hdf_label_row" id="hdf_label_${d.name}_${i}" data-type="checkbox" for="hdf_option_${d.name}_${i}">
     657    <div class="hdf-options-checkbox">
     658        <input type="checkbox" aria-labelledby="hdf_label_${d.name}_${i}" data-id = "${d.name}" autocomplete="off" title="${d.options[i].label}" class="hdf_option hdf-checkbox-input" data-type="checkbox" value="${d.options[i].value}" name="hdf_option_${d.name}_${i}" id="hdf_option_${d.name}_${i}" />
     659        <span class="hdf_toggle"></span>
     660    </div>
     661    <span class="hdf_aria_label"> ${d.options[i].label} </span>
     662</label>`;
    655663                    }
    656664                }
    … …  
    13241332    },
    13251333    send: async function (id) {
    1326         // send data
    1327         jQuery.ajax({
    1328             type: "POST",
    1329             data: {
    1330                 action: "hdf_submit_form",
    1331                 hdf: id,
    1332                 data: HDF.VARS[id].data,
    1333             },
    1334             url: hdf_ajaxurl,
    1335             success: function (data) {
    1336                 let form = document.getElementById(id);
    1337                 console.log(data);
    1338                 data = JSON.parse(data);
    1339                 if (data.status == "error") {
    1340                     if (HDF.VARS[id].message) {
    1341                         form.getElementsByClassName("hdf-message")[0].innerHTML = `<p>${data.message}</p>`;
    1342                         form.getElementsByClassName("hdf-message")[0].style.display = "block";
    1343                         submit.style.display = "block";
    1344                     }
    1345                 } else if (data.status == "success") {
    1346                     if (HDF.VARS[id].message) {
    1347                         data.message = decodeURIComponent(data.message);
    1348                         form.getElementsByClassName("hdf-message")[0].innerHTML = `<p>${data.message}</p>`;
    1349                         form.getElementsByClassName("hdf-message")[0].style.display = "block";
    1350                     }
    1351                 } else {
    1352                     form.getElementsByClassName("hdf-message")[0].innerHTML = `<p>an unknown error occured</p>`;
    1353                     form.getElementsByClassName("hdf-message")[0].style.display = "block";
    1354                     submit.style.display = "block";
    1355                 }
    1356             },
    1357             complete: function () {
    1358                 //
    1359             },
    1360             error: function () {
     1334        const formdata = new FormData();
     1335        formdata.append("action", "hdf_submit_form");
     1336        formdata.append("hdf", id);
     1337        formdata.append("data", JSON.stringify(HDF.VARS[id].data));
     1338
     1339        let res = await fetch(hdf_ajaxurl, {
     1340            method: "POST",
     1341            credentials: "same-origin",
     1342            body: formdata,
     1343        });
     1344        res = await res.json();
     1345        console.log(res);
     1346
     1347        let form = document.getElementById(id);
     1348
     1349        if (typeof res.status == "undefined") {
     1350            submit.style.display = "block";
     1351            alert("There was an unknown server error. Form was not sent.");
     1352            return;
     1353        }
     1354
     1355        if (res.status == "error") {
     1356            if (HDF.VARS[id].message) {
     1357                form.getElementsByClassName("hdf-message")[0].innerHTML = `<p>${res.message}</p>`;
     1358                form.getElementsByClassName("hdf-message")[0].style.display = "block";
    13611359                submit.style.display = "block";
    1362                 alert("There was an error sending your form");
    1363             },
    1364         });
     1360            }
     1361            return;
     1362        }
     1363
     1364        if (res.status == "success") {
     1365            if (HDF.VARS[id].message) {
     1366                res.message = decodeURIComponent(res.message);
     1367                form.getElementsByClassName("hdf-message")[0].innerHTML = `<p>${res.message}</p>`;
     1368                form.getElementsByClassName("hdf-message")[0].style.display = "block";
     1369            }
     1370            return;
     1371        }
     1372
     1373        form.getElementsByClassName("hdf-message")[0].innerHTML = `<p>an unknown error occured</p>`;
     1374        form.getElementsByClassName("hdf-message")[0].style.display = "block";
     1375        submit.style.display = "block";
    13651376    },
    13661377    submit: async function (form) {

  • hdforms/trunk/index.php

    r3024231 r3312721  
    66    * Author: Harmonic Design
    77    * Author URI: https://harmonicdesign.ca/
    8     * Version: 1.5
     8    * Version: 1.6
    99*/
    10 
    11 
    12 // TODO: hook into builder and script to allow custom blocks.
    13 //       - HDF.blocks hook
    14 //       - construct
    15 //       - validate
    16 //       - sanitize as type
    17 // Create hidden field. will hidden fields send (cause not visible)?
    18 // allow custom blocks/elements filterable
    19 // use visual edtor, uploader, hidden, and post/get inside new pro addon
    2010
    2111if (!defined('ABSPATH')) {
    … …  
    2414
    2515if (!defined('HDF_PLUGIN_VERSION')) {
    26     define('HDF_PLUGIN_VERSION', 20240119);
     16    define('HDF_PLUGIN_VERSION', 20250618);
    2717}
    2818

  • hdforms/trunk/readme.txt

    r3242228 r3312721  
    44Requires at least: 5.2.0
    55Tested up to: 6.7.2
    6 Stable tag: 1.5
     6Stable tag: 1.6
    77Requires PHP: 7.0
    88License: GPLv2 or later
    … …  
    9999
    100100== Changelog ==
     101= 1.6 =
     102* June 16 2025
     103* Removal of jQuery dependency on frontend
     104* Better accessibility for radio and checkboxes
     105
    101106= 1.5 =
    102107* Feb 18 2024
Note: See TracChangeset for help on using the changeset viewer.