Merge remote-tracking branch 'origin/master'

heremaps · Jul 14, 2020 · d71883f · d71883f
2 parents 3f9db15 + 5406b31
commit d71883f
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 14 deletions.
diff --git a/packages/playground/rollup.config.js b/packages/playground/rollup.config.js
@@ -36,6 +36,8 @@ const SRC = env['resource'] || settings.path.resource;
 
 const exclude = env.exclude;
 const production = env.BUILD == 'production';
+
+const ts = (new Date()).getTime();
 let credentialsPath = join(SRC, 'credentials.json');
 let credential;
 
@@ -96,7 +98,8 @@ export default {
         virtual({
             'utag': env['utag-path'] ? fs.readFileSync(env['utag-path'], 'utf8') : 'export default ()=>{}',
             'settings': 'export default' + JSON.stringify(settings),
-            'credentials': 'export default' + JSON.stringify(credential)
+            'credentials': 'export default' + JSON.stringify(credential),
+            'ts': 'export default ' + ts
         }),
         json(),
         resolve(),
@@ -110,7 +113,7 @@ export default {
             targets: [{
                 src: 'examples', dest: DEST
             }, {
-                src: 'static/index.html', dest: DEST
+                src: 'static/index.html', dest: DEST, transform: (contents) => contents.toString().replace(/\$\{TIMESTAMP\}/g, ts)
             }, {
                 src: join(SRC, 'assets'), dest: DEST
             }]

diff --git a/packages/playground/src/playground.js b/packages/playground/src/playground.js
@@ -23,6 +23,7 @@ import xyzmaps from '../examples/xyzmaps.json';
 
 import pgSettings from 'settings';
 import credentials from 'credentials';
+import timestamp from 'ts';
 
 export let injectCss = (css, doc) => {
     doc = doc || document;
@@ -44,6 +45,7 @@ export let pg = new (function Playground() {
     var ts = Math.round(Math.random() * 1000) + ('' + new Date().getTime()).substr(-4);
     var codeEditor = null;
     var speed = 500;
+    var tsAppendix = '?ts=' + timestamp;
     var visiblePH1 = '/*###visiblesource*/';
     var visiblePH2 = '/*visiblesource###*/';
     var visibleSrcRex = /^[\s\S]+\/\/###visiblesource([\s\S]*)\/\/visiblesource###[\s\S]*$/gi;
@@ -70,7 +72,7 @@ export let pg = new (function Playground() {
     var examplecss;
 
     $.ajax({
-        url: 'assets/css/example.css',
+        url: 'assets/css/example.css' + tsAppendix,
         dataType: 'text',
         success: function(cssText) {
             examplecss = cssText;
@@ -388,13 +390,21 @@ export let pg = new (function Playground() {
     }
 
     function hideVisiblePlaceholder() {
-        var cmMarkOptions = {collapsed: true, css: 'background-color:red', readOnly: true};
+        var cmMarkOptions1 = {collapsed: true, readOnly: true};
+        var cmMarkOptions2 = {collapsed: true, readOnly: false};
         var cValue = codeEditor.getValue();
         var pos1 = codeEditor.posFromIndex(cValue.indexOf(visiblePH1));
         var pos2 = codeEditor.posFromIndex(cValue.indexOf(visiblePH2));
 
-        codeEditor.markText(pos1, {line: pos1.line, ch: pos1.ch + visiblePH1.length}, cmMarkOptions);
-        codeEditor.markText(pos2, {line: pos2.line, ch: pos2.ch + visiblePH2.length}, cmMarkOptions);
+        codeEditor.markText(pos1, {line: pos1.line, ch: pos1.ch + visiblePH1.length}, cmMarkOptions1);
+        codeEditor.markText(pos2, {line: pos2.line, ch: pos2.ch + visiblePH2.length}, cmMarkOptions1);
+
+        let tsIdx = cValue.indexOf(tsAppendix, 0);
+        while ( tsIdx > 0 ) {
+            var tspos = codeEditor.posFromIndex(tsIdx);
+            codeEditor.markText(tspos, {line: tspos.line, ch: tspos.ch + tsAppendix.length}, cmMarkOptions2);
+            tsIdx = cValue.indexOf(tsAppendix, tsIdx + tsAppendix.length);
+        }
     }
 
     window.onresize = function() {
@@ -517,6 +527,7 @@ export let pg = new (function Playground() {
                 content = content.replace(apiPath.editor, absolutePath(apiPath.editor));
                 content = content.replace(visiblePH1, '');
                 content = content.replace(visiblePH2, '');
+                content = content.replace(new RegExp('\\'+tsAppendix, 'gi'), '');
 
                 let examplecsst = examplecss.replace(new RegExp('\n', 'g'), '\n\t\t\t');
                 content = content.replace('</style>', examplecsst + '\n\t\t</style>');
@@ -700,14 +711,14 @@ export let pg = new (function Playground() {
 
                 $('.docs').attr('href', docPath + (t.data().docs || t.data().root.docs));
 
-                $.get(examplePath + t.data().file, function(data) {
+                $.get(examplePath + t.data().file + tsAppendix, function(data) {
                     // untouched data
                     originalData = data;
 
-                    data = data.replace(apiPATHPlaceholderCommon, apiPath.common);
-                    data = data.replace(apiPATHPlaceholderCore, apiPath.core);
-                    data = data.replace(apiPATHPlaceholderDisplay, apiPath.display);
-                    data = data.replace(apiPATHPlaceholderEditor, apiPath.editor);
+                    data = data.replace(apiPATHPlaceholderCommon, apiPath.common + tsAppendix);
+                    data = data.replace(apiPATHPlaceholderCore, apiPath.core + tsAppendix);
+                    data = data.replace(apiPATHPlaceholderDisplay, apiPath.display + tsAppendix);
+                    data = data.replace(apiPATHPlaceholderEditor, apiPath.editor + tsAppendix);
 
                     currentData = data;
                     currentBlock = data.replace(visibleSrcRex, '$1');

diff --git a/packages/playground/static/index.html b/packages/playground/static/index.html
@@ -4,9 +4,9 @@
 		<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
 		<title>XYZ Maps Playground</title>
 		<link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico">
-		<link rel="stylesheet" href="assets/css/playground.css"/>
-		<link rel="stylesheet" id="mobile-css" href="assets/css/mplayground.css"/>
-        <script src="src/playground.js"></script>
+		<link rel="stylesheet" href="assets/css/playground.css?ts=${TIMESTAMP}"/>
+		<link rel="stylesheet" id="mobile-css" href="assets/css/mplayground.css?ts=${TIMESTAMP}"/>
+        <script src="src/playground.js?ts=${TIMESTAMP}"></script>
 	</head>
 
 	<body class='desktop'>