diff --git a/erpnext/www/book-appointment/2.html b/erpnext/www/book-appointment/2.html
index 198b12d..2a8c5c9 100644
--- a/erpnext/www/book-appointment/2.html
+++ b/erpnext/www/book-appointment/2.html
@@ -42,34 +42,9 @@
 
     <div class="mt-3 justify-content-center">
         <div class="row">
-            <div class="col-md time-slot unavailable" id="12pm">12 pm to 1 am</div>
-            <div class="col-md time-slot selected" id="1am">1 am to 2 am</div>
-            <div class="col-md time-slot" id="2am">2 am to 3 am</div>
-            <div class="col-md time-slot" id="3am">3 am to 4 am</div>
-            <div class="col-md time-slot" id="4am">4 am to 5 am</div>
-            <div class="col-md time-slot" id="5am">5 am to 6 am</div>
-            <div class="col-md time-slot" id="6am">6 am to 7 am</div>
-            <div class="col-md time-slot" id="7am">7 am to 8 am</div>
-        </div>
-        <div class="row">
-            <div class=" col-md time-slot" id="8am">8 am to 9 am</div>
-            <div class=" col-md time-slot" id="9am">9 am to 10 am</div>
-            <div class=" col-md time-slot" id="10am">10 am to 11 am</div>
-            <div class=" col-md time-slot" id="11am">11 am to 12 am</div>
-            <div class=" col-md time-slot" id="12am">12 am to 1 pm</div>
-            <div class=" col-md time-slot" id="1pm">1 pm to 2 pm</div>
-            <div class=" col-md time-slot" id="2pm">2 pm to 3 pm</div>
-            <div class=" col-md time-slot" id="3pm">3 pm to 4pm</div>
-        </div>
-        <div class="row">
-            <div class=" col-md time-slot" id="4pm">4pm to 5pm</div>
-            <div class=" col-md time-slot" id="5pm">5 pm to 6 pm</div>
-            <div class=" col-md time-slot" id="6pm">6 pm to 7 pm</div>
-            <div class=" col-md time-slot" id="7pm">7 pm to 8 pm</div>
-            <div class=" col-md time-slot" id="8pm">8 pm to 9 pm</div>
-            <div class=" col-md time-slot" id="9pm">9 pm to 10 pm</div>
-            <div class=" col-md time-slot" id="10pm">10 pm to 11 pm</div>
-            <div class=" col-md time-slot" id="11pm">11 pm to 12 pm</div>
+            {% for timeslot in timeslots %}
+                <div class="col-md time-slot {% if timeslot.unavailable %}unavailable{% endif %}" id="{{ timeslot.time.time() }}">{{ timeslot.time.time().strftime('%H : %M') }}</div>
+            {% endfor %}
         </div>
         <div class="row justify-content-center">
             <div class="col-md-4 align-self-center">
diff --git a/erpnext/www/book-appointment/2.js b/erpnext/www/book-appointment/2.js
index bdcabdc..113564a 100644
--- a/erpnext/www/book-appointment/2.js
+++ b/erpnext/www/book-appointment/2.js
@@ -9,8 +9,12 @@
         return
     }
     console.log(this.id)
-    var selected = document.getElementsByClassName('selected')[0];
-    selected.classList.remove('selected');
+    try{
+        selected_element = document.getElementsByClassName('selected')[0]
+    }catch(e){
+        this.classList.add('selected')
+    }
+    selected_element.classList.remove('selected');
     this.classList.add('selected');
 }
 
diff --git a/erpnext/www/book-appointment/2.py b/erpnext/www/book-appointment/2.py
index 688545a..fa8aafa 100644
--- a/erpnext/www/book-appointment/2.py
+++ b/erpnext/www/book-appointment/2.py
@@ -3,26 +3,91 @@
 
 
 def get_context(context):
-    context.date = frappe.form_dict['date']
+    # Get query parameters
+    date = frappe.form_dict['date']
+    tz = frappe.form_dict['tz']
+    tz = int(tz)
+    # Database queries
     settings = frappe.get_doc('Appointment Booking Settings')
     holiday_list = frappe.get_doc('Holiday List', settings.holiday_list)
-    if(is_holiday(context.date,holiday_list)):
-        context.is_holiday = True
-        return context
-    get_time_slots(context.date,settings)
-    # time_slots = get_time_slots(date)
+    # Format datetimes
+    format_string = '%Y-%m-%d %H:%M:%S'
+    start_time = datetime.datetime.strptime(date+' 00:00:00', format_string)
+    end_time = datetime.datetime.strptime(date+' 23:59:59', format_string)
+    # Convert to ist
+    start_time = _convert_to_ist(start_time, tz)
+    end_time = _convert_to_ist(end_time, tz)
+    timeslots = get_available_slots_between(start_time, end_time, settings)
+    converted_timeslots = []
+    print('Appointments')
+    print(frappe.get_list('Appointment',fields=['from_time']))
+    for timeslot in timeslots:
+        if timeslot > end_time or timeslot < start_time:
+            pass
+        else:
+            if frappe.db.count('Appointment',{'from_time':start_time.time()}) < settings.number_of_agents:
+                converted_timeslots.append(dict(time=_convert_to_tz(timeslot, tz), unavailable=False))
+            else:
+                converted_timeslots.append(dict(time=_convert_to_tz(timeslot, tz),unavailable=True))
+
+    context.timeslots = converted_timeslots
+    context.date = date
     return context
 
-def is_holiday(date,holiday_list):
+def _is_holiday(date, holiday_list):
     for holiday in holiday_list.holidays:
         if holiday.holiday_date.isoformat() == date:
-            print('matched')
             return True
     return False
 
+def _convert_to_ist(datetime_object, timezone):
+    offset = datetime.timedelta(minutes=timezone)
+    datetime_object = datetime_object + offset
+    offset = datetime.timedelta(minutes=-330)
+    datetime_object = datetime_object - offset
+    return datetime_object
+
+def _convert_to_tz(datetime_object, timezone):
+    offset = datetime.timedelta(minutes=timezone)
+    datetime_object = datetime_object - offset
+    offset = datetime.timedelta(minutes=-330)
+    datetime_object = datetime_object + offset
+    return datetime_object
+
+def get_available_slots_between(start_time_parameter, end_time_parameter, settings):
+    records = get_records(start_time_parameter, end_time_parameter, settings)
+    timeslots = []
+    appointment_duration = datetime.timedelta(
+        minutes=settings.appointment_duration)
+    for record in records:
+        if record.day_of_week == weekdays[start_time_parameter.weekday()]:
+            current_time = _deltatime_to_datetime(
+                start_time_parameter, record.from_time)
+            end_time = _deltatime_to_datetime(
+                start_time_parameter, record.to_time)
+        elif record.day_of_week == weekdays[end_time_parameter.weekday()]:
+            current_time = _deltatime_to_datetime(
+                end_time_parameter, record.from_time)
+            end_time = _deltatime_to_datetime(
+                end_time_parameter, record.to_time)
+        while current_time + appointment_duration <= end_time:
+            timeslots.append(current_time)
+            current_time += appointment_duration
+    return timeslots
 
 
-def _deltatime_to_time(deltatime):
-    return (datetime.datetime.min + deltatime).time()
+def get_records(start_time, end_time, settings):
+    records = []
+    for record in settings.availability_of_slots:
+        if record.day_of_week == weekdays[start_time.weekday()] or record.day_of_week == weekdays[end_time.weekday()]:
+            records.append(record)
+    return records
 
-weekdays = ["Monday","Tuesday","Wednesday","Thursday","Friday","Saturday","Sunday"]
\ No newline at end of file
+
+def _deltatime_to_datetime(date, deltatime):
+    time = (datetime.datetime.min + deltatime).time()
+    return datetime.datetime.combine(date.date(), time)
+
+
+weekdays = ["Monday", "Tuesday", "Wednesday",
+            "Thursday", "Friday", "Saturday", "Sunday"]