Under improvement -Event page

apps/events/admin.py

@@ -8,7 +8,7 @@ class EventAdmin(admin.ModelAdmin):
     list_display = ('title', 'schedule', 'venue')
     search_fields = ('title', 'venue')
     ordering = ('-schedule',)
-
+    
 
 @admin.register(Team)
 class TeamAdmin(admin.ModelAdmin):
@@ -70,3 +70,4 @@ def get_event_title(self, obj):
         return obj.event.title
     get_event_title.short_description = 'Event Title'
     get_event_title.admin_order_field = 'event__title'
+

apps/events/models.py

@@ -15,7 +15,7 @@ class Event(models.Model):
     schedule = models.DateTimeField()
     venue = models.CharField(max_length=50)
     thumbnail = models.ImageField(
-        upload_to=event_thumbmail_path, null=True, blank=True)
+        upload_to='events/images', null=True, blank=True)
 
     def __str__(self):
         return self.title
@@ -27,6 +27,12 @@ def get_thumbnail_url(self):
         else:
             return settings.STATIC_URL + 'home/images/02.jpg'
 
+class Gallery(models.Model):
+    post = models.CharField(max_length=200)
+    images = models.ImageField(upload_to = 'gallery/image',null=True ,blank=True)
+
+    def __str__(self):
+        return self.post
 
 class Team(models.Model):
     team_id = models.CharField(max_length=50, unique=True)

apps/events/static/events/style.css

@@ -0,0 +1,3 @@
+.container{
+    background-color: aqua;
+}

apps/events/templates/events/index.html

@@ -0,0 +1,114 @@
+{% extends 'layout.html' %}
+
+{% block title %} Jagrati | Events {% endblock %}
+
+{% block style %}
+
+  .col-md-3
+{
+display: inline-block;
+margin-top:-10px;
+margin-left:-4px;
+}
+.carousel-indicators .active {
+background-color: blue;
+}
+.col-md-3 img{
+  margin:3rem 3rem;
+width: 170px;
+height: 200px;
+}
+
+body .carousel-indicator li active{
+background-color: blue;
+margin-top:10px;
+}
+body .carousel-indicator li unable{
+background-color: grey;
+margin-top:10px;
+}
+body .carousel-indicators{
+bottom: 2rem;
+}
+body .carousel-control-prev-icon,
+body .carousel-control-next-icon{
+background-color: blue;
+}
+<!--slider buttons-->
+.carousel-control-prev,
+.carousel-control-next{
+top: auto;
+bottom: auto;
+padding-top: 222px;
+}
+body .no-padding{
+padding-left: 0,
+padding-right: 0;
+}
+{% endblock %}
+
+{% block content %}
+{% load static %}
+<div class="container">
+    <h1>Events list</h1>
+<div id="demo" class="carousel slide my-3" data-ride="carousel">
+    <ul class="carousel-indicators">
+      <li data-target="#demo" data-slide-to="0" class="active"></li>
+
+       {% for i in range %}
+      <li data-target="#demo" data-slide-to="{{i}}" class="unable"></li>
+      {% endfor %}
+    </ul>
+
+    <!--Slideshow starts here -->
+    <div class="container carousel-inner no-padding">
+
+      <div class="carousel-item active">
+        <div class="col-xs-3 col-sm-3 col-md-3">
+          <div class="card" style="width: 18rem;">
+            <img src='/media/{{event.0.thumbnail}}' class="card-img-top" alt="...">
+            <div class="card-body">
+                <h5 class="card-title">{{event.0.venue}}</h5>
+                <p class="card-text">{{event.0.description}}</p>
+                <a href="/events/show_event/{{event.0.id}}"><button id="qv{{event.0.id}}" class="btn btn-primary">QuickView</button></a>
+            </div>
+          </div>
+       </div>
+
+
+        {% for i in event|slice:"1:" %}
+        <div class="col-xs-3 col-sm-3 col-md-3">
+          <div class="card" style="width: 18rem;">
+            <img src='/media/{{i.thumbnail}}' class="card-img-top" alt="...">
+            <div class="card-body">
+              <h5 class="card-title">{{i.venue}}</h5>
+              <p class="card-text">{{i.description}}</p>
+              <a href="/events/show_event/{{i.id}}"><button id="qv{{i.id}}" class="btn btn-primary cart">QuickView</button></a>
+            </div>
+          </div>
+        </div>
+        {% if forloop.counter|divisibleby:3 and forloop.counter > 0 and not forloop.last %}
+      </div><div class="carousel-item">
+        {% endif %}
+
+        {% endfor %}
+    </div>
+
+
+
+</div>
+</div>
+    <!-- left and right controls for the slide -->
+    <a class="carousel-control-prev" href="#demo" data-slide="prev">
+        <span class="carousel-control-prev-icon"></span>
+    </a>
+    <a class="carousel-control-next" href="#demo" data-slide="next">
+        <span class="carousel-control-next-icon"></span>
+    </a>
+
+
+
+</div>
+
+
+ {% endblock %}

apps/events/templates/events/show_event.html

@@ -0,0 +1,137 @@
+{% extends 'layout.html' %}
+
+{% block title %} Jagrati | {{my_event.title}} {% endblock %}
+
+{% block style %}
+
+.upper{
+  width: 100%;
+  height:90%;
+  border-radius:3%;
+  box-shadow: 1.2rem 1.2rem 1.7rem #C0C0C0;
+}
+
+.upper img{
+
+  border-radius:5%;
+  box-shadow: .8rem .2rem 1.2rem #C0C0C0;
+}
+
+.title {
+  text-transform:uppercase;
+}
+
+.title .text1{
+  font-family: 'Mulish', sans-serif;
+}
+.col-md-3
+{
+display: inline-block;
+margin-left:-4px;
+}
+.carousel-indicators .active {
+background-color: blue;
+}
+.col-md-3 img{
+width: 170px;
+height: 200px;
+}
+body .carousel-indicator li{
+background-color: blue;
+}
+body .carousel-indicators{
+bottom: 0;
+}
+body .carousel-control-prev-icon,
+body .carousel-control-next-icon{
+background-color: blue;
+}
+.carousel-control-prev,
+.carousel-control-next{
+top: auto;
+bottom: auto;
+padding-top: 222px;
+}
+body .no-padding{
+padding-left: 0,
+padding-right: 0;
+}
+
+{% endblock %}
+
+{% block content %}
+{% load static %}
+<div class="container">
+<h1 class="title">
+<center>
+<span class="text1"><b>event</b></span><br>
+<span class="text2">description</span>
+</center>
+</h1>
+<div class="container my-4">
+<div class="upper">
+    <div class="row">
+    <div class="col-md-4 my-5">
+        <center>
+            <img src="/media/{{my_event.thumbnail}}" width="70%" height="60%"></center>
+
+    </div>
+    <div class="col-md-8 my-4">
+        <h5>{{my_event.title}}</h5>
+        <p><b>About event:</b> {{my_event.description}}</p>
+        <p>{{my_event.venue}}</p>
+    </div>
+
+    </div>
+</div>
+</div>
+
+
+<div class="gallery">
+    <!--Slideshow starts here -->
+    {% for event, range, nSlides in all_events %}
+<h1>Particular {{event.0.event_id}}</h1>
+    <div class="row">
+        <div id="demo{{forloop.counter}}" class="col carousel slide my-3" data-ride="carousel">
+            <ul class="carousel-indicators">
+                <li data-target="#demo{{forloop.counter}}" data-slide-to="0" class="active"></li>
+                {% for i in range %}
+                <li data-target="#demo{{forloop.parentloop.counter}}" data-slide-to="{{i}}"></li>
+                {% endfor %}
+            </ul>
+            <div class="container carousel-inner no-padding">
+                <div class="carousel-item active">
+                    {% for i in event %}
+
+                    <div class="col-xs-3 col-sm-3 col-md-3">
+                        <div class="card align-items-center" style="width: 18rem;">
+                            <img src='/media/{{i.images}}' class="card-img-top" alt="...">
+                            <div class="card-body">
+                                <h5 class="card-title" id="namepr{{i.id}}">{{i.event_id}}</h5>
+                                <p>Here we have image collection</p>
+                            </div>
+                        </div>
+                    </div>
+                    {% if forloop.counter|divisibleby:4 and forloop.counter > 0 and not forloop.last %}
+                </div>
+                <div class="carousel-item">
+                    {% endif %}
+
+                    {% endfor %}
+                </div>
+
+            </div>
+        </div>
+        <!-- left and right controls for the slide -->
+        <a class="carousel-control-prev" href="#demo" data-slide="prev">
+        <span class="carousel-control-prev-icon"></span>
+    </a>
+    <a class="carousel-control-next" href="#demo" data-slide="next">
+        <span class="carousel-control-next-icon"></span>
+    </a>
+
+{% endfor %}
+</div>
+
+
+{% endblock %}

apps/events/urls.py

@@ -1,9 +1,13 @@
+from django.contrib import admin
 from django.urls import path
-
+from django.conf import settings 
+from django.conf.urls.static import static 
+
 from . import views
 
 app_name = 'events'
 urlpatterns = [
     path('', views.index, name='index'),
     path('add/', views.add_event, name='add_event'),
-]
+ path('show_event/<int:myid>',views.show_event,name='show_event'),
+]+static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

apps/events/views.py

@@ -1,10 +1,40 @@
 from django.http import HttpResponse
-from django.shortcuts import render
-
+from django.shortcuts import render,get_object_or_404
+from .models import Event,Gallery
+from math import ceil
 
 def index(request):
-    return HttpResponse('Hello World!')
+    events = Event.objects.all()
+    print(events)
+    n = len(events)
+    nSlides = n//4 + ceil((n/4)-(n//4))
+    params = {'no_of_slides':nSlides, 'range': range(1,nSlides),'event': events}
+
+    return render(request,'events/index.html',params)
 
 
 def add_event(request):
     return HttpResponse('Add events page..')
+
+def show_event(request,myid):
+    all_event=[]
+    event = Event.objects.filter(id=myid)
+
+    all_image=Gallery.objects.filter(id=myid)
+    all_title=Gallery.objects.values('event_id','id')
+    tit = {item['event_id'] for item in all_title }
+
+    for t in tit:
+        print("T: ",t)
+      #  print("selected id: ",)
+        event_list = Gallery.objects.filter(event_id=t)
+        n = len(event_list)
+        nSlides = n // 4 + ceil((n / 4) - (n // 4))
+        if t==myid:
+            all_event.append([event_list, range(1, nSlides), nSlides])
+            break
+        print(event_list)
+    params = {'my_event':event[0],'all_events': all_event}
+    return render(request, 'events/show_event.html',params)
+
+

home/urls.py

@@ -8,4 +8,5 @@
     path('dashboard/', views.dashboard, name='dashboard'),
     path('dashboard/update_cwhw/', views.update_cwhw, name='update_cwhw'),
     path('ajax/dashboard/', views.ajax_dashboard, name='ajax_dashboard'),
+
 ]

home/views.py

@@ -213,3 +213,4 @@ def ajax_dashboard(request):
         data[sch.section.section_id] = sch.section.name
 
     return JsonResponse(data)
+

static/global/css/custom.css

@@ -12,4 +12,4 @@ html, body {
 label {
     font-weight:600;
     letter-spacing:1.2px;
-}
+}

static/home/css/style.css

@@ -937,3 +937,4 @@ footer{
 		width: 70%;
 	}
 }
+

templates/home/index.html

@@ -46,7 +46,7 @@ <h1><span onclick="document.querySelector('.navbar a:first-child').click()"
                     <a class="nav-link" href="#about-us">About</a>
                 </li>
                 <li class="nav-item">
-                    <a class="nav-link" href="#">Events</a>
+                    <a class="nav-link" href="{% url 'events:index' %}">Events</a>
                 </li>
                 <li class="nav-item">
                     <a class="nav-link" href="#">Team</a>