Merge pull request #1865 from bolt/chore/longer-js-lines

Allow up to 120 characters on a line of JS code
bolt · Sep 16, 2020 · d8da8bb · d8da8bb
2 parents fbc4c29 + 5a1be32
commit d8da8bb
Show file tree

Hide file tree

Showing 31 changed files with 140 additions and 524 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -20,7 +20,7 @@ module.exports = {
     "no-debugger": "error" ,
     "vue/require-default-prop": "off",
     "vue/require-prop-type-constructor": "off",
-    "prettier/prettier": "error",
+    "prettier/prettier": ["error", { printWidth: 120 }],
   },
   "plugins": [
     "standard",

diff --git a/assets/js/app/editor/Components/Collection.vue b/assets/js/app/editor/Components/Collection.vue
@@ -15,11 +15,7 @@
       </div>
     </div>
 
-    <div
-      v-for="element in elements"
-      :key="element.hash"
-      class="collection-item"
-    >
+    <div v-for="element in elements" :key="element.hash" class="collection-item">
       <details :open="state === 'expanded'">
         <summary>
           <!-- Initial title. This is replaced by dynamic title in JS below. -->
@@ -144,106 +140,57 @@ export default {
      * This is a jQuery event listener, because Vue cannot handle an event emitted by a non-vue element.
      * The collection items are not Vue elements in order to initialise them correctly within their twig template.
      */
-    window
-      .$(document)
-      .on(
-        'click',
-        vueThis.selector.collectionContainer + vueThis.selector.remove,
-        function(e) {
-          e.preventDefault();
-          let collectionContainer = window
-            .$(this)
-            .closest(vueThis.selector.collectionContainer);
-          vueThis.getCollectionItemFromPressedButton(this).remove();
-          vueThis.setAllButtonsStates(collectionContainer);
-          vueThis.counter--;
-        },
-      );
+    window.$(document).on('click', vueThis.selector.collectionContainer + vueThis.selector.remove, function(e) {
+      e.preventDefault();
+      let collectionContainer = window.$(this).closest(vueThis.selector.collectionContainer);
+      vueThis.getCollectionItemFromPressedButton(this).remove();
+      vueThis.setAllButtonsStates(collectionContainer);
+      vueThis.counter--;
+    });
 
-    window
-      .$(document)
-      .on(
-        'click',
-        vueThis.selector.collectionContainer + vueThis.selector.moveUp,
-        function(e) {
-          e.preventDefault();
-          let thisCollectionItem = vueThis.getCollectionItemFromPressedButton(
-            this,
-          );
-          let prevCollectionitem = vueThis.getPreviousCollectionItem(
-            thisCollectionItem,
-          );
-          window.$(thisCollectionItem).after(prevCollectionitem);
+    window.$(document).on('click', vueThis.selector.collectionContainer + vueThis.selector.moveUp, function(e) {
+      e.preventDefault();
+      let thisCollectionItem = vueThis.getCollectionItemFromPressedButton(this);
+      let prevCollectionitem = vueThis.getPreviousCollectionItem(thisCollectionItem);
+      window.$(thisCollectionItem).after(prevCollectionitem);
 
-          vueThis.setButtonsState(thisCollectionItem);
-          vueThis.setButtonsState(prevCollectionitem);
-        },
-      );
+      vueThis.setButtonsState(thisCollectionItem);
+      vueThis.setButtonsState(prevCollectionitem);
+    });
 
-    window
-      .$(document)
-      .on(
-        'click',
-        vueThis.selector.collectionContainer + vueThis.selector.moveDown,
-        function(e) {
-          e.preventDefault();
-          let thisCollectionItem = vueThis.getCollectionItemFromPressedButton(
-            this,
-          );
-          let nextCollectionItem = vueThis.getNextCollectionItem(
-            thisCollectionItem,
-          );
-          window.$(thisCollectionItem).before(nextCollectionItem);
+    window.$(document).on('click', vueThis.selector.collectionContainer + vueThis.selector.moveDown, function(e) {
+      e.preventDefault();
+      let thisCollectionItem = vueThis.getCollectionItemFromPressedButton(this);
+      let nextCollectionItem = vueThis.getNextCollectionItem(thisCollectionItem);
+      window.$(thisCollectionItem).before(nextCollectionItem);
 
-          vueThis.setButtonsState(thisCollectionItem);
-          vueThis.setButtonsState(nextCollectionItem);
-        },
-      );
+      vueThis.setButtonsState(thisCollectionItem);
+      vueThis.setButtonsState(nextCollectionItem);
+    });
 
-    window
-      .$(document)
-      .on(
-        'click',
-        vueThis.selector.collectionContainer + vueThis.selector.expandAll,
-        function(e) {
-          e.preventDefault();
-          const collection = $(e.target).closest(
-            vueThis.selector.collectionContainer,
-          );
-          collection.find('details').attr('open', '');
-        },
-      );
+    window.$(document).on('click', vueThis.selector.collectionContainer + vueThis.selector.expandAll, function(e) {
+      e.preventDefault();
+      const collection = $(e.target).closest(vueThis.selector.collectionContainer);
+      collection.find('details').attr('open', '');
+    });
 
-    window
-      .$(document)
-      .on(
-        'click',
-        vueThis.selector.collectionContainer + vueThis.selector.collapseAll,
-        function(e) {
-          e.preventDefault();
-          const collection = $(e.target).closest(
-            vueThis.selector.collectionContainer,
-          );
-          collection.find('details').removeAttr('open');
-        },
-      );
+    window.$(document).on('click', vueThis.selector.collectionContainer + vueThis.selector.collapseAll, function(e) {
+      e.preventDefault();
+      const collection = $(e.target).closest(vueThis.selector.collectionContainer);
+      collection.find('details').removeAttr('open');
+    });
 
     /**
      * Update the title dynamically.
      */
     $(document).ready(function() {
-      $.each(
-        window.$(vueThis.selector.collectionContainer + vueThis.selector.item),
-        function() {
-          updateTitle(this);
-        },
-      );
+      $.each(window.$(vueThis.selector.collectionContainer + vueThis.selector.item), function() {
+        updateTitle(this);
+      });
 
-      window
-        .$(vueThis.selector.collectionContainer)
-        .on('keyup change', vueThis.selector.item, function() {
-          updateTitle(this);
-        });
+      window.$(vueThis.selector.collectionContainer).on('keyup change', vueThis.selector.item, function() {
+        updateTitle(this);
+      });
     });
 
     /**
@@ -318,14 +265,10 @@ export default {
       }
     },
     getPreviousCollectionItem(item) {
-      return item.prev('.collection-item').length === 0
-        ? false
-        : item.prev('.collection-item');
+      return item.prev('.collection-item').length === 0 ? false : item.prev('.collection-item');
     },
     getNextCollectionItem(item) {
-      return item.next('.collection-item').length === 0
-        ? false
-        : item.next('.collection-item');
+      return item.next('.collection-item').length === 0 ? false : item.next('.collection-item');
     },
     getCollectionItemFromPressedButton(button) {
       return window
@@ -339,10 +282,7 @@ export default {
 
       const realhash = uniqid();
 
-      template.content = template.content.replace(
-        new RegExp(template.hash, 'g'),
-        realhash,
-      );
+      template.content = template.content.replace(new RegExp(template.hash, 'g'), realhash);
 
       template.hash = realhash;
 

diff --git a/assets/js/app/editor/Components/Date.vue b/assets/js/app/editor/Components/Date.vue
@@ -109,9 +109,7 @@ export default {
 
   created() {
     if (this.locale !== 'en') {
-      const lang = require(`flatpickr/dist/l10n/${this.locale}.js`).default[
-        this.locale
-      ];
+      const lang = require(`flatpickr/dist/l10n/${this.locale}.js`).default[this.locale];
       this.config.locale = lang;
     }
     if (this.mode === 'datetime') {

diff --git a/assets/js/app/editor/Components/Embed.vue b/assets/js/app/editor/Components/Embed.vue
@@ -19,22 +19,11 @@
                 :pattern="pattern"
               />
               <span class="input-group-append">
-                <button
-                  class="btn btn-tertiary refresh"
-                  type="button"
-                  :disabled="loading"
-                  @click="updateEmbed"
-                >
-                  <i
-                    :class="(loading ? 'fa-spin' : '') + ' fas fa-sync mr-0'"
-                  ></i>
+                <button class="btn btn-tertiary refresh" type="button" :disabled="loading" @click="updateEmbed">
+                  <i :class="(loading ? 'fa-spin' : '') + ' fas fa-sync mr-0'"></i>
                 </button>
 
-                <button
-                  class="btn btn-hidden-danger remove"
-                  type="button"
-                  @click="clearEmbed"
-                >
+                <button class="btn btn-hidden-danger remove" type="button" @click="clearEmbed">
                   <i class="fas fa-trash mr-0"></i>
                 </button>
               </span>
@@ -50,9 +39,7 @@
               :readonly="readonly"
             />
             ×
-            <label for="embed-height-size" class="sr-only">{{
-              labels.label_height
-            }}</label>
+            <label for="embed-height-size" class="sr-only">{{ labels.label_height }}</label>
             <input
               class="form-control col-2"
               :name="name + '[height]'"
@@ -80,24 +67,9 @@
               type="text"
               :value="authornameData"
             />
-            <input
-              class="author_url"
-              :name="name + '[authorurl]'"
-              type="hidden"
-              :value="authorurlData"
-            />
-            <input
-              class="html"
-              :name="name + '[html]'"
-              type="hidden"
-              :value="htmlData"
-            />
-            <input
-              class="thumbnail_url"
-              :name="name + '[thumbnail]'"
-              type="hidden"
-              :value="thumbnailData"
-            />
+            <input class="author_url" :name="name + '[authorurl]'" type="hidden" :value="authorurlData" />
+            <input class="html" :name="name + '[html]'" type="hidden" :value="htmlData" />
+            <input class="thumbnail_url" :name="name + '[thumbnail]'" type="hidden" :value="thumbnailData" />
           </div>
         </div>
         <div class="col-4">
@@ -190,10 +162,7 @@ export default {
     fetchEmbed: function() {
       const body = new FormData();
       body.append('url', this.urlData);
-      body.append(
-        '_csrf_token',
-        document.getElementsByName('_csrf_token')[0].value,
-      );
+      body.append('_csrf_token', document.getElementsByName('_csrf_token')[0].value);
 
       fetch(this.embedapi, { method: 'POST', body: body })
         .then(response => response.json())

diff --git a/assets/js/app/editor/Components/File.vue b/assets/js/app/editor/Components/File.vue
@@ -1,11 +1,5 @@
 <template>
-  <div
-    class="editor__file"
-    @dragenter="onDragEnter"
-    @dragleave="onDragLeave"
-    @dragover.prevent
-    @drop="onDrop"
-  >
+  <div class="editor__file" @dragenter="onDragEnter" @dragleave="onDragLeave" @dragover.prevent @drop="onDrop">
     <transition name="fade">
       <div v-show="isDragging" class="editor__file--dragging">
         <i class="fas fa-upload"></i>
@@ -40,12 +34,7 @@
         </div>
         <div class="btn-toolbar" role="toolbar">
           <div class="btn-group mr-2" role="group">
-            <button
-              class="btn btn-sm btn-tertiary"
-              type="button"
-              :disabled="readonly"
-              @click="selectUploadFile"
-            >
+            <button class="btn btn-sm btn-tertiary" type="button" :disabled="readonly" @click="selectUploadFile">
               <i class="fas fa-fw fa-upload"></i>{{ labels.button_upload }}
             </button>
 
@@ -78,9 +67,7 @@
               >
                 <i class="fas fa-fw fa-info-circle"></i>
                 {{ labels.button_edit_attributes }}
-                <small class="dim"
-                  ><i class="fas fa-external-link-square-alt"></i
-                ></small>
+                <small class="dim"><i class="fas fa-external-link-square-alt"></i></small>
               </a>
             </div>
           </div>
@@ -108,12 +95,7 @@
               {{ labels.button_move_down }}
             </button>
 
-            <button
-              class="btn btn-sm btn-hidden-danger"
-              type="button"
-              :disabled="readonly"
-              @click="onRemoveFile"
-            >
+            <button class="btn btn-sm btn-hidden-danger" type="button" :disabled="readonly" @click="onRemoveFile">
               <i class="fas fa-fw fa-trash"></i> {{ labels.button_remove }}
             </button>
           </div>
@@ -257,9 +239,7 @@ export default {
       const fd = new FormData();
       const config = {
         onUploadProgress: progressEvent => {
-          const percentCompleted = Math.round(
-            (progressEvent.loaded * 100) / progressEvent.total,
-          );
+          const percentCompleted = Math.round((progressEvent.loaded * 100) / progressEvent.total);
           this.progress = percentCompleted;
         },
         headers: {