Przeglądaj źródła

some keyboard commands

Michael 10 lat temu
rodzic
commit
945031daaf

+ 11 - 1
src/allplatforms/classes/DocumentMenu.js

@@ -61,7 +61,9 @@ SC.loadPackage({ 'DocumentMenu': {
             comment: 'Show me at { x: anInt, y: anInt }',
             code: function(myCoordinates){
 
-                var myNode        = this.get('myNode');
+                var myNode        = this.get('myNode'),
+                    menuItemsTop  = this.get('menuItemsTop'),
+                    menuItemsLeft = this.get('menuItemsLeft');
 
                 if(myNode.parentNode === document.body){
                     return this.do('close');
@@ -70,6 +72,14 @@ SC.loadPackage({ 'DocumentMenu': {
 
                 document.body.insertBefore(myNode, SuperGlue.get('windowManager').get('windowsContainer'));
 
+                for(var i = 0, l = menuItemsTop.length; i < l; i++){
+                    menuItemsTop[i].do('updateMenuItem');
+                }
+
+                for(var i = 0, l = menuItemsLeft.length; i < l; i++){
+                    menuItemsLeft[i].do('updateMenuItem');
+                }
+
             }
         },
 

+ 6 - 5
src/allplatforms/classes/FileManagerWindow.js

@@ -1237,7 +1237,8 @@ SC.loadPackage({ 'FileManagerWindow': {
                 SuperGlue.get('server').do('doesFileExist', {
                     path: destination,
                     onerror: function() {
-                        alert('Checking if path already exists threw an error.\nError Message:\n\n' + this);
+                        alert('The file does already exist.');
+                        console.log(this)
                     },
                     onsuccess: function(aBoolean) {
 
@@ -1254,11 +1255,11 @@ SC.loadPackage({ 'FileManagerWindow': {
                                 destination = self.get('basePath') +'/'+ cleanedName.substr(0, (cleanedName.lastIndexOf('.')) || cleanedName) + '-' + increment + cleanedName.substring(cleanedName.lastIndexOf('.'));
                             }                            
                             
-                            SuperGlue.get('server').do('copyFile', {
-                                sourcePath:   '/resources/empty.html',
-                                targetPath:   destination,
+                            SuperGlue.get('server').do('newPage', {
+                                newPath: destination,
                                 onerror: function() {
-                                    alert('File / Directory could not be copied.\nError Message:\n\n' + this);
+                                    alert('There was a critical error.\nSee console for more details');
+                                    console.log(this);
                                 },
                                 onprogress: function(evt){
                                     //

+ 1 - 1
src/allplatforms/classes/ImageElement.js

@@ -7,7 +7,7 @@ SC.loadPackage({ 'ImageElement': {
 
     sharedProperties: {
         protoHTML:          { initValue: '<div class="sg-element" data-superglue-type="ImageElement" style="left: 0px; top: 0px; width: 0px; height: 0px;">'
-                                        +'\t<img src="/resources/img/defaultImage.svg" style="min-width: 100%; min-height: 100%;">'
+                                        +'\t<img src="/resources/img/defaultImage.png" style="min-width: 100%; min-height: 100%;">'
                                         +'</div>' },
         applicableWidgets:  { initValue: [ 'WidgetBackgroundColor', 'WidgetBorderColor', 'WidgetBorder', 'WidgetBorderRadius', 'WidgetPadding', 'WidgetOpacity', 'WidgetImgLink', 'WidgetImgDimensions', 'WidgetImgSrc' ] },
         creationMenuItem:   { initValue: '<div class="sg-editing-creation-menu-container"><button id="sg-editing-creation-menu-imageElement" class="sg-editing-creation-menu-button" data-tooltip="Image"></button></div>' }

+ 150 - 4
src/allplatforms/classes/Keyboard.js

@@ -2,20 +2,166 @@ SC.loadPackage({ 'Keyboard': {
 
     comment: 'I am a controller for keyboard commands.',
 
-
+    
     methods: {
 
         init: { 
             comment:    'method comment',
             code:       function(){
 
+                var self = this;
+
+                document.addEventListener('keydown', function(evt){
+                    self.do('processKeyEvent', evt);
+                }, false);
+
             }
-        }
+        },
 
-    }
 
+        processKeyEvent: {
+            comment: 'I process key events.',
+            code: function(evt){
 
-    
+                var self       = this,
+                    irrelevant = false;
+
+                if(evt.ctrlKey){
+
+
+                    switch(evt.keyCode){
+
+                        case 38:
+                            // Ctrl+ArrowUp
+                            
+                            SuperGlue.get('selection').do('callWidgetAction', { 
+                                widget:   'WidgetLayerTop',
+                                modifier: evt.shiftKey
+                            });
+                            
+                            break;
+
+                        case 40:
+                            // Ctrl+ArrowDown
+                            
+                            SuperGlue.get('selection').do('callWidgetAction', { 
+                                widget:   'WidgetLayerBottom',
+                                modifier: evt.shiftKey
+                            });
+
+                            break;
+
+                        case 65:
+                            // Ctrl+A
+                            
+                            break;
+
+                        case 67:
+                            // Ctrl+C
+
+                            SuperGlue.get('selection').do('callWidgetAction', { 
+                                widget:   'WidgetCopy'
+                            });
+                            
+                            break;
+
+                        case 71:
+                            // Ctrl+G
+                            
+                            SuperGlue.get('selection').do('callWidgetAction', { 
+                                widget:   'WidgetLock'
+                            });
+
+                            break;
+
+                        case 83:
+                            // Ctrl+S
+                                alert('ja SSSSS')
+                            break;
+
+                        case 86:
+                            // Ctrl+V
+                                
+                            break;
+
+                        case 89:
+                            // Ctrl+Y
+                            
+                            break;
+
+                        case 90:
+                            // Ctrl+Z
+                            
+                            break;
+
+                        default:
+                            irrelevant = true;
+                            break;
+
+                    }
+
+
+                }else{
+
+                    switch(evt.keyCode){
+
+                        case 46:
+                            
+                            SuperGlue.get('selection').do('callWidgetAction', { 
+                                widget:   'WidgetDelete'
+                            });
+                            
+                            break;
+
+                        case 32:
+                            // Space
+                            
+                            break;
+
+                        case 37:
+                            // ArrowLeft
+                            
+                            break;
+
+                        case 38:
+                            // ArrowUp
+                            
+                            break;
+
+                        case 39:
+                            // ArrowRight
+                            
+                            break;
+
+                        case 40:
+                            // ArrowDown
+                            
+                            break;
+
+                        case 72:
+                            // H (Help)
+                            
+                            break;
+
+                        default:
+                            irrelevant = true;
+                            break;
+
+                    }
+
+
+                }
+
+                if(!irrelevant){
+                    evt.stopPropagation();
+                    evt.preventDefault();
+                }
+
+
+            }
+        }
+
+    }
 
 
 }});

+ 8 - 1
src/allplatforms/classes/MenuItem.js

@@ -94,7 +94,14 @@ SC.loadPackage({ 'MenuItem': {
 
     		}
 
-    	}
+    	},
+
+        updateMenuItem: {
+            comment: 'I update the MenuItem when the documentMenu is shown.',
+            code: function(){
+                this.set({ isMenuItemActive: false });
+            }
+        }
 
 
     }

+ 19 - 1
src/allplatforms/classes/MenuItemCenter.js

@@ -18,6 +18,8 @@ SC.loadPackage({ 'MenuItemCenter': {
 
                 this.delegate('MenuItem', 'init', theDocumentMenu);
                 this.set({ isActionButton: true });
+
+                var self = this;
                 
                 this.get('menuContainer').firstChild.addEventListener('mouseup', function(evt){
 
@@ -34,6 +36,7 @@ SC.loadPackage({ 'MenuItemCenter': {
                     myDocument.set({ layout: {
                         centered: !myDocument.get('layout').centered
                     }});
+                    self.do('updateMenuItem');
 
                     SuperGlue.get('history').do('actionHasSucceeded', createState(myDocument));
                     
@@ -43,7 +46,22 @@ SC.loadPackage({ 'MenuItemCenter': {
 
     		}
 
-    	}
+    	},
+
+        updateMenuItem: {
+            comment: 'I update the MenuItem when the documentMenu is shown.',
+            code: function(){
+                this.set({ isMenuItemActive: false });
+
+                if(SuperGlue.get('document').get('layout').centered){
+                    this.get('menuContainer').firstElementChild.classList.remove('infinite');
+                }else{
+                    this.get('menuContainer').firstElementChild.classList.add('infinite');
+                }
+
+
+            }
+        }
 
 
     }

+ 19 - 1
src/allplatforms/classes/MenuItemOutlines.js

@@ -18,6 +18,8 @@ SC.loadPackage({ 'MenuItemOutlines': {
 
                 this.delegate('MenuItem', 'init', theDocumentMenu);
                 this.set({ isActionButton: true });
+
+                var self = this;
                 
                 this.get('menuContainer').firstChild.addEventListener('mouseup', function(evt){
 
@@ -28,13 +30,29 @@ SC.loadPackage({ 'MenuItemOutlines': {
 
                     });
 
+                    self.do('updateMenuItem');
 
                 }, false);
 
 
     		}
 
-    	}
+    	},
+
+        updateMenuItem: {
+            comment: 'I update the MenuItem when the documentMenu is shown.',
+            code: function(){
+                this.set({ isMenuItemActive: false });
+
+                if(SuperGlue.get('document').get('showOutlines')){
+                    this.get('menuContainer').firstElementChild.classList.add('hideOutlines');
+                }else{
+                    this.get('menuContainer').firstElementChild.classList.remove('hideOutlines');
+                }
+
+
+            }
+        }
 
 
     }

+ 41 - 1
src/allplatforms/classes/Selection.js

@@ -174,7 +174,47 @@ SC.loadPackage({ 'Selection': {
 
         },
 
-        
+
+        callWidgetAction: {
+            comment: 'I call a widget object\'s action',
+            code: function(config){
+
+                if(this.do('isEmpty')){
+                    return;
+                }
+
+                var widget = (function(){
+
+                                    var widgetsRight  = this.get('widgetsRight'),
+                                        widgetsBottom = this.get('widgetsBottom');
+
+                                    for(var i = 0, l = widgetsRight.length; i < l; i++){
+                                        if(widgetsRight[i].class() === config.widget){
+                                            return widgetsRight[i];
+                                        }
+                                    }
+
+                                    for(var i = 0, l = widgetsBottom.length; i < l; i++){
+                                        if(widgetsBottom[i].class() === config.widget){
+                                            return widgetsBottom[i];
+                                        }
+                                    }
+
+                                    if('WidgetLock' === config.widget){
+                                        return this.get('lockWidget');
+                                    }
+
+                                }).call(this);
+
+                if(!widget){
+                    return;
+                }
+
+                widget.do('action', config.modifier)
+                
+            }
+        },
+
 
         addElement: { 
             comment:    'I add anElement to myself.',

+ 20 - 0
src/allplatforms/classes/Server.js

@@ -195,6 +195,26 @@ SC.loadPackage({ 'Server': {
         },
 
 
+        newPage: {
+            comment: 'I create a new SuperGlue page, params = { newPath: aString, onsuccess: aFunction, onerror: aFunction, onprogress: aFunction }',
+            code: function(params){
+
+                var newPath = '.' + params.newPath.split(' ').join('\\ ');
+
+                this.do('cmdRequest', {
+
+                    cmd: 'wget http://localhost/resources/empty.html -O ' + newPath,
+
+                    onerror:    params.onerror,
+                    onprogress: params.onprogress,
+                    onresponse: params.onsuccess
+
+                });
+
+            }
+        },
+
+
         copyFile: {
             comment: 'I copy a file, params = { sourcePath: aString, targetPath: aString, onsuccess: aFunction, onerror: aFunction, onprogress: aFunction }',
             code: function(params){

+ 17 - 9
src/allplatforms/classes/WidgetCopy.js

@@ -22,24 +22,32 @@ SC.loadPackage({ 'WidgetCopy': {
 
                 this.get('widgetButton').addEventListener('mouseup', function(){
 
-                    var elements   = theSelection.get('elements'),
-                        copyString = '';
+                    self.do('action')
 
-                    for(var i = 0, l = elements.length; i < l; i++){
+                }, false)
 
-                        copyString += elements[i].do('renderYourself', { indent: 1 }) + '\n';
 
-                    }
+    		}
 
-                    SuperGlue.get('clipboard').do('copy', copyString);
+    	}, 
 
+        action: {
+            comment: 'I do the job.',
+            code: function(){
 
-                }, false)
+                var elements   = SuperGlue.get('selection').get('elements'),
+                    copyString = '';
 
+                for(var i = 0, l = elements.length; i < l; i++){
 
-    		}
+                    copyString += elements[i].do('renderYourself', { indent: 1 }) + '\n';
+
+                }
+
+                SuperGlue.get('clipboard').do('copy', copyString);
 
-    	}
+            }
+        }
 
 
     }

+ 43 - 37
src/allplatforms/classes/WidgetDelete.js

@@ -25,56 +25,62 @@ SC.loadPackage({ 'WidgetDelete': {
 
                     self.set({ isWidgetActive: false });
 
+                    self.do('action');
 
-                    var elements = self.get('selection').get('elements').slice();
-                    self.get('selection').do('clearAll');
-
-                    SuperGlue.get('history').do('actionHasStarted', (function(elements){
-
-                        var indicesAndElements = [];
-                        for(var i = 0, l = elements.length; i < l; i++){
-                            indicesAndElements.push({
-                                index:   SuperGlue.get('document').get('children').indexOf(elements[i]),
-                                element: elements[i]
-                            })
-                        }
-                        indicesAndElements.sort(function(a, b){
-                            if(a.index > b.index){
-                                return 1;
-                            }else{
-                                return -1;
-                            }
-                        });
-
-                        return function(){
-
-                            for(var i = 0, l = indicesAndElements.length; i < l; i++){
-                                SuperGlue.get('document').do('insertElement', indicesAndElements[i]);
-                            }
-                            
-                        }
+                }, false);
 
 
-                    }).call(this, elements));
+    		}
 
-                    var deleteElements = function(){
-                        for(var i = 0, l = elements.length; i < l; i++){
-                            SuperGlue.get('document').do('removeElement', elements[i]);
+    	}, 
+
+        action: {
+            comment: 'I do the job.',
+            code: function(){
+
+                var elements = this.get('selection').get('elements').slice();
+                this.get('selection').do('clearAll');
+
+                SuperGlue.get('history').do('actionHasStarted', (function(elements){
+
+                    var indicesAndElements = [];
+                    for(var i = 0, l = elements.length; i < l; i++){
+                        indicesAndElements.push({
+                            index:   SuperGlue.get('document').get('children').indexOf(elements[i]),
+                            element: elements[i]
+                        })
+                    }
+                    indicesAndElements.sort(function(a, b){
+                        if(a.index > b.index){
+                            return 1;
+                        }else{
+                            return -1;
                         }
-                    };
+                    });
 
-                    deleteElements();
+                    return function(){
 
-                    SuperGlue.get('history').do('actionHasSucceeded', deleteElements);
+                        for(var i = 0, l = indicesAndElements.length; i < l; i++){
+                            SuperGlue.get('document').do('insertElement', indicesAndElements[i]);
+                        }
+                        
+                    }
 
 
+                }).call(this, elements));
 
-                }, false);
+                var deleteElements = function(){
+                    for(var i = 0, l = elements.length; i < l; i++){
+                        SuperGlue.get('document').do('removeElement', elements[i]);
+                    }
+                };
 
+                deleteElements();
 
-    		}
+                SuperGlue.get('history').do('actionHasSucceeded', deleteElements);
 
-    	}
+            }
+        }
 
 
     }

+ 76 - 67
src/allplatforms/classes/WidgetLayerBottom.js

@@ -22,112 +22,121 @@ SC.loadPackage({ 'WidgetLayerBottom': {
                 var self = this,
                     onMouseUp = function(evt){
 
-                        var modifierKey      = evt.shiftKey || evt.ctrlKey,
-                            elements         = SuperGlue.get('selection').get('elements'),
-                            pageContainer    = SuperGlue.get('document').get('pageContainer'),
-                            documentChilds   = SuperGlue.get('document').get('children'),
-                            selectionHasGaps = false,
-                            elementsToMove   = [];
+                        self.do('action', (evt.shiftKey || evt.ctrlKey));
 
+                    };
 
-                        if(documentChilds.length <= 1){ 
-                            return;
-                        }
+                this.get('widgetButton').addEventListener('mouseup', onMouseUp, false)
 
-                        SuperGlue.get('history').do('actionHasStarted', self.do('createState'));
 
-                        if(elements.length === 1){
+    		}
 
-                            if(modifierKey){
+    	}, 
 
-                                SuperGlue.get('document').do('layerDown', elements[0]);
 
-                            }else{
+        action: {
+            comment: 'I do the job.',
+            code: function(modifierKey){
 
-                                for(var i = documentChilds.indexOf(elements[0]);
-                                    i > 0; i--){
-                                    SuperGlue.get('document').do('layerDown', elements[0]);
-                                }
+                var elements         = SuperGlue.get('selection').get('elements'),
+                    pageContainer    = SuperGlue.get('document').get('pageContainer'),
+                    documentChilds   = SuperGlue.get('document').get('children'),
+                    selectionHasGaps = false,
+                    elementsToMove   = [];
 
-                            }
-                            
 
-                        }else{
+                if(documentChilds.length <= 1){ 
+                    return;
+                }
 
+                SuperGlue.get('history').do('actionHasStarted', self.do('createState'));
 
-                            for(var i = 0, l = elements.length; i < l; i++){
-                                elementsToMove.push({
-                                    index: documentChilds.indexOf(elements[i]), 
-                                    child: elements[i],
-                                    gapBelow: null
-                                });
-                            }
+                if(elements.length === 1){
 
-                            elementsToMove.sort(function(a,b){ return a.index > b.index; });
+                    if(modifierKey){
 
-                            for(var i = 1, l = elementsToMove.length; i < l; i++){
-                                if(elementsToMove[i].index !== elementsToMove[i - 1].index + 1){
-                                    selectionHasGaps = true;
-                                    break;
-                                }
-                            }
+                        SuperGlue.get('document').do('layerDown', elements[0]);
 
+                    }else{
 
-                            if(selectionHasGaps){
+                        for(var i = documentChilds.indexOf(elements[0]);
+                            i > 0; i--){
+                            SuperGlue.get('document').do('layerDown', elements[0]);
+                        }
 
-                                for(var i = 1, l = elementsToMove.length; i < l; i++){
-                                    elementsToMove[i].gapBelow = elementsToMove[i].index - i - elementsToMove[0].index;
-                                }
+                    }
+                    
 
-                                for(var i = 1, l = elementsToMove.length; i < l; i++){
-                                    for(var k = elementsToMove[i].gapBelow; k > 0; k--){
-                                        SuperGlue.get('document').do('layerDown', elementsToMove[i].child);
-                                    }
-                                }
+                }else{
 
 
-                            }else{
+                    for(var i = 0, l = elements.length; i < l; i++){
+                        elementsToMove.push({
+                            index: documentChilds.indexOf(elements[i]), 
+                            child: elements[i],
+                            gapBelow: null
+                        });
+                    }
 
-                                if(elementsToMove[0].index === 0){
-                                    return;
-                                }
+                    elementsToMove.sort(function(a,b){ return a.index > b.index; });
+
+                    for(var i = 1, l = elementsToMove.length; i < l; i++){
+                        if(elementsToMove[i].index !== elementsToMove[i - 1].index + 1){
+                            selectionHasGaps = true;
+                            break;
+                        }
+                    }
 
-                                if(modifierKey){
 
-                                    for(var i = 0, l = elementsToMove.length; i < l; i++){
-                                        SuperGlue.get('document').do('layerDown', elementsToMove[i].child);
-                                    }
+                    if(selectionHasGaps){
 
-                                }else{
+                        for(var i = 1, l = elementsToMove.length; i < l; i++){
+                            elementsToMove[i].gapBelow = elementsToMove[i].index - i - elementsToMove[0].index;
+                        }
 
-                                    for(var n = elementsToMove[0].index;
-                                        n > 0; n--){
+                        for(var i = 1, l = elementsToMove.length; i < l; i++){
+                            for(var k = elementsToMove[i].gapBelow; k > 0; k--){
+                                SuperGlue.get('document').do('layerDown', elementsToMove[i].child);
+                            }
+                        }
 
-                                        for(var i = 0, l = elementsToMove.length; i < l; i++){
-                                            SuperGlue.get('document').do('layerDown', elementsToMove[i].child);
-                                        }
 
-                                    }
+                    }else{
 
-                                }
-                                
+                        if(elementsToMove[0].index === 0){
+                            return;
+                        }
 
+                        if(modifierKey){
+
+                            for(var i = 0, l = elementsToMove.length; i < l; i++){
+                                SuperGlue.get('document').do('layerDown', elementsToMove[i].child);
                             }
 
+                        }else{
+
+                            for(var n = elementsToMove[0].index;
+                                n > 0; n--){
 
+                                for(var i = 0, l = elementsToMove.length; i < l; i++){
+                                    SuperGlue.get('document').do('layerDown', elementsToMove[i].child);
+                                }
+
+                            }
 
                         }
+                        
 
-                        SuperGlue.get('history').do('actionHasSucceeded', self.do('createState'));
+                    }
 
-                    };
-
-                this.get('widgetButton').addEventListener('mouseup', onMouseUp, false)
 
 
-    		}
+                }
 
-    	},
+                SuperGlue.get('history').do('actionHasSucceeded', self.do('createState'));
+                
+            }
+        },
 
 
         createState: {

+ 75 - 68
src/allplatforms/classes/WidgetLayerTop.js

@@ -23,118 +23,125 @@ SC.loadPackage({ 'WidgetLayerTop': {
                 var self = this,
                     onMouseUp = function(evt){
 
-                        var modifierKey      = evt.shiftKey || evt.ctrlKey,
-                            elements         = SuperGlue.get('selection').get('elements'),
-                            pageContainer    = SuperGlue.get('document').get('pageContainer'),
-                            documentChilds   = SuperGlue.get('document').get('children'),
-                            selectionHasGaps = false,
-                            elementsToMove   = [];
+                        self.do('action', (evt.shiftKey || evt.ctrlKey))
 
+                    };
 
-                        if(documentChilds.length <= 1){ 
-                            return;
-                        }
+                this.get('widgetButton').addEventListener('mouseup', onMouseUp, false)
 
-                        SuperGlue.get('history').do('actionHasStarted', self.do('createState'));
 
-                        if(elements.length === 1){
 
-                            if(modifierKey){
 
-                                SuperGlue.get('document').do('layerUp', elements[0]);
+    		}
 
-                            }else{
+    	},
 
-                                for(var i = documentChilds.indexOf(elements[0]), l = documentChilds.length;
-                                    i < l; i++){
-                                    SuperGlue.get('document').do('layerUp', elements[0]);
-                                }
+        action: {
+            comment: 'I do the job',
+            code: function(modifierKey){
 
-                            }
-                            
-                            
+                var elements         = SuperGlue.get('selection').get('elements'),
+                    pageContainer    = SuperGlue.get('document').get('pageContainer'),
+                    documentChilds   = SuperGlue.get('document').get('children'),
+                    selectionHasGaps = false,
+                    elementsToMove   = [];
 
-                        }else{
 
+                if(documentChilds.length <= 1){ 
+                    return;
+                }
 
-                            for(var i = 0, l = elements.length; i < l; i++){
-                                elementsToMove.push({
-                                    index: documentChilds.indexOf(elements[i]), 
-                                    child: elements[i],
-                                    gapAbove: null
-                                });
-                            }
+                SuperGlue.get('history').do('actionHasStarted', self.do('createState'));
 
-                            elementsToMove.sort(function(a,b){ return a.index < b.index; });
+                if(elements.length === 1){
 
-                            for(var i = 1, l = elementsToMove.length; i < l; i++){
-                                if(elementsToMove[i].index !== elementsToMove[i - 1].index - 1){
-                                    selectionHasGaps = true;
-                                    break;
-                                }
-                            }
+                    if(modifierKey){
 
+                        SuperGlue.get('document').do('layerUp', elements[0]);
 
+                    }else{
 
-                            if(selectionHasGaps){
+                        for(var i = documentChilds.indexOf(elements[0]), l = documentChilds.length;
+                            i < l; i++){
+                            SuperGlue.get('document').do('layerUp', elements[0]);
+                        }
 
-                                for(var i = 1, l = elementsToMove.length; i < l; i++){
-                                    elementsToMove[i].gapAbove = elementsToMove[0].index - i - elementsToMove[i].index;
-                                }
+                    }
+                    
+                    
 
-                                for(var i = 1, l = elementsToMove.length; i < l; i++){
-                                    for(var k = elementsToMove[i].gapAbove; k > 0; k--){
-                                        SuperGlue.get('document').do('layerUp', elementsToMove[i].child);
-                                    }
-                                }
+                }else{
 
 
-                            }else{
+                    for(var i = 0, l = elements.length; i < l; i++){
+                        elementsToMove.push({
+                            index: documentChilds.indexOf(elements[i]), 
+                            child: elements[i],
+                            gapAbove: null
+                        });
+                    }
 
+                    elementsToMove.sort(function(a,b){ return a.index < b.index; });
 
-                                if(elementsToMove[0].index >= documentChilds.length - 1){
-                                    return;
-                                }
+                    for(var i = 1, l = elementsToMove.length; i < l; i++){
+                        if(elementsToMove[i].index !== elementsToMove[i - 1].index - 1){
+                            selectionHasGaps = true;
+                            break;
+                        }
+                    }
 
-                                if(modifierKey){
 
-                                    for(var i = 0, l = elementsToMove.length; i < l; i++){
-                                        SuperGlue.get('document').do('layerUp', elementsToMove[i].child);
-                                    }
 
-                                }else{
+                    if(selectionHasGaps){
 
-                                    for(var n = elementsToMove[0].index + 1, k = documentChilds.length;
-                                        n < k; n++){
+                        for(var i = 1, l = elementsToMove.length; i < l; i++){
+                            elementsToMove[i].gapAbove = elementsToMove[0].index - i - elementsToMove[i].index;
+                        }
 
-                                        for(var i = 0, l = elementsToMove.length; i < l; i++){
-                                            SuperGlue.get('document').do('layerUp', elementsToMove[i].child);
-                                        }
+                        for(var i = 1, l = elementsToMove.length; i < l; i++){
+                            for(var k = elementsToMove[i].gapAbove; k > 0; k--){
+                                SuperGlue.get('document').do('layerUp', elementsToMove[i].child);
+                            }
+                        }
 
-                                    }
 
-                                }
+                    }else{
+
 
+                        if(elementsToMove[0].index >= documentChilds.length - 1){
+                            return;
+                        }
+
+                        if(modifierKey){
 
+                            for(var i = 0, l = elementsToMove.length; i < l; i++){
+                                SuperGlue.get('document').do('layerUp', elementsToMove[i].child);
                             }
 
+                        }else{
 
-                        }
+                            for(var n = elementsToMove[0].index + 1, k = documentChilds.length;
+                                n < k; n++){
 
-                        SuperGlue.get('history').do('actionHasSucceeded', self.do('createState'));
+                                for(var i = 0, l = elementsToMove.length; i < l; i++){
+                                    SuperGlue.get('document').do('layerUp', elementsToMove[i].child);
+                                }
 
-                        
+                            }
 
-                    };
+                        }
 
-                this.get('widgetButton').addEventListener('mouseup', onMouseUp, false)
 
+                    }
 
 
+                }
 
-    		}
+                SuperGlue.get('history').do('actionHasSucceeded', self.do('createState'));
 
-    	},
+
+            }
+        },
 
 
         createState: {

+ 28 - 19
src/allplatforms/classes/WidgetLock.js

@@ -35,42 +35,51 @@ SC.loadPackage({ 'WidgetLock': {
                 var self = this,
                     onMouseUp = function(evt){
 
-                        SuperGlue.get('history').do('actionHasStarted', self.do('createState'))
+                        self.do('action');
 
-                        if(self.get('locked')){
+                    };
 
-                            for(var myElements = self.get('selection').get('elements'),
-                                    i = 0, l = myElements.length; i < l; i++){
+                this.get('widgetButton').addEventListener('mouseup', onMouseUp, false)
 
-                                myElements[i].set({ group: null });
 
-                            }
+    		}
 
-                        }else{
+    	}, 
 
-                            for(var groupID    = Date.now(),
-                                    myElements = self.get('selection').get('elements'),
-                                    i = 0, l = myElements.length; i < l; i++){
 
-                                myElements[i].set({ group: groupID });
+        action: {
+            comment: 'I do the job.',
+            code: function(){
 
-                            }
+                SuperGlue.get('history').do('actionHasStarted', this.do('createState'))
 
-                        }
+                if(this.get('locked')){
 
-                        self.get('selection').do('updateLockGroup');
+                    for(var myElements = this.get('selection').get('elements'),
+                            i = 0, l = myElements.length; i < l; i++){
 
-                        SuperGlue.get('history').do('actionHasSucceeded', self.do('createState'))
+                        myElements[i].set({ group: null });
 
-                    };
+                    }
 
-                this.get('widgetButton').addEventListener('mouseup', onMouseUp, false)
+                }else{
 
+                    for(var groupID    = Date.now(),
+                            myElements = this.get('selection').get('elements'),
+                            i = 0, l = myElements.length; i < l; i++){
 
-    		}
+                        myElements[i].set({ group: groupID });
 
-    	},
+                    }
 
+                }
+
+                this.get('selection').do('updateLockGroup');
+
+                SuperGlue.get('history').do('actionHasSucceeded', this.do('createState'))
+                
+            }
+        },
 
 
         createState: {