@concretecms/bedrock 1.0.0 → 1.1.0

package/assets/cms/components/form/ConcreteFileDirectoryInput.vue

@@ -12,7 +12,7 @@
                     <button type="button"
                             :class="{'btn': true, 'btn-outline-secondary': true, 'ccm-create-new-directory-button': true, 'disabled': disabled === true}"
                             @click="toggleDirectoryInput" :disabled="disabled">
-                        Create New Folder
+                        {{ i18n.createNewFolder }}
                     </button>
                 </div>
                 <select v-else :id="directorySelectInputId" :name="inputName" class="ccm-directory-selector form-select" v-model="selectedDirectoryID" ref="directoryInput" :disabled="disabled">
@@ -24,16 +24,16 @@
         </div>
         <div v-if="showAddDirectoryButton" v-show="showAddDirectoryInput" class="ccm-new-directory-name-container">
             <div class="form-group">
-                <label class="form-label" :for="directoryInputId">Name</label>
+                <label class="form-label" :for="directoryInputId">{{ i18n.name }}</label>
                 <div class="input-group">
                     <input type="text"
                            :id="directoryInputId"
-                           placeholder="Please enter a name..." class="ccm-new-directory-name form-control"
+                           :placeholder="i18n.specifyName" class="ccm-new-directory-name form-control"
                            v-model="newDirectoryName" @keyup.enter.stop.prevent="createDirectory" :disabled="disabled">
                     <button type="button"
                             :class="{'btn': true, 'btn-outline-secondary': true, 'disabled': disabled === true}"
                             @click.stop.prevent="createDirectory" :disabled="disabled">
-                        Add
+                        {{ i18n.add }}
                     </button>
                 </div>
             </div>
@@ -46,6 +46,12 @@
 /* global CCM_DISPATCHER_FILENAME, CCM_SECURITY_TOKEN, ConcreteAjaxRequest, _ */
 export default {
     data: () => ({
+        i18n: {
+            createNewFolder: 'Create New Folder',
+            name: 'Name',
+            specifyName: 'Please enter a name...',
+            add: 'Add'
+        },
         showAddDirectoryInput: false,
         selectedDirectoryID: 0,
         directorySelectInputId: _.uniqueId('input-'),
@@ -109,6 +115,13 @@ export default {
         this.fetchDirectories()
     },
     mounted() {
+        if (window.ccmi18n_filemanager) {
+            for (const key in this.i18n) {
+                if (window.ccmi18n_filemanager[key]) {
+                    this.i18n[key] = window.ccmi18n_filemanager[key]
+                }
+            }
+        }
         $(this.$refs.directoryInput).selectpicker()
 
         if (this.directoryId) {

package/assets/cms/components/gallery/GalleryEdit.vue

@@ -6,14 +6,14 @@
                 <a class="nav-link"
                     :class="activeTab === 'image' ? 'active' : ''"
                     @click="openTab('image')">
-                    Images
+                    {{ i18n.images }}
                 </a>
             </li>
             <li class="nav-item">
                 <a class="nav-link"
                     @click="openTab('settings')"
                     :class="activeTab === 'settings' ? 'active' : ''">
-                    Settings
+                    {{ i18n.settings }}
                 </a>
             </li>
         </ul>
@@ -22,7 +22,7 @@
             <div v-show="activeTab === 'image'"  id="galleryImages">
                 <div class="text-end mt-4">
                     <icon-button icon="plus" icon-type="fas" type="outline" class="btn btn-secondary" @click="addImage()">
-                        Add Images
+                        {{ i18n.addImages }}
                     </icon-button>
                 </div>
                 <div class="image-container mt-4"
@@ -51,13 +51,13 @@
             </div>
             <div v-show="activeTab === 'settings'" id="gallerySettings">
                 <h3>
-                  Settings
+                  {{ i18n.settings }}
                 </h3>
 
                 <div class="form-check">
                   <input class="form-check-input" type="checkbox" id="includeDownloadLink" :value="1" :checked="$root.includeDownloadLink" name="includeDownloadLink">
                   <label class="form-check-label" for="includeDownloadLink">
-                      Include link to download original
+                      {{ i18n.includeOriginalDownloadLink }}
                   </label>
                 </div>
             </div>
@@ -143,6 +143,12 @@ export default {
         ...ImageDetail.components
     },
     data: () => ({
+        i18n: {
+            images: 'Images',
+            settings: 'Settings',
+            addImages: 'Add Images',
+            includeOriginalDownloadLink: 'Include link to download original'
+        },
         activeTab: 'image',
         activeImage: null
     }),
@@ -200,6 +206,15 @@ export default {
             })
         }
     },
+    mounted() {
+        if (window.ccmi18n_gallery) {
+            for (const key in this.i18n) {
+                if (window.ccmi18n_gallery[key]) {
+                    this.i18n[key] = window.ccmi18n_gallery[key]
+                }
+            }
+        }
+    },
     props: {
         gallery: {
             type: Array,

package/assets/cms/components/gallery/ImageDetail.vue

@@ -10,13 +10,13 @@
               @click="$emit('delete')"
               type="outline"
             >
-              Remove from Gallery
+              {{ i18n.removeFromGallery }}
             </IconButton>
-            <!-- <button type="button" class="btn btn-secondary" @click="$emit('delete')">Remove from Gallery</button> -->
+            <!-- <button type="button" class="btn btn-secondary" @click="$emit('delete')">{{ i18n.removeFromGallery }}</button> -->
         </div>
         <div class="image-details">
             <section>
-                <strong>Custom Attributes</strong>
+                <strong>{{ i18n.customAttributes }}</strong>
 
                 <p class="image-title">{{this.$props.image.title}}</p>
                 <p class="image-description">{{this.$props.image.description}}</p>
@@ -32,14 +32,14 @@
                       type="outline"
                       v-if="$props.image.detailUrl"
                     >
-                      Edit Attributes
+                      {{ i18n.editAttributes }}
                     </IconButton>
                 </div>
             </section>
 
             <section v-if="!this.$props.image.displayChoices.length">
                 <div class="mb-2">
-                    <strong>Display Options</strong>
+                    <strong>{{ i18n.displayOptions }}</strong>
                 </div>
                 <div v-for="(choice, index) in this.$props.image.displayChoices" :key="index">
                     <input v-if="choice.type === 'text'"
@@ -123,6 +123,23 @@ export default {
         IconButton,
         ...IconButton.components
     },
+    data: () => ({
+        i18n: {
+            removeFromGallery: 'Remove from Gallery',
+            customAttributes: 'Custom Attributes',
+            editAttributes: 'Edit Attributes',
+            displayOptions: 'Display Options'
+        }
+    }),
+    mounted() {
+        if (window.ccmi18n_gallery) {
+            for (const key in this.i18n) {
+                if (window.ccmi18n_gallery[key]) {
+                    this.i18n[key] = window.ccmi18n_gallery[key]
+                }
+            }
+        }
+    },
     props: {
         image: {
             type: Object,

package/assets/cms/components/groups/Chooser.vue

@@ -3,7 +3,7 @@
         <div class="mb-3 ccm-header-search-form">
             <form method="get" @submit="performSearch">
                 <div class="input-group">
-                    <input type="search" v-model="searchKeywords" placeholder="Search" class="form-control border-end-0" autocomplete="off">
+                    <input type="search" v-model="searchKeywords" :placeholder="i18n.search" class="form-control border-end-0" autocomplete="off">
                     <button type="submit" class="input-group-icon">
                         <svg width="16" height="16">
                             <use xlink:href="#icon-search"/>
@@ -18,8 +18,8 @@
                     <table class="border-top ccm-search-results-table">
                         <thead>
                         <tr>
-                            <th>ID</th>
-                            <th class="w-100">Name</th>
+                            <th>{{ i18n.id }}</th>
+                            <th class="w-100">{{ i18n.name }}</th>
                         </tr>
                         </thead>
                         <tbody>
@@ -31,7 +31,7 @@
                     </table>
                 </div>
                 <div v-else>
-                    No results found.
+                    {{ i18n.noResults }}
                 </div>
             </div>
             <div v-show="searchSubmitted === 'searching'">
@@ -65,6 +65,12 @@ export default {
     },
     data() {
         return {
+            i18n: {
+                search: 'Search',
+                id: 'ID',
+                name: 'Name',
+                noResults: 'No results found.'
+            },
             searchKeywords: '',
             searchResults: [],
             searchSubmitted: false,
@@ -91,6 +97,13 @@ export default {
         }
     },
     mounted() {
+        if (window.ccmi18n_groups) {
+            for (const key in this.i18n) {
+                if (window.ccmi18n_groups[key]) {
+                    this.i18n[key] = window.ccmi18n_groups[key]
+                }
+            }
+        }
         var my = this
         new ConcreteAjaxRequest({
             method: 'POST',

package/assets/cms/components/page/Chooser/ChooserSearch.vue

@@ -4,7 +4,7 @@
             <div class="col-md-4 ms-auto">
                 <form @submit.prevent="search">
                     <div class="ccm-header-search-form-input input-group">
-                        <input type="text" class="form-control border-end-0" placeholder="Search" autocomplete="false" v-model="searchText">
+                        <input type="text" class="form-control border-end-0" :placeholder="i18n.search" autocomplete="false" v-model="searchText">
                         <button type="submit" class="input-group-icon">
                             <svg width="16" height="16">
                                 <use xlink:href="#icon-search"/>
@@ -18,7 +18,7 @@
             <span class="search-icon my-4">
                 <Icon icon="search" type="fas" color="#f4f4f4"/>
             </span>
-            <p><b>Let's get some info on what you're looking for.</b></p>
+            <p><b>{{ i18n.initialPageSearchChooserTip }}</b></p>
         </div>
         <div v-if="keywords">
             <PageList
@@ -37,6 +37,10 @@ import PageList from './../PageList'
 export default {
     components: { Icon, PageList },
     data: () => ({
+        i18n: {
+            search: 'Search',
+            initialPageSearchChooserTip: "Let's get some info on what you're looking for."
+        },
         searchText: '',
         keywords: '',
         routePath: '/ccm/system/page/chooser/search/'
@@ -52,6 +56,15 @@ export default {
                 title: page.name
             })
         }
+    },
+    mounted() {
+        if (window.ccmi18n_sitemap) {
+            for (const key in this.i18n) {
+                if (window.ccmi18n_sitemap[key]) {
+                    this.i18n[key] = window.ccmi18n_sitemap[key]
+                }
+            }
+        }
     }
 }
 </script>

package/assets/cms/components/page/PageList.vue

@@ -8,9 +8,9 @@
                 <thead>
                 <tr>
                     <th><span>Type</span></th>
-                    <th :class="orderBy === 'cv.cvName' ? 'ccm-results-list-active-sort-' + orderByDirection : ''"><a href="#" @click="sortResults('cv.cvName', 'asc', $event)">Name</a></th>
-                    <th :class="orderBy === 'cv.cvDatePublic' ? 'ccm-results-list-active-sort-' + orderByDirection : ''"><a href="#" @click="sortResults('cv.cvDatePublic', 'asc', $event)">Date</a></th>
-                    <th :class="orderBy === 'c.cDateModified' ? 'ccm-results-list-active-sort-' + orderByDirection : ''"><a href="#" @click="sortResults('c.cDateModified', 'desc', $event)">Last Modified</a></th>
+                    <th :class="orderBy === 'cv.cvName' ? 'ccm-results-list-active-sort-' + orderByDirection : ''"><a href="#" @click="sortResults('cv.cvName', 'asc', $event)">{{ i118n.name }}</a></th>
+                    <th :class="orderBy === 'cv.cvDatePublic' ? 'ccm-results-list-active-sort-' + orderByDirection : ''"><a href="#" @click="sortResults('cv.cvDatePublic', 'asc', $event)">{{ i18n.date }}</a></th>
+                    <th :class="orderBy === 'c.cDateModified' ? 'ccm-results-list-active-sort-' + orderByDirection : ''"><a href="#" @click="sortResults('c.cDateModified', 'desc', $event)">{{ i18n.lastModified }}</a></th>
                     <th><span>Author</span></th>
                 </tr>
                 </thead>
@@ -58,6 +58,11 @@ import Pagination from '../Pagination'
 export default {
     components: { Pagination },
     data: () => ({
+        i18n: {
+            name: 'Name',
+            date: 'Date',
+            lastModified: 'Last Modified'
+        },
         currentPage: -1,
         latestSearchID: null,
         mouseOver: 0,
@@ -190,6 +195,13 @@ export default {
         }
     },
     mounted () {
+        if (window.ccmi18n_sitemap) {
+            for (const key in this.i18n) {
+                if (window.ccmi18n_sitemap[key]) {
+                    this.i18n[key] = window.ccmi18n_sitemap[key]
+                }
+            }
+        }
         this.fetchPages()
     }
 }

package/assets/cms/components/user/Chooser/Search.vue

@@ -4,7 +4,7 @@
             <div class="col-md-6 ms-auto">
                 <form @submit.prevent="search">
                     <div class="ccm-header-search-form-input input-group">
-                        <input type="text" class="form-control border-end-0" placeholder="Search" autocomplete="false" v-model="searchText">
+                        <input type="text" class="form-control border-end-0" :placeholder="i18n.search" autocomplete="false" v-model="searchText">
                         <button type="submit" class="input-group-icon">
                             <svg width="16" height="16">
                                 <use xlink:href="#icon-search"/>
@@ -18,7 +18,7 @@
             <span class="search-icon my-4">
                 <Icon icon="search" type="fas" color="#f4f4f4"/>
             </span>
-            <p><b>Let's get some info on what you're looking for.</b></p>
+            <p><b>{{ i18n.initialUserSearchChooserTip }}</b></p>
         </div>
         <div>
             <users v-if="keywords"
@@ -39,6 +39,10 @@ export default {
         Users
     },
     data: () => ({
+        i18n: {
+            search: 'Search',
+            initialUserSearchChooserTip: "Let's get some info on what you're looking for."
+        },
         keywords: '',
         searchText: '',
         selectedUsers: [],
@@ -59,6 +63,15 @@ export default {
         selectedUsers: function(value) {
             this.$emit('update:selectedUsers', value)
         }
+    },
+    mounted() {
+        if (window.ccmi18n_users) {
+            for (const key in this.i18n) {
+                if (window.ccmi18n_users[key]) {
+                    this.i18n[key] = window.ccmi18n_users[key]
+                }
+            }
+        }
     }
 }
 </script>

package/assets/cms/components/user/Chooser/Users.vue

@@ -6,11 +6,11 @@
                 <thead>
                     <tr>
                         <th></th>
-                        <th @click="sortBy('name')" :class="getSortColumnClassName('name')"><a href="javascript:void(0)">Username</a></th>
-                        <th @click="sortBy('email')" :class="getSortColumnClassName('email')"><a href="javascript:void(0)">Email</a></th>
-                        <th @click="sortBy('dateAdded')" :class="getSortColumnClassName('dateAdded')"><a href="javascript:void(0)">Date</a></th>
-                        <th>Status</th>
-                        <th @click="sortBy('totalLogins')" :class="getSortColumnClassName('totalLogins')"><a href="javascript:void(0)"># Logins</a></th>
+                        <th @click="sortBy('name')" :class="getSortColumnClassName('name')"><a href="javascript:void(0)">{{ i18n.username }}</a></th>
+                        <th @click="sortBy('email')" :class="getSortColumnClassName('email')"><a href="javascript:void(0)">{{ i18n.email }}</a></th>
+                        <th @click="sortBy('dateAdded')" :class="getSortColumnClassName('dateAdded')"><a href="javascript:void(0)">{{ i18n.date }}</a></th>
+                        <th>{{ i18n.status }}</th>
+                        <th @click="sortBy('totalLogins')" :class="getSortColumnClassName('totalLogins')"><a href="javascript:void(0)">{{ i18n.numLogins }}</a></th>
                     </tr>
                 </thead>
                 <tbody>
@@ -36,6 +36,13 @@
 export default {
     data() {
         return {
+            i18n: {
+                username: 'Username',
+                email: 'Email',
+                date: 'Date',
+                status: 'Status',
+                numLogins: '# Logins'
+            },
             isLoading: true,
             userList: [],
             selectedUsers: [],
@@ -111,6 +118,13 @@ export default {
         }
     },
     mounted() {
+        if (window.ccmi18n_users) {
+            for (const key in this.i18n) {
+                if (window.ccmi18n_users[key]) {
+                    this.i18n[key] = window.ccmi18n_users[key]
+                }
+            }
+        }
         this.getUsers()
     }
 }

package/assets/cms/components/user/Chooser.vue

@@ -2,8 +2,8 @@
     <div>
         <search :selectedUsers.sync="selectedUsers" :multiple-selection="multipleSelection"/>
         <div class="dialog-buttons">
-            <button class="btn btn-secondary" data-dialog-action="cancel">Cancel</button>
-            <button type="button" @click="chooseUsers" :disabled="selectedUsers.length === 0" class="btn btn-primary">Choose</button>
+            <button class="btn btn-secondary" data-dialog-action="cancel">{{ i18n.cancel }}</button>
+            <button type="button" @click="chooseUsers" :disabled="selectedUsers.length === 0" class="btn btn-primary">{{ i18n.choose }}</button>
         </div>
     </div>
 </template>
@@ -25,6 +25,10 @@ export default {
     },
     data() {
         return {
+            i18n: {
+                cancel: 'Cancel',
+                choose: 'Choose'
+            },
             selectedUsers: []
         }
     },
@@ -32,6 +36,15 @@ export default {
         chooseUsers() {
             window.ConcreteEvent.publish('UserSearchDialogSelectUser.core', { users: this.selectedUsers })
         }
+    },
+    mounted() {
+        if (window.ccmi18n_users) {
+            for (const key in this.i18n) {
+                if (window.ccmi18n_users[key]) {
+                    this.i18n[key] = window.ccmi18n_users[key]
+                }
+            }
+        }
     }
 }
 </script>

package/assets/cms/js/edit-mode/style-customizer/color.js

@@ -3,12 +3,16 @@
 function ConcreteStyleCustomizerColorPicker($element, options) {
     var my = this
     my.$element = $element
+    const defaulti18n = window.ccmi18n_styleCustomizer || null
     my.options = $.extend(true, {
         initialColor: '',
         i18n: {
-            cancel: 'Cancel',
-            choose: 'Choose',
-            clear: 'Clean'
+            cancel: defaulti18n && defaulti18n.cancel ? defaulti18n.cancel : 'Cancel',
+            choose: defaulti18n && defaulti18n.choose ? defaulti18n.choose : 'Choose',
+            clear: defaulti18n && defaulti18n.clearColorSelection ? defaulti18n.clearColorSelection : 'Clear Color Selection',
+            noColorSelected: defaulti18n && defaulti18n.noColorSelected ? defaulti18n.noColorSelected : 'No Color Selected',
+            togglePaletteMore: defaulti18n && defaulti18n.togglePaletteMore ? defaulti18n.togglePaletteMore : 'More',
+            togglePaletteLess: defaulti18n && defaulti18n.togglePaletteLess ? defaulti18n.togglePaletteLess : 'Less'
         }
     }, options || {})
     $element.spectrum({
@@ -22,6 +26,9 @@ function ConcreteStyleCustomizerColorPicker($element, options) {
         cancelText: my.options.i18n.cancel,
         chooseText: my.options.i18n.choose,
         clearText: my.options.i18n.clear,
+        noColorSelectedText: my.options.i18n.noColorSelected,
+        togglePaletteMoreText: my.options.i18n.togglePaletteMore,
+        togglePaletteLessText: my.options.i18n.togglePaletteLess,
         change: function() {
             ConcreteEvent.publish('StyleCustomizerControlUpdate')
         }

package/assets/cms/js/edit-mode/style-customizer/custom.js

@@ -16,7 +16,7 @@ function ConcreteStyleCustomizerCustomCss($element, options) {
             url: ''
         },
         i18n: {
-            editTitle: 'Custom CSS'
+            editTitle: window.ccmi18n_styleCustomizer && window.ccmi18n_styleCustomizer.customCSS ? window.ccmi18n_styleCustomizer.customCSS : 'Custom CSS'
         }
     }, options || {})
     $element

package/assets/cms/js/edit-mode/style-customizer/inline-toolbar.js

@@ -1,9 +1,9 @@
 /* eslint-disable no-new, no-unused-vars, camelcase, no-irregular-whitespace, new-cap */
+
 /* global bootstrap */
 function ConcreteInlineStyleCustomizer($element, options) {
     var my = this
-    options = $.extend({
-    }, options)
+    options = $.extend({}, options)
 
     my.options = options
     my.$element = $element
@@ -19,7 +19,7 @@ function ConcreteInlineStyleCustomizer($element, options) {
 
 ConcreteInlineStyleCustomizer.prototype = {
 
-    refreshStyles: function(resp) {
+    refreshStyles: function (resp) {
         if (resp.oldIssID) {
             $('head').find('style[data-style-set=' + resp.oldIssID + ']').remove()
         }
@@ -28,41 +28,41 @@ ConcreteInlineStyleCustomizer.prototype = {
         }
     },
 
-    setupForm: function() {
+    setupForm: function () {
         var my = this
         const tooltipTriggerList = [].slice.call(my.$element.find('.launch-tooltip'))
         const tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
             return new bootstrap.Tooltip(tooltipTriggerEl)
         })
         my.$element.concreteAjaxForm({
-            success: function(resp) {
+            success: function (resp) {
                 my.handleResponse(resp)
             },
-            error: function(r) {
+            error: function (r) {
                 my.$toolbar.prependTo('#ccm-inline-toolbar-container').show()
             }
         })
     },
 
-    setupButtons: function() {
+    setupButtons: function () {
         var my = this
-        my.$toolbar.on('click.inlineStyleCustomizer', 'input[data-action=cancel-design]', function() {
+        my.$toolbar.on('click.inlineStyleCustomizer', 'input[data-action=cancel-design]', function () {
             my.$element.hide()
             ConcreteEvent.fire('EditModeExitInline')
             return false
         })
 
-        my.$toolbar.on('click.inlineStyleCustomizer', 'input[data-action=reset-design]', function() {
+        my.$toolbar.on('click.inlineStyleCustomizer', 'input[data-action=reset-design]', function () {
             $.concreteAjax({
                 url: $(this).attr('data-reset-action'),
-                success: function(resp) {
+                success: function (resp) {
                     my.handleResponse(resp)
                 }
             })
             return false
         })
 
-        my.$toolbar.on('click.inlineStyleCustomizer', 'input[data-action=save-design]', function() {
+        my.$toolbar.on('click.inlineStyleCustomizer', 'input[data-action=save-design]', function () {
             // move the toolbar back into the form so it submits. so great.
             my.$toolbar.hide().prependTo(my.$element)
             my.$element.submit()
@@ -71,7 +71,7 @@ ConcreteInlineStyleCustomizer.prototype = {
         })
     },
 
-    setupDropdowns: function() {
+    setupDropdowns: function () {
         var my = this
         my.$toolbar.find('.ccm-inline-toolbar-icon-cell > a').on('click', function () {
             const $dropdown = $(this).parent().find('.ccm-dropdown-menu')
@@ -87,7 +87,7 @@ ConcreteInlineStyleCustomizer.prototype = {
         })
     },
 
-    setupDeviceVisibilityComponent: function() {
+    setupDeviceVisibilityComponent: function () {
         var my = this
         my.$toolbar.find('button[data-hide-on-device]').on('click', function (e) {
             e.stopPropagation()
@@ -104,7 +104,7 @@ ConcreteInlineStyleCustomizer.prototype = {
         })
     },
 
-    setupSelectBoxes: function() {
+    setupSelectBoxes: function () {
         var my = this
 
         my.$toolbar.find('.selectpicker').selectpicker()
@@ -117,9 +117,9 @@ ConcreteInlineStyleCustomizer.prototype = {
         })
     },
 
-    setupSliders: function() {
+    setupSliders: function () {
         var my = this
-        my.$toolbar.find('.ccm-inline-style-sliders').each(function() {
+        my.$toolbar.find('.ccm-inline-style-sliders').each(function () {
             var targetInput = $(this).next().children('.ccm-inline-style-slider-value')
             var targetInputFormat = targetInput.attr('data-value-format')
             var sliderElement = $(this)
@@ -139,7 +139,7 @@ ConcreteInlineStyleCustomizer.prototype = {
                 min: min,
                 max: max,
                 value: currentValue(),
-                slide: function(event, ui) {
+                slide: function (event, ui) {
                     targetInput.prop('disabled', false)
                     targetInput.val(ui.value + targetInputFormat)
                     disableCheck()
@@ -181,7 +181,7 @@ function ConcreteBlockInlineStyleCustomizer($element, options) {
 
 ConcreteBlockInlineStyleCustomizer.prototype = Object.create(ConcreteInlineStyleCustomizer.prototype)
 
-ConcreteBlockInlineStyleCustomizer.prototype.handleResponse = function(resp) {
+ConcreteBlockInlineStyleCustomizer.prototype.handleResponse = function (resp) {
     var my = this
     var editor = new Concrete.getEditMode()
     var area = editor.getAreaByID(resp.aID)
@@ -222,7 +222,7 @@ function ConcreteAreaInlineStyleCustomizer($element, options) {
 
 ConcreteAreaInlineStyleCustomizer.prototype = Object.create(ConcreteInlineStyleCustomizer.prototype)
 
-ConcreteAreaInlineStyleCustomizer.prototype.handleResponse = function(resp) {
+ConcreteAreaInlineStyleCustomizer.prototype.handleResponse = function (resp) {
     var my = this
     var editor = new Concrete.getEditMode()
     var area = editor.getAreaByID(resp.aID)
@@ -257,21 +257,21 @@ $.fn.concreteInlineStyleCustomizer = function (options) {
     })
 }
 
-$.fn.removeClassExcept = function (val) {
-    return this.each(function (index, el) {
-        var keep = val.split(' ')  // list we'd like to keep
-        var reAdd = [] // ones that should be re-added if found
-        var $el = $(el) // element we're working on
+$.fn.removeClassExcept = function (val) {
+    return this.each(function (index, el) {
+        var keep = val.split(' ')
+        var reAdd = [] // ones that should be re-added if found
+        var $el = $(el) // element we're working on
 
         // look for which we re-add (based on them already existing)
-        for (var i = 0; i < keep.length; i++) {
-            if ($el.hasClass(keep[i])) reAdd.push(keep[i])
+        for (var i = 0; i < keep.length; i++) {
+            if ($el.hasClass(keep[i])) reAdd.push(keep[i])
         }
 
         // drop all, and only add those confirmed as existing
         $el
             .removeClass() // remove existing classes
-            .addClass(reAdd.join(' '))  // re-add the confirmed ones
+            .addClass(reAdd.join(' '))
     })
 }