added timer event theme part

resources/views/segments/index/TimerEvent/TimerEvent.blade.php

@@ -0,0 +1,32 @@
+<section class="TimerEvent live-setting" data-live="{{$data->area_name.'_'.$data->part}}" >
+    <div class="{{gfx()['container']}}">
+
+        <div class="contents">
+            <h4 class="my-3 text-center">
+                {{getSetting($data->area_name.'_'.$data->part.'_title')}}
+            </h4>
+            <div class="row p-0">
+                <div class="col-md-4">
+                    <img src="{{asset('upload/images/'.$data->area_name.'.'.$data->part.'.jpg')}}" alt="next marasem"
+                         class="img-fluid">
+                </div>
+                <div class="col-md-8">
+                    <div id="countdown">
+                        <div id="dcd" data-text="{{__("Day(s)")}}">0</div>
+                        <div id="hcd" data-text="{{__("Hour(s)")}}">0</div>
+                        <div id="mcd" data-text="{{__("Minute(s)")}}">0</div>
+                        <div id="scd" data-text="{{__("Second(s)")}}">0</div>
+                    </div>
+                    <div class="pe-5">
+                        {!! getSetting($data->area_name.'_'.$data->part.'_last') !!}
+
+                        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate dignissimos dolores
+                        doloribus eaque expedita facilis ipsa itaque maiores minus nam neque, porro ratione sapiente
+                        sint unde ut vero voluptatibus voluptatum.
+                    </div>
+                </div>
+            </div>
+        </div>
+        <input type="hidden" id="count-down-time-timestamp" value="{{ getSetting($data->area_name.'_'.$data->part.'_date')}}">
+    </div>
+</section>

resources/views/segments/index/TimerEvent/TimerEvent.js

@@ -0,0 +1,38 @@
+function startCountdown(unixTimestamp) {
+
+    function updateCountdown() {
+        const now = Math.floor(Date.now() / 1000); // Current time in seconds
+        const remainingTime = unixTimestamp - now;
+
+        if (remainingTime <= 0) {
+            countdownElement.innerHTML = "Time's up!";
+            clearInterval(interval);
+        } else {
+            const seconds = remainingTime % 60;
+            const minutes = Math.floor((remainingTime / 60) % 60);
+            const hours = Math.floor((remainingTime / 3600) % 24);
+            const days = Math.floor(remainingTime / 86400);
+
+            document.querySelector('#dcd').innerText = numFixer(days);
+            document.querySelector('#hcd').innerText = numFixer(hours);
+            document.querySelector('#mcd').innerText = numFixer(minutes);
+            document.querySelector('#scd').innerText = numFixer(seconds);
+        }
+    }
+
+    updateCountdown(); // Initial call to display immediately
+    const interval = setInterval(updateCountdown, 1000);
+}
+
+function numFixer(x) {
+    if (x < 10) {
+        return '0' + x;
+    }
+    return x.toString();
+}
+
+window.addEventListener('load', function () {
+    if  (document.querySelector('#count-down-time-timestamp') != null){
+    startCountdown(parseInt(document.querySelector('#count-down-time-timestamp').value));
+    }
+});

resources/views/segments/index/TimerEvent/TimerEvent.json

@@ -0,0 +1,10 @@
+{
+    "name": "TimerEvent",
+    "version": "1.0",
+    "author": "xStack",
+    "email": "xshop@xstack.ir",
+    "license": "GPL-3.0-or-later",
+    "url": "https:\/\/xstack.ir",
+    "author_url": "https:\/\/4xmen.ir",
+    "packages": []
+}

resources/views/segments/index/TimerEvent/TimerEvent.php

@@ -0,0 +1,64 @@
+<?php
+
+namespace Resources\Views\Segments;
+
+use App\Models\Part;
+use App\Models\Setting;
+
+class TimerEvent
+{
+    public static function onAdd(Part $part = null)
+    {
+
+        $setting = new Setting();
+        $setting->section = 'theme';
+        $setting->key = $part->area_name . '_' . $part->part.'_title';
+        $setting->value = 'Next event title';
+        $setting->type = 'TEXT';
+        $setting->size = 6;
+        $setting->title =  $part->area_name . ' ' . $part->part .' modern categories title';
+        $setting->save();
+
+        $setting = new Setting();
+        $setting->section = 'theme';
+        $setting->key = $part->area_name . '_' . $part->part.'_jpg';
+        $setting->value = null;
+        $setting->type = 'FILE';
+        $setting->size = 6;
+        $setting->title =  $part->area_name . ' ' . $part->part.' next image';
+        $setting->save();
+
+        $setting = new Setting();
+        $setting->section = 'theme';
+        $setting->key = $part->area_name . '_' . $part->part.'_date';
+        $setting->value = strtotime('next friday');
+        $setting->type = 'DATETIME';
+        $setting->size = 12;
+        $setting->title =  $part->area_name . ' ' . $part->part.' next date time';
+        $setting->save();
+
+        \File::copy(__DIR__.'/../../default-assets/bg.jpg',public_path('upload/images/').$part->area_name . '.' . $part->part.'.jpg');
+
+        $setting = new Setting();
+        $setting->section = 'theme';
+        $setting->key = $part->area_name . '_' . $part->part.'_last';
+        $setting->value = 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate dignissimos dolores
+                        doloribus eaque expedita facilis ipsa itaque maiores minus nam neque, porro ratione sapiente
+                        sint unde ut vero voluptatibus voluptatum.';
+        $setting->size = 12;
+        $setting->title =  $part->area_name . ' ' . $part->part. ' last content';
+        $setting->type = 'EDITOR';
+        $setting->save();
+    }
+    public static function onRemove(Part $part = null)
+    {
+        Setting::where('key',$part->area_name . '_' . $part->part.'_jpg')->first()?->delete();
+        Setting::where('key',$part->area_name . '_' . $part->part.'_last')->first()?->delete();
+        Setting::where('key',$part->area_name . '_' . $part->part.'_title')->first()?->delete();
+        Setting::where('key',$part->area_name . '_' . $part->part.'_date')->first()?->delete();
+    }
+    public static function onMount(Part $part = null)
+    {
+        return $part;
+    }
+}

resources/views/segments/index/TimerEvent/TimerEvent.scss

@@ -0,0 +1,42 @@
+.TimerEvent {
+    // scss
+    [class^='col']{
+        position: relative;
+    }
+
+    #countdown{
+        position: absolute;
+        inset-inline-end: 1rem;
+        font-size: 25px;
+        width: 50px;
+        text-align: center;
+        top: 1rem;
+    }
+
+    #dcd,#hcd,#mcd,#scd{
+        position: relative;
+        margin-bottom: 2rem;
+        &:after{
+            font-size: 12px;
+            position: absolute;
+            top: 100%;
+            right: 0;
+            left: 0;
+        }
+    }
+    #dcd:after{
+        content: attr(data-text);
+    }
+    #hcd:after{
+        content: attr(data-text);
+
+    }
+    #mcd:after{
+        content: attr(data-text);
+
+    }
+    #scd:after{
+        content: attr(data-text);
+
+    }
+}