Untitled

 avatar
unknown
plain_text
25 days ago
26 kB
1
Indexable
import 'dart:async';

import 'package:carousel_slider/carousel_slider.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:shimmer/shimmer.dart';
import '../constants/painter.dart';

class eventCarousel extends StatefulWidget {
  const eventCarousel({super.key});
  @override
  State<eventCarousel> createState() => _eventCarouselState();
}

class _eventCarouselState extends State<eventCarousel> {
  Timer? _timer;

  @override
  void dispose() {
    _timer?.cancel();
    super.dispose();
  }

  // Timer to refresh the countdown every second
  void _startCountdown() {
    _timer = Timer.periodic(const Duration(seconds: 1), (timer) {
      setState(() {});
    });
  }

  // Format the duration into days, hours, minutes, and seconds
  // Format the duration into days, hours, and minutes
  String _formatDuration(Duration duration) {
    final int days = duration.inDays;
    final int hours = duration.inHours.remainder(24);
    final int minutes = duration.inMinutes.remainder(60);

    return '${days.toString().padLeft(2, '0')}d : ${hours.toString().padLeft(2, '0')}h : ${minutes.toString().padLeft(2, '0')}m';
  }

  @override
  void initState() {
    super.initState();
    _fetchEvents();
    _startCountdown();
  }

  // Calculate the remaining time until the event
  Duration _calculateRemainingTime(DateTime eventTime) {
    final DateTime currentTime = DateTime.now();
    return eventTime.difference(currentTime);
  }

  List<Map<String, dynamic>> events = [];

  void _fetchEvents() async {
    FirebaseFirestore.instance.collection('nights').get().then((querySnapshot) {
      List<Map<String, dynamic>> eventList = [];
      for (var doc in querySnapshot.docs) {
        Map<String, dynamic> data = doc.data();
        eventList.add(data);
      }
      setState(() {
        events = eventList;
      });
    });
  }


  @override
  Widget build(BuildContext context) {
    double screenheight= MediaQuery.of(context).size.height;
    double screenwidth= MediaQuery.of(context).size.width;
    return Center(
      child: CarouselSlider(
        options: CarouselOptions(
          height: (450 / 949.3333333333334) * screenheight, // Carousel height
          autoPlay: false,  // Auto slide
          enlargeCenterPage: true,  // Zoom effect on the center item
          aspectRatio: 16 / 9,
          autoPlayInterval: Duration(seconds: 3),  // Time between slides
          viewportFraction: 0.8,  // Shows partial next/previous slides
        ),
        items: events.map((event) {
          final String artistName = event['artistName'] ?? 'Unknown Artist';
          final String location = event['location'] ?? 'Unknown Location';
          final String imageUrl = event['imageUrl'] ?? '';
          final DateTime eventTime =
          (event['eventTime'] as Timestamp).toDate();
          final Duration remainingTime = _calculateRemainingTime(eventTime);
          return Builder(
            builder: (BuildContext context) {
              return Column(
                  children: [
                    Stack(
                      children: [
                        Align(
                          alignment: Alignment.bottomCenter,
                          child: Container(
                            height: (20/949.3333333333334)*screenheight,
                            width: (140/448)*screenwidth,
                            decoration: const BoxDecoration(
                              color: Color(0xFF93E624),
                            ),
                          ),
                        ),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            ClipPath(
                              clipper: TriangleClipper(),
                              child: Container(
                                color: Colors.black,
                                height: (20/949.3333333333334)*screenheight,
                                width: (71/448)*screenwidth,
                              ),
                            ),
                            ClipPath(
                              clipper: TriangleClipperReverse(),
                              child: Container(
                                color: Colors.black,
                                height: (20/949.3333333333334)*screenheight,
                                width: (71/448)*screenwidth,
                              ),
                            ),
                          ],
                        ),
                      ],
                    ),
                    Stack(
                      children: [
                        Align(
                          alignment: Alignment.center,
                          child: Container(
                            alignment: Alignment.center,
                            height: (420/949.3333333333334)*screenheight,
                            width: (350/448)*screenwidth,
                            decoration: BoxDecoration(
                              color: Colors.black,
                              border: Border.all(
                                color: const Color(0xFF93E624),
                                width: 3,
                              ),
                            ),),
                        ),
                        Column(
                          mainAxisAlignment: MainAxisAlignment.start,
                          children: [
                            SizedBox(
                              height: (20/949.3333333333334)*screenheight,
                            ),
                            Container(
                              height: (200/949.3333333333334)*screenheight,
                              width: (300/448)*screenwidth,
                              decoration: const BoxDecoration(
                                color: Color(0xFF93E624),
                              ),
                              child:  ClipRRect(
                                borderRadius: BorderRadius.circular(8),
                                child: Image.network(
                                  imageUrl,
                                  fit: BoxFit.cover,
                                  loadingBuilder: (BuildContext context, Widget child, ImageChunkEvent? loadingProgress) {
                                    if (loadingProgress == null) {
                                      return child; // When the image is fully loaded, return the image.
                                    } else {
                                      return Shimmer.fromColors(
                                        baseColor: Colors.grey[300]!,
                                        highlightColor: Colors.grey[100]!,
                                        child: Container(
                                          color: Colors.white,
                                        ),
                                      );
                                    }
                                  },
                                  errorBuilder: (BuildContext context, Object error, StackTrace? stackTrace) {
                                    return Shimmer.fromColors(
                                      baseColor: Colors.grey[300]!,
                                      highlightColor: Colors.grey[100]!,
                                      child: Container(
                                        width: 300,
                                        height: 290,
                                        color: Colors.white,
                                        child: const Icon(
                                          Icons.error,
                                          color: Colors.red,
                                          size: 50.0,
                                        ),
                                      ),
                                    );
                                  },
                                ),
                              ),),
                            SizedBox(
                              height: (10/949.3333333333334)*screenheight,
                            ),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: [
                                ClipPath(
                                  clipper: LeftSideBoxClipper(),
                                  child: Container(
                                    alignment: Alignment.center,
                                    height: (190/949.3333333333334)*screenheight,
                                    width: (30/448)*screenwidth,
                                    color: const Color(0xFF93E624),
                                    child: Column(
                                      mainAxisAlignment: MainAxisAlignment.start,
                                      crossAxisAlignment: CrossAxisAlignment.center,
                                      children: [
                                        const SizedBox(height: 15),
                                        ClipPath(
                                          clipper: SlantedRectangleClipper(),
                                          child: Container(
                                            height: (24/949.3333333333334)*screenheight,
                                            width: (20/448)*screenwidth,
                                            color: Colors.black,
                                          ),
                                        ),
                                        ClipPath(
                                          clipper: SlantedRectangleClipper(),
                                          child: Container(
                                            height: (24/949.3333333333334)*screenheight,
                                            width: (20/448)*screenwidth,
                                            color: Colors.black,
                                          ),
                                        ),
                                        ClipPath(
                                          clipper: SlantedRectangleClipper(),
                                          child: Container(
                                            height: (24/949.3333333333334)*screenheight,
                                            width: (20/448)*screenwidth,
                                            color: Colors.black,
                                          ),
                                        ),
                                        ClipPath(
                                          clipper: SlantedRectangleClipper(),
                                          child: Container(
                                            height: (24/949.3333333333334)*screenheight,
                                            width: (20/448)*screenwidth,
                                            color: Colors.black,
                                          ),
                                        ),
                                        ClipPath(
                                          clipper: SlantedRectangleClipper(),
                                          child: Container(
                                            height: (24/949.3333333333334)*screenheight,
                                            width: (20/448)*screenwidth,
                                            color: Colors.black,
                                          ),
                                        ),
                                        ClipPath(
                                          clipper: SlantedRectangleClipper(),
                                          child: Container(
                                            height: (24/949.3333333333334)*screenheight,
                                            width: (20/448)*screenwidth,
                                            color: Colors.black,
                                          ),
                                        ),
                                        ClipPath(
                                          clipper: SlantedRectangleClipper(),
                                          child: Container(
                                            height: (24/949.3333333333334)*screenheight,
                                            width: (20/448)*screenwidth,
                                            color: Colors.black,
                                          ),
                                        ),
                                      ],
                                    ),
                                  ),
                                ),
                                Container(
                                    padding: const EdgeInsets.only(left: 10, right:10),
                                    height: (150/949.3333333333334)*screenheight,
                                    width: (285/448)*screenwidth,
                                    child: Column(
                                      children: [
                                         Row(
                                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                          children: [
                                            Text(
                                              artistName,
                                              style: TextStyle(
                                                color: Colors.white,
                                                fontSize: 16,
                                                fontFamily: 'Robot-Invaders',
                                                fontWeight: FontWeight.w400,
                                              ),
                                            ),
                                            Text(
                                              location,
                                              style: TextStyle(
                                                color: Colors.white,
                                                fontSize: 16,
                                                fontFamily: 'Robot-Invaders',
                                                fontWeight: FontWeight.w400,
                                              ),
                                            ),
                                          ],
                                        ),
                                        const Row(
                                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                          children: [
                                            Text(
                                              'Event',
                                              style: TextStyle(
                                                color: Color(0xFFA0A0A0),
                                                fontSize: 12,
                                                fontFamily: 'K2D-ExtraBold',
                                              ),
                                            ),
                                            Text(
                                              'Location',
                                              style: TextStyle(
                                                color: Color(0xFFA0A0A0),
                                                fontSize: 12,
                                                fontFamily: 'K2D-ExtraBold',
                                              ),
                                            ),
                                          ],
                                        ),
                                        SizedBox(height: (40/949.3333333333334)*screenheight,),
                                        Stack(
                                          children: [
                                            Align(
                                              alignment: Alignment.center,
                                              child: CustomPaint(
                                                size: const Size(196, 59),
                                                painter: RPSCustomPainter(),
                                              ),
                                            ),
                                            Align(
                                              alignment:  Alignment.center,
                                              child: Column(
                                                children: [
                                                  const Text(
                                                    'Starts in',
                                                    style: TextStyle(
                                                      color: Colors.black,
                                                      fontSize: 22,
                                                      fontFamily: 'Robot-Invaders',
                                                      fontWeight: FontWeight.w400,
                                                    ),
                                                  ),
                                                  Text(
                                                    remainingTime > Duration.zero
                                                        ? _formatDuration(remainingTime)
                                                        : 'Event Started',
                                                      style: TextStyle(
                                                        color: Colors.white,
                                                        fontFamily: 'Robot-Invaders',
                                                        fontSize: 18,
                                                        fontWeight: FontWeight.w400,
                                                      ),
                                                  ),
                                                ],
                                              ),
                                            ),
                                          ],
                                        ),
                                      ],
                                    )
                                ),
                                ClipPath(
                                  clipper: RightSideBoxClipper(),
                                  child: Container(
                                    decoration: const BoxDecoration(
                                      color: Color(0xFF93E624),
                                    ),
                                    alignment: Alignment.bottomRight,
                                    height: (190/949.3333333333334)*screenheight,
                                    width: (35/448)*screenwidth,
                                    child: ClipPath(
                                      clipper: RightSideStackedBoxClipper(),
                                      child: Container(
                                          height: (185/949.3333333333334)*screenheight,
                                          width: (31/448)*screenwidth,
                                          color: Colors.black,
                                          child:Column(
                                            children: [
                                              SizedBox(height: (10/949.3333333333334)*screenheight,),
                                              Align(
                                                alignment: Alignment.center,
                                                child: ClipPath(
                                                  clipper: RightSlantedRectangleClipper(),
                                                  child: Container(
                                                    height: (24/949.3333333333334)*screenheight,
                                                    width: (17/448)*screenwidth,
                                                    color: const Color(0xFF13EABF),
                                                  ),
                                                ),
                                              ),
                                              Align(
                                                alignment: Alignment.center,
                                                child: ClipPath(
                                                  clipper: RightSlantedRectangleClipper(),
                                                  child: Container(
                                                    height: (24/949.3333333333334)*screenheight,
                                                    width: (17/448)*screenwidth,
                                                    color: const Color(0xFF13EABF),
                                                  ),
                                                ),
                                              ),
                                              Align(
                                                alignment: Alignment.center,
                                                child: ClipPath(
                                                  clipper: RightSlantedRectangleClipper(),
                                                  child: Container(
                                                    height: (24/949.3333333333334)*screenheight,
                                                    width: (17/448)*screenwidth,
                                                    color: const Color(0xFF13EABF),
                                                  ),
                                                ),
                                              ),
                                              Align(
                                                alignment: Alignment.center,
                                                child: ClipPath(
                                                  clipper: RightSlantedRectangleClipper(),
                                                  child: Container(
                                                    height: (24/949.3333333333334)*screenheight,
                                                    width: (17/448)*screenwidth,
                                                    color: const Color(0xFF13EABF),
                                                  ),
                                                ),
                                              ),
                                              Align(
                                                alignment: Alignment.center,
                                                child: ClipPath(
                                                  clipper: RightSlantedRectangleClipper(),
                                                  child: Container(
                                                    height: (24/949.3333333333334)*screenheight,
                                                    width: (17/448)*screenwidth,
                                                    color: const Color(0xFF13EABF),
                                                  ),
                                                ),
                                              ),
                                              Align(
                                                alignment: Alignment.center,
                                                child: ClipPath(
                                                  clipper: RightSlantedRectangleClipper(),
                                                  child: Container(
                                                    height: (24/949.3333333333334)*screenheight,
                                                    width: (17/448)*screenwidth,
                                                    color: const Color(0xFF13EABF),

                                                  ),
                                                ),
                                              ),
                                            ],
                                          )
                                      ),
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ],
                        ),
                        Positioned(
                          left: (283/949.3333333333334)*screenheight,
                          top: (390/448)*screenwidth,
                          child: ClipPath(
                            clipper: BottomTriangleClipper(),
                            child: Container(
                              color: const Color(0xFF93E624),
                              height: (35/949.3333333333334)*screenheight,
                              width: (40/448)*screenwidth,
                            ),
                          ),
                        ),
                        Positioned(
                          left: (286/949.3333333333334)*screenheight,
                          top: (393/448)*screenwidth,
                          child: ClipPath(
                            clipper: StackedBottomTriangleClipper(),
                            child: Container(
                              height: (32/949.3333333333334)*screenheight,
                              width: (40/448)*screenwidth,
                              color: Colors.black,
                            ),
                          ),)
                      ],
                    )
                  ]
              );
            },
          );
        }).toList(),
      ),
    );
  }
}



Leave a Comment