Commit 27c4528c authored by Zac Wood's avatar Zac Wood
Browse files

Tons of changes after round 1 of feedback

parent 8b1d4b9a
Pipeline #3482 canceled with stage
in 39 seconds
...@@ -32,7 +32,7 @@ class Cart { ...@@ -32,7 +32,7 @@ class Cart {
document.getElementById('course-counter').innerText = Object.keys(this._courses).length; document.getElementById('course-counter').innerText = Object.keys(this._courses).length;
} }
async addSection(section) { async toggleSection(section) {
const resp = await fetch(`/sessions/cart?&section_id=${section.id}`, { cache: 'no-store' }); const resp = await fetch(`/sessions/cart?&section_id=${section.id}`, { cache: 'no-store' });
const json = await resp.json(); const json = await resp.json();
this.courses = json; this.courses = json;
......
...@@ -9,6 +9,8 @@ document.addEventListener('DOMContentLoaded', () => { ...@@ -9,6 +9,8 @@ document.addEventListener('DOMContentLoaded', () => {
defaultView: 'agendaWeek', defaultView: 'agendaWeek',
header: false, header: false,
events: renderEvents, events: renderEvents,
columnHeaderFormat: 'dddd',
allDaySlot: false,
}); });
} }
...@@ -20,7 +22,7 @@ const renderEvents = (start, end, timezone, callback) => { ...@@ -20,7 +22,7 @@ const renderEvents = (start, end, timezone, callback) => {
}; };
const remove = async item => { const remove = async item => {
await window.cart.addSection({ ...item.dataset }); await window.cart.toggleSection({ ...item.dataset });
location.reload(true); location.reload(true);
}; };
...@@ -33,13 +35,15 @@ const setUrlInModal = () => { ...@@ -33,13 +35,15 @@ const setUrlInModal = () => {
}; };
const downloadIcs = async () => { const downloadIcs = async () => {
const response = await fetch(`http://localhost:3000/api/schedules?section_ids=${window.cart._courses.join(',')}`); const response = await fetch(`${window.location.protocol}//${window.location.hostname}/api/schedules?section_ids=${window.cart._courses.join(',')}`);
const text = await response.text(); const text = await response.text();
const blob = new Blob([text], { type: 'text/calendar;charset=utf-8' }); const blob = new Blob([text], { type: 'text/calendar;charset=utf-8' });
saveAs(blob, 'GMU Schedule.ics'); saveAs(blob, 'GMU Schedule.ics');
}; };
const addToSystemCalendar = () => {}; const addToSystemCalendar = () => {
window.open(`webcal://${window.location.hostname}:3000/api/schedules?section_ids=${window.cart._courses.join(',')}`);
};
const initListeners = () => { const initListeners = () => {
const items = Array.from(document.querySelectorAll('.section-item')); const items = Array.from(document.querySelectorAll('.section-item'));
......
...@@ -9,11 +9,15 @@ const addOrRemoveFromCart = async (event, sectionNode) => { ...@@ -9,11 +9,15 @@ const addOrRemoveFromCart = async (event, sectionNode) => {
event && event.stopPropagation(); event && event.stopPropagation();
const section = { ...sectionNode.dataset }; const section = { ...sectionNode.dataset };
await this.cart.addSection(section); await this.cart.toggleSection(section);
const icon = $(sectionNode.querySelector('.add-remove-btn #icon'));
const text = sectionNode.querySelector('.add-remove-btn .text');
if (this.cart.includesSection(section)) { if (this.cart.includesSection(section)) {
sectionNode.classList.add('selected'); icon.addClass('fa-minus').removeClass('fa-plus');
text.innerText = 'Remove';
} else { } else {
sectionNode.classList.remove('selected'); icon.addClass('fa-plus').removeClass('fa-minus');
text.innerText = 'Add';
} }
}; };
......
...@@ -87,3 +87,6 @@ body { ...@@ -87,3 +87,6 @@ body {
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.075) inset, 0px 0px 0px rgba(0, 0, 255, 0.5); box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.075) inset, 0px 0px 0px rgba(0, 0, 255, 0.5);
} }
.quick-add-header {
margin-top: 32px;
}
...@@ -12,4 +12,14 @@ ...@@ -12,4 +12,14 @@
#logo { #logo {
font-size: 24pt; font-size: 24pt;
color: black; color: black;
white-space: nowrap;
margin-right: 8px;
}
#semester-select {
min-width: 100px;
}
#cart-button {
margin-top: 24px;
} }
...@@ -2,6 +2,8 @@ ...@@ -2,6 +2,8 @@
background-color: white; background-color: white;
padding: 16px; padding: 16px;
margin-bottom: 8px; margin-bottom: 8px;
margin-top: 8px;
min-width: 800px;
} }
.section-item.selected { .section-item.selected {
......
...@@ -4,15 +4,18 @@ ...@@ -4,15 +4,18 @@
.section-item:hover { .section-item:hover {
transition: 0.15s; transition: 0.15s;
background-color: lightgray; border-style: solid;
} border-width: 2px;
border-color: lightgray;
.section-item.selected {
transition: 0.15s;
background-color: lightgreen;
} }
.section-item.selected:hover { // .section-item.selected {
transition: 0.15s; // transition: 0.15s;
background-color: rgba(255, 0, 0, 0.6); // background-color: lightgreen;
} // }
// .section-item.selected:hover {
// transition: 0.15s;
// background-color: rgba(255, 0, 0, 0.6);
// }
...@@ -9,15 +9,14 @@ ...@@ -9,15 +9,14 @@
<div class="icon"> <div class="icon">
<i class="fa fa-book"></i> <i class="fa fa-book"></i>
</div> </div>
3 credits <%= @course.credits %> credits
</div> </div>
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;
<div class="attr"> <div class="attr">
<div class="icon"> <div class="icon">
<i class="fa fa-bars"></i> <i class="fa fa-bars"></i>
</div> </div>
<!-- TODO: FIX THIS --> <%= @course.course_sections.count %> sections
<%#= "#{course.section_count}" %> 3 sections
</div> </div>
</div> </div>
</div> </div>
......
<h1>Welcome to Schedules!</h1> <div class="jumbotron text-center">
<p>Schedules is a website built by <a href="https://srct.gmu.edu">Mason SRCT</a> designed to help students explore the GMU Catalog.</p> <h1>SRCT Schedules</h1>
Search for either courses or professors using the search bar above. <p class="lead">Build, share, and export your schedule. Search for classes and professors.</p>
<br/> <hr>
<p></p> <p>
Schedules was built by <a href="https://srct.gmu.edu">Mason SRCT</a> and is completely open source.<br/>
Want to contribute? View the code on the <a href="https://git.gmu.edu/srct/schedules">SRCT GitLab</a>.
</p>
</div>
<div class="row">
<div class="col-md-4">
<div class="card">
<div class="card-body">
<h5 class="card-title">Powerful search</h5>
<p class="card-text">Want to see what courses your favorite professor is teaching this semester? Or what they've taught in the past? Search for any professor that's taught at Mason easily.</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card">
<div class="card-body">
<h5 class="card-title">Search classes</h5>
<p class="card-text">Looking for cool electives? Want to see who's teaching a class you're looking to take? Search for classes using keywords, subject, or the subject and course number.</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card">
<div class="card-body">
<h5 class="card-title">Export your schedule</h5>
<p class="card-text">Select the courses you're taking this semester and see them in a beautiful calendar view. Easily export your schedule to your favorite calendar apps. Schedules even knows about breaks!</p>
</div>
</div>
</div>
</div>
<h3>Quick add</h3> <h3 class="quick-add-header">Quick add</h3>
<p>Want to quickly generate a calendar populated with your semester's classes? Enter the CRNs in a comma separated list below.</p> <p>Want to quickly generate a calendar populated with your semester's classes? Enter the CRNs in a comma separated list below.</p>
<form action="/sessions/add_bulk" class="form"> <form action="/sessions/add_bulk" class="form">
<div class="input-group"> <div class="input-group">
<input <input
id="crns" id="crns"
name="crns" name="crns"
type="text" type="text"
class="form-control" class="form-control"
placeholder="12345,54321,..." placeholder="12345,54321,..."
aria-describedby="basic-addon2" aria-describedby="basic-addon2"
autocomplete="off" autocomplete="off"
> >
<div class="input-group-append"> <div class="input-group-append">
<button type="submit" class="btn btn-primary" type="button"> <button type="submit" class="btn btn-primary" type="button">
......
<div class="row"> <div class="row">
<div class="col-lg-4 col-12"> <div class="col-lg-4 col-12">
<h1><%= @instructor.name %></h1> <h1><%= @instructor.name %></h1>
<% prev = @instructor.course_sections.map(&:course).reject { |c| c.semester == @semester } %> <% prev = @instructor.course_sections.map(&:course).uniq.reject { |c| c.semester == @semester } %>
<% if prev.count.positive? %> <% if prev.count.positive? %>
<strong>Previously taught: </strong> <strong>Previously taught: </strong>
......
...@@ -10,6 +10,23 @@ ...@@ -10,6 +10,23 @@
<%= stylesheet_link_tag 'masonstrap.min' %> <%= stylesheet_link_tag 'masonstrap.min' %>
<%= stylesheet_link_tag 'application' %> <%= stylesheet_link_tag 'application' %>
<!-- FB/Opengraph tags -->
<meta property="og:url" content="https://schedules.gmu.edu/">
<meta property="og:type" content="website">
<meta property="og:title" content="SRCT Schedules">
<meta property="og:description" content="Easily generate a calendar with your class schedule.">
<meta property="og:site_name" content="SRCT Schedules">
<meta property="og:locale" content="en_US">
<meta property="article:author" content="SRCT">
<!-- Twitter card tags -->
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@MasonSRCT">
<meta name="twitter:creator" content="@MasonSRCT">
<meta name="twitter:url" content="https://schedules.gmu.edu/">
<meta name="twitter:title" content="SRCT Schedules">
<meta name="twitter:description" content="Easily generate a calendar with your class schedule.">
</head> </head>
<body> <body>
...@@ -17,6 +34,21 @@ ...@@ -17,6 +34,21 @@
<%= render 'shared/page' do %> <%= render 'shared/page' do %>
<%= yield %> <%= yield %>
<% end %> <% end %>
<%= render partial: 'shared/cart'%>
<!-- Matomo -->
<script type="text/javascript">
var _paq = _paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//matomo.srct.gmu.edu/";
_paq.push(['setTrackerUrl', u+'piwik.php']);
_paq.push(['setSiteId', '3']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<!-- End Matomo Code -->
</body> </body>
</html> </html>
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
<button id="open-modal-btn" type="button" class="btn btn-primary" data-toggle="modal" data-target="#exportModal"> <button id="open-modal-btn" type="button" class="btn btn-primary" data-toggle="modal" data-target="#exportModal">
Generate Schedule Export Schedule
</button> </button>
<div id="calendar"></div> <div id="calendar"></div>
<h3>Quick add</h3> <h3>Quick add</h3>
...@@ -72,7 +72,7 @@ ...@@ -72,7 +72,7 @@
<h5>.ics file</h5> <h5>.ics file</h5>
To download a .ics file containing your schedule, click the "Download calendar file" button below. To download a .ics file containing your schedule, click the "Download calendar file" button below.
</div> </div>
<div class="modal-footer"> <div class="modal-footer flex">
<button id="download-ics" type="button" class="btn btn-secondary">Download calendar file</button> <button id="download-ics" type="button" class="btn btn-secondary">Download calendar file</button>
<button id="add-to-system" type="button" class="btn btn-primary">Add to system calendar</button> <button id="add-to-system" type="button" class="btn btn-primary">Add to system calendar</button>
</div> </div>
......
<div class="container-fluid"> <div id="navbar" class="container-fluid">
<div class="row align-left align-sm-center align-md-right" id="navbar"> <div class="row align-left align-sm-center align-md-right" id="navbar">
<div class="col align-center"> <div class="col align-center">
<div class="center-vert"> <div class="center-vert">
...@@ -6,10 +6,12 @@ ...@@ -6,10 +6,12 @@
<i class="fas fa-calendar-alt"></i> <i class="fas fa-calendar-alt"></i>
Schedules Schedules
</a> </a>
&nbsp;&nbsp; <select id="semester-select" class="custom-select">
<select id="semester-select">
<% Semester.all.each do |semester| %> <% Semester.all.each do |semester| %>
<option value="<%= semester.id %>" <% if @semester == semester %> selected <% end %> > <option
value="<%= semester.id %>"
<% if @semester == semester %> selected <% end %>
>
<%= "#{semester.season} #{semester.year}" %> <%= "#{semester.season} #{semester.year}" %>
</option> </option>
<% end %> <% end %>
...@@ -19,7 +21,7 @@ ...@@ -19,7 +21,7 @@
<div class="col-sm align-center order-0 order-sm-1"> <div class="col-sm align-center order-0 order-sm-1">
<a id="cart-button" href="<%= schedule_path %>"> <a id="cart-button" href="<%= schedule_path %>">
<h1 style="margin-top:24px"> <h1>
<span class="fa-layers fa-fw" id="schedule-icon"> <span class="fa-layers fa-fw" id="schedule-icon">
<i class="fas fa-shopping-cart"></i> <i class="fas fa-shopping-cart"></i>
<span class="fa-layers fa-fw"> <span class="fa-layers fa-fw">
...@@ -47,7 +49,7 @@ ...@@ -47,7 +49,7 @@
autocomplete="off" autocomplete="off"
> >
<div class="input-group-append"> <div class="input-group-append">
<button class="btn btn-secondary" type="button"> <button type="submit" class="btn btn-secondary" type="button">
<i class="fas fa-search"></i> <i class="fas fa-search"></i>
</button> </button>
</div> </div>
......
<li id="section-<%= section.id %>" <li id="section-<%= section.id %>"
class="list-group-item section-item <%= "selected" if in_cart? section.id %>" class="list-group-item section-item"
data-crn="<%= section.crn %>" data-crn="<%= section.crn %>"
data-id="<%= section.id %>" data-id="<%= section.id %>"
data-cid="<%= course.id if defined?(course) %>" data-cid="<%= course.id if defined?(course) %>"
data-type="<%= section.section_type %>" data-type="<%= section.section_type %>"
> >
<span style="float:left"><b class="subj"><%= "#{section.name}" %></b>: <%= section.title %></span> <p><b class="subj"><%= "#{section.name}" %></b>: <%= section.title %></p>
<span style="float:right"><i class="fas fa-map-marker-alt"></i> <%= section.location %></span>
<div style="clear: both"></div> <% if in_cart? section.id %>
<span style="float:left"><i class="fas fa-chalkboard-teacher"></i> <%= link_to section.instructor.name, section.instructor %></span> <span class="float-right text-center add-remove-btn"><i id="icon" class="fas fa-minus"></i><br/><span class="text">Remove</span></span>
<span style="float:right"><i class="fas fa-clock"></i> <%= "#{section.days}, #{section.start_time}-#{section.end_time}" %></span> <% else %>
<div style="clear: both"></div> <span class="float-right text-center add-remove-btn"><i id="icon" class="fas fa-plus"></i><br/><span class="text">Add</span></span>
<% end %>
<i class="fas fa-chalkboard-teacher"></i> <%= link_to section.instructor.name, section.instructor %> <br/>
<i class="fas fa-map-marker-alt"></i> <%= section.location %> <br/>
<i class="fas fa-clock"></i> <%= "#{section.days}, #{section.start_time}-#{section.end_time}" %> <br/>
</li> </li>
...@@ -4,10 +4,6 @@ Rails.application.configure do ...@@ -4,10 +4,6 @@ Rails.application.configure do
# Code is not reloaded between requests. # Code is not reloaded between requests.
config.cache_classes = true config.cache_classes = true
config.action_controller.default_url_options = {
host: ENV['HTTP_HOST'] || 'localhost'
}
# Eager load code on boot. This eager loads most of Rails and # Eager load code on boot. This eager loads most of Rails and
# your application in memory, allowing both threaded web servers # your application in memory, allowing both threaded web servers
# and those relying on copy on write to perform better. # and those relying on copy on write to perform better.
......
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