_cart.html.erb 3.06 KB
Newer Older
Zac Wood's avatar
Zac Wood committed
1
2
3
4
5
6
</div>

<!-- List of sections in the cart -->
<div class="col order-1 order-lg-1" id="cart">
    <div class="card">
	<div class="card-body">
Zac Wood's avatar
Zac Wood committed
7
	    <h3 class="card-title"><%= link_to 'Your Schedule', schedule_path %></h3>
Zac Wood's avatar
Zac Wood committed
8
9
	</div>
	<ul class="list-group list-group-flush" id="schedule">
Zac Wood's avatar
Zac Wood committed
10
11
12
13
14
15
16
17
18
19
20
	    <% @cart.each do |cid, sections| %>
		<% course = Course.find_by_id(cid) %>
		<li id="schedule-<%= cid %>" class="list-group-item schedule-section-card" onclick="removeCourse(<%= cid %>)">
		    <div style="display: flex; justify-content: space-between;">
			<b style="min-width: 15%"><%= "#{course.subject} #{course.course_number}" %></b>
			<span class="crns" style="color: gray; font-size: 10pt;">
			    <%= sections.map { |s| "##{s.crn}" }.join(', ') %>
			</span>
		    </div>
		</li>
	    <% end %>
Zac Wood's avatar
Zac Wood committed
21
22
	</ul>
	<div class="card-body">
23
	    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exportModal" onclick="setUrlInModal()">
Zac Wood's avatar
Zac Wood committed
24
25
26
27
28
29
		Export schedule
	    </button>
	</div>
    </div>
</div>

Zac Wood's avatar
Zac Wood committed
30
31
32
33
34
35
36
37
38
39
<template id="cart-data">
    <% @cart.each do |cid, sections| %>
	<% course = Course.find_by_id cid %>
	<div data-id="<%= cid %>" data-title="<%= "#{course.subject} #{course.course_number}" %>">
	    <% sections.each do |s| %>
		<div data-id="<%= s.id %>" data-crn="<%= s.crn %>"></div>
	    <% end %>
	</div>
    <% end %>
</template>
Zac Wood's avatar
Zac Wood committed
40
41
42
43

</div>
</div>

44
45

<!-- Export Modal -->
46
<div class="modal fade" id="exportModal" tabindex="-1" role="dialog" aria-labelledby="exportModalLabel" aria-hidden="true">
47
48
49
    <div class="modal-dialog" role="document">
	<div class="modal-content">
	    <div class="modal-header">
50
		<h5 class="modal-title" id="exportModalLabel">Your calendar has been generated!</h5>
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
		<button type="button" class="close" data-dismiss="modal" aria-label="Close">
		    <span aria-hidden="true">&times;</span>
		</button>
	    </div>
	    <div class="modal-body">
		<h5>Apple Calendar</h5>
		To add your schedule to Apple Calendar, click the "Add to calendar" button below. If you are on a device
		running macOS or iOS, this will open a dialogue which will walk you through adding the calendar.
		<hr />
		<h5>Google Calendar</h5>
		<strong>On desktop:</strong>
		<br />
		Open your <a href="https://calendar.google.com/">Google Calendar</a>. Click the "Settings" button in the top
		right, and then click the Settings tab. In the menu on the left, click "Add calendar" and "From URL". Now,
		paste the following link inside the text box: <br />
		<code id="calendar-link"></code>
		<br />
		<strong>On mobile (Android only):</strong>
		<br />
		Click the "Download calendar file" button. This will download the calendar file which you may then open and
		add to your calendar.
		<hr />
		<h5>.ics file</h5>
		To download a .ics file containing your schedule, click the "Download calendar file" button below.
	    </div>
	    <div class="modal-footer">
		<button type="button" class="btn btn-secondary" onclick="downloadIcs()">Download calendar file</button>
		<button type="button" class="btn btn-primary" onclick="addToSystemCalendar()">Add to system calendar</button>
	    </div>
	</div>
    </div>
</div>