Commit 39fd59da authored by Arie Peterson's avatar Arie Peterson 🐚
Browse files

Extract long descriptions from edX course overviews

parent 352ea448
......@@ -26,3 +26,6 @@ gem 'mini_racer'
# Slim
# gem "slim", "~> 3.0"
# Html parsing
gem 'ruby-cheerio'
......@@ -86,9 +86,12 @@ GEM
middleman-sprockets (4.1.1)
middleman-core (~> 4.0)
sprockets (>= 3.0)
mini_portile2 (2.3.0)
mini_racer (0.1.14)
libv8 (~> 5.9)
minitest (5.10.3)
nokogiri (1.8.1)
mini_portile2 (~> 2.3.0)
padrino-helpers (0.13.3.4)
i18n (~> 0.6, >= 0.6.7)
padrino-support (= 0.13.3.4)
......@@ -103,6 +106,8 @@ GEM
rb-inotify (0.9.10)
ffi (>= 0.5.0, < 2)
redcarpet (3.4.0)
ruby-cheerio (0.0.5)
nokogiri
sass (3.4.25)
servolux (0.13.0)
sprockets (3.7.1)
......@@ -131,6 +136,7 @@ DEPENDENCIES
mini_racer
popper_js
redcarpet (~> 3.3, >= 3.3.3)
ruby-cheerio
BUNDLED WITH
1.11.2
......@@ -33,11 +33,41 @@ activate :sprockets
# Methods defined in the helpers block are available in templates
# https://middlemanapp.com/basics/helper-methods/
require 'ruby-cheerio'
helpers do
def edx_api_call(endpoint)
url = config[:edx_api_url] + endpoint
JSON.parse(open(url).read)
end
def get_courses
courses = JSON.parse(open(config[:edx_url]).read)
courses = courses.select { |course| not course['hidden'] }
return courses
courses = edx_api_call("courses/")
courses.select { |course| not course['hidden'] }
end
def get_course(course_id)
edx_api_call("courses/" + course_id)
end
def course_url(course_id)
config[:edx_url] + "/courses/" + course_id + "/about"
end
def extract_long_description(overview)
if not overview
return nil
end
if overview == ''
return nil
end
html = RubyCheerio.new(overview)
long_description = html.find('#long_description').first
if long_description
return long_description.html
else
return nil
end
end
end
......@@ -47,7 +77,8 @@ set :site_title, "Totem project"
# set :css_dir, 'stylesheets'
# set :js_dir, 'javascripts'
set :images_dir, 'img'
set :edx_url, "https://learn-dev.totem-project.org/api/courses/v1/courses/"
set :edx_url, "https://learn.totem-project.org"
set :edx_api_url, config[:edx_url] + "/api/courses/v1/"
# Build-specific configuration
# https://middlemanapp.com/advanced/configuration/#environment-specific-settings
......
......@@ -80,11 +80,13 @@ courses = get_courses()
<i class="fa fa-plus fa-3x"></i>
</div>
</div>
<img class="img-fluid" src="<%= course['media']['image']['small'] %>" onerror="this.onerror=null;this.src='<%= fallback_image %>';" alt="">
<img class="img-fluid" src="<%= course['media']['image']['small'] %>" onerror="this.onerror=null;this.src='<%= fallback_image %>';">
</a>
<div class="portfolio-caption">
<h4><%= course["name"] %></h4>
<p class="text-muted">topic</p>
<h4><%= course['name'] %></h4>
<% if course['short_description'] %>
<p class="text-muted"><%= course['description'] %></p>
<% end %>
</div>
</div>
<% end %>
......@@ -109,8 +111,17 @@ courses = get_courses()
<!-- Project Details Go Here -->
<h2><%= course['name'] %></h2>
<p class="item-intro text-muted"><%= course['short_description'] %></p>
<img class="img-fluid d-block mx-auto" src="<%= course['media']['image']['large'] %>" alt="">
<p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p>
<img class="img-fluid d-block mx-auto" src="<%= course['media']['image']['large'] %>" onerror="this.onerror=null;this.src='<%= fallback_image %>';">
<%
course_data = get_course(course['id'])
long_description = extract_long_description(course_data['overview'])
if long_description
%>
<p><%= long_description %></p>
<% else %>
<p>More information on this course is available on <a href="<%= course_url(course['id']) %>">the course page</a>.</p>
<% end %>
<ul class="list-inline">
<%
if (course['start_display'])
......@@ -122,9 +133,14 @@ courses = get_courses()
<li>Date: <%= date %></li>
<li>Organisation: <%= course['org'] %></li>
</ul>
<p>
<a class="btn btn-xl" href="<%= course_url(course['id']) %>">
<span>Enroll</span>
</a>
</p>
<button class="btn btn-primary" data-dismiss="modal" type="button">
<i class="fa fa-times"></i>
Close Project</button>
Close</button>
</div>
</div>
</div>
......@@ -209,7 +225,7 @@ courses = get_courses()
</div>
<div class="col-sm-4 text-center">
<img class="img-fluid" src="img/totem-logo.png" alt="">
<img class="img-fluid" src="img/totem-logo.png" alt="Totem logo">
</div>
<div class="col-sm-8 text-left">
......@@ -223,7 +239,7 @@ courses = get_courses()
<ul class="timeline">
<li>
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="img/about/1.jpg" alt="">
<img class="rounded-circle img-fluid" src="img/about/1.jpg">
</div>
<div class="timeline-panel">
<div class="timeline-heading">
......@@ -237,7 +253,7 @@ courses = get_courses()
</li>
<li class="timeline-inverted">
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="img/about/2.jpg" alt="">
<img class="rounded-circle img-fluid" src="img/about/2.jpg">
</div>
<div class="timeline-panel">
<div class="timeline-heading">
......@@ -251,7 +267,7 @@ courses = get_courses()
</li>
<li>
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="img/about/3.jpg" alt="">
<img class="rounded-circle img-fluid" src="img/about/3.jpg">
</div>
<div class="timeline-panel">
<div class="timeline-heading">
......@@ -265,7 +281,7 @@ courses = get_courses()
</li>
<li class="timeline-inverted">
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="img/about/4.jpg" alt="">
<img class="rounded-circle img-fluid" src="img/about/4.jpg">
</div>
<div class="timeline-panel">
<div class="timeline-heading">
......@@ -289,14 +305,14 @@ courses = get_courses()
<!-- about Greenhost and Free Press Unlimited-->
<div class="row">
<div class="col-sm-4 text-center">
<img class="img-fluid" src="img/greenhost.png" alt="">
<img class="img-fluid" src="img/greenhost.png" alt="Greenhost logo">
</div>
<div class="col-sm-8 text-left">
<h3>About Greenhost</h3>
<p class="text-end"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nisi mauris, vehicula quis nunc non, fringilla condimentum lectus. Curabitur velit ipsum, ornare interdum enim sit amet, posuere posuere dolor. Aenean lobortis luctus felis aliquam imperdiet. Curabitur rutrum urna enim, id fringilla nisl venenatis et. Maecenas neque diam, pulvinar et tristique vel, consequat ut mi. Suspendisse viverra placerat scelerisque. Nullam maximus, magna vel ultrices tincidunt, ligula eros consequat sapien, in porta ante leo eget mauris. Nam sollicitudin neque nec dolor ullamcorper sodales. Nunc condimentum urna vel consectetur laoreet. </p>
</div>
<div class="col-sm-4 text-center">
<img class="img-fluid" src="img/free-press-unlimited.png" alt="">
<img class="img-fluid" src="img/free-press-unlimited.png" alt="Free press unlimited logo">
</div>
<div class="col-sm-8 text-left">
<h3>About Free Press Unlimited</h3>
......
......@@ -25,6 +25,7 @@
<!-- Custom styles for this template -->
<%= stylesheet_link_tag "agency" %>
<%= stylesheet_link_tag "custom" %>
</head>
<body id="page-top">
<%= partial "partials/nav" %>
......
.portfolio-item img
{
height: 240px;
}
.portfolio-link
{
text-align: center;
}
Supports Markdown
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