Update webpack config (MWDK update)

.github/workflows/release-build.yml

@@ -11,14 +11,14 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [12.3.1]
+        node-version: [18.13.0]
 
     steps:
     - name: Checkout code
-      uses: actions/checkout@v2
+      uses: actions/checkout@v5
 
     - name: Test and build with node ${{ matrix.node-version }}
-      uses: actions/setup-node@v1
+      uses: actions/setup-node@v3
       with:
         node-version: ${{ matrix.node-version }}
 
@@ -35,4 +35,4 @@ jobs:
         file: build/_output/*
         tag: ${{ github.ref }}
         overwrite: true
-        file_glob: true
+        file_glob: true

.github/workflows/test.yml

@@ -5,20 +5,20 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [12.13.1]
+        node-version: [18.13.0]
 
     steps:
     - name: Checkout code
-      uses: actions/checkout@v2
+      uses: actions/checkout@v4
 
     - name: Setup GIT user
       uses: fregante/setup-git-user@v1
 
     - name: Run tests with Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v1
+      uses: actions/setup-node@v3
       with:
         node-version: ${{ matrix.node-version }}
     - run: npm install -g yarn
     - run: yarn install
     # - run: yarn test-ci
-    - run: yarn build
+    - run: yarn build

package.json

@@ -6,7 +6,7 @@
   "version": "1.2.0",
   "dependencies": {
     "angular-sortable-view": "^0.0.13",
-    "materia-widget-development-kit": "2.5.2"
+    "materia-widget-development-kit": "~3.0.0"
   },
   "devDependencies": {
     "angular": "1.6.9",
@@ -20,9 +20,9 @@
     "jest-coffee-preprocessor": "^1.0.0"
   },
   "scripts": {
-    "start": "webpack-dev-server",
-    "build-dev": "webpack",
-    "build": "webpack -p",
+    "start": "mwdk-start",
+    "build": "mwdk-build-prod",
+    "build-dev": "mwdk-build-dev",
     "test": "TZ='America/New_York' jest --verbose",
     "test-ci": "TZ='America/New_York' CI=true jest --ci --useStderr --coverage --coverageReporters text-summary cobertura",
     "test-dev": "TZ='America/New_York' jest --coverage --coverageReporters text-summary lcov"

sample_score_data.json

@@ -0,0 +1 @@
+[{"overview":{"complete":"1","score":100,"table":[{"message":"Points Lost","value":0},{"message":"Final Score","value":100}],"referrer_url":"","created_at":1698247740,"auth":""},"details":[{"title":"Responses:","header":["Question Score","The Question","Your Response","Correct Answer"],"table":[{"data":["How do you typically check for daily weather updates?","A dedicated weather app on my phone","Built-in notifications on my phone"],"data_style":["question","response","answer"],"score":100,"feedback":null,"type":"SCORE_QUESTION_ANSWERED","style":"full-value","tag":"div","symbol":"%","graphic":"score","display_score":true},{"data":["Generally speaking, do you plan in advance for inclement weather before leaving home?","Rarely","Very Often"],"data_style":["question","response","answer"],"score":100,"feedback":null,"type":"SCORE_QUESTION_ANSWERED","style":"full-value","tag":"div","symbol":"%","graphic":"score","display_score":true},{"data":["Large weather events (snow storms, hurricanes, nor\u0027easters) cause me stress well in advance.","Somewhat Disagree","Strongly Agree"],"data_style":["question","response","answer"],"score":100,"feedback":null,"type":"SCORE_QUESTION_ANSWERED","style":"full-value","tag":"div","symbol":"%","graphic":"score","display_score":true},{"data":["Do you keep an umbrella in your car or on your person when traveling to work?","No","Yes"],"data_style":["question","response","answer"],"score":100,"feedback":null,"type":"SCORE_QUESTION_ANSWERED","style":"full-value","tag":"div","symbol":"%","graphic":"score","display_score":true},{"data":["I feel comfortable driving in severe weather conditions.","Somewhat Agree","Strongly Agree"],"data_style":["question","response","answer"],"score":100,"feedback":null,"type":"SCORE_QUESTION_ANSWERED","style":"full-value","tag":"div","symbol":"%","graphic":"score","display_score":true},{"data":["Consider your potential levels of confidence and stress when faced with each of the following forms of severe weather. Try and rank them from least stressful (you are the most confident) to most stressful (you are not at all confident.)","Blizzards\/Snowstorms\nExtreme rain and flooding\nTornadoes\nHurricanes\nDust storms or haboobs\nExtended drought or dryness","Hurricanes"],"data_style":["question","response","answer"],"score":100,"feedback":null,"type":"SCORE_QUESTION_ANSWERED","style":"full-value","tag":"div","symbol":"%","graphic":"score","display_score":true},{"data":["Thinking back, what was the most severe or stressful weather event you\u0027ve had to endure?","Hurricane Michael","Enter Your Response Here."],"data_style":["question","response","answer"],"score":100,"feedback":null,"type":"SCORE_QUESTION_ANSWERED","style":"full-value","tag":"div","symbol":"%","graphic":"score","display_score":true}]}]}]

src/creator.coffee

@@ -1,12 +1,12 @@
 # Create an angular module to house our controller
-SurveyWidget = angular.module 'SurveyWidgetCreator', ['ngMaterial', 'ngMessages', 'ngAnimate', 'ngSanitize', 'angular-sortable-view', 'ngAria']
+angular.module 'SurveyWidgetCreator', ['ngMaterial', 'ngMessages', 'ngAnimate', 'ngSanitize', 'angular-sortable-view', 'ngAria']
 
-SurveyWidget.config ['$mdThemingProvider', ($mdThemingProvider) ->
+.config ['$mdThemingProvider', ($mdThemingProvider) ->
 		$mdThemingProvider.theme('default')
 			.primaryPalette('teal')
 			.accentPalette('blue-grey')
 ]
-SurveyWidget.controller 'SurveyWidgetController', [ '$scope','$mdToast','$mdDialog','$sanitize','$compile', 'Resource', 'sanitizeHelper', '$timeout', ($scope, $mdToast, $mdDialog, $sanitize, $compile, Resource, sanitizeHelper, $timeout) ->
+.controller 'SurveyWidgetController', [ '$scope','$mdToast','$mdDialog','$sanitize','$compile', 'Resource', 'sanitizeHelper', '$timeout', ($scope, $mdToast, $mdDialog, $sanitize, $compile, Resource, sanitizeHelper, $timeout) ->
 
 	$scope.acceptedMediaTypes = ['image']
 	mediaRef = null
@@ -391,7 +391,7 @@ SurveyWidget.controller 'SurveyWidgetController', [ '$scope','$mdToast','$mdDial
 	Materia.CreatorCore.start $scope
 ]
 
-SurveyWidget.factory 'Resource', ['$sanitize', 'sanitizeHelper', ($sanitize, sanitizeHelper) ->
+.factory 'Resource', ['$sanitize', 'sanitizeHelper', ($sanitize, sanitizeHelper) ->
 	buildQset: (title, questions, groups, OneQuestionAtATime) ->
 		qsetItems = []
 		qset = {}
@@ -440,7 +440,7 @@ SurveyWidget.factory 'Resource', ['$sanitize', 'sanitizeHelper', ($sanitize, san
 		return processed
 ]
 
-SurveyWidget.directive 'focusMe', ['$timeout', '$parse', ($timeout, $parse) ->
+.directive 'focusMe', ['$timeout', '$parse', ($timeout, $parse) ->
 	link: (scope, element, attrs) ->
 		model = $parse(attrs.focusMe)
 		scope.$watch model, (value) ->
@@ -450,7 +450,7 @@ SurveyWidget.directive 'focusMe', ['$timeout', '$parse', ($timeout, $parse) ->
 			value
 ]
 
-SurveyWidget.service 'sanitizeHelper', [() ->
+.service 'sanitizeHelper', [() ->
 	SANITIZE_CHARACTERS =
 		'&' : '&',
 		'>' : '>',
@@ -474,3 +474,4 @@ SurveyWidget.service 'sanitizeHelper', [() ->
 	sanitize: sanitize
 	desanitize: desanitize
 ]
+angular.bootstrap(document, ['SurveyWidgetCreator'])

src/creator.html

@@ -28,11 +28,9 @@
 		<script src="//ajax.googleapis.com/ajax/libs/angular_material/1.1.8/angular-material.min.js"></script>
 		<script src="vendor/angular-sortable-view.min.js"></script>
 
-		<!-- MAIN CREATOR SCRIPT -->
-		<script src="creator.js"></script>
 	</head>
 
-	<body ng-app="SurveyWidgetCreator">
+	<body>
 		<md-content id="container" ng-controller="SurveyWidgetController">
 
 			<md-toolbar>
@@ -67,7 +65,7 @@
 											Question {{$index + 1}}
 										</label>
 									</span>
-									
+
 									<div class="question-body">
 										<span class='question-input-container'>
 											<input ng-model="card.question"
@@ -80,7 +78,7 @@
 											<div ng-messages="questionForm.question.$error">
 												<div ng-message="required">Question text is required.</div>
 											</div>
-											
+
 										</span>
 										<button class="icon-container"
 											ng-hide="card.assets.length > 0"
@@ -89,7 +87,7 @@
 											ng-click="beginMediaImport(cardIndex)">
 											<md-tooltip md-direction="below">Add Image</md-tooltip>
 											<i class="material-icons">add_photo_alternate</i>
-										</button>										
+										</button>
 									</div>
 
 									<div class="card-buttons">
@@ -403,7 +401,7 @@
 				</div>
 			</div>
 
-			
+
 
 			<!-- Type Info Dialog -->
 			<div style="visibility: hidden">
@@ -469,5 +467,7 @@ <h2>Edit Groups</h2>
 			</div>
 		</md-content>
 
+		<!-- MAIN CREATOR SCRIPT -->
+		<script src="creator.js"></script>
 	</body>
 </html>

webpack.config.js

@@ -5,7 +5,6 @@ const outputPath = path.join(__dirname, 'build')
 const widgetWebpack = require('materia-widget-development-kit/webpack-widget')
 
 const rules = widgetWebpack.getDefaultRules()
-const entries = widgetWebpack.getDefaultEntries()
 const copy = widgetWebpack.getDefaultCopyList()
 
 const customCopy = copy.concat([
@@ -24,22 +23,23 @@ const customCopy = copy.concat([
 	}
 ])
 
-entries['scorescreen.js'] = [
-	srcPath+'scorescreen.coffee'
-]
-
-entries['scorescreen.css'] = [
-	srcPath+'scorescreen.html',
-	srcPath+'scorescreen.scss'
-]
-
-entries['guides/creator.temp.html'] = [
-	srcPath+'_guides/creator.md'
-]
-
-entries['guides/player.temp.html'] = [
-	srcPath+'_guides/player.md'
-]
+const entries = {
+	'player': [
+		path.join(srcPath, 'player.html'),
+		path.join(srcPath, 'player.coffee'),
+		path.join(srcPath, 'player.scss')
+	],
+	'creator': [
+		path.join(srcPath, 'creator.html'),
+		path.join(srcPath, 'creator.coffee'),
+		path.join(srcPath, 'creator.scss'),
+	],
+	'scorescreen': [
+		path.join(srcPath, 'scorescreen.html'),
+		path.join(srcPath, 'scorescreen.coffee'),
+		path.join(srcPath, 'scorescreen.scss'),
+	]
+}
 
 // this is needed to prevent html-loader from causing issues with
 // style tags in the player using angular
@@ -51,9 +51,6 @@ let customHTMLAndReplaceRule = {
 			loader: 'file-loader',
 			options: { name: '[name].html' }
 		},
-		{
-			loader: 'extract-loader'
-		},
 		{
 			loader: 'string-replace-loader',
 			options: { multiple: widgetWebpack.materiaJSReplacements }
@@ -71,10 +68,10 @@ let customRules = [
 	rules.loaderDoNothingToJs,
 	rules.loaderCompileCoffee,
 	rules.copyImages,
-	customHTMLAndReplaceRule, // <--- replaces "rules.loadHTMLAndReplaceMateriaScripts"
-	rules.loadAndPrefixCSS,
-	rules.loadAndPrefixSASS,
-	rules.loadAndCompileMarkdown
+	rules.loadHTMLAndReplaceMateriaScripts,
+	rules.loadAndPrefixSASS, // <--- replaces "rules.loadHTMLAndReplaceMateriaScripts"
+	// rules.loadAndPrefixCSS,
+	// rules.loadAndCompileMarkdown
 ]