dsm-portfolio-theme 0.1.4 → 0.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 93b1d5e4f5bbf4efda233492143ae3cfc5edcc27
-  data.tar.gz: 6fc0cc3f20513e4f8621f897e1990d9ba232c629
+  metadata.gz: 4c22c3fafa27def4d92dc1f88d818a290a9f19d1
+  data.tar.gz: 31d9294eb0928b0237a88ad2be62fdcc346cd8f2
 SHA512:
-  metadata.gz: b25f1a073bfafae064ccd5ae658f2e15d9333d7ac0f974e7e05391e4fbfa6d0c6a6b7a3a18281e1433210e8a0e406ccdfea4df39ffbfce3ac7affe0d4809f186
-  data.tar.gz: 8ee80aa88dcee2088494b56d2f72b52c73f91d9a3b89cada146d88bf255477cdf45175680e13a39d23c60a4383bc5f317a0e6b945e0c0916f7c797fcb96caf45
+  metadata.gz: bd3908a5f426ae686ebba5fa8ecc18e86115db502a76c0036a3f79bd8c80c21cba3ae1e662fbf559507baa2853826a566689330cd9eacb6ca0f9dc5edee14b35
+  data.tar.gz: e7b03efa7b07a2d351b9e78d4d7342b90961a1242f34064a0f620555152b70d725ad1b7dc40cb9d92231dd642ac8e3e45fa67fe69c24cc4b64e455a059df0c92

data/README.md

@@ -1,21 +1,7 @@
-# dsm-portfolio
+# dsm-portfolio-theme
 
-Describe the work here...
+[![Gem Version](https://badge.fury.io/rb/dsm-portfolio-theme.svg)](https://badge.fury.io/rb/dsm-portfolio-theme)
 
-The theme is the main body of work.
+The theme used for the dsm-portfolio-project.
 
-The site is a pre-generated site using the theme, with dummy information to be altered by users.
-
-## Usage
-
-See 'USAGE.md' in 'docs', which describes how to use this repository to maintain a portfolio of submissions.
-
-## Contributing
-
-See 'MODIFICATIONS.md' in 'docs', which describes how to alter the repository.
-
-## Legal
-
-See 'LEGAL.md' in 'docs', which describes licensing and attributions.
-
-### All information is duplicated in the repository's ['wiki'](#) and the theme iteslf.
+Read the [hosted about page](https://joshhills.github.io/dsm-portfolio-site/about) for usage, modification and legal information.

data/_includes/breadcrumbs.html

@@ -0,0 +1,11 @@
+<div class="row">
+    <div class="col">
+        <nav aria-label="breadcrumb">
+            <ol class="breadcrumb">
+                <li class="breadcrumb-item"><a href="{{ '/' | relative_url }}">Portfolio</a></li>
+                <li class="breadcrumb-item">{{ page.project_title }}</li>
+                <li class="breadcrumb-item active" aria-current="page">{{ page.type | capitalize }}</li>
+            </ol>
+        </nav>
+    </div>
+</div>    

data/_includes/competencies.html

@@ -0,0 +1,28 @@
+<div class="table-responsive">
+    <table class="table">
+        <tr>
+            <th>Id</th>
+            <th>Title</th>
+            <th>Description</th>
+            <th>Categories</th>
+        </tr>
+        {% for competency in site.data.competencies %}
+        <tr id="{{ competency.id }}">
+            <td>
+                {{ competency.id }}
+            </td>
+            <td>
+                {{ competency.title }}
+            </td>
+            <td>
+                {{ competency.description }}
+            </td>
+            <td>
+                {% for category in competency.categories %}
+                    {{ category }}<br/>
+                {% endfor %}
+            </td>
+        </tr>
+        {% endfor %}
+    </table>
+</div>

data/_includes/navigation.html

@@ -0,0 +1,42 @@
+<nav class="navbar navbar-expand-lg navbar-light bg-light">
+    <a class="navbar-brand" href="{{ '/' | relative_url }}">Portfolio</a>
+    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+        <span class="navbar-toggler-icon"></span>
+    </button>
+    <div class="collapse navbar-collapse" id="navbarSupportedContent">
+        <ul class="navbar-nav ml-auto">
+            {% assign page_url = page.url | replace: ".html","" %}
+            <li class="nav-item {% if page_url == '/progression' %}active{% endif %} mr-2">
+                <a class="nav-link" href="{{ '/progression' | relative_url }}">
+                    Progression
+                </a>
+            </li>
+            <li class="nav-item {% if page_url == '/projects' %}active{% endif %} mr-2">
+                <a class="nav-link" href="{{ '/projects' | relative_url }}">
+                    Projects
+                </a>
+            </li>
+            <li class="nav-item {% if page_url == '/competencies' %}active{% endif %}">
+                <a class="nav-link" href="{{ '/competencies' | relative_url }}">
+                    Competencies
+                </a>
+            </li>
+            <li>
+                <a class="nav-link disabled" href="#">|</a>
+            </li>
+            {% for navigation-link in site.data.navigation-links %}
+            <li class="nav-item {% if page_url == navigation-link.url %}active{% endif %} {% unless forloop.last %}mr-2{% endunless %}">
+                {% if navigation-link.external %}
+                <a class="btn btn-outline-primary" href="{{ navigation-link.url | relative_url }}" target="_blank">
+                    {{ navigation-link.title }}
+                </a>
+                {% else %}
+                <a class="nav-link" href="{{ navigation-link.url | relative_url }}" target="_self">
+                    {{ navigation-link.title }}
+                </a>
+                {% endif %}
+            </li>
+            {% endfor %}
+        </ul>
+    </div>
+</nav>

data/_includes/notice.html

@@ -0,0 +1,7 @@
+{% assign page_url = page.url | replace: ".html","" %}
+
+{% if site.data.notices[page_url] %}
+<p>
+    {{ site.data.notices[page_url] }}
+<p>
+{% endif %}

data/_includes/project-list.html

@@ -1,29 +1,73 @@
-<!-- List all projects in collection -->
-<div class="o-project-list">
-    <h2>
-        Projects
-    </h2>
-    <div class="">
-        <!-- Group posts by subdirectory (parent project Id) -->
+<div class="row">
+    <div class="col">
+        <h2 class="mb-4">
+            Submitted Projects
+        </h2>
+        {% assign truncate_value = site.project_description_truncation | default: 64 %}
         {% assign postsByProject = site.posts | group_by_exp: "post", "post.project_id" %}
-        {% for project in postsByProject %}
-            <div class="">
-                <p class="">
-                    <!-- Date of submission -->
-                    {{ project.items[0].date | date: "%d-%m-%Y" }}
-                </p>
-                <div class="">
-                    <!-- Project details -->
-                    <h3 class="">
-                        {{ project.items[0].project_title }}
-                    </h3>
-                    <div class="">
+        {% if postsByProject.size > 0 %}
+            {% for project in postsByProject %}
+                {% if project.items[0].project_code != -1 %}
+                    {% assign linked_project = site.data.projects | where:"id", project.items[0].project_code | first %}
+                    {% assign projectType = "Academic Project" %}
+                    {% if linked_project and linked_project.deadline %}
+                        {% assign today_date = 'now' | date: '%s' %}
+                        {% assign pre_date = linked_project.deadline | date: '%s' %}
+                        {% if today_date < pre_date %}  
+                            {% assign days_until_deadline = pre_date | minus: today_date | divided_by: 3600 | divided_by: 24 | plus: 1 %}
+                            {% assign days_until_deadline = days_until_deadline | pluralize: "Day", "Days" %}
+                            {% assign incomplete = true %}
+                            {% assign classString = "border-warning" %}
+                        {% else %}
+                            {% assign incomplete = false %}
+                            {% assign classString = "" %}
+                        {% endif %}
+                    {% else %}
+                        {% assign classString = "border-primary" %}
+                        {% assign incomplete = false %}
+                    {% endif %}
+                {% else %}
+                    {% assign projectType = "Personal Project" %}
+                    {% assign classString = "" %}
+                    {% assign linked_project = nil %}
+                    {% assign incomplete = false %}
+                {% endif %}
+
+                {% for item in project.items %}
+                    {% if item.type == "summary" %}
+                        {% assign project_summary = item.excerpt %}
+                        {% break %}
+                    {% endif %}
+                {% endfor %}
+                <div class="card mb-4 {{ classString }}">
+                    <div class="card-body">
+                        <h5 class="card-title">{{ project.items[0].project_title }}</h5>
+                        {% if incomplete %}
+                            {% assign deadlineString = " | Deadline: " | append: linked_project.deadline | append: " (" | append: days_until_deadline | append: ")" %}
+                        {% else %} 
+                            {% assign deadlineString = "" %}
+                        {% endif %}
+                        <h6 class="card-subtitle mb-2 text-muted">{{ project.items[0].date | date: "%d-%m-%Y" }}{{ deadlineString }}</h6>
+                        <p class="card-text"><small class="text-muted text-primary">{{ projectType }}</small></p>
+                        {% if project_summary %}   
+                            <p class="card-text">{{ project_summary | truncatewords: truncate_value }}</p>
+                        {% elsif linked_project and linked_project.description %}
+                            <p class="card-text">{{ linked_project.description | truncatewords: truncate_value }}</p>
+                        {% endif %}
                         {% for file in project.items %}
-                            <a class="" href="{{ file.url | relative_url }}">{{ file.type | capitalize }}</a>
+                            <a class="card-link" href="{{ file.url | relative_url }}">{{ file.type | capitalize }}{% if file.type == "vignette" and file["vignettes"].size > 0 %}
+                                    <span class="badge badge-primary">{{file["vignettes"].size}}</span>
+                                    {% endif %}</a>
                         {% endfor %}
                     </div>
                 </div>
+                {% assign project_summary = nil %}
+            {% endfor %}
             </div>
-        {% endfor %}
+        {% else %}
+            <p class="lead">
+                No projects found. See <a href="{{ '/about' | relative_url }}">about</a> to find out how to make them.
+            </p>
+        {% endif %}
     </div>
 </div>

data/_includes/projects.html

@@ -0,0 +1,32 @@
+<div class="table-responsive">
+    <table class="table">
+        <tr>
+            <th>Id</th>
+            <th>Title</th>
+            <th>Description</th>
+            <th>Deadline</th>
+            <th>Targets</th>
+        </tr>
+        {% for project in site.data.projects %}
+        <tr id="{{ project.id }}">
+            <td>
+                {{ project.id }}
+            </td>
+            <td>
+                {{ project.title }}
+            </td>
+            <td>
+                {{ project.description }}
+            </td>
+            <td>
+                {{ project.deadline | date: "%d-%m-%Y" }}
+            </td>
+            <td>
+                {% for target in project.targets %}
+                    {{ target }}<br/>
+                {% endfor %}
+            </td>
+        </tr>
+        {% endfor %}
+    </table>
+</div>

data/_includes/scripts.html

@@ -1,3 +1,7 @@
 {% if page['type'] == 'vignette' %}
     <script src="{{ "/assets/scripts/vignette.js" | relative_url }}" type="text/javascript"></script>
-{% endif %}
+{% endif %}
+
+<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
+<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>

data/_layouts/default.html

@@ -4,25 +4,23 @@
         <!-- Meta-->
         <meta charset="UTF-8">
         <meta http-equiv="X-UA-Compatible" content="IE=edge">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-
-        <!-- TODO: SEO-->
+        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 
         <!-- Styles -->
         <link rel="stylesheet" href="{{ "/assets/styles/main.css" | relative_url }}">
-
+        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
+        <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
     </head>
-    <body>
-        <!-- Header-->
-        {% include header.html %}
-
-        <!-- Wrapper Content -->
-        {{ content }}
-
-        <!-- Footer -->
-        {% include footer.html %}
-        
-        <!-- Scripts -->
-        {% include scripts.html %}
+    <body data-spy="scroll" data-target="#index" data-offset="0">
+        <div class="container">
+            {% include navigation.html %}
+            <div class="row p-4">
+                <div class="col">
+                    {{ content }}
+                </div>
+            </div>
+            <!-- Scripts -->
+            {% include scripts.html %}
+        </div>
     </body>
 </html>

data/_layouts/examples/summary-example.md

@@ -0,0 +1,17 @@
+---
+layout: summary
+length: X Months
+# notebook_file: demo.ipynb
+external_resources:
+- url: "#"
+  title: Resource One
+- url: "#"
+  title: Resource Two
+tags:
+- Example Tag One
+- Example Tag Two
+---
+
+This is a place to write a summary of your project - an abstract, and examples. Anything can be included, and bespoke sections have been pinned to the side. This is a great place to demonstrate capabilities to your peers and potential employers.
+
+To link a notebook file place it in <code>assets/notebooks</code>, and then reference it's filename in the front-matter as <code>notebook_file</code>.

data/_layouts/examples/vignette-example.md

@@ -0,0 +1,8 @@
+---
+layout: vignette
+# project_code: X
+---
+
+{% v %}
+Write your vignette blocks in chronological order using {% raw %}<code class="text-nowrap">{% v %} TEXT HERE {% endv %}</code>{% endraw %}, and tag competencies inside using {% raw %}<code class="text-nowrap">{% c COMPETENCY_ID %}</code>{% endraw %}.
+{% endv %}

data/_layouts/generate/about.html

@@ -0,0 +1,180 @@
+---
+layout: page
+---
+
+<div class="container">
+    <div class="row">
+        <div class="col-lg-3 mb-4">
+            <!-- About Navigation -->
+            <div class="row sticky-top t-1" style="top: 1rem">
+                <ul id="index" class="list-group container-fluid" style="padding-left: 15px">
+                    <a href="#about" class="list-group-item list-group-item-light flex-column align-items-start">
+                        <h5 class="mb-1">About</h5>
+                    </a>
+                    <a href="#usage" class="list-group-item">
+                        <h6 class="mb-1">Usage</h6>
+                    </a>
+                    <a href="#technology" class="list-group-item">Technology</a>
+                    <a href="#installation--forking" class="list-group-item">Installation & Forking</a>
+                    <a href="#altering-details" class="list-group-item">Altering Details</a>
+                    <a href="#creating-projects" class="list-group-item">Creating Projects</a>
+                    <a href="#progression" class="list-group-item">Progression</a>
+                    <a href="#hosting-on-github-pages" class="list-group-item">Hosting On Github Pages</a>
+                    <a href="#api" class="list-group-item">API</a>
+                    <a href="#modifications" class="list-group-item">
+                        <h6 class="mb-1">Modifications</h6>
+                    </a>
+                    <a href="#legal" class="list-group-item">
+                        <h6 class="mb-1">Legal</h6>
+                    </a>
+                    <a href="#attributions" class="list-group-item">
+                        <h6 class="mb-1">Attributions</h6>
+                    </a>
+                </ul>
+            </div>
+        </div>
+        <!-- Contents -->
+        <div class="col-lg">
+            <div class="row">
+                <div class="container">
+                    <h1>About</h1>
+                    {% include notice.html %}
+                    {% capture about_contents %}
+This guide provides a brief overview of how to use this portfolio. An example
+site has been provided to reduce the amount of pre-requisite knowledge needed,
+and the theme itself has been built with degradation in mind (meaning that 
+it should be easy to customise and somewhat hard to break!).
+
+The software is produced and maintained by [Josh Hills](mailto:josh@jargonify.com)
+(post-graduate), for the purpose of providing a modern solution to submitting and
+assessing work for the data science masters course at Newcastle University. It may
+be used beyond this scope - see [modifications](#modifications).
+
+## Usage
+
+### Technology
+
+[Jekyll](https://jekyllrb.com/) is a static-site generator running in the programming language Ruby.
+It can be run on any major platform.
+
+It uses the [Liquid](https://help.shopify.com/en/themes/liquid) templating engine. You write posts in Markdown, and they
+are converted to a folder containing your entire portfolio site. Data files are
+written in [YAML](http://yaml.org/).
+
+The site provides means for the academic institution to add information about
+projects, competencies, useful links and documentation. It provides means for
+students to extend this information, and submit associated work.
+
+It also provides an API to expose student progression for analysis.
+
+### Installation & Forking
+
+- Clone the example site
+- Install Ruby & Jekyll
+- Install & update gem dependencies using commands `bundle install && bundle update`
+- Run Jekyll using command `jekyll serve`
+- Access at `localhost:4000`
+- Every time the site builds it will generate the site at `_site`
+
+### Altering Details
+
+- In `config.yml`, edit user details
+- Overrides/extensions for data files can be added - see the [example folder](https://github.com/joshhills/dsm-portfolio-theme/tree/master/_data) in the demo project.
+
+### Creating Projects
+
+Writing any file for a project can be done using Markdown or HTML. See [cheatsheet](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet).
+
+- `jekyll project "NAME OF PROJECT"`
+- OR copy [example structure](https://github.com/joshhills/dsm-portfolio-theme/tree/master/_posts/2018-02-07-test-project-one) from demo project
+
+Note that the date is YYYY-MM-DD-title. This date should be when you start writing. If it is dated in the
+future it wont be included in the site.
+
+#### Summaries
+
+This is a place to summarise a project. You may write this in any format.
+
+By adding a Jupyter notebook file to `assets/notebooks` and including the name in
+the frontmatter, it will render below your summary.
+
+See the [example file](https://github.com/joshhills/dsm-portfolio-theme/blob/master/_posts/2018-02-07-test-project-one/summary.md) in the demo project.
+
+#### Vignettes
+
+This is a place to evaluate your project work, tagging relevant sections with
+the competencies you have satisfied.
+
+By linking your project submission to an academic project, it will pull in information
+from the data file such as skill targets, description and deadline. You can view all
+academic projects at [projects]({{ '/projects' | relative_url }}).
+
+Individual iterations on your evaluation within the page are created by using a custom
+'liquid' tag `{% raw %}{% v %} ... {% end v %}{% endraw %}`. When you have met a specific
+competency, you can include that in the evaluation using `{% raw %}{% c COMPETENCY_ID %}{% endraw %}`.
+You can view all competencies at [competencies]({{ '/competencies' | relative_url }}).
+
+See the [example file](https://github.com/joshhills/dsm-portfolio-theme/blob/master/_posts/2018-02-07-test-project-one/vignette.md) in the demo project.
+
+### Progression
+
+You can see an overview of all projects at [progression]({{ '/progression' | relative_url }}).
+
+### Hosting on Github Pages
+
+- `git init` in `_site`
+- Create branch `gh-pages`
+- Set remote to the same repository using command `git remote add origin git@github.com:username/repositoryname.git` 
+- Add, commit and push changes
+- View latest version of branch at `https://username.github.io/repositoryname/`
+
+### API
+
+The API and associated documentation pages are auto-generated upon build. Their documentation can be found [here]({{ '/api' | relative_url }}).
+
+## Modifications
+
+Administrators may fork the [theme](https://github.com/joshhills/dsm-portfolio-theme) in order to maintain an updated version of `_data` and other information. They may also fork the [site example]() in order to point this to their version of the theme. Pull requests made to the original of either will be accepted upon code review.
+
+
+Students should fork the [site example](https://github.com/joshhills/dsm-portfolio-site) for a quick set-up. Pull requests may be made to the original repository, however only modifications to the initial theme in the form of optional feature extensions (widgets) or bug-fixes will be accepted by students. Make sure that tests pass, and that no personal information is included.
+
+Issues raised represent feedback that may be taken into consideration during further development. Contact your course representatives for immediate concerns.
+
+## Legal
+
+This theme is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
+
+## Attributions
+
+- [jekyll](https://github.com/jekyll/jekyll) w/ MIT licence
+- [jekyll-jupyter-notebook](https://github.com/red-data-tools/jekyll-jupyter-notebook) by RED Data Tools w/ Apache 2.0 license
+- [jekyll-remote-theme](https://github.com/benbalter/jekyll-remote-theme) by Ben Balter w/ MIT license
+- [jekyll-data](https://github.com/ashmaroli/jekyll-data) by Ashwin Maroli w/ MIT
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+&nbsp;
+                    {% endcapture %}
+                    {{ about_contents | markdownify }}
+                </div>
+            </div>
+        </div>
+    </div>
+</div>