Release 3.2

.env.example

@@ -51,9 +51,11 @@ STORAGE_BUCKET=
 # Disabling default schema won't work if custom schema does not exist.
 ENABLE_DEFAULT_SCHEMA=1
 
-# String template that will be interpolated on the client using two route params,
-# repositoryId and activityId.
-PREVIEW_URL=https://myserver.com/repository/{repositoryId}/activity/{activityId}
+# LMS preview route
+PREVIEW_URL=https://boutique.localhost/api/v1/preview/
+
+# Logger
+LOG_LEVEL='info'
 
 # Terminal (forcefully enable color)
 FORCE_COLOR=1

.eslintrc.js

@@ -1,3 +1,5 @@
+'use strict';
+
 const isDev = process.env.NODE_ENV === 'development';
 
 module.exports = {
@@ -29,10 +31,9 @@ module.exports = {
       anonymous: 'always',
       named: 'never'
     }],
-    // 'sort-imports': ['error', {
-    //   'ignoreCase': true,
-    //   'ignoreMemberSort': false
-    // }]
+    'sort-imports': ['error', {
+      'ignoreCase': true
+    }],
     // Vue rules
     'vue/html-self-closing': 'off',
     'vue/attribute-hyphenation': 'off',

README.md

@@ -5,7 +5,7 @@
 [![Known Vulnerabilities](https://snyk.io/test/github/ExtensionEngine/tailor/develop/badge.svg)](https://snyk.io/test/github/ExtensionEngine/tailor)
 [![GitHub license](https://badgen.net/github/license/ExtensionEngine/tailor)](https://github.com/ExtensionEngine/tailor/blob/develop/LICENSE)
 [![js semistandard style](https://badgen.net/badge/code%20style/semistandard/pink)](https://github.com/Flet/semistandard)
-[![Open Source Love](https://badges.frapsoft.com/os/v2/open-source.svg?v=102)](https://github.com/ellerbrock/open-source-badge/)
+[![Open Source Love](https://badgen.net/badge/Open%20Source/%E2%9D%A4/3eaf8e)](https://github.com/ellerbrock/open-source-badge/)
 
 Adaptive course authoring platform.
 

build/plugins/html-version-spec.js

@@ -14,21 +14,21 @@ exports.apply = ({ config, pkg }) => {
       return getVersion(pkg);
     }
   };
-  if (isObject(config.html)) {
-    return Object.assign(config.html, { meta });
-  }
   if (isObject(config.pages)) {
     return forEach(config.pages, page => Object.assign(page, { meta }));
   }
+  const { output } = config;
+  output.html = output.html || {};
+  Object.assign(output.html, { meta });
 };
 
 function getVersion(pkg) {
-  const semver = pkg.data.version;
+  const { codename, version } = pkg.data;
   try {
     const rev = execSync('git', ['rev-parse', '--short', 'HEAD']);
-    return `${semver}-rev-${rev}`;
+    return `${version}-rev-${rev} (${codename})`;
   } catch (err) {
     console.error(err);
   }
-  return `${semver}`;
+  return `${version} (${codename})`;
 }

client/App.vue

@@ -11,14 +11,16 @@
 <script>
 import ConfirmationModal from 'components/common/ConfirmationModal';
 import isIexplorer from 'is-iexplorer';
+import { mapState } from 'vuex';
 import Navbar from 'components/common/Navbar';
-import { mapGetters } from 'vuex-module';
 
 if (isIexplorer) document.body.classList.add('ie');
 
 export default {
   name: 'app',
-  computed: mapGetters(['user']),
+  computed: mapState({
+    user: state => state.auth.user
+  }),
   components: {
     ConfirmationModal,
     Navbar
@@ -40,20 +42,20 @@ html {
 
 #app {
   color: rgba(0,0,0,0.87);
-  font-family: Poppins, Helvetica, Arial, sans-serif;
+  font-family: $font-family-primary;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   text-align: center;
   overflow: hidden;
 }
 
-.v-content .view {
-  overflow-y: scroll;
-  overflow-y: overlay;
-}
-
 .application, .v-content, .view {
   width: 100%;
   height: 100%;
 }
+
+.v-content .view {
+  overflow-y: scroll;
+  overflow-y: overlay;
+}
 </style>

client/api/activity.js

@@ -5,6 +5,12 @@ function getActivities(courseId, params) {
     .then(res => res.data.data);
 }
 
+function createPreview(courseId, activityId) {
+  return request.get(`courses/${courseId}/activities/${activityId}/preview`)
+    .then(res => res.data.location);
+}
+
 export default {
+  createPreview,
   getActivities
 };

client/api/user.js

@@ -0,0 +1,26 @@
+import request from './request';
+
+const extractData = res => res.data.data;
+
+function fetch(params) {
+  return request.get('/users', { params }).then(extractData);
+}
+
+function upsert(data) {
+  return request.post('/users', data).then(extractData);
+}
+
+function remove({ id }) {
+  return request.delete(`/users/${id}`);
+}
+
+function reinvite({ id }) {
+  return request.post(`/users/${id}/reinvite`);
+}
+
+export default {
+  fetch,
+  upsert,
+  remove,
+  reinvite
+};

client/assets/stylesheets/common/_variables.scss

@@ -4,3 +4,8 @@ $font-weight-regular: 400;
 $font-weight-medium: 500;
 $font-weight-semibold: 600;
 $font-weight-bold: 700;
+
+// Font family
+$font-family-icons: "Material Design Icons";
+$font-family-primary: Poppins, Helvetica, Arial, sans-serif;
+$font-family-secondary: Roboto, Helvetica, Arial, sans-serif;

client/components/auth/Container.vue

@@ -1,24 +1,22 @@
 <template>
   <div class="auth-container">
-    <div class="auth-panel">
+    <div class="auth-panel elevation-2">
       <div class="auth-header">
-        <img :src="logo" alt="Logo"/>
+        <img :src="logo" alt="Logo" class="logo">
         <h1>{{ title }}</h1>
       </div>
       <div class="auth-body">
-        <router-view></router-view>
+        <router-view/>
       </div>
     </div>
   </div>
 </template>
 
 <script>
 export default {
-  data() {
-    return {
-      title: BRAND_CONFIG.TITLE,
-      logo: BRAND_CONFIG.LOGO_FULL
-    };
+  computed: {
+    title: () => BRAND_CONFIG.TITLE,
+    logo: () => BRAND_CONFIG.LOGO_FULL
   }
 };
 </script>
@@ -29,48 +27,41 @@ export default {
 }
 
 .auth-panel {
-  width: 440px;
+  width: 480px;
   margin: auto;
   background-color: #fff;
-  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
   border-radius: 4px;
-  transition: all 0.3s cubic-bezier(0.25,0.8,0.25,1);
-
-  &:hover {
-    box-shadow: 0 6px 10px rgba(0,0,0,0.2), 0 6px 8px rgba(0,0,0,0.22);
-  }
-
-  img {
-    width: 130px;
-    margin: 15px 0 10px;
-  }
 
   h1 {
     margin: 0;
     color: white;
     font-size: 22px;
-    line-height: 18px;
   }
 
   .auth-header {
     padding-bottom: 20px;
-    background: linear-gradient(90deg, $brandColor 65%, $altBrandColor);
+    background-color: var(--v-primary-darken1);
     border-radius: 4px 4px 0 0;
+
+    .logo {
+      width: 75px;
+      margin: 30px 0;
+    }
   }
 
   .auth-body {
-    padding: 20px 30px;
+    padding: 25px 30px;
 
     a {
       color: inherit;
-      font-weight: 500;
+      font-weight: 400;
     }
   }
 
   .message {
     min-height: 16px;
     margin-bottom: 20px;
-    color: #da126d;
+    color: var(--v-secondary-base);
     font-size: 16px;
     line-height: 16px;
   }