@windward/core 0.0.7 → 0.0.8

package/.idea/codeStyles/Project.xml

@@ -0,0 +1,58 @@
+<component name="ProjectCodeStyleConfiguration">
+  <code_scheme name="Project" version="173">
+    <HTMLCodeStyleSettings>
+      <option name="HTML_SPACE_INSIDE_EMPTY_TAG" value="true" />
+      <option name="HTML_ENFORCE_QUOTES" value="true" />
+    </HTMLCodeStyleSettings>
+    <JSCodeStyleSettings version="0">
+      <option name="FORCE_SEMICOLON_STYLE" value="true" />
+      <option name="SPACE_BEFORE_FUNCTION_LEFT_PARENTH" value="false" />
+      <option name="FORCE_QUOTE_STYlE" value="true" />
+      <option name="ENFORCE_TRAILING_COMMA" value="Remove" />
+      <option name="SPACES_WITHIN_OBJECT_LITERAL_BRACES" value="true" />
+      <option name="SPACES_WITHIN_IMPORTS" value="true" />
+    </JSCodeStyleSettings>
+    <TypeScriptCodeStyleSettings version="0">
+      <option name="FORCE_SEMICOLON_STYLE" value="true" />
+      <option name="SPACE_BEFORE_FUNCTION_LEFT_PARENTH" value="false" />
+      <option name="FORCE_QUOTE_STYlE" value="true" />
+      <option name="ENFORCE_TRAILING_COMMA" value="Remove" />
+      <option name="SPACES_WITHIN_OBJECT_LITERAL_BRACES" value="true" />
+      <option name="SPACES_WITHIN_IMPORTS" value="true" />
+    </TypeScriptCodeStyleSettings>
+    <VueCodeStyleSettings>
+      <option name="INTERPOLATION_NEW_LINE_AFTER_START_DELIMITER" value="false" />
+      <option name="INTERPOLATION_NEW_LINE_BEFORE_END_DELIMITER" value="false" />
+    </VueCodeStyleSettings>
+    <codeStyleSettings language="HTML">
+      <option name="SOFT_MARGINS" value="80" />
+      <indentOptions>
+        <option name="INDENT_SIZE" value="2" />
+        <option name="CONTINUATION_INDENT_SIZE" value="2" />
+        <option name="TAB_SIZE" value="2" />
+      </indentOptions>
+    </codeStyleSettings>
+    <codeStyleSettings language="JavaScript">
+      <option name="SOFT_MARGINS" value="80" />
+      <indentOptions>
+        <option name="INDENT_SIZE" value="2" />
+        <option name="CONTINUATION_INDENT_SIZE" value="2" />
+        <option name="TAB_SIZE" value="2" />
+      </indentOptions>
+    </codeStyleSettings>
+    <codeStyleSettings language="TypeScript">
+      <option name="SOFT_MARGINS" value="80" />
+      <indentOptions>
+        <option name="INDENT_SIZE" value="2" />
+        <option name="CONTINUATION_INDENT_SIZE" value="2" />
+        <option name="TAB_SIZE" value="2" />
+      </indentOptions>
+    </codeStyleSettings>
+    <codeStyleSettings language="Vue">
+      <option name="SOFT_MARGINS" value="80" />
+      <indentOptions>
+        <option name="CONTINUATION_INDENT_SIZE" value="2" />
+      </indentOptions>
+    </codeStyleSettings>
+  </code_scheme>
+</component>

package/.idea/codeStyles/codeStyleConfig.xml

@@ -0,0 +1,5 @@
+<component name="ProjectCodeStyleConfiguration">
+  <state>
+    <option name="USE_PER_PROJECT_SETTINGS" value="true" />
+  </state>
+</component>

package/.idea/inspectionProfiles/Project_Default.xml

@@ -0,0 +1,6 @@
+<component name="InspectionProjectProfileManager">
+  <profile version="1.0">
+    <option name="myName" value="Project Default" />
+    <inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
+  </profile>
+</component>

package/.idea/modules.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/windward-ui-plugin-core.iml" filepath="$PROJECT_DIR$/.idea/windward-ui-plugin-core.iml" />
+    </modules>
+  </component>
+</project>

package/.idea/php-docker-settings.xml

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="PhpDockerContainerSettings">
+    <list>
+      <map>
+        <entry key="79d59a8f-c56c-4789-b96c-e55a326ab125">
+          <value>
+            <DockerContainerSettings>
+              <option name="version" value="1" />
+              <option name="volumeBindings">
+                <list>
+                  <DockerVolumeBindingImpl>
+                    <option name="containerPath" value="/opt/project" />
+                    <option name="hostPath" value="$PROJECT_DIR$" />
+                  </DockerVolumeBindingImpl>
+                </list>
+              </option>
+            </DockerContainerSettings>
+          </value>
+        </entry>
+      </map>
+    </list>
+  </component>
+</project>

package/.idea/php.xml

@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="MessDetectorOptionsConfiguration">
+    <option name="transferred" value="true" />
+  </component>
+  <component name="PHPCSFixerOptionsConfiguration">
+    <option name="transferred" value="true" />
+  </component>
+  <component name="PHPCodeSnifferOptionsConfiguration">
+    <option name="highlightLevel" value="WARNING" />
+    <option name="transferred" value="true" />
+  </component>
+  <component name="PhpStanOptionsConfiguration">
+    <option name="transferred" value="true" />
+  </component>
+  <component name="PsalmOptionsConfiguration">
+    <option name="transferred" value="true" />
+  </component>
+</project>

package/.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>

package/.idea/watcherTasks.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectTasksOptions" suppressed-tasks="SCSS" />
+</project>

package/.idea/windward-ui-plugin-core.iml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$" />
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>

package/components/Content/Blocks/Image.vue

@@ -1,18 +1,27 @@
 <template>
     <div>
-        <p v-if="!block.body">
-            <v-img
-                class="img-holder"
-                src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTNCyiabrwN6YV6s3Mj5IzREZCnQqqwT4A3Bw&usqp=CAU"
-                contain
-            ></v-img>
-        </p>
+        <div v-if="!block.body" class="img-holder">
+            <v-skeleton-loader
+                height="300px"
+                :elevation="2"
+                type="image"
+            ></v-skeleton-loader>
+
+            <div class="no-source-overlay">
+                <v-icon x-large>mdi-file-question</v-icon><br />
+                {{
+                    $t(
+                        'windward.core.components.content.blocks.image.no_image_url'
+                    )
+                }}
+            </div>
+        </div>
         <v-responsive :aspect-ratio="aspectRatio">
             <v-img
                 v-if="block.body"
                 :alt="block.metadata.config.alt"
                 :aria-describedby="block.metadata.config.aria_described_by"
-                class="img-display"
+                :class="imageClass"
                 :src="block.body"
                 contain
             >
@@ -59,6 +68,9 @@ export default {
         if (_.isEmpty(this.block.metadata.config.alt)) {
             this.block.metadata.config.alt = ''
         }
+        if (!_.isBoolean(this.block.metadata.config.hide_background)) {
+            this.block.metadata.config.hide_background = false
+        }
         if (_.isEmpty(this.block.metadata.config.aria_describedby)) {
             this.block.metadata.config.aria_describedby = ''
         }
@@ -75,6 +87,14 @@ export default {
         describedByText() {
             return _.get(this.block.metadata, 'config.aria_describedby', null)
         },
+        imageClass() {
+            let imageClass = ''
+            // If NOT hide background, inclide the extra class
+            if (!_.get(this.block.metadata, 'config.hide_background', false)) {
+                imageClass += ' img-white'
+            }
+            return 'img-display' + imageClass
+        },
     },
     watch: {
         value(newValue) {
@@ -103,6 +123,13 @@ export default {
 .img-holder {
     max-height: 300px;
 }
+.img-white {
+    background: #fff;
+}
+.no-source-overlay {
+    text-align: center;
+    margin-top: -175px;
+}
 ::v-deep .v-skeleton-loader.v-skeleton-loader--is-loading {
     .v-skeleton-loader__image {
         height: 100%;

package/components/Content/Blocks/OpenResponse.vue

@@ -75,9 +75,11 @@
 
 <script>
 import _ from 'lodash'
+import { mapGetters } from 'vuex'
 import TextViewer from '~/components/Text/TextViewer.vue'
 import TextEditor from '~/components/Text/TextEditor.vue'
 import BaseContentBlock from '~/components/Content/Blocks/BaseContentBlock'
+import UserContentBlockState from '~/models/UserContentBlockState'
 
 export default {
     name: 'ContentBlockOpenResponse',
@@ -93,6 +95,18 @@ export default {
             submitted: false,
         }
     },
+    computed: {
+        ...mapGetters({
+            enrollment: 'enrollment/get',
+        }),
+        canSubmit() {
+            // Make sure the response is not empty and not equal to the starting text
+            return (
+                this.response &&
+                this.response !== this.block.metadata.config.starting_text
+            )
+        },
+    },
     beforeMount() {
         if (_.isEmpty(this.block.body)) {
             this.block.body = ''
@@ -107,23 +121,31 @@ export default {
             this.block.metadata.config.starting_text = ''
         }
     },
-    computed: {
-        canSubmit() {
-            // Make sure the response is not empty and not equal to the starting text
-            return (
-                this.response &&
-                this.response !== this.block.metadata.config.starting_text
-            )
-        },
-    },
     watch: {},
     mounted() {},
     methods: {
-        onAfterSetContentBlockState() {
+        async onAfterSetContentBlockState() {
+            // Check to see if we have a state already for this block with the same block_id
+            // States are loaded via the ContentBlock.id but in this particular case we want to
+            // maintain the state ACROSS different ContentBlock.ids but with the same linked Block.id
+            const userState = await UserContentBlockState.where({
+                'metadata->block->tag': 'plugin-core-open-response',
+                course_user_id: this.enrollment.id,
+            })
+                .where('metadata->block->block_id', this.block.block_id)
+                .first()
+
+            // Apply the "True" state
+            if (!_.isEmpty(userState)) {
+                this.response = _.get(userState, 'metadata.response', '')
+                this.submitted = _.get(userState, 'metadata.submitted', false)
+            }
+
             // If after the state is applied the response is still empty then apply the default response
             if (this.response === '') {
                 this.response = this.block.metadata.config.starting_text
             }
+
             this.stateLoaded = true
         },
         onSubmit() {

package/components/Content/Blocks/OpenResponseCollate.vue

@@ -31,7 +31,9 @@ export default {
     extends: BaseContentBlock,
     components: {},
     data() {
-        return {}
+        return {
+            saveState: false, // Override the base block to disable state saving
+        }
     },
     beforeMount() {
         if (_.isEmpty(this.block.body)) {
@@ -46,7 +48,8 @@ export default {
         if (_.isEmpty(this.block.metadata.config.filename)) {
             this.block.metadata.config.filename = ''
         }
-        if (_.isEmpty(this.block.metadata.config.include_prompts)) {
+        // _.isEmpty(true) returns false. use isBoolean to check if this prop exists
+        if (!_.isBoolean(this.block.metadata.config.include_prompts)) {
             this.block.metadata.config.include_prompts = false
         }
     },
@@ -62,50 +65,74 @@ export default {
     mounted() {},
     methods: {
         async onCollate() {
-            let userState = await UserContentBlockState.where({
-                'metadata->block->tag': 'plugin-core-open-response',
-                course_user_id: this.enrollment.id,
-            })
-                .whereIn('content_block_id', this.block.metadata.config.linked)
-                .get()
-            let collated = ''
+            try {
+                let userState = await UserContentBlockState.where({
+                    'metadata->block->tag': 'plugin-core-open-response',
+                    course_user_id: this.enrollment.id,
+                })
+                    .whereIn(
+                        'metadata->block->block_id',
+                        this.block.metadata.config.linked
+                    )
+                    .get()
+                let collated = ''
+                const sortedStates = []
 
-            userState.forEach((state) => {
-                // Prepend the prompt from the state if include prompts is enabled
-                if (this.block.metadata.config.include_prompts) {
-                    collated +=
-                        '<strong>' +
-                        state.metadata.block.body +
-                        '</strong><hr />'
-                }
-                if (!_.isEmpty(state.metadata.response)) {
-                    collated += '\n' + state.metadata.response
-                } else {
-                    collated +=
-                        '\n<p>' +
-                        this.$t(
-                            'windward.core.components.content.blocks.open_response_collate.no_response'
-                        ) +
-                        '</p>'
+                // Sorted the states based on the linked order
+                this.block.metadata.config.linked.forEach((linkedId) => {
+                    const found = userState.find((state) => {
+                        return state.metadata.block.block_id === linkedId
+                    })
+                    if (found) {
+                        sortedStates.push(found)
+                    }
+                })
+
+                sortedStates.forEach((state) => {
+                    // Prepend the prompt from the state if include prompts is enabled
+                    if (this.block.metadata.config.include_prompts) {
+                        collated +=
+                            '<strong>' +
+                            state.metadata.block.body +
+                            '</strong><hr />'
+                    }
+                    if (!_.isEmpty(state.metadata.response)) {
+                        collated += '\n' + state.metadata.response
+                    } else {
+                        collated +=
+                            '\n<p>' +
+                            this.$t(
+                                'windward.core.components.content.blocks.open_response_collate.no_response'
+                            ) +
+                            '</p>'
+                    }
+                })
+                let filename = this.block.metadata.config.filename
+                if (_.isEmpty(this.block.metadata.config.filename)) {
+                    // Default filename is the users name + the current page
+                    filename =
+                        this.$auth.user.last_name +
+                        '_' +
+                        this.$auth.user.first_name +
+                        '_' +
+                        _.get(this.content, 'content.name_prefix') +
+                        _.get(this.content, 'content.name')
+
+                    // Change spaces to underscores and remove special characters
+                    filename = filename.replaceAll(/\s+/gi, '_')
+                    filename = filename.replaceAll(/[^a-z0-9\-\_]/gi, '')
                 }
-            })
-            let filename = this.block.metadata.config.filename
-            if (_.isEmpty(this.block.metadata.config.filename)) {
-                // Default filename is the users name + the current page
-                filename =
-                    this.$auth.user.last_name +
-                    '_' +
-                    this.$auth.user.first_name +
-                    '_' +
-                    _.get(this.content, 'content.name_prefix') +
-                    _.get(this.content, 'content.name')
 
-                // Change spaces to underscores and remove special characters
-                filename = filename.replaceAll(/\s+/gi, '_')
-                filename = filename.replaceAll(/[^a-z0-9\-\_]/gi, '')
+                this.generateDocument(collated, filename)
+            } catch (e) {
+                // eslint-disable-next-line no-console
+                console.error(e)
+                this.$dialog.error(
+                    this.$t(
+                        'windward.core.components.content.blocks.open_response_collate.generate_error'
+                    )
+                )
             }
-
-            this.generateDocument(collated, filename)
         },
         generateDocument(htmlBody, filename = '') {
             // Specify file name. If one isn't supplied then a default name of `exported_document_YYYY-MM-DD.doc` is used

package/components/Settings/ImageSettings.vue

@@ -17,6 +17,13 @@
             </template>
         </ContentBlockAsset>
 
+        <v-switch
+            v-model="block.metadata.config.hide_background"
+            :label="
+                $t('windward.core.components.settings.image.hide_background')
+            "
+        ></v-switch>
+
         <v-form>
             <v-text-field
                 v-model="block.metadata.config.alt"
@@ -69,6 +76,9 @@ export default {
         if (_.isEmpty(this.block.metadata.config.alt)) {
             this.block.metadata.config.alt = ''
         }
+        if (!_.isBoolean(this.block.metadata.config.hide_background)) {
+            this.block.metadata.config.hide_background = false
+        }
         if (_.isEmpty(this.block.metadata.config.aria_describedby)) {
             this.block.metadata.config.aria_describedby = ''
         }

package/components/Settings/OpenResponseCollateSettings.vue

@@ -38,8 +38,8 @@
                     >
                         <v-list-item
                             v-for="contentBlock in contentBlocks"
-                            :key="contentBlock.id"
-                            :value="contentBlock.id"
+                            :key="contentBlock.block_id"
+                            :value="contentBlock.block_id"
                         >
                             <template #default="{ active }">
                                 <v-list-item-icon>
@@ -133,7 +133,8 @@ export default {
         if (_.isEmpty(this.block.metadata.config.filename)) {
             this.block.metadata.config.filename = ''
         }
-        if (_.isEmpty(this.block.metadata.config.include_prompts)) {
+        // _.isEmpty(true) returns false. use isBoolean to check if this prop exists
+        if (!_.isBoolean(this.block.metadata.config.include_prompts)) {
             this.block.metadata.config.include_prompts = false
         }
 
@@ -151,19 +152,19 @@ export default {
             this.setLinkedBlocks()
         },
         setLinkedBlocks() {
-            const linkedContentIds = []
+            const linkedBlockIds = []
 
             // Loop over content blocks since they have the correct order we want to collate
             this.contentBlocks.forEach((contentBlock) => {
                 // If the unsorted this.linked includes the block id, add it in the right order
-                if (this.linked.includes(contentBlock.id)) {
-                    linkedContentIds.push(contentBlock.id)
+                if (this.linked.includes(contentBlock.block_id)) {
+                    linkedBlockIds.push(contentBlock.block_id)
                 }
             })
 
             // Set the linked and also body for convenience
-            this.block.metadata.config.linked = linkedContentIds
-            this.block.body = linkedContentIds.join()
+            this.block.metadata.config.linked = linkedBlockIds
+            this.block.body = linkedBlockIds.join()
         },
     },
 }

package/components/Settings/TextEditorSettings.vue

@@ -103,6 +103,7 @@
             v-show="
                 settingSelector.includes(1) && !block.metadata.config.expand
             "
+            autofill
         ></text-editor>
         <v-skeleton-loader
             v-bind="attrs"

package/components/utils/TinyMCEWrapper.vue

@@ -6,7 +6,7 @@
         :api-key="api_key"
         :init="config"
         tag-name="div"
-        model-events="change keydown blur focus paste input submit"
+        model-events="change keydown blur focus paste input submit SetContent"
     >
     </editor>
 </template>
@@ -29,13 +29,13 @@ export default {
         menubar: {
             type: String,
             required: false,
-            default: 'file edit insert format view table windward help',
+            default: 'edit insert format  view table windward help',
         },
         toolbar: {
             type: String,
             required: false,
             default:
-                'undo redo | formatselect | bold italic | alignleft aligncenter alignright | table bullist numlist outdent indent | mathButton ',
+                'undo redo | formatselect | fontsizeselect  | bold italic underline strikethrough removeformat | alignleft aligncenter alignright | table bullist numlist outdent indent | mathButton ',
         },
     },
     beforeMount() {
@@ -71,6 +71,10 @@ export default {
                         title: 'Table',
                         items: 'inserttable | tableprops |  deletetable',
                     },
+                    format: {
+                        title: 'Format',
+                        items: ' bold italic underline strikethrough superscript subscript codeformat | formats align | forecolor backcolor | language | removeformat',
+                    },
                 },
                 plugins: [
                     'advlist autolink lists link  charmap',
@@ -85,6 +89,8 @@ export default {
                 table_default_attributes: {
                     class: 'default',
                 },
+                font_size_formats:
+                    '8pt 10pt 12pt 14pt 16pt 18pt 24pt 36pt 48pt',
                 table_class_list: [
                     { title: 'None', value: ' ' },
                     {
@@ -163,6 +169,7 @@ export default {
                         WindwardPlugins
                     )
                 },
+
                 formats: {
                     glossary: {
                         inline: 'span',

package/components/utils/assets/tinymce/css/content.scss

@@ -193,5 +193,5 @@ span.windward-fill-blank{
     color: #000000;
 }
 
-
+body { font-family: 'Roboto', sans-serif; }