Merge pull request #15 from pkmnct/fix-ie

Update script to work on Internet Explorer

README.md

@@ -22,7 +22,7 @@ The first step is to add the Google Maps API and this script to your survey's he
 
 ```html
 <script src="https://maps.googleapis.com/maps/api/js?libraries=places&key={YOURKEYHERE}"></script>
-<script src="https://unpkg.com/[email protected].0/dist/QualtricsGoogleMap.min.js"></script>
+<script src="https://unpkg.com/[email protected].1/dist/QualtricsGoogleMap.min.js"></script>
 ```
 
 Make sure to replace the `{YOURKEYHERE}` with your Google Maps API key.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "qualtrics-google-map-lat-long",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "Embed a customizable Google Map in your Qualtrics survey to collect location data",
   "scripts": {
     "lint": "eslint src/**.ts",

src/QualtricsGoogleMap.ts

@@ -50,10 +50,10 @@ const initGoogleMapsQuestion = (
   const mapObject = document.createElement('div');
   mapObject.setAttribute('id', `${id}-map`);
   if (map.css) {
-    styles.append(`#${id}-map {${map.css}}`);
+    styles.innerText += `#${id}-map {${map.css}}`;
     mapObject.setAttribute('style', map.css);
   } else {
-    styles.append(`#${id}-map {height: 300px;}`);
+    styles.innerText += `#${id}-map {height: 300px;}`;
   }
   questionBody.appendChild(mapObject);
 
@@ -78,17 +78,17 @@ const initGoogleMapsQuestion = (
       locationLabel.setAttribute('id', `${inputId}-label`);
       locationLabel.setAttribute('class', 'QuestionText');
       if (marker.autocomplete.labelCss) {
-        styles.append(`#${inputId}-label {${marker.autocomplete.labelCss}}`);
+        styles.innerText += `#${inputId}-label {${marker.autocomplete.labelCss}}`;
       }
-      locationLabel.append(marker.autocomplete.label || marker.options.title || `Marker ${marker.options.label ? marker.options.label : index}`);
+      locationLabel.innerText = marker.autocomplete.label || marker.options.title || `Marker ${marker.options.label ? marker.options.label : index}`;
       questionBody.appendChild(locationLabel);
 
       // Make the autocomplete
       const locationInput = document.createElement('input');
       locationInput.setAttribute('id', inputId);
       locationInput.setAttribute('class', 'InputText');
       if (marker.autocomplete.css) {
-        styles.append(`#${id}-${index}-locationInput {${marker.autocomplete.css}}`);
+        styles.innerText += `#${id}-${index}-locationInput {${marker.autocomplete.css}}`;
       }
       questionBody.appendChild(locationInput);