Fixes #1631

README.md

@@ -16,7 +16,7 @@ Interested? [See what Adapt can do.](https://community.adaptlearning.org/demo2/i
 * Supports all core extensions and components
 * Allows uploading and linking of course assets
 
-##Full Documentation
+## Full Documentation
 [Visit the wiki](https://github.com/adaptlearning/adapt_authoring/wiki) for full documentation, including [installation](https://github.com/adaptlearning/adapt_authoring/wiki/Installing-the-Authoring-Tool), course authoring, developer guides, and other information.
 
 ## Communication
@@ -38,4 +38,4 @@ See [Contributing to the Adapt authoring tool](https://github.com/adaptlearning/
 + To provide feedback, please use the [GitHub Issues](https://github.com/adaptlearning/adapt_authoring/issues).
 
 ## License
-<a href="https://community.adaptlearning.org/" target="_blank"><img src="https://github.com/adaptlearning/documentation/blob/master/04_wiki_assets/plug-ins/images/adapt-logo-mrgn-lft.jpg" alt="adapt learning logo" align="right"></a>  Adapt is licensed under the [GNU General Public License, Version 3](https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE).
+<a href="https://community.adaptlearning.org/" target="_blank"><img src="https://github.com/adaptlearning/documentation/blob/master/04_wiki_assets/plug-ins/images/adapt-logo-mrgn-lft.jpg" alt="adapt learning logo" align="right"></a>  Adapt is licensed under the [GNU General Public License, Version 3](https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE).

frontend/src/core/editor/global/views/editorOriginView.js

@@ -122,13 +122,32 @@ define(function(require){
       type && $('.paste-zone-' + type).removeClass('display-none');
     },
 
-    showDropZones: function () {
+    showDropZones: function (supportedLayout) {
       // Purposeful global selector here
       $('.paste-zone').addClass('display-none');
       // Hide the links within the dropzone
       $('.add-control').addClass('display-none');
-      $('.paste-zone-'+ this.model.get('_type') + ' a').addClass('display-none');
-      $('.paste-zone-'+ this.model.get('_type')).addClass('paste-zone-available').removeClass('display-none');
+
+      // Components may be restricted to either full or half width so
+      // make sure only the appropriate paste zones are displayed
+      var type = this.model.get('_type');
+      var pasteZoneSelector = '.paste-zone-'+ type;
+      var $pasteZones;
+
+      if (type === 'component') {
+        $pasteZones = $();
+        if (supportedLayout.full) {
+          $pasteZones = $pasteZones.add('.paste-zone-component-full');
+        }
+        if (supportedLayout.half) {
+          $pasteZones = $pasteZones.add('.paste-zone-component-left, .paste-zone-component-right');
+        }
+      } else {
+        $pasteZones = $(pasteZoneSelector);
+      }
+
+      $(pasteZoneSelector + ' a').addClass('display-none');
+      $pasteZones.addClass('paste-zone-available').removeClass('display-none');
       this.$el.parent().children('.drop-only').removeClass('display-none');
     },
 

frontend/src/core/editor/page/views/editorComponentListView.js

@@ -77,30 +77,32 @@ define(function(require) {
     renderComponentList: function() {
       Origin.trigger('editorComponentListView:removeSubviews');
       // _.each(this.collection, function(componentType) {
+
       this.collection.each(function(componentType) {
         var properties = componentType.get('properties');
-        if (properties && properties.hasOwnProperty('._supportedLayout')) {
-          var supportedLayout = properties.hasOwnProperty('._supportedLayout').enum;
+        if (properties && properties.hasOwnProperty('_supportedLayout')) {
+          var supportedLayout = properties._supportedLayout.enum;
+          var availablePositions = _.clone(this.availablePositions);
 
           // Prune the available positions
           if (_.indexOf(supportedLayout, 'half-width') == -1) {
-            this.availablePositions.left = false;
-            this.availablePositions.right = false;
+            availablePositions.left = false;
+            availablePositions.right = false;
           }
 
           if (_.indexOf(supportedLayout, 'full-width') == -1) {
-            this.availablePositions.full = false;
+            availablePositions.full = false;
           }
         }
 
         this.$('.editor-component-list-sidebar-list').append(new EditorComponentListItemView({
-            model: componentType,
-            availablePositions: this.availablePositions,
-            _parentId: this.model.get('_parentId'),
-            $parentElement: this.$parentElement,
-            parentView: this.parentView,
-            searchTerms: componentType.get('displayName').toLowerCase()
-          }).$el);
+          model: componentType,
+          availablePositions: availablePositions,
+          _parentId: this.model.get('_parentId'),
+          $parentElement: this.$parentElement,
+          parentView: this.parentView,
+          searchTerms: componentType.get('displayName').toLowerCase()
+        }).$el);
       }, this);
     },
 

frontend/src/core/editor/page/views/editorComponentView.js

@@ -29,7 +29,7 @@ define(function(require){
 
       this.on('contextMenu:component:edit', this.loadComponentEdit);
       this.on('contextMenu:component:copy', this.onCopy);
-      this.on('contextMenu:component:copyID', this.onCopyID),
+      this.on('contextMenu:component:copyID', this.onCopyID);
       this.on('contextMenu:component:cut', this.onCut);
       this.on('contextMenu:component:delete', this.deleteComponentPrompt);
     },
@@ -104,7 +104,10 @@ define(function(require){
           view.offsetTopFromWindow = view.$el.offset().top - $(window).scrollTop();
           // This is in the helper method because the height needs to be
           // manipulated before the drag start method due to adding drop zones
-          view.showDropZones();
+          // Passing the supported layout as a parameter allows the method to
+          // determine which drop zones should be displayed
+          var supportedLayout = view.getSupportedLayout();
+          view.showDropZones(supportedLayout);
           $(this).attr('data-component-id', view.model.get('_id'));
           $(this).attr('data-block-id', view.model.get('_parentId'));
           return $('<div class="drag-helper">' + view.model.get('title') + '</div>');
@@ -144,29 +147,49 @@ define(function(require){
       });
     },
 
+    getSupportedLayout: function() {
+      var componentType = _.find(Origin.editor.data.componentTypes.models, function(type){
+        return type.get('component') === this.model.get('_component');
+      }, this);
+
+      var supportedLayout = componentType.get('properties')._supportedLayout;
+
+      return {
+        full: _.indexOf(supportedLayout.enum, 'full-width') > -1,
+        half: _.indexOf(supportedLayout.enum, 'half-width') > -1
+      }
+    },
+
     evaluateLayout: function() {
+      var supportedLayout = this.getSupportedLayout();
+      var isFullWidthSupported = supportedLayout.full;
+      var isHalfWidthSupported = supportedLayout.half;
+
       var movePositions = {
         left: false,
         right: false,
         full: false
       };
 
-      var siblings = this.model.getSiblings();
-      var showFull = !siblings.length;
-      var type = this.model.get('_layout');
-      switch (type) {
-        case 'left':
-          movePositions.right = true;
-          movePositions.full = showFull;
-          break;
-        case 'right':
-          movePositions.left = true;
-          movePositions.full = showFull;
-          break;
-        case 'full':
-          movePositions.left = true;
-          movePositions.right = true;
-          break
+      if (isHalfWidthSupported) {
+        var siblings = this.model.getSiblings();
+        var showFull = !siblings.length && isFullWidthSupported;
+        var type = this.model.get('_layout');
+
+        switch (type) {
+          case 'left':
+            movePositions.right = true;
+            movePositions.full = showFull;
+            break;
+          case 'right':
+            movePositions.left = true;
+            movePositions.full = showFull;
+            break;
+          case 'full':
+            movePositions.left = true;
+            movePositions.right = true;
+            break
+        }
       }
 
       this.model.set('_movePositions', movePositions);
@@ -262,4 +285,4 @@ define(function(require){
 
   return EditorComponentView;
 
-});
+});