Issue #344 : Avoid templating syntax conflict with Django

2023-08-10 21:12:52 +03:00 · 2015-11-30 01:29:59 +01:00 · 2015-11-30 01:29:59 +01:00 · 2b28577813
commit 2b28577813
parent 7e1451fa8d
17 changed files with 45 additions and 45 deletions
--- a/Gruntfile.js
+++ b/Gruntfile.js
@ -4,18 +4,16 @@ module.exports = function(grunt) {
  var now = new Date();
  var version = '-' + dateFormat(now, "yyyy-mm-dd-hh-MM");

-  var mapToSrcFolder = function (path) {
+  // get the list of scripts paths to include
+  var piskelScripts = require('./src/piskel-script-list.js').scripts.map(function (path) {
    return "src/" + path;
-  };
-
-  var piskelScripts = require('./src/piskel-script-list.js').scripts.map(mapToSrcFolder).filter(function (path) {
+  }).filter(function (path) {
    return path.indexOf('devtools') === -1;
  });
-  var piskelStyles = require('./src/piskel-style-list.js').styles.map(mapToSrcFolder);
-
-  var mapToCasperFolder = function (path) {
-    return "test/casperjs/" + path;
-  };
+  // get the list of styles paths to include
+  var piskelStyles = require('./src/piskel-style-list.js').styles.map(function (path) {
+    return "src/" + path;
+  });

  var casperEnvironments = {
    'local' : {
@ -30,7 +28,9 @@ module.exports = function(grunt) {

  var getCasperConfig = function (env) {
    var conf = casperEnvironments[env];
-    var tests = require(conf.suite).tests.map(mapToCasperFolder);
+    var tests = require(conf.suite).tests.map(function (path) {
+      return "test/casperjs/" + path;
+    });
    return {
      filesSrc : tests,
      options : {
@ -232,7 +232,7 @@ module.exports = function(grunt) {
        },
        files: [
          // src/index.html should already have been moved by the includereplace task
-          {src: ['dest/index.html'], dest: 'dest/piskelapp-partials/main-partial.html'}
+          {src: ['dest-tmp/index.html'], dest: 'dest/piskelapp-partials/main-partial.html'}
        ]
      }
    },
--- a/src/js/controller/PalettesListController.js
+++ b/src/js/controller/PalettesListController.js
@ -51,7 +51,7 @@
    var palettes = this.paletteService.getPalettes();

    var html = palettes.map(function (palette) {
-      return pskl.utils.Template.replace('<option value="{{id}}">{{name}}</option>', palette);
+      return pskl.utils.Template.replace('<option value="${id}">${name}</option>', palette);
    }).join('');
    this.colorPaletteSelect_.innerHTML = html;
  };
--- a/src/js/controller/dialogs/BrowseLocalController.js
+++ b/src/js/controller/dialogs/BrowseLocalController.js
@ -47,7 +47,7 @@
    });

    keys.forEach((function (key) {
-      var date = pskl.utils.DateUtils.format(key.date, '{{Y}}/{{M}}/{{D}} {{H}}:{{m}}');
+      var date = pskl.utils.DateUtils.format(key.date, '${Y}/${M}/${D} ${H}:${m}');
      html += pskl.utils.Template.replace(this.localStorageItemTemplate_, {name : key.name, date : date});
    }).bind(this));

--- a/src/js/controller/settings/ImportController.js
+++ b/src/js/controller/settings/ImportController.js
@ -32,7 +32,7 @@
    var previousInfo = pskl.app.backupService.getPreviousPiskelInfo();
    if (previousInfo) {
      var previousSessionTemplate_ = pskl.utils.Template.get('previous-session-info-template');
-      var date = pskl.utils.DateUtils.format(previousInfo.date, '{{H}}:{{m}} - {{Y}}/{{M}}/{{D}}');
+      var date = pskl.utils.DateUtils.format(previousInfo.date, '${H}:${m} - ${Y}/${M}/${D}');
      previousSessionContainer.innerHTML = pskl.utils.Template.replace(previousSessionTemplate_, {
        name : previousInfo.name,
        date : date
--- a/src/js/controller/settings/exportimage/GifExportController.js
+++ b/src/js/controller/settings/exportimage/GifExportController.js
@ -153,7 +153,7 @@
  // FIXME : JD : HORRIBLE COPY/PASTA (JD later : where???)
  ns.GifExportController.prototype.updateStatus_ = function (imageUrl, error) {
    if (imageUrl) {
-      var linkTpl = '<a class="image-link" href="{{link}}" target="_blank">{{shortLink}}</a>';
+      var linkTpl = '<a class="image-link" href="${link}" target="_blank">${shortLink}</a>';
      var linkHtml = pskl.utils.Template.replace(linkTpl, {
        link : imageUrl,
        shortLink : this.shorten_(imageUrl, URL_MAX_LENGTH, '...')
--- a/src/js/controller/settings/exportimage/PngExportController.js
+++ b/src/js/controller/settings/exportimage/PngExportController.js
@ -98,7 +98,7 @@

  ns.PngExportController.prototype.updateStatus_ = function (imageUrl, error) {
    if (imageUrl) {
-      var linkTpl = '<a class="image-link" href="{{link}}" target="_blank">{{shortLink}}</a>';
+      var linkTpl = '<a class="image-link" href="${link}" target="_blank">${shortLink}</a>';
      var linkHtml = pskl.utils.Template.replace(linkTpl, {
        link : imageUrl,
        shortLink : this.shorten_(imageUrl, URL_MAX_LENGTH, '...')
--- a/src/js/devtools/DrawingTestSuiteController.js
+++ b/src/js/devtools/DrawingTestSuiteController.js
@ -21,7 +21,7 @@

    var testSuiteStatus = document.createElement('li');
    testSuiteStatus.innerHTML = pskl.utils.Template.replace(
-      '<b>Test Suite [{{path}}]</b>',
+      '<b>Test Suite [${path}]</b>',
      {path : this.shortenPath_(this.suitePath)}
    );
    this.testListElt.appendChild(testSuiteStatus);
@ -51,7 +51,7 @@
    var testCaseStatus = document.createElement('li');

    testCaseStatus.innerHTML = pskl.utils.Template.replace(
-      '[{{path}}] finished : <b style="color:{{color}}">{{status}}</b>',
+      '[${path}] finished : <b style="color:${color}">${status}</b>',
      {path : this.shortenPath_(testPath), status : status ? 'OK' : 'KO', color : status ? 'green' : 'red'}
    );
    this.testListElt.appendChild(testCaseStatus);
@ -64,7 +64,7 @@

    var testSuiteStatus = document.createElement('li');
    testSuiteStatus.innerHTML = pskl.utils.Template.replace(
-      '<b>Test finished : {{status}}</b> ({{elapsed}} seconds)',
+      '<b>Test finished : ${status}</b> (${elapsed} seconds)',
      {status : status, elapsed : elapsed}
    );
    this.testListElt.appendChild(testSuiteStatus);
--- a/src/js/service/storage/FileDownloadStorageService.js
+++ b/src/js/service/storage/FileDownloadStorageService.js
@ -10,7 +10,7 @@

    pskl.utils.BlobUtils.stringToBlob(serialized, function(blob) {
      var piskelName = piskel.getDescriptor().name;
-      var timestamp = pskl.utils.DateUtils.format(new Date(), '{{Y}}{{M}}{{D}}-{{H}}{{m}}{{s}}');
+      var timestamp = pskl.utils.DateUtils.format(new Date(), '${Y}${M}${D}-${H}${m}${s}');
      var fileName = piskelName + '-' + timestamp + '.piskel';

      try {
--- a/src/js/utils/Template.js
+++ b/src/js/utils/Template.js
@ -49,7 +49,7 @@
              value = '';
            }
          }
-          template = template.replace(new RegExp('\\{\\{' + key + '\\}\\}', 'g'), value);
+          template = template.replace(new RegExp('\\$\\{' + key + '\\}', 'g'), value);
        }
      }
      return template;
--- a/src/templates/dialogs/browse-local.html
+++ b/src/templates/dialogs/browse-local.html
@ -21,9 +21,9 @@

 <script type="text/template" id="local-storage-item-template">
  <tr class="local-piskel-item">
-    <td class="local-piskel-name">{{name}}</td>
-    <td class="local-piskel-save-date">{{date}}</td>
-    <td><button type="button" data-action="load" data-name="{{name}}" class="button button-primary local-piskel-load-button">Load</button></td>
-    <td><button type="button" data-action="delete" data-name="{{name}}" class="button local-piskel-delete-button">Delete</button></td>
+    <td class="local-piskel-name">${name}</td>
+    <td class="local-piskel-save-date">${date}</td>
+    <td><button type="button" data-action="load" data-name="${name}" class="button button-primary local-piskel-load-button">Load</button></td>
+    <td><button type="button" data-action="delete" data-name="${name}" class="button local-piskel-delete-button">Delete</button></td>
  </tr>
 </script>
--- a/src/templates/dialogs/cheatsheet.html
+++ b/src/templates/dialogs/cheatsheet.html
@ -41,9 +41,9 @@
 </script>

 <script type="text/template" id="cheatsheet-shortcut-template">
-  <li class="cheatsheet-shortcut {{className}}" data-shortcut-id="{{id}}">
-    <div class="cheatsheet-icon {{icon}}"></div>
-    <span class="cheatsheet-key" rel="tooltip" data-placement="top" title="{{title}}">{{key}}</span>
-    <span class="cheatsheet-description">{{description}}</span>
+  <li class="cheatsheet-shortcut ${className}" data-shortcut-id="${id}">
+    <div class="cheatsheet-icon ${icon}"></div>
+    <span class="cheatsheet-key" rel="tooltip" data-placement="top" title="${title}">${key}</span>
+    <span class="cheatsheet-description">${description}</span>
  </li>
 </script>
--- a/src/templates/dialogs/create-palette.html
+++ b/src/templates/dialogs/create-palette.html
@ -75,10 +75,10 @@

 <script type="text/template" id="create-palette-color-template">
  <li
-    class="create-palette-color {{:selected}} {{:light-color}}"
-    style="background:{{color}}"
-    data-palette-index="{{index}}"
-    data-palette-color="{{color}}">
+    class="create-palette-color ${:selected} ${:light-color}"
+    style="background:${color}"
+    data-palette-index="${index}"
+    data-palette-color="${color}">
    <div class="create-palette-remove-color">X</div>
  </li>
 </script>
--- a/src/templates/drawing-tools.html
+++ b/src/templates/drawing-tools.html
@ -35,6 +35,6 @@

  <!-- Drawing tool icon-button -->
  <script type="text/template" id="drawingTool-item-template">
-    <li rel="tooltip" data-placement="{{tooltipposition}}" class="{{cssclass}}" data-tool-id="{{toolid}}" title="{{title}}"></li>
+    <li rel="tooltip" data-placement="${tooltipposition}" class="${cssclass}" data-tool-id="${toolid}" title="${title}"></li>
  </script>
 </div>
--- a/src/templates/layers-list.html
+++ b/src/templates/layers-list.html
@ -34,6 +34,6 @@
  <ul class="layers-list"></ul>

  <script type="text/template" id="layer-item-template">
-    <li class="layer-item {{isselected:current-layer-item}}" data-layer-index="{{layerindex}}">{{layername}}</li>
+    <li class="layer-item ${isselected:current-layer-item}" data-layer-index="${layerindex}">${layername}</li>
  </script>
 </div>
--- a/src/templates/misc-templates.html
+++ b/src/templates/misc-templates.html
@ -1,32 +1,32 @@
 <div style="display:none">
  <script type="text/template" id="progress-bar-template">
    <div class="progress-bar-container">
-      <div class="progress-bar-name">{{name}}</div>
+      <div class="progress-bar-name">${name}</div>
      <div class="progress-bar-item progress-bar"></div>
-      <div class="progress-bar-item progress-bar-status">{{status}}%</div>
+      <div class="progress-bar-item progress-bar-status">${status}%</div>
    </div>
  </script>

  <!-- Tooltip container -->
  <script type="text/template" id="tooltip-container-template">
    <div class='tooltip-container'>
-      <div>{{helptext}} <span class='tooltip-shortcut'>{{shortcut}}</span></div>
-      {{descriptors}}
+      <div>${helptext} <span class='tooltip-shortcut'>${shortcut}</span></div>
+      ${descriptors}
    </div>
  </script>

  <!-- Tooltip description with modifier -->
  <script type="text/template" id="tooltip-modifier-descriptor-template">
    <div class='tooltip-descriptor'>
-      <span class='tooltip-descriptor-button'>{{key}}</span>
-      {{description}}
+      <span class='tooltip-descriptor-button'>${key}</span>
+      ${description}
    </div>
  </script>

  <!-- Simple tooltip description -->
  <script type="text/template" id="tooltip-simple-descriptor-template">
    <div class='tooltip-descriptor'>
-      {{description}}
+      ${description}
    </div>
  </script>
 </div>
--- a/src/templates/palettes-list.html
+++ b/src/templates/palettes-list.html
@ -11,8 +11,8 @@
  </div>
  <div class="palettes-list-colors"></div>
  <script type="text/template" id="palette-color-template">
-    <div class="palettes-list-color" data-color="{{color}}" data-color-index="{{index}}" title="{{color}}">
-      <div data-color="{{color}}" style="background:{{color}}"></div>
+    <div class="palettes-list-color" data-color="${color}" data-color-index="${index}" title="${color}">
+      <div data-color="${color}" style="background:${color}"></div>
    </div>
  </script>

--- a/src/templates/settings/import.html
+++ b/src/templates/settings/import.html
@ -45,7 +45,7 @@

 <script type="text/template" id="previous-session-info-template">
  <div>
-    Restore a backup of <span style="color:gold">{{name}}</span>, saved at <span style="color:white">{{date}}</span> ?
+    Restore a backup of <span style="color:gold">${name}</span>, saved at <span style="color:white">${date}</span> ?
    <div style="margin-top:10px;">
      <button type="button" class="button  button-primary restore-session-button">Restore</button>
    </div>