Thứ Tư, 9 tháng 9, 2026

Datetime - hiện thời gian



date_default_timezone_set('Asia/Ho_Chi_Minh');

$time = date('g:i A');

$day  = date('l');

$date = date('j');

$month = date('n');

$days = array(

  'Monday'    => 'Thứ Hai',

  'Tuesday'   => 'Thứ Ba',

  'Wednesday' => 'Thứ Tư',

  'Thursday'  => 'Thứ Năm',

  'Friday'    => 'Thứ Sáu',

  'Saturday'  => 'Thứ Bảy',

  'Sunday'    => 'Chủ Nhật'

);

$ampm = date('A') == 'AM' ? 'sáng' : 'chiều';

$result = date('g:i') . ' ' . $ampm . ' , '

. $days[$day]

. ' ngày ' . $date

. ' tháng ' . $month

. ' năm ' . date('Y');

<div class="times-show">'.$result.'</div>

Thứ Ba, 8 tháng 9, 2026

JS Thời Gian Đếm Ngược


 ĐẾM NGƯỢC ( 10S )

if (empty($client) || !isset($_SESSION["client"])) {

    include("header.php");

    ?>

    <style type="text/css">

        .cart-empty-box {

            max-width: 550px;

            margin: 60px auto;

            padding: 40px 30px;

            background: #ffffff;

            border-radius: 16px;

            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);

            text-align: center;

            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;

        }

        .cart-empty-box h2 {

            color: #2c3e50;

            font-size: 22px;

            margin-bottom: 12px;

            font-weight: 700;

        }

        .cart-empty-box p {

            color: #666;

            font-size: 15px;

            margin-bottom: 24px;

        }

        .timer-wrapper {

            display: inline-block;

            background: #f0fdf4;

            border: 1px solid #bbf7d0;

            border-radius: 50px;

            padding: 8px 20px;

            margin-bottom: 25px;

        }

        .timer-count {

            color: #16a34a;

            font-weight: 800;

            font-size: 20px;

        }

        .btn-redirect {

            display: inline-block;

            padding: 12px 28px;

            background-color: #16a34a;

            color: #ffffff !important;

            border-radius: 30px;

            text-decoration: none;

            font-weight: 600;

            font-size: 14px;

            box-shadow: 0 4px 12px rgba(22, 163, 74, 0.25);

            transition: all 0.3s ease;

        }

        .btn-redirect:hover {

            background-color: #15803d;

            box-shadow: 0 6px 16px rgba(22, 163, 74, 0.35);

        }

    </style>

    <div class="cart-empty-box">

        <h2>Đơn hàng đã được xử lý hoặc giỏ hàng rỗng!</h2>

        <p>Bạn đã hoàn tất đặt hàng hoặc chưa chọn sản phẩm mới.</p>

        <div class="timer-wrapper">

            Đang quay về trang chủ sau <span id="countdown" class="timer-count">10</span> giây

        </div>

        <div>

            <a href="<?php echo $site_live; ?>" class="btn-redirect">Quay về trang chủ ngay</a>

        </div>

    </div>

    <script type="text/javascript">

        (function() {

            var timeLeft = 10;

            var timerElement = document.getElementById('countdown');

            var countdownTimer = setInterval(function() {

                timeLeft--;

                if (timerElement) {

                    timerElement.textContent = timeLeft;

                }

                if (timeLeft <= 0) {

                    clearInterval(countdownTimer);

                    window.location.href = "<?php echo $site_live; ?>";

                }

            }, 1000);

        })();

    </script>

    <?php

    include("footer.php");

    exit();

}

Thứ Tư, 2 tháng 9, 2026

Thiết lập get dữ liệu đuôi.php cùng Module PHP

 


Đang sử dụng file Edit_Supplier.php và gọi đến file upload.momento.php

**** JS

function uploadMomentoFile_<?php echo $uniqueId; ?>() {

        

    var form = document.getElementById('form_<?php echo $uniqueId; ?>');

    var formData = new FormData(form);

    var status = document.getElementById('status_<?php echo $uniqueId; ?>');

    var targetUrl = '<?php echo rtrim($site_live, "/"); ?>/modules.php?name=Shoping&file=upload_momento';

    status.textContent = "Đang lưu ảnh...";

    fetch(targetUrl, {

        method: 'POST',

        body: formData

    })

    .then(function(response) {

        return response.text(); // Lấy dữ liệu thô dạng text

    })

    .then(function(text) {

        // Tách lọc lấy phần chuỗi JSON chuẩn {...} phòng trường hợp bị dính HTML

        var jsonStart = text.indexOf('{');

        var jsonEnd = text.lastIndexOf('}') + 1;

        

        if (jsonStart !== -1 && jsonEnd !== -1) {

            var cleanJson = text.substring(jsonStart, jsonEnd);

            var data = JSON.parse(cleanJson);


            if (data.success) {

                status.textContent = "Lưu thành công: " + data.filename;

                loadPanorama_<?php echo $uniqueId; ?>(data.url + '?v=' + new Date().getTime());

            } else {

                alert('Lỗi: ' + data.message);

                status.textContent = "Lưu thất bại!";

            }

        } else {

            console.error("Dữ liệu server trả về không phải JSON:", text);

            alert("Lỗi server trả về dữ liệu không hợp lệ! Kiểm tra Console (F12)");

            status.textContent = "Lỗi phản hồi!";

        }

    })

    .catch(function(err) {

        console.error(err);

        alert('Lỗi kết nối máy chủ!');

        status.textContent = "Lỗi tải lên!";

    });

}

Thứ Năm, 20 tháng 8, 2026

smooth scroll

Smooth Scroll

 
<button class="smooth-scroll">

    Liên hệ với nhà cung cấp

</button>

// +---------------------+

// | Click div.smooth-scroll chạy xuống div.inquiry-msg-wrapper

// +---------------------+

<div class="inquiry-msg-wrapper">

    Content suppliers    

</div>


**** CSS

html {

  scroll-behavior: smooth;

}

.btn-inquiry {

  cursor: pointer;

  transition: transform 0.2s ease, opacity 0.2s ease;

}


.btn-inquiry:hover {

  opacity: 0.9;

  transform: translateY(-2px); 

  /* Hiệu ứng nhích nhẹ nút khi di chuột */

}


**** JavaScript

$(document).ready(function() {

    $('.smooth-scroll').on('click', function(e) {

        e.preventDefault();        

        // Lấy vị trí top của phần tử mục tiêu

        var targetOffset = $('.inquiry-msg-wrapper').offset().top;        

        // Nếu menu của bạn là menu cố định (fixed header), hãy trừ đi chiều cao menu tại đây (ví dụ: - 70)

        var headerHeight = 0; 

        // Thực hiện hiệu ứng cuộn mượt trong 800ms

        $('html, body').animate({

            scrollTop: targetOffset - headerHeight

        }, 800);

    });

});

360° Virtual Tour


 

Để làm hình ảnh panorama 360 độ và tích hợp trình xem tương tác (360° Virtual Tour) giống trong ảnh lên website, bạn cần thực hiện theo 2 bước chính dưới đây.

Bước 1: Chụp và chuẩn bị ảnh 360 độ (Equirectangular)

  • Chụp bằng điện thoại/máy ảnh: Sử dụng ứng dụng chụp Panorama 360 (Google Street View, Polycam, Google Camera) hoặc chụp từ flycam/máy ảnh panorama chuyên dụng (Insta360, Ricoh Theta).

  • Định dạng ảnh: Xuất ảnh dưới dạng panorama toàn cảnh góc nhìn 360° × 180° (thường có tỉ lệ 2:1, định dạng .jpg hoặc .png).

Bước 2: Nhúng tính năng tương tác 360° vào Website

Bạn có thể chọn 1 trong 2 cách triển khai tùy thuộc vào nền tảng website của bạn:

Cách 1: Sử dụng thư viện JavaScript (Dành cho mã nguồn tự viết / HTML-JS) Dùng thư viện mã nguồn mở Pannellum (miễn phí, siêu nhẹ và phổ biến nhất).

  1. Thêm thư viện vào tệp HTML của bạn:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/pannellum@2.5.6/build/pannellum.css"/>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pannellum@2.5.6/build/pannellum.js"></script>
  1. Tạo thẻ div chứa khung nhìn và thêm đoạn script cấu hình:

<div id="panorama" style="width: 100%; height: 400px;"></div>

<script>
pannellum.viewer('panorama', {
    "type": "equirectangular",
    "panorama": "duong-dan-den-anh-360.jpg",
    "autoLoad": true,
    "autoRotate": -2
});
</script>

Cách 2: Sử dụng Plugin hoặc Nền tảng có sẵn (Không cần viết code)

  • Website WordPress: Cài đặt các plugin như WP VR - 360 Panorama Tour hoặc iPanorama 360. Bạn chỉ cần tải ảnh 360 lên, plugin sẽ tự tạo trình xem tương tác và cung cấp Shortcode để chèn vào bất kỳ đâu trên trang.

  • Nền tảng nhúng đám mây: Tải ảnh lên các dịch vụ như Kuula.co hoặc Momento360, sau đó sao chép đoạn mã <iframe> được tạo tự động và dán vào website.