Commit 47420959 authored by Zac Wood's avatar Zac Wood
Browse files

Merge branch 'v2-ui' into 'dev-v2'

V2 ui

See merge request !25
parents 894575fb 9a163119
Pipeline #2947 passed with stage
in 2 minutes and 14 seconds
<%= render partial: 'shared/navbar' %>
<h1>Home#index</h1>
<p>Find me in app/views/home/index.html.erb</p>
......@@ -4,6 +4,9 @@
<title>Schedules</title>
<%= csrf_meta_tags %>
<link href="https://srct.gmu.io/masonstrap/css/masonstrap.min.css" rel="stylesheet">
<script src="https://srct.gmu.io/masonstrap/js/masonstrap.min.js"></script>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>
......
<%= render partial: 'shared/navbar' %>
<div class="container-fluid">
<!-- The main screen consists of a row with two columns: the search results, and the cart -->
<div class="row">
<!-- Search result, List of Courses -->
<div class="col-lg-7 col-md-10 mx-auto order-2 order-lg-0" id="search-list">
<% if @courses.any? %>
<%= render partial: 'shared/course', collection: @courses %>
<% else %>
<h1>Sorry, we couldn't find anything matching your search.</h1>
<p>Please try again!</p>
<% end %>
</div>
<!-- List of sections in the cart -->
<div class="col order-1 order-lg-1" id="cart">
<div class="card">
<div class="card-body">
<h3 class="card-title">Your Schedule</h3>
</div>
<ul class="list-group list-group-flush" id="schedule">
<%= render partial: 'shared/section', collection: @cart, locals: { in_cart: true } %>
</ul>
<div class="card-body">
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal" onclick="setUrlInModal()">
Export schedule
</button>
</div>
</div>
</div>
</div>
</div>
<!-- Export Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Your calendar has been generated!</h5>
<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>
<div class="card" id="course-<%= course.id %>" onclick="toggleSections(this)" data-course="<%= course.to_json %>">
<div class="card-body">
<div>
<h3 style="float: left"><%= "#{course.subject} #{course.course_number}" %></h3>
<h5 style="float: right"><em><%= course.title %></em>. <%= course.credits %> credits.</h5>
</div>
<div style="clear: both"> </div>
<p class="description"><%= course.description %></p>
<div class="d-block" style="text-align: center">
<i class="fas fa-chevron-down"></i>
</div>
<!-- List of Course Sections -->
<ul class="list-group list-group-flush" id="sections" style="display:none">
<%= render partial: 'section', collection: course.course_sections, locals: { in_cart: false } %>
</ul>
</div>
</div>
<div class="container-fluid">
<div class="row align-left align-sm-center align-md-right" id="navbar">
<div class="col-8 col-sm align-center">
<a href="/search" id="logo">
<i class="fas fa-calendar-alt"></i>
Schedules
</a>
</div>
<div class="col-4 col-sm align-center order-0 order-sm-1" onclick="toggleSchedule()">
<h1 style="margin-top:24px">
<!-- <h2><i class="fas fa-shopping-cart" id="schedule-icon"></i></h2> -->
<span class="fa-layers fa-fw" id="schedule-icon">
<i class="fas fa-shopping-cart"></i>
<span class="fa-layers fa-fw">
<i class="fas fa-circle" data-fa-transform="shrink-3 up-12 right-12" style="color:gray"></i>
<span id="course-counter" class="fa-layers-text fa-inverse" data-fa-transform="shrink-10 up-12 right-12" style="font-weight:600">
<%= @cart.length %>
</span>
</span>
</span>
</h1>
</div>
<div class="col-12 col-sm align-center order-1 order-sm-0">
<form action="/search" class="form-inline">
<div class="form-group">
<div class="input-group">
<input name="q" type="text" class="form-control" placeholder="Search by CRN, course, professor..." aria-describedby="basic-addon2">
<div class="input-group-append">
<button class="btn btn-secondary" type="button">
<i class="fas fa-search"></i>
</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment