@windward/integrations 0.0.2 → 0.0.4

package/components/Integration/Driver/Disabled.vue

@@ -0,0 +1,29 @@
+<template>
+    <div>
+        <h1>
+            {{
+                $t(
+                    'windward.integrations.components.integration.driver.disabled'
+                )
+            }}
+        </h1>
+    </div>
+</template>
+
+<script>
+import ManageBaseVue from './ManageBase.vue'
+
+export default {
+    name: 'ManageAtutorDriver',
+    components: {},
+    extends: ManageBaseVue,
+    data() {
+        return {
+            // formValid: true|false If this form is "complete" and passed validation on THIS component. Defined and watched in ManageBase.vue
+            // render: true|false If we should show the form aka when validation has passed. Defined and managed in ManageBase.vue
+            // integration: { metadata: {...} } The integration object to write to. Defined and loaded in ManageBase.vue
+        }
+    },
+    methods: {},
+}
+</script>

package/components/SecretField.vue

@@ -0,0 +1,50 @@
+<template>
+    <v-text-field :value="value" readonly :type="fieldType">
+        <template #append>
+            <v-btn icon @click="toggleClear">
+                <v-icon>{{ showClear ? 'mdi-eye-off' : 'mdi-eye' }}</v-icon>
+            </v-btn>
+            <v-btn v-if="copy" icon @click="copyText(value)">
+                <v-icon>mdi-content-copy</v-icon>
+            </v-btn>
+        </template>
+    </v-text-field>
+</template>
+
+<script>
+export default {
+    name: 'SecretField',
+    props: {
+        value: { type: String, required: false, default: '' },
+        hidden: { type: Boolean, required: false, default: true },
+        copy: { type: Boolean, required: false, default: true },
+    },
+    data() {
+        return {
+            showClear: false,
+        }
+    },
+
+    computed: {
+        fieldType() {
+            if (this.showClear) {
+                return 'text'
+            } else {
+                return 'password'
+            }
+        },
+    },
+    mounted() {
+        this.showClear = !this.hidden
+    },
+    methods: {
+        toggleClear() {
+            this.showClear = !this.showClear
+        },
+        copyText(text) {
+            navigator.clipboard.writeText(text || '')
+            this.$dialog.show(this.$t('shared.forms.copied'))
+        },
+    },
+}
+</script>

package/config/integration.config.js

@@ -1,4 +1,9 @@
 import Atutor from '../helpers/Driver/Atutor'
+import BlackboardUltra from '../helpers/Driver/BlackboardUltra'
+import Canvas from '../helpers/Driver/Canvas'
+import Desire2Learn from '../helpers/Driver/Desire2Learn'
+import Moodle from '../helpers/Driver/Moodle'
+import GoogleClassroom from '../helpers/Driver/GoogleClassroom'
 
 export default {
     /**
@@ -9,5 +14,11 @@ export default {
      */
     integrationDrivers: {
         atutor: { driver: Atutor },
+        atutor_wgu: { driver: Atutor },
+        canvas: { driver: Canvas },
+        blackboard_ultra: { driver: BlackboardUltra },
+        desire2learn: { driver: Desire2Learn },
+        moodle: { driver: Moodle },
+        google_classroom: { driver: GoogleClassroom },
     },
 }

package/helpers/Driver/BlackboardUltra.ts

@@ -0,0 +1,15 @@
+// @ts-ignore
+import Manage from '../../components/Integration/Driver/Disabled.vue'
+import DriverInterface, { IntegrationComponents } from './DriverInterface'
+import BaseDriver from './BaseDriver'
+
+export default class BlackboardUltra
+    extends BaseDriver
+    implements DriverInterface
+{
+    public components(): IntegrationComponents {
+        return {
+            Manage,
+        }
+    }
+}

package/helpers/Driver/Canvas.ts

@@ -0,0 +1,12 @@
+// @ts-ignore
+import Manage from '../../components/Integration/Driver/Disabled.vue'
+import DriverInterface, { IntegrationComponents } from './DriverInterface'
+import BaseDriver from './BaseDriver'
+
+export default class Canvas extends BaseDriver implements DriverInterface {
+    public components(): IntegrationComponents {
+        return {
+            Manage,
+        }
+    }
+}

package/helpers/Driver/Desire2Learn.ts

@@ -0,0 +1,15 @@
+// @ts-ignore
+import Manage from '../../components/Integration/Driver/Disabled.vue'
+import DriverInterface, { IntegrationComponents } from './DriverInterface'
+import BaseDriver from './BaseDriver'
+
+export default class Desire2Learn
+    extends BaseDriver
+    implements DriverInterface
+{
+    public components(): IntegrationComponents {
+        return {
+            Manage,
+        }
+    }
+}

package/helpers/Driver/GoogleClassroom.ts

@@ -0,0 +1,15 @@
+// @ts-ignore
+import Manage from '../../components/Integration/Driver/Disabled.vue'
+import DriverInterface, { IntegrationComponents } from './DriverInterface'
+import BaseDriver from './BaseDriver'
+
+export default class GoogleClassroom
+    extends BaseDriver
+    implements DriverInterface
+{
+    public components(): IntegrationComponents {
+        return {
+            Manage,
+        }
+    }
+}

package/helpers/Driver/Moodle.ts

@@ -0,0 +1,12 @@
+// @ts-ignore
+import Manage from '../../components/Integration/Driver/Disabled.vue'
+import DriverInterface, { IntegrationComponents } from './DriverInterface'
+import BaseDriver from './BaseDriver'
+
+export default class Moodle extends BaseDriver implements DriverInterface {
+    public components(): IntegrationComponents {
+        return {
+            Manage,
+        }
+    }
+}

package/i18n/en-US/components/external_integration/driver/lti1p1.ts

@@ -0,0 +1,26 @@
+export default {
+    key: 'Key',
+    secret: 'Secret',
+    auto_key: 'Autogenerated Key',
+    auto_secret: 'Autogenerated Secret',
+    target_url: 'Target Url',
+    launch_url: 'Launch Url',
+    new: 'New LTI Link',
+    edit: 'Edit LTI Link',
+    enabled: 'Enabled',
+    provider: 'Provider',
+    consumer: 'Consumer',
+    provider_panel: 'Provider (Students incoming to Windward)',
+    consumer_panel: 'Consumer (Students outgoing from Windward)',
+    role_map_panel: 'Role map',
+    role_in_host: 'Role in Host LMS',
+    role_in_local: 'Role in Windward',
+    remote_role: 'Remote Role name',
+    map_to_role: 'Map to Windward Role',
+    delete_role_map_item: 'Delete role map item',
+    add_role_map_item: 'Add role map item',
+    role_map_instructions:
+        'Only add roles to the below map if the host LMS uses different role names that you want to elevated permissions. Eg "Mentor" that you want to elevate to "External Instructor"',
+    role_map_warning:
+        'Only add roles to the below map if the host LMS uses different role names that you want to elevated permissions. Eg "Mentor" that you want to elevate to "External Instructor"',
+}

package/i18n/en-US/components/external_integration/index.ts

@@ -0,0 +1,5 @@
+import lti1p1 from './driver/lti1p1'
+
+export default {
+    driver: { lti1p1 },
+}

package/i18n/en-US/components/index.ts

@@ -1,7 +1,9 @@
 import navigation from './navigation'
 import integration from './integration'
+import externalIntegration from './external_integration'
 
 export default {
     navigation,
     integration,
+    external_integration: externalIntegration,
 }

package/i18n/en-US/components/integration/driver.ts

@@ -1,6 +1,6 @@
 export default {
     atutor: {
-        manage_dialog_title: 'Manage ATutor Driver',
+        manage_dialog_title: 'Manage ATutor Integration',
         url: 'ATutor API Url',
         url_hint: 'Eg: https://atutor.mindedgecollege.com',
         username: 'Username',
@@ -8,6 +8,24 @@ export default {
         aws_secure_url: 'AWS CDN Url',
         aws_secure_url_hint: 'Eg: https://cdn-d.mindedgecollege.com',
     },
+    atutor_wgu: {
+        manage_dialog_title: 'Manage ATutor WGU Integration',
+    },
+    canvas: {
+        manage_dialog_title: 'Manage Canvas Integration',
+    },
+    blackboard_ultra: {
+        manage_dialog_title: 'Manage Blackboard Ultra Integration',
+    },
+    desire2learn: {
+        manage_dialog_title: 'Manage Desire2Learn Integration',
+    },
+    moodle: {
+        manage_dialog_title: 'Manage Moodle Integration',
+    },
+    google_classroom: {
+        manage_dialog_title: 'Manage Google Classroom Integration',
+    },
     enabled: 'Integration Enabled',
     disabled: 'Integration Disabled',
     ssl_enabled: 'SSL Enabled (Should be enabled for production)',

package/i18n/en-US/pages/course/external_integration/index.ts

@@ -0,0 +1,6 @@
+export default {
+    title: 'External Integrations',
+    lti_1p1: 'LTI 1.1',
+    lti_1p3: 'LTI 1.3',
+    scorm_1p2: 'SCORM 1.2',
+}

package/i18n/en-US/pages/course/index.ts

@@ -0,0 +1,5 @@
+import externalIntegration from './external_integration'
+
+export default {
+    external_integration: externalIntegration,
+}

package/i18n/en-US/pages/index.ts

@@ -1,9 +1,13 @@
 import vendor from './vendor'
 import importCourse from './importCourse'
 import importContent from './importContent'
+import login from './login'
+import course from './course'
 
 export default {
     vendor,
     import_course: importCourse,
     import_content: importContent,
+    login,
+    course,
 }

package/i18n/en-US/pages/login/index.ts

@@ -0,0 +1,5 @@
+import lti from './lti'
+
+export default {
+    lti,
+}

package/i18n/en-US/pages/login/lti.ts

@@ -0,0 +1,21 @@
+export default {
+    lti_error: 'LTI Errors',
+    launch_error: 'LTI link failed to launch',
+    missing_title: 'The below fields are missing:',
+    error_title: 'The below errors occurred:',
+    error: {
+        unknown: 'An unknown error occurred',
+        organization: 'Invalid organization',
+        tool: 'Invalid tool id',
+        tool_organization: 'This tool does not belong to this organization',
+        oauth: 'Invalid OAuth. Check your key and secret.',
+    },
+    missing: {
+        context_label:
+            'The context label field `context_label` is missing or invalid.',
+        resource_link_title:
+            'The resource link title `resource_link_title` is missing or invalid.',
+        lis_person_contact_email_primary:
+            'The users email is missing and an anonymous email could not be generated.',
+    },
+}

package/i18n/en-US/shared/permission.ts

@@ -8,6 +8,8 @@ export default {
             'Organization Integrations',
         'plugin->windward->integrations->course': 'Course Integrations',
         'plugin->windward->integrations->content': 'Content Integrations',
+        'plugin->windward->integrations->course->externalIntegration':
+            'External Integrations (LTI / SCORM / etc)',
     },
 
     type_description: {
@@ -22,5 +24,7 @@ export default {
             'Access and manage course imports',
         'plugin->windward->integrations->content':
             'Access and manage content imports',
+        'plugin->windward->integrations->course->externalIntegration':
+            'Access and manage external integrations such as LTI and SCORM',
     },
 }

package/models/ExternalIntegration/Lti1p1Consumer.ts

@@ -0,0 +1,13 @@
+// @ts-ignore
+import Model from '~/models/Model'
+
+export default class Lti1p1Consumer extends Model {
+    get required(): string[] {
+        return []
+    }
+
+    // Set the resource route of the model
+    resource() {
+        return 'external-integrations/lti/1.1/consumers'
+    }
+}

package/models/ExternalIntegration/Lti1p1Provider.ts

@@ -0,0 +1,13 @@
+// @ts-ignore
+import Model from '~/models/Model'
+
+export default class Lti1p1Provider extends Model {
+    get required(): string[] {
+        return []
+    }
+
+    // Set the resource route of the model
+    resource() {
+        return 'external-integrations/lti/1.1/providers'
+    }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@windward/integrations",
-    "version": "0.0.2",
+    "version": "0.0.4",
     "description": "Windward UI Plugin Integrations for 3rd Party Systems",
     "main": "plugin.js",
     "scripts": {

package/pages/admin/vendors.vue

@@ -151,9 +151,9 @@
 import _ from 'lodash'
 import { mapGetters } from 'vuex'
 
-import Dialog from '~/components/Dialog.vue'
 import Organization from '../../models/Organization'
 import IntegrationJobTable from '../../components/Integration/JobTable.vue'
+import Dialog from '~/components/Dialog.vue'
 
 export default {
     name: 'PluginIntegrationsAdminVendorsPage',

package/pages/course/externalIntegration/index.vue

@@ -0,0 +1,72 @@
+<template>
+    <div>
+        <h1>
+            {{
+                $t(
+                    'windward.integrations.pages.course.external_integration.title'
+                )
+            }}
+        </h1>
+        <v-tabs v-model="tab">
+            <v-tabs-slider></v-tabs-slider>
+
+            <v-tab>
+                {{
+                    $t(
+                        'windward.integrations.pages.course.external_integration.lti_1p1'
+                    )
+                }}
+            </v-tab>
+
+            <v-tab>
+                {{
+                    $t(
+                        'windward.integrations.pages.course.external_integration.lti_1p3'
+                    )
+                }}
+            </v-tab>
+
+            <v-tab>
+                {{
+                    $t(
+                        'windward.integrations.pages.course.external_integration.scorm_1p2'
+                    )
+                }}
+            </v-tab>
+        </v-tabs>
+
+        <v-tabs-items v-model="tab">
+            <v-tab-item> <ManageLti1p1></ManageLti1p1> </v-tab-item>
+            <v-tab-item>
+                <p class="ma-5">LTI 1.3 Not yet implemented</p>
+            </v-tab-item>
+            <v-tab-item>
+                <p class="ma-5">SCORM 1.2 Not yet implemented</p>
+            </v-tab-item>
+        </v-tabs-items>
+    </div>
+</template>
+
+<script>
+import ManageLti1p1 from '../../../components/ExternalIntegration/Driver/ManageLti1p1.vue'
+
+export default {
+    name: 'PluginIntegrationsExternalIntegrationIndexPage',
+    components: { ManageLti1p1 },
+    layout: 'authenticated',
+    meta: {
+        privilege: {
+            'plugin.windward.integrations.course.externalIntegration': {
+                readable: true,
+            },
+        },
+    },
+    data() {
+        return {
+            tab: 0,
+        }
+    },
+    async fetch() {},
+    computed: {},
+}
+</script>

package/pages/login/lti/error.vue

@@ -0,0 +1,98 @@
+<template>
+    <v-container>
+        <v-divider />
+        <v-row>
+            <v-col cols="12" md="6" offset-md="3">
+                <h1 class="text-center mt-5">
+                    {{
+                        $t('windward.integrations.pages.login.lti.launch_error')
+                    }}
+                </h1>
+                <v-alert
+                    v-if="error.length === 0 && missing.length === 0"
+                    type="error"
+                    class="mt-5"
+                >
+                    <strong>{{
+                        $t(
+                            'windward.integrations.pages.login.lti.error.unknown'
+                        )
+                    }}</strong>
+                </v-alert>
+                <v-alert v-if="missing.length" type="warning" class="mt-5">
+                    <strong>{{
+                        $t(
+                            'windward.integrations.pages.login.lti.missing_title'
+                        )
+                    }}</strong>
+                    <ul>
+                        <li v-for="missingItem in missing" :key="missingItem">
+                            {{
+                                $t(
+                                    'windward.integrations.pages.login.lti.missing.' +
+                                        missingItem
+                                )
+                            }}
+                        </li>
+                    </ul>
+                </v-alert>
+                <v-alert v-if="error.length" type="error" class="mt-5">
+                    <strong>{{
+                        $t('windward.integrations.pages.login.lti.error_title')
+                    }}</strong>
+                    <ul>
+                        <li v-for="errorItem in error" :key="errorItem">
+                            {{
+                                $t(
+                                    'windward.integrations.pages.login.lti.error.' +
+                                        errorItem
+                                )
+                            }}
+                        </li>
+                    </ul>
+                </v-alert>
+            </v-col>
+        </v-row>
+    </v-container>
+</template>
+
+<script>
+import _ from 'lodash'
+export default {
+    name: 'PluginIntegrationsLoginLtiErrorPage',
+    layout: 'default',
+    data() {
+        return {
+            missing: [],
+            error: [],
+        }
+    },
+    async fetch() {},
+    computed: {},
+    mounted() {
+        // Get the missing url parameters to display
+        if (!_.isEmpty(_.get(this.$route, 'query.missing', ''))) {
+            this.missing = _.get(this.$route, 'query.missing', '')
+                .split(',')
+                .map((v) => v.trim())
+        }
+
+        // Get the error url parameters to display
+        if (!_.isEmpty(_.get(this.$route, 'query.error', ''))) {
+            this.error = _.get(this.$route, 'query.error', '')
+                .split(',')
+                .map((v) => v.trim())
+        }
+
+        // Set the appropriate locale
+        if (!_.isEmpty(_.get(this.$route, 'query.locale', ''))) {
+            const locale = _.get(this.$route, 'query.locale', '')
+
+            if (this.$i18n.locales.includes(locale)) {
+                this.$i18n.setLocale(locale)
+            }
+        }
+    },
+    methods: {},
+}
+</script>

package/plugin.js

@@ -2,6 +2,8 @@ import enUS from './i18n/en-US'
 import AdminVendorsPage from './pages/admin/vendors.vue'
 import AdminImportCoursePage from './pages/admin/importCourse.vue'
 import ImportContentPage from './pages/course/importContent.vue'
+import ExternalIntegrationIndexPage from './pages/course/externalIntegration/index.vue'
+import LoginLtiErrorPage from './pages/login/lti/error.vue'
 import IntegrationHelper from './helpers/IntegrationHelper'
 
 export default {
@@ -41,6 +43,21 @@ export default {
             name: 'PluginIntegrationsImportContentPage',
             template: ImportContentPage,
         },
+
+        {
+            page: 'admin-integrations',
+            path: '/course/:course/integrations/external',
+            i18n: 'windward.integrations.pages.course.external_integration.title',
+            name: 'PluginIntegrationsExternalIntegrationIndexPage',
+            template: ExternalIntegrationIndexPage,
+        },
+        {
+            page: 'lti-error',
+            path: '/login/lti/error',
+            i18n: 'windward.integrations.pages.login.lti.lti_error',
+            name: 'PluginIntegrationsLoginLtiErrorPage',
+            template: LoginLtiErrorPage,
+        },
     ],
     components: {
         menu: [
@@ -78,6 +95,17 @@ export default {
                             },
                         },
                     },
+                    {
+                        i18n: 'windward.integrations.pages.course.external_integration.title',
+                        path: '/course/{course.id}/integrations/external',
+                        context: ['course'],
+                        permissions: {
+                            'plugin.windward.integrations.course.externalIntegration':
+                                {
+                                    readable: true,
+                                },
+                        },
+                    },
                     /*
                     {
                         i18n: 'windward.integrations.components.navigation.integrations.manage_lti',

package/test/Components/ExternalIntegration/Lti1p1/ManageConsumer.spec.js

@@ -0,0 +1,19 @@
+import { shallowMount } from '@vue/test-utils'
+
+import Vue from 'vue'
+import Vuetify from 'vuetify'
+import { defaultMocks } from '@/test/mocks'
+
+import ManageConsumer from '@/components/ExternalIntegration/Driver/Lti1p1/ManageConsumer.vue'
+
+Vue.use(Vuetify)
+
+describe('ManageConsumer', () => {
+    test('ManageConsumer is a Vue instance', () => {
+        const wrapper = shallowMount(ManageConsumer, {
+            vuetify: new Vuetify(),
+            mocks: defaultMocks,
+        })
+        expect(wrapper.vm).toBeTruthy()
+    })
+})

package/test/Components/ExternalIntegration/Lti1p1/ManageConsumers.spec.js

@@ -0,0 +1,19 @@
+import { shallowMount } from '@vue/test-utils'
+
+import Vue from 'vue'
+import Vuetify from 'vuetify'
+import { defaultMocks } from '@/test/mocks'
+
+import ManageConsumers from '@/components/ExternalIntegration/Driver/Lti1p1/ManageConsumers.vue'
+
+Vue.use(Vuetify)
+
+describe('ManageConsumers', () => {
+    test('ManageConsumers is a Vue instance', () => {
+        const wrapper = shallowMount(ManageConsumers, {
+            vuetify: new Vuetify(),
+            mocks: defaultMocks,
+        })
+        expect(wrapper.vm).toBeTruthy()
+    })
+})

package/test/Components/ExternalIntegration/Lti1p1/ManageProvider.spec.js

@@ -0,0 +1,19 @@
+import { shallowMount } from '@vue/test-utils'
+
+import Vue from 'vue'
+import Vuetify from 'vuetify'
+import { defaultMocks } from '@/test/mocks'
+
+import ManageProvider from '@/components/ExternalIntegration/Driver/Lti1p1/ManageProvider.vue'
+
+Vue.use(Vuetify)
+
+describe('ManageProvider', () => {
+    test('ManageProvider is a Vue instance', () => {
+        const wrapper = shallowMount(ManageProvider, {
+            vuetify: new Vuetify(),
+            mocks: defaultMocks,
+        })
+        expect(wrapper.vm).toBeTruthy()
+    })
+})