@concretecms/bedrock 1.2.9 → 1.3.2

package/assets/cms/components/RunningProcessList.vue

@@ -31,6 +31,7 @@
 </template>
 
 <script>
+/* global CCM_DISPATCHER_FILENAME, CCM_SERVER_EVENTS_URL, CCM_SECURITY_TOKEN */
 /* eslint-disable no-new */
 /* eslint eqeqeq: 0 */
 import Icon from './Icon'
@@ -117,36 +118,45 @@ export default {
             }
         })
 
-        ConcreteEvent.subscribe('ConcreteServerEventProcessOutput', function(e, data) {
-            if (data.processId) {
-                my.processes.forEach(function (thisProcess) {
-                    if (thisProcess.id === data.processId) {
-                        thisProcess.details.push(data.message)
-                    }
-                })
-            }
-        })
-        ConcreteEvent.subscribe('ConcreteServerEventBatchUpdated', function(e, data) {
-            var total = data.batch.totalJobs
-            var progress = total - data.batch.pendingJobs
-            var percent = Math.round(progress / total * 100)
-
-            my.processes.forEach(function (thisProcess) {
-                if (thisProcess.batch && thisProcess.batch.id == data.batch.id) {
-                    thisProcess.progress = percent
-                    thisProcess.batch = data.batch
-                }
+        if (typeof (CCM_SERVER_EVENTS_URL) !== 'undefined') {
+            const eventSourceUrl = new URL(CCM_SERVER_EVENTS_URL)
+            eventSourceUrl.searchParams.append('topic', '{+siteUrl}/concrete/events/processes/{+eventName}')
+            const eventSource = new EventSource(eventSourceUrl, {
+                withCredentials: true
             })
-        })
-        ConcreteEvent.subscribe('ConcreteServerEventCloseProcess', function(e, data) {
-            my.processes.forEach(function (thisProcess) {
-                if (thisProcess.id == data.process.id) {
-                    thisProcess.dateCompleted = data.process.dateCompleted
-                    thisProcess.dateCompletedString = data.process.dateCompletedString
-                    my.completeProcess(thisProcess)
+
+            eventSource.onmessage = event => {
+                var data = JSON.parse(event.data)
+                if (Object.prototype.hasOwnProperty.call(data, 'batch')) {
+                    // Batch Updated
+                    var total = data.batch.totalJobs
+                    var progress = total - data.batch.pendingJobs
+                    var percent = Math.round(progress / total * 100)
+
+                    my.processes.forEach(function (thisProcess) {
+                        if (thisProcess.batch && thisProcess.batch.id == data.batch.id) {
+                            thisProcess.progress = percent
+                            thisProcess.batch = data.batch
+                        }
+                    })
+                } else if (Object.prototype.hasOwnProperty.call(data, 'exitCode')) {
+                    // Close process
+                    my.processes.forEach(function (thisProcess) {
+                        if (thisProcess.id == data.process.id) {
+                            thisProcess.dateCompleted = data.process.dateCompleted
+                            thisProcess.dateCompletedString = data.process.dateCompletedString
+                            my.completeProcess(thisProcess)
+                        }
+                    })
+                } else if (Object.prototype.hasOwnProperty.call(data, 'processId')) {
+                    my.processes.forEach(function (thisProcess) {
+                        if (thisProcess.id === data.processId) {
+                            thisProcess.details.push(data.message)
+                        }
+                    })
                 }
-            })
-        })
+            }
+        }
     },
     watch: {
         processes: {

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

@@ -11,8 +11,7 @@ import { icons } from '../iconlist'
 export default {
     data() {
         return {
-            selectedOption: this.selected,
-            emptyOptionLabel: this.emptyOptionLabel
+            selectedOption: this.selected
         }
     },
     props: {

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

@@ -0,0 +1,49 @@
+<template>
+    <div class="input-group">
+        <input
+            class="form-control"
+            autocomplete="off"
+            value=""
+            :name="name"
+            :id="name"
+            :type="inputType"
+        />
+        <button v-if="toggler" type="button" class="input-group-icon" @click="toggle()">
+            <i :class="`fas fa-${iconName}`" aria-hidden="true"></i>
+        </button>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            passwordVisible: false,
+            inputType: 'password',
+            iconName: 'eye'
+        }
+    },
+    props: {
+        name: {
+            type: String
+        },
+        toggler: {
+            type: Boolean,
+            default: true
+        }
+    },
+    methods: {
+        toggle() {
+            this.passwordVisible = !this.passwordVisible
+
+            if (this.passwordVisible === true) {
+                this.inputType = 'text'
+                this.iconName = 'eye-slash'
+            } else {
+                this.inputType = 'password'
+                this.iconName = 'eye'
+            }
+        }
+    }
+}
+</script>

package/assets/cms/components/index.js

@@ -33,6 +33,7 @@ import ColorPageCustomizerWidget from './customizer/ColorPageCustomizerWidget'
 import ThemeCustomizerPreview from './customizer/ThemeCustomizerPreview'
 import ToolbarSliderWidget from './customizer/block/ToolbarSliderWidget'
 import ToolbarSectionWidget from './customizer/block/ToolbarSectionWidget'
+import PasswordInput from './form/PasswordInput'
 
 // Export our component library
 export default {
@@ -70,5 +71,6 @@ export default {
     ThemeCustomizerPreview,
     ToolbarSliderWidget,
     ToolbarSectionWidget,
-    ColorPageCustomizerWidget
+    ColorPageCustomizerWidget,
+    PasswordInput
 }

package/assets/cms/js/base.js

@@ -13,9 +13,6 @@ import 'ajax-bootstrap-select'
 import './modifiable-ajax-bootstrap-select'
 import 'dropzone/dist/dropzone'
 
-// Server events
-import './server-events'
-
 // jQuery UI components
 import 'jquery-ui/ui/widgets/button'
 import 'jquery-ui/ui/widgets/dialog'

package/assets/cms/js/legacy-dialog.js

@@ -14,7 +14,7 @@
     })
 
     function onDialogCreate($dialog) {
-        $dialog.parent().addClass('animated fadeIn')
+        // $dialog.parent().addClass('animated fadeIn')
     }
 
     function onDialogOpen($dialog) {
@@ -33,7 +33,11 @@
         var overlays = $('.ui-widget-overlay').length
 
         if (overlays == 1) {
-            $('.ui-widget-overlay').addClass('ui-widget-overlay-active')
+            var overlayFunction = function() {
+                var overlay = $('.ui-widget-overlay').get(0)
+                overlay.classList.add('ui-widget-overlay-active')
+            }
+            requestAnimationFrame(overlayFunction)
         }
 
         var $close = $dialog.parent().find('.ui-dialog-titlebar-close')

package/assets/cms/scss/_page-areas.scss

@@ -514,3 +514,11 @@ div.ccm-block-edit[data-block-type-handle=core_container] {
     }
   }
 }
+
+/**
+ * Dragging performance. We have to change this because BS5 sets it to to smooth which botches drag operations. See
+ * issue https://github.com/concretecms/concretecms/issues/10701
+ */
+html.ccm-edit-mode {
+  scroll-behavior: auto;
+}

package/assets/cms/scss/jquery-ui/_overrides.scss

@@ -120,7 +120,8 @@ html.ccm-toolbar-visible {
 
   .ui-widget-overlay {
     opacity: 0;
-    transition: $transition-fade;
+    transition: opacity 0.2s linear;
+    will-change: opacity;
 
     &.ui-widget-overlay-active {
       background: $modal-backdrop-bg;

package/assets/cms/scss/jquery-ui/_theme.scss

@@ -242,11 +242,7 @@ a.ui-button:active,
 }
 
 /* Overlays */
-.ui-widget-overlay {
-  background: #aaa;
-  filter: Alpha(Opacity=30)/*{opacityFilterOverlay}*/; /* support: IE8 */
-  opacity: 0.3;
-}
+/* Removed because it's screwing up CSS animation performance due to our CSS overrides of the property elsewhere */
 
 .ui-widget-shadow {
   -webkit-box-shadow: 0 0 5px #666#666;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@concretecms/bedrock",
-  "version": "1.2.9",
+  "version": "1.3.2",
   "description": "The asset framework and dependencies for Concrete CMS.",
   "scripts": {
     "lint": "standardx \"**/*.{js,vue}\" && stylelint assets/**/*.{scss,vue}",

package/assets/cms/js/server-events.js

@@ -1,17 +0,0 @@
-/* eslint-disable no-new, no-unused-vars, camelcase, eqeqeq */
-
-class ConcreteServerEvents {
-    static listen(url, topicUrl) {
-        const eventSourceUrl = new URL(url)
-        eventSourceUrl.searchParams.append('topic', topicUrl + '/{+anything}')
-        const eventSource = new EventSource(eventSourceUrl)
-        eventSource.onmessage = event => {
-            // Will be called every time an update is published by the server
-            var data = JSON.parse(event.data)
-            var eventName = 'ConcreteServerEvent' + data.event
-            ConcreteEvent.publish(eventName, data.data)
-        }
-    }
-}
-
-global.ConcreteServerEvents = ConcreteServerEvents