This is an automated email from the ASF dual-hosted git repository.
jeb pushed a commit to branch master
in repository
https://gitbox.apache.org/repos/asf/sling-org-apache-sling-app-cms.git
The following commit(s) were added to refs/heads/master by this push:
new 8dd98a1 SLING-7986 added new js lib and examples
8dd98a1 is described below
commit 8dd98a165c8dba4c071600a5b63b74d670440b69
Author: JE Bailey <[email protected]>
AuthorDate: Sun Oct 7 11:28:50 2018 -0400
SLING-7986 added new js lib and examples
---
ui/src/main/frontend/gulpfile.js | 7 +-
ui/src/main/frontend/package.json | 2 +-
ui/src/main/frontend/src/js/cms.draggable.js | 66 +++++++++++++
ui/src/main/frontend/src/js/cms.js | 85 ----------------
ui/src/main/frontend/src/js/cms.modal.js | 27 +++++
ui/src/main/frontend/src/js/cms.nav.js | 27 +++++
ui/src/main/frontend/src/js/cms.upload.js | 27 +++++
ui/src/main/frontend/src/js/nomnom.js | 143 +++++++++++++++++++++++++++
8 files changed, 297 insertions(+), 87 deletions(-)
diff --git a/ui/src/main/frontend/gulpfile.js b/ui/src/main/frontend/gulpfile.js
index f8cc434..ae79a1c 100755
--- a/ui/src/main/frontend/gulpfile.js
+++ b/ui/src/main/frontend/gulpfile.js
@@ -20,7 +20,7 @@ var header = require('gulp-header');
var cleanCSS = require('gulp-clean-css');
var concat = require('gulp-concat');
var rename = require('gulp-rename');
-var uglify = require('gulp-uglify');
+var uglify = require('gulp-terser');
var sourcemaps = require('gulp-sourcemaps');
var streamqueue = require('streamqueue');
var saveLicense = require('uglify-save-license');
@@ -87,6 +87,11 @@ gulp.task('cms-js', function() {
'./node_modules/handlebars/dist/handlebars.js',
'./node_modules/summernote/dist/summernote-lite.js',
'./node_modules/js-autocomplete/auto-complete.js',
+ './src/js/nomnom.js',
+ './src/js/cms.nav.js',
+ './src/js/cms.modal.js',
+ './src/js/cms.upload.js',
+ './src/js/cms.draggable.js',
'./src/js/cms.js'
])
.pipe(uglify({
diff --git a/ui/src/main/frontend/package.json
b/ui/src/main/frontend/package.json
index f7918fd..d6290c8 100644
--- a/ui/src/main/frontend/package.json
+++ b/ui/src/main/frontend/package.json
@@ -18,9 +18,9 @@
},
"devDependencies": {
"gulp": "^3.9.1",
+ "gulp-terser": "^1.1.5",
"gulp-concat": "^2.6.1",
"gulp-rename": "^1.4.0",
- "gulp-uglify": "^3.0.1",
"gulp-header": "^2.0.5",
"gulp-clean-css": "^3.10.0",
"gulp-sass": "^4.0.1",
diff --git a/ui/src/main/frontend/src/js/cms.draggable.js
b/ui/src/main/frontend/src/js/cms.draggable.js
new file mode 100644
index 0000000..2dd6f8f
--- /dev/null
+++ b/ui/src/main/frontend/src/js/cms.draggable.js
@@ -0,0 +1,66 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+nomnom.decorate(".is-draggable", class {
+
+ init() {
+ this.dragData = {
+ mouseX : 0,
+ mouseY : 0,
+ mouseDown : false,
+ elementX : 0,
+ elementY : 0
+ };
+ }
+
+ "mousedown::this"(event) {
+ if(event.target.matches('.modal-card-body *')){
+ return;
+ }
+ this.dragData.mouseX = event.clientX;
+ this.dragData.mouseY = event.clientY;
+ this.dragData.mouseDown = true;
+ }
+
+ "mouseup::document"() {
+ if (this.dragData.mouseDown === true){
+ this.moveComplete();
+ }
+ }
+
+ moveComplete(){
+ this.dragData.mouseDown = false;
+ this.dragData.elementX = parseInt(this.style.left) || 0;
+ this.dragData.elementY = parseInt(this.style.top) || 0;
+ return false;
+ }
+
+
+ "mousemove::document"(event){
+ if (this.dragData.mouseDown === false) {
+ return false;
+ }
+ var deltaX = event.clientX - this.dragData.mouseX;
+ var deltaY = event.clientY - this.dragData.mouseY;
+ this.style.left = this.dragData.elementX + deltaX + 'px';
+ this.style.top = this.dragData.elementY + deltaY + 'px';
+ return false;
+ }
+
+});
\ No newline at end of file
diff --git a/ui/src/main/frontend/src/js/cms.js
b/ui/src/main/frontend/src/js/cms.js
index 3b2f306..9d58b39 100644
--- a/ui/src/main/frontend/src/js/cms.js
+++ b/ui/src/main/frontend/src/js/cms.js
@@ -132,56 +132,6 @@ Sling.CMS = {
});
}
};
-
- Sling.CMS.ext['draggable'] = {
- decorate: function($ctx) {
- var draggable = function(){
- var element = this;
- var mouseX;
- var mouseY;
- var mouseDown = false;
- var elementX = 0;
- var elementY = 0;
-
- // mouse button down over the element
- element.addEventListener('mousedown', function(evt){
- if(evt.target.matches('.modal-card-body *')){
- return;
- }
- mouseX = evt.clientX;
- mouseY = evt.clientY;
- mouseDown = true;
- });
-
- var moveComplete = function(){
- mouseDown = false;
- elementX = parseInt(element.style.left) || 0;
- elementY = parseInt(element.style.top) || 0;
- return false;
- }
-
- element.addEventListener('mouseup', moveComplete);
- document.addEventListener('mouseout', moveComplete);
-
- document.addEventListener('mousemove', function(event) {
- if (!mouseDown) {
- return;
- }
- var deltaX = event.clientX - mouseX;
- var deltaY = event.clientY - mouseY;
- element.style.left = elementX + deltaX + 'px';
- element.style.top = elementY + deltaY + 'px';
- return false;
- });
-
- };
- if($ctx.is('.is-draggable')){
- $ctx.each(draggable)
- }
- $ctx.find('.is-draggable').each(draggable);
- }
- };
-
Sling.CMS.ext['load-versions'] = {
loaded: false,
decorate: function($ctx) {
@@ -202,29 +152,6 @@ Sling.CMS = {
}
};
- //support links which fetch HTML and display a modal
- Sling.CMS.ext['fetch-modal'] = {
- decorate : function($ctx){
- $ctx.find('a.Fetch-Modal').click(function(){
- var $link = $(this);
- $link.attr('disabled', 'disabled');
- Sling.CMS.ui.fetchModal($link.attr('data-title'),
encodeURI($link.attr('href')), $link.attr('data-path'), function(){
- $link.removeAttr('disabled');
- });
- return false;
- });
- }
- };
-
- Sling.CMS.ext['file-upload'] = {
- decorate: function($ctx) {
- $ctx.find('.file').on('change', "input", function(){
- var node = $(this);
- node.parent().find('.file-name').text(this.files[0].name);
- });
- }
- };
-
Sling.CMS.ext['getform'] = {
decorate: function($ctx){
$ctx.find('.Get-Form').submit(function(){
@@ -298,18 +225,6 @@ Sling.CMS = {
});
}
};
-
- Sling.CMS.ext['navbar'] = {
- init: function() {
-
document.querySelectorAll('.navbar-burger').forEach(function(burger){
- burger.addEventListener('click', function(){
- var target = document.querySelector(burger.dataset.target);
- target.classList.toggle('is-active');
- burger.classList.toggle('is-active');
- });
- });
- }
- };
Sling.CMS.ext['pageproperties'] = {
decorate: function($ctx){
diff --git a/ui/src/main/frontend/src/js/cms.modal.js
b/ui/src/main/frontend/src/js/cms.modal.js
new file mode 100644
index 0000000..bd7cb77
--- /dev/null
+++ b/ui/src/main/frontend/src/js/cms.modal.js
@@ -0,0 +1,27 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+nomnom.decorate("a.Fetch-Modal", class {
+ "click::handler"() {
+ var link = this;
+ link.setAttribute("disabled",'disabled');
+ Sling.CMS.ui.fetchModal(link.getAttribute('data-title'),
encodeURI(link.getAttribute('href')), link.getAttribute('data-path'),
function(event){
+ link.removeAttribute('disabled');
+ });
+ }
+});
diff --git a/ui/src/main/frontend/src/js/cms.nav.js
b/ui/src/main/frontend/src/js/cms.nav.js
new file mode 100644
index 0000000..8c0e7f0
--- /dev/null
+++ b/ui/src/main/frontend/src/js/cms.nav.js
@@ -0,0 +1,27 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+nomnom.decorate(".navbar-burger", class {
+ "click::this"() {
+ var target = document.querySelector(this.dataset.target);
+ target.classList.toggle('is-active');
+ this.classList.toggle('is-active');
+ }
+});
+
diff --git a/ui/src/main/frontend/src/js/cms.upload.js
b/ui/src/main/frontend/src/js/cms.upload.js
new file mode 100644
index 0000000..d4ee610
--- /dev/null
+++ b/ui/src/main/frontend/src/js/cms.upload.js
@@ -0,0 +1,27 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+nomnom.decorate(".file",class {
+ "change:input::this"(event){
+ var nameField = this.querySelector('.file-name');
+ if (nameField){
+ nameField.textContent = event.target.files[0].name;
+ }
+ }
+});
\ No newline at end of file
diff --git a/ui/src/main/frontend/src/js/nomnom.js
b/ui/src/main/frontend/src/js/nomnom.js
new file mode 100644
index 0000000..86a069c
--- /dev/null
+++ b/ui/src/main/frontend/src/js/nomnom.js
@@ -0,0 +1,143 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+(function(nomnom) {
+
+ var debug = false;
+
+ // public
+ nomnom.decorate = function(matchType, config) {
+ if (debug){
+ console.log("storing selector"+ matchType);
+ }
+ tagSelectors[matchType] = config;
+ var nodes = document.querySelectorAll(matchType);
+ for (var index = 0; index < nodes.length; ++index) {
+ wrap(nodes[index], config);
+ }
+ };
+
+ // private
+ var tagSelectors = {};
+
+ new MutationObserver(function(mutations) {
+ mutations.forEach(function(mutation) {
+ mutation.addedNodes.forEach(function(node) {
+ check(node);
+ });
+ });
+ }).observe(document.body, {
+ attributes : false,
+ childList : true,
+ subtree:true,
+ characterData : false
+ });
+
+ var wrap = function(node, config) {
+ if (debug){
+ console.log("decorating element "+ node + node.name);
+ }
+ var names = Object.getOwnPropertyNames(config.prototype);
+ names.forEach(function(name) {
+ if (debug){
+ console.log(" decorating "+ name);
+ }
+ if (name.indexOf("::") !== -1) {
+ registerEventHandler(node, name, config.prototype[name]);
+ } else {
+ node[name] = config.prototype[name];
+ }
+ });
+ if (node['init']) {
+ node['init'].call(node);
+ }
+ };
+
+ var registerEventHandler = function(node, propertyName, func) {
+ var elementIndex = propertyName.indexOf("::");
+ var eventName = propertyName.substring(0, elementIndex);
+ var selector = propertyName.substring(elementIndex + 2,
+ propertyName.length);
+ var childSelector = eventName.split(':');
+ if (childSelector[1]) {
+ console.log("capture bubbling events for "
+ + childSelector[1]);
+ eventName = childSelector[0];
+ }
+ if (selector === "this") {
+ node.addEventListener(eventName, function(event) {
+ if (childSelector[1]) {
+ console.log(" looking for "
+ + childSelector[1]);
+ console.log(" target is "
+ + event.target);
+ if (!event.target.matches(childSelector[1])) {
+ return;
+ }
+ }
+ func.call(node, event);
+ });
+ return;
+ }
+ if (selector === "handler") {
+ node.addEventListener(eventName, function(event) {
+ event.preventDefault();
+ if (childSelector[1]) {
+ if (!event.target.matches(childSelector[1])) {
+ return;
+ }
+ }
+ func.call(node, event);
+ });
+ return;
+ }
+ if (selector === "document") {
+ document.addEventListener(eventName, function(event) {
+ if (childSelector[1]) {
+ if (!event.target.matches(childSelector[1])) {
+ return;
+ }
+ }
+ func.call(node, event);
+ });
+ return;
+ }
+ }
+
+ var check = function(node) {
+ if (node.querySelectorAll) {
+ for ( var selector in tagSelectors) {
+ if (debug) {
+ console.log("checking new nodes for "+selector);
+ }
+ var found = node.querySelectorAll(selector);
+ if (found) {
+ found.forEach(function(item) {
+ if (debug) {
+ console.log("html node found for "+selector);
+ }
+ wrap(item, tagSelectors[selector])
+ });
+ }
+ }
+ }
+ };
+
+ return nomnom;
+
+})(window.nomnom = window.nomnom || {});
\ No newline at end of file
