<!DOCTYPE html>
<html ng-app="app">

  <head>
    <link data-require="bootstrap@3.3.1" data-semver="3.3.1" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" />
    <link data-require="bootstrap-css@*" data-semver="3.3.1" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" />
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.1/angular.js"></script>
    <script data-require="ui-bootstrap@0.12.1" data-semver="0.12.1" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.1.min.js"></script>
    <script src="app.js"></script>
    <script src="dragular.js"></script>
  </head>

  <body>
    <div ng-controller="MainCtrl">
      <div class="row">
        <!--
        <div class="col-sm-3">
          <div class="list-group" style="min-height:100px;" dragular="dragularObjects">
            <div class="list-group-item" ng-repeat="ob in tmpList">
                    {{ob.objectName}}
                </div>
          </div>
        </div>
        -->
        <div class="col-sm-3">
          <div class="list-group" dragular="dragularObjects">
            <div class="list-group-item haspointer hvr-sweep-to-right" ng-repeat="ob in tmpList track by $index">
            <div class="row">
                <div class="col-xs-12">
                    <div class="row no-margin">
                        <i class="ui-icon bg-primary text-md text-white ti-move dragme pull-right m-xs"></i>
                        {{ob.displayNum}}.&nbsp;{{ob.objectName}}
                    </div>
                    <div class="row no-margin">
                        <span ng-bind="{{ob.myPermLevel}}"></span>&nbsp;<span ng-bind="{{ob.ObjType}}"></span>
                    </div>
                </div>
            </div>
          </div>
          </div>
        </div>
        <div class="col-sm-3 col-sm-offset-1">
          <div class="list-group" style="min-height:100px;" dragular="dragularSimpleProtocol">
            <div class="list-group-item" ng-repeat="ob in simpleProtocol">
                    {{ob.objectName}}
                </div>
          </div>
        </div>
      </div>
    </div>
  </body>

</html>
(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
'use strict';

/**
 * dragular Directive by Luckylooke https://github.com/luckylooke/dragular
 * Angular version of dragula https://github.com/bevacqua/dragula
 */
 var dragularModule = require('./dragularModule');

/**
* @ngInject
*/

dragularModule.directive('dragular', ['dragularService', function(dragularService) {
  return {
    restrict: 'A',
    link: function($scope, iElm, iAttrs) {

      var options = $scope[iAttrs.dragular] || tryJson(iAttrs.dragular);

      function tryJson(json) {
        try { // I dont like try catch solutions but I havent find sattisfying way of chcecking json validity.
          return JSON.parse(json);
        } catch (e) {
          return undefined;
        }
      }

      if(options && options.containersModel && typeof options.containersModel === 'string'){
        options.containersModel = $scope.$eval(options.containersModel);
      }

      dragularService(iElm[0], options);
    }
  };
}]);

},{"./dragularModule":2}],2:[function(require,module,exports){
/* global angular */
'use strict';



module.exports = angular.module('dragularModule', []);

({"dragularDirective":require("./dragularDirective.js"),"dragularService":require("./dragularService.js")});

},{"./dragularDirective.js":1,"./dragularService.js":3}],3:[function(require,module,exports){
/* global angular */
'use strict';

/**
 * dragular Module and Service by Luckylooke https://github.com/luckylooke/dragular
 * Angular version of dragula https://github.com/bevacqua/dragula
 */

var dragularModule = require('./dragularModule');

/**
 * @ngInject
 */

dragularModule.factory('dragularService', ['$rootScope', '$timeout', function dragula($rootScope, $timeout) {

  var containersNameSpaced = {}, // name-spaced containers
    containersNameSpacedModel = {}, // name-spaced containers models
    _cache = {}, // classes lookup cache
    _mirror; // mirror image

  return function(initialContainers, options) {

    if (arguments.length === 1 && !Array.isArray(initialContainers) && !angular.isElement(initialContainers) && !initialContainers[0]) {
      // then containers are not provided, only options
      options = initialContainers;
      initialContainers = [];
    }

    var body = document.body,
      documentElement = document.documentElement,
      _source, // source container
      _item, // item being dragged
      _sourceModel, // source container model
      _itemModel, // item-model being dragged
      _targetModel, // target container model
      _lastTargetModel, // last target container model
      _lastDropTarget = null, // last container item was over
      _offsetX, // reference x
      _offsetY, // reference y
      _offsetXr, // reference x right for boundingBox feature
      _offsetYb, // reference y bottom for boundingBox feature
      _clientX, // cache client x, init at grab, update at drag
      _clientY, // cache client y, init at grab, update at drag
      _mirrorWidth, // mirror width for boundingBox feature
      _mirrorHeight, // mirror height for boundingBox feature
      _initialSibling, // reference sibling when grabbed
      _currentSibling, // reference sibling now
      _initialIndex, // reference model index when grabbed
      _currentIndex, // reference model index now
      _lastOverElem, // last element behind the cursor (dragOverClasses feature)
      _lastOverClass, // last overClass used (dragOverClasses feature)
      _copy, // item used for copying
      _copyModel, // item-model used for copying
      _containers = {}, // containers managed by the drake
      _containersModel = {}, // containers model
      _renderTimer, // timer for setTimeout renderMirrorImage
      _isContainer, // internal isContainer
      _targetContainer, // droppable container under drag item
      _dragEnterEvent, // drag enter event fired on element behind cursor
      _dragLeaveEvent, // drag leave event fired on element behind cursor
      _lastElementBehindCursor, // last element behind cursor
      defaultClasses = {
        mirror: 'gu-mirror',
        hide: 'gu-hide',
        unselectable: 'gu-unselectable',
        transit: 'gu-transit',
        overActive: 'gu-over-active',
        overAccepts: 'gu-over-accept',
        overDeclines: 'gu-over-decline'
      },
      o = { // options
        classes: defaultClasses,
        containers: false,
        moves: always,
        accepts: always,
        isContainer: never,
        copy: false,
        delay: false,
        invalid: invalidTarget,
        revertOnSpill: false,
        removeOnSpill: false,
        dragOverClasses: false,
        lockX: false,
        lockY: false,
        boundingBox: false,
        containersModel: false
      };

    if (!isElement(o.boundingBox)) {
      o.boundingBox = null;
    }

    if (options && options.classes) {
      angular.extend(defaultClasses, options.classes);
      angular.extend(options.classes, defaultClasses);
    }

    angular.extend(o, options);

    if (o.delay === true) {
      o.delay = 300;
    }

    if (o.mirrorContainer === void 0) {
      o.mirrorContainer = document.body;
    }

    // get initial containers from options, argument or fall back to empty array (containers can be added later)
    initialContainers = o.containers || (initialContainers ? makeArray(initialContainers) : []);
    if (o.containers) {
      // make array from o.containers
      initialContainers = makeArray(initialContainers);
    }
    if (o.containersModel) {
      o.containersModel = Array.isArray(o.containersModel[0]) ? o.containersModel : [o.containersModel];
    }

    function proceedNameSpaces(_containers, containersNameSpaced, nameSpace, initialContainers) {
      if (!containersNameSpaced[nameSpace]) {
        containersNameSpaced[nameSpace] = [];
      }
      Array.prototype.push.apply(containersNameSpaced[nameSpace], initialContainers);
      _containers[nameSpace] = containersNameSpaced[nameSpace];
    }

    // feed namespaced containers groups and optionaly shadow it by models
    if (o.nameSpace) {
      if (!Array.isArray(o.nameSpace)) {
        o.nameSpace = [o.nameSpace];
      }
      o.nameSpace.forEach(function eachNameSpace(nameSpace) {
        proceedNameSpaces(_containers, containersNameSpaced, nameSpace, initialContainers);
        if (o.containersModel) {
          proceedNameSpaces(_containersModel, containersNameSpacedModel, nameSpace, o.containersModel);
        }
      });
      _isContainer = isContainerNameSpaced;
    } else {
      // default (not using nameSpaces)
      _containers = initialContainers;
      _isContainer = isContainer;
      if (o.containersModel) {
        _containersModel = o.containersModel;
      }
    }

    //register events
    events();

    if (document.createEvent) {
      _dragEnterEvent = document.createEvent('HTMLEvents');
      _dragEnterEvent.initEvent('dragularenter', true, true);
      _dragLeaveEvent = document.createEvent('HTMLEvents');
      _dragLeaveEvent.initEvent('dragularleave', true, true);
    } else {
      _dragEnterEvent = document.createEventObject();
      _dragEnterEvent.eventType = 'dragularenter';
      _dragLeaveEvent = document.createEventObject();
      _dragLeaveEvent.eventType = 'dragularleave';
    }

    var drake = {
      addContainer: manipulateContainers('add'),
      removeContainer: manipulateContainers('remove'),
      containers: _containers,
      containersModel: _containersModel,
      start: start,
      end: end,
      cancel: cancel,
      remove: remove,
      destroy: destroy,
      dragging: false
    };

    return drake;

    // make array from array-like objects or from single element
    function makeArray(all) {
      if (Array.isArray(all)) {
        return all;
      }
      if (all.length) { // is array-like
        var iAll = all.length,
          newArray = [],
          i;
        for (i = 0; i < iAll; i++) {
          newArray.push(all[i]);
        }
        return newArray;
      } else { // is one element
        return [all];
      }
    }

    // add or remove containers - deprecated
    function manipulateContainers(op) {
      return function addOrRemove(all) {
        var changes = Array.isArray(all) ? all : makeArray(all);
        changes.forEach(function forEachContainer(container) {
          if (o.nameSpace) {
            angular.forEach(o.nameSpace, function addRemoveNamespaced(nameSpace) {
              var index;
              if (op === 'add') {
                _containers[nameSpace].push(container);
                console.warn && console.warn('drake.addContainer is deprecated. please access drake.containers directly, instead');
              } else {
                index = _containers[nameSpace].indexOf(container);
                _containers[nameSpace].splice(index, 1);
                if (o.containersModel) {
                  _containersModel[nameSpace].splice(index, 1);
                }
                console.warn && console.warn('drake.removeContainer is deprecated. please access drake.containers directly, instead');
              }
            });
          } else {
            if (op === 'add') {
              _containers.push(container);
              console.warn && console.warn('drake.addContainer is deprecated. please access drake.containers directly, instead');
            } else {
              _containers.splice(_containers.indexOf(container), 1);
              console.warn && console.warn('drake.removeContainer is deprecated. please access drake.containers directly, instead');
            }
          }
        });
      };
    }

    function isContainer(el) {
      return drake.containers.indexOf(el) !== -1 || o.isContainer(el);
    }

    function isContainerNameSpaced(el) {
      var nameSpace;
      for (nameSpace in drake.containers) {
        if (drake.containers.hasOwnProperty(nameSpace) && drake.containers[nameSpace].indexOf(el) !== -1) {
          return true;
        }
      }
      return false;
    }

    function events(rem) {
      var op = rem ? 'off' : 'on';
      regEvent(documentElement, op, 'mouseup', release);

      initialContainers.forEach(function addMouseDown(container) {
        regEvent(container, 'on', 'mousedown', grab);
      });
    }

    function destroy() {
      events(true);
      drake.removeContainer(initialContainers);
      release({});
    }

    function grab(e) {
      e = e || window.event;
      var item = e.target;

      // filter some odd situations
      if ((e.which !== 0 && e.which !== 1) || e.metaKey || e.ctrlKey) {
        return; // we only care about honest-to-god left clicks and touch events
      }

      // check if drag can start
      if (start(item) !== true) {
        return;
      }

      // automaticly detect direction of elements if not set in options
      if (!o.direction) {
        var parent = item.parentElement,
          parentHeight = parent.offsetHeight,
          parentWidth = parent.offsetWidth,
          childHeight = item.clientHeight,
          childWidth = item.clientWidth;
        o.direction = parentHeight / childHeight < parentWidth / childWidth ? 'horizontal' : 'vertical';
      }

      // get initial coordinates, used to render _mirror for first time
      var offset = getOffset(_item);
      _offsetX = getCoord('pageX', e) - offset.left;
      _offsetY = getCoord('pageY', e) - offset.top;
      _clientX = getCoord('clientX', e);
      _clientY = getCoord('clientY', e);

      // limiting area of _mirror movement, get initial coordinates
      if (o.boundingBox) {
        _offsetXr = getCoord('pageX', e) - offset.right;
        _offsetYb = getCoord('pageY', e) - offset.bottom;
      }

      // delayed rendering
      if (typeof o.delay === 'number') {
        _renderTimer = $timeout(function() {
          renderMirrorAndDrag(e);
        }, o.delay);
      } else {
        renderMirrorAndDrag(e);
      }

      e.preventDefault();
    }

    function renderMirrorAndDrag(e) {
      addClass(_copy || _item, o.classes.transit);
      renderMirrorImage();
      // initial position
      _mirror.style.left = _clientX - _offsetX + 'px';
      _mirror.style.top = _clientY - _offsetY + 'px';

      drag(e);
    }


    function start(item) {
      var handle = item;

      if (drake.dragging && _mirror) {
        return; // already dragging
      }

      if (_isContainer(item)) {
        return; // don't drag container itself
      }

      while (item.parentElement && !_isContainer(item.parentElement)) {
        // break loop if user tries to drag item which is considered invalid handle
        if (o.invalid(item, handle)) {
          return;
        }
        item = item.parentElement; // drag target should be immediate child of container
        if (!item) {
          return;
        }
      }

      var container = item.parentElement;
      if (!container) {
        return;
      }
      if (!container || o.invalid(item, handle) || !o.moves(item, container, handle, _itemModel, _sourceModel)) { // is movable
        return;
      }

      end();

      // prepare models operations
      if (o.containersModel) {
        var containerIndex = initialContainers.indexOf(container),
          itemIndex = domIndexOf(item, container);

        _initialIndex = _currentIndex = itemIndex;
        _sourceModel = o.containersModel[containerIndex];
        _targetModel = _sourceModel;
        _itemModel = _sourceModel[itemIndex];
        if (o.copy) {
          _copyModel = angular.copy(_itemModel);
        }
      }

      if (o.copy) {
        _copy = item.cloneNode(true);
        if (o.scope) {
          o.scope.$emit('cloned', _copy, item, _copyModel, _itemModel);
        }
      }

      _source = container;
      _item = item;
      _initialSibling = _currentSibling = nextEl(item);

      drake.dragging = true;
      if (o.scope) {
        o.scope.$emit('drag', _item, _source);
      }

      return true;
    }

    function invalidTarget(el) {
      return el.tagName === 'A' || el.tagName === 'BUTTON';
    }

    function end() {
      if (!drake.dragging) {
        return;
      }
      console.log('!!!!! I havent seen this message in any case');
      var item = _copy || _item;
      drop(item, item.parentElement);
    }

    function release(e) {
      if (!drake.dragging) {
        return;
      }
      e = e || window.event;

      _clientX = getCoord('clientX', e);
      _clientY = getCoord('clientY', e);

      var item = _copy || _item,
        elementBehindCursor = getElementBehindPoint(_mirror, _clientX, _clientY),
        dropTarget = findDropTarget(elementBehindCursor, _clientX, _clientY);

      if (dropTarget && (o.copy === false || dropTarget !== _source)) {
        // found valid target and (is not copy case or target is not initial container)
        drop(item, dropTarget);
      } else if (o.removeOnSpill) {
        remove();
      } else {
        cancel();
      }

      // after release there is no container hovered
      _targetContainer = null;

      // remove classes if used
      if (o.dragOverClasses && _lastOverElem) {
        rmClass(_lastOverElem, _lastOverClass);
        _lastOverElem = null;
      }

      if (o.scope) {
        o.scope.$emit('release', item, _source);
      }
    }

    function drop(item, target) {
      if (o.scope && isInitialPlacement(target)) {
        o.scope.$emit('cancel', item, _source, _copyModel || _itemModel, _sourceModel, _targetModel);
      } else if (o.scope) {
        o.scope.$emit('drop', item, target, _source, _copyModel || _itemModel, _sourceModel, _targetModel);
      }
      cleanup();
    }

    function remove() {
      if (!drake.dragging) {
        return;
      }
      var item = _copy || _item,
        parent = item.parentElement,
        itemModel;

      if (!o.containersModel) {
        if (parent) {
          parent.removeChild(item);
        }
      } else {
        itemModel = _copyModel || _itemModel;
        _targetModel.splice(_targetModel.indexOf(itemModel), 1);
      }

      if (o.scope) {
        o.scope.$emit(o.copy ? 'cancel' : 'remove', item, parent, itemModel, _sourceModel, _targetModel);
      }
      cleanup();
    }

    function cancel(revert) {
      if (!drake.dragging) {
        return;
      }
      var reverts = arguments.length > 0 ? revert : o.revertOnSpill,
        item = _copy || _item,
        parent = item.parentElement;

      if (parent === _source && o.copy) {
        console.log('!!!!!!!!!!!!!!!!! I think this is never possible because copy cannot be placed into source');
        if (!o.containersModel) {
          parent.removeChild(_copy);
        } else {
          _targetModel.splice(_targetModel.indexOf(_copyModel), 1, _copyModel);
        }
      }

      var initial = isInitialPlacement(parent);
      if (initial === false && o.copy === false && reverts) {
        if (!o.containersModel) {
          _source.insertBefore(item, _initialSibling);
        } else {
          _lastTargetModel = _targetModel;
          _targetModel = _sourceModel;
          // move back to initial placement
          moveInContainersModel(_initialIndex);
        }
      }

      if (o.scope && (initial || reverts)) {
        o.scope.$emit('cancel', item, _source);
      } else if (o.scope) {
        o.scope.$emit('drop', item, parent, _source);
      }

      cleanup();
    }

    function cleanup() {
      var item = _copy || _item;
      removeMirrorImage();

      if (item) {
        rmClass(item, o.classes.transit);
      }

      // cancel timer
      if (_renderTimer) {
        $timeout.cancel(_renderTimer);
      }

      drake.dragging = false;

      if (o.scope) {
        o.scope.$emit('dragend', item);
        o.scope.$emit('out', item, _lastDropTarget, _source);
      }

      _source = _item = _copy = _initialSibling = _currentSibling = _sourceModel = null;
      _itemModel = _copyModel = _initialIndex = _currentIndex = _renderTimer = _lastDropTarget = null;
    }

    // is item currently placed in original container and original position?
    function isInitialPlacement(target, s) {
      var sibling = s || (_mirror ? _currentSibling : nextEl(_item || _copy));
      return target === _source && sibling === _initialSibling;
    }

    // find valid drop container
    function findDropTarget(elementBehindCursor, clientX, clientY) {
      var target = elementBehindCursor;

      while (target && !accepted()) {
        target = target.parentElement;
      }
      return target;

      function accepted() {
        var accepts = false;

        if (_isContainer(target)) { // is droppable?
          _targetContainer = target;

          var immediate = getImmediateChild(target, elementBehindCursor),
            reference = getReference(target, immediate, clientX, clientY),
            initial = isInitialPlacement(target, reference);
          accepts = initial ? true : o.accepts(_item, target, _source, reference, _itemModel, _sourceModel);

          if (accepts && o.containersModel) {
            _lastTargetModel = _targetModel;
            if (!o.nameSpace) {
              _targetModel = _containersModel[drake.containers.indexOf(target)];
            } else {
              for (var nameSpace in drake.containers) {
                if (drake.containers.hasOwnProperty(nameSpace) && drake.containers[nameSpace].indexOf(target) !== -1) {
                  _lastTargetModel = _targetModel;
                  _targetModel = _containersModel[nameSpace][drake.containers[nameSpace].indexOf(target)];
                  break;
                }
              }
            }
          }
        }

        // add class if element is enabled for it and it has not already the class
        if (o.dragOverClasses &&
          hasClass(target, o.classes.overActive) &&
          target !== _lastOverElem) {

          if (_lastOverElem) { // clear from previous
            rmClass(_lastOverElem, _lastOverClass);
          }

          _lastOverClass = accepts ? o.classes.overAccepts : o.classes.overDeclines;
          addClass(target, _lastOverClass);
          _lastOverElem = target;
        }

        return accepts;
      }
    }

    function drag(e) {
      if (!_mirror) {
        return;
      }
      e = e || window.event;

      // update coordinates
      _clientX = getCoord('clientX', e);
      _clientY = getCoord('clientY', e);

      // count mirror coordiates
      var x = _clientX - _offsetX,
        y = _clientY - _offsetY,
        pageX,
        pageY,
        offsetBox;

      // fill extra properties if boundingBox is used
      if (o.boundingBox) {
        pageX = getCoord('pageX', e);
        pageY = getCoord('pageY', e);
        offsetBox = getOffset(o.boundingBox);
      }

      if (!o.lockY) {
        if (!o.boundingBox || (pageX > offsetBox.left + _offsetX && pageX < offsetBox.right + _offsetXr)) {
          _mirror.style.left = x + 'px';
        } else if (o.boundingBox) { // check again in case user scrolled the view
          if (pageX < offsetBox.left + _offsetX) {
            _mirror.style.left = _clientX - (pageX - offsetBox.left) + 'px';
          } else {
            _mirror.style.left = _clientX - _mirrorWidth - (pageX - offsetBox.right) + 'px';
          }
        }
      }
      if (!o.lockX) {
        if (!o.boundingBox || (pageY > offsetBox.top + _offsetY && pageY < offsetBox.bottom + _offsetYb)) {
          _mirror.style.top = y + 'px';
        } else if (o.boundingBox) { // check again in case user scrolled the view
          if (pageY < offsetBox.top + _offsetY) {
            _mirror.style.top = _clientY - (pageY - offsetBox.top) + 'px';
          } else {
            _mirror.style.top = _clientY - _mirrorHeight - (pageY - offsetBox.bottom) + 'px';
          }
        }
      }

      var item = _copy || _item,
        elementBehindCursor = getElementBehindPoint(_mirror, _clientX, _clientY),
        dropTarget = findDropTarget(elementBehindCursor, _clientX, _clientY),
        changed = dropTarget !== null && dropTarget !== _lastDropTarget;

      if (elementBehindCursor !== _lastElementBehindCursor) {
        fireEvent(elementBehindCursor, _dragEnterEvent);
        if (_lastElementBehindCursor) {
          fireEvent(_lastElementBehindCursor, _dragLeaveEvent);
        }
        _lastElementBehindCursor = elementBehindCursor;
      }

      if (changed || dropTarget === null) {
        if (o.scope) {
          out();
          _lastDropTarget = dropTarget;
          over();
        } else {
          _lastDropTarget = dropTarget;
        }
      }

      // do not copy in same container
      if (dropTarget === _source && o.copy) {
        if (!o.containersModel && item.parentElement) {
          item.parentElement.removeChild(item);
        } else if (o.containersModel && _lastTargetModel.indexOf(_copyModel) !== -1) {
          $rootScope.$applyAsync(function removeCopyFromLastContainer() {
            _lastTargetModel.splice(_lastTargetModel.indexOf(_copyModel), 1);
          });
        }
        return;
      }

      var reference,
        immediate = getImmediateChild(dropTarget, elementBehindCursor),
        referenceIndex;

      if (immediate !== null) {
        reference = getReference(dropTarget, immediate, _clientX, _clientY);
        if (o.containersModel) {
          if (reference) { // reference is null if drag is over last element
            referenceIndex = domIndexOf(reference, dropTarget);
          } else {
            referenceIndex = null;
          }
        }
      } else if (o.revertOnSpill === true && !o.copy) {
        // the case that mirror is not over valid target and reverting is on and copy is off
        reference = _initialSibling;
        dropTarget = _source;

        // getting model intitial properties into current
        if (o.containersModel) {
          referenceIndex = _initialIndex;
          _lastTargetModel = _targetModel;
          _targetModel = _sourceModel;
        }
      } else {
        // the case that mirror is not over valid target and removing is on or copy is on
        if ((o.copy || o.removeOnSpill === true) && item.parentElement !== null) {
          // remove item or copy of item
          if (!o.containersModel) {
            item.parentElement.removeChild(item);
          } else {
            $rootScope.$applyAsync(function removeOnSpillOrRemoveCopy() {
              _targetModel.splice(referenceIndex, 1);
            });
          }
        }
        return;
      }
      if (reference === null ||
        reference !== item &&
        reference !== nextEl(item) &&
        reference !== _currentSibling) {
        // moving item/copy to new container from previous one
        _currentSibling = reference;

        if (!o.containersModel) {
          dropTarget.insertBefore(item, reference); // if reference is null item is inserted at the end
        } else {
          moveInContainersModel(referenceIndex);
        }

        if (o.scope) {
          o.scope.$emit('shadow', item, dropTarget);
        }
      }

      function moved(type) {
        o.scope.$emit(type, item, _lastDropTarget, _source);
      }

      function over() {
        if (changed) {
          moved('over');
        }
      }

      function out() {
        if (_lastDropTarget) {
          moved('out');
        }
      }
    }

    function moveInContainersModel(referenceIndex) {
      $rootScope.$applyAsync(function applyMoveBetweenContainers() {
        if (_lastTargetModel === _targetModel) {
          if (referenceIndex === null) {
            referenceIndex = _targetModel.length;
          }
          var index = referenceIndex > _currentIndex ? referenceIndex - 1 : referenceIndex;
          _targetModel.splice(index, 0, _lastTargetModel.splice(_currentIndex, 1)[0]);
          _currentIndex = index;
        } else {
          if (referenceIndex === null) {
            referenceIndex = _targetModel.length - 1;
          }
          if (!o.copy || _lastTargetModel !== _sourceModel) { // dont remove original from source while copying
            _lastTargetModel.splice(_currentIndex, 1);
          }
          if (!o.copy || _targetModel.indexOf(_copyModel) === -1) { // dont place copy twice in one drag
            _targetModel.splice(referenceIndex, 0, _copyModel || _itemModel);
            _currentIndex = referenceIndex;
          }
        }
      });
    }

    function scrollContainer(e) {
      if (_targetContainer) {
        var before = _targetContainer.scrollTop;
        _targetContainer.scrollTop += e.deltaY;
        // block scroll of the document when container can be scrolled
        if (before !== _targetContainer.scrollTop) {
          e.stopPropagation();
          e.preventDefault();
        }
      }
    }

    function renderMirrorImage() {
      if (_mirror) {
        return;
      }
      var rect = _item.getBoundingClientRect();
      _mirror = _item.cloneNode(true);
      _mirrorWidth = rect.width;
      _mirrorHeight = rect.height;
      _mirror.style.width = getRectWidth(rect) + 'px';
      _mirror.style.height = getRectHeight(rect) + 'px';
      rmClass(_mirror, o.classes.transit);
      addClass(_mirror, o.classes.mirror);
      o.mirrorContainer.appendChild(_mirror);
      regEvent(documentElement, 'on', 'mousemove', drag);
      addClass(body, o.classes.unselectable);
      regEvent(_mirror, 'on', 'wheel', scrollContainer);
      if (o.scope) {
        o.scope.$emit('cloned', _mirror, _item);
      }
    }

    function removeMirrorImage() {
      if (_mirror) {
        rmClass(body, o.classes.unselectable);
        regEvent(documentElement, 'off', 'mousemove', drag);
        regEvent(_mirror, 'off', 'wheel', scrollContainer);
        _mirror.parentElement.removeChild(_mirror);
        _mirror = null;
      }
    }

    function getImmediateChild(dropTarget, target) {
      var immediate = target;
      while (immediate !== dropTarget && immediate.parentElement !== dropTarget) {
        immediate = immediate.parentElement;
      }
      if (immediate === documentElement) {
        return null;
      }
      return immediate;
    }

    function getReference(dropTarget, target, x, y) {
      var horizontal = o.direction === 'horizontal';
      var reference = target !== dropTarget ? inside() : outside();
      return reference;

      function outside() { // slower, but able to figure out any position
        var len = dropTarget.children.length;
        var i;
        var el;
        var rect;
        for (i = 0; i < len; i++) {
          el = dropTarget.children[i];
          rect = el.getBoundingClientRect();
          if (horizontal && rect.left > x) {
            return el;
          }
          if (!horizontal && rect.top > y) {
            return el;
          }
        }
        return null;
      }

      function inside() { // faster, but only available if dropped inside a child element
        var rect = target.getBoundingClientRect();
        if (horizontal) {
          return resolve(x > rect.left + getRectWidth(rect) / 2);
        }
        return resolve(y > rect.top + getRectHeight(rect) / 2);
      }

      function resolve(after) {
        return after ? nextEl(target) : target;
      }
    }

    function getScroll(scrollProp, offsetProp) {
      if (typeof window[offsetProp] !== 'undefined') {
        return window[offsetProp];
      }
      if (documentElement.clientHeight) {
        return documentElement[scrollProp];
      }
      return body[scrollProp];
    }

    function getOffset(el) {
      var rect = el.getBoundingClientRect(),
        scrollTop = getScroll('scrollTop', 'pageYOffset'),
        scrollLeft = getScroll('scrollLeft', 'pageXOffset');
      return {
        left: rect.left + scrollLeft,
        right: rect.right + scrollLeft,
        top: rect.top + scrollTop,
        bottom: rect.bottom + scrollTop
      };
    }

    function getElementBehindPoint(point, x, y) {
      if (!x && !y) {
        return null;
      }
      var p = point || {},
        state = p.className,
        el;
      p.className += ' ' + o.classes.hide;
      el = document.elementFromPoint(x, y);
      p.className = state;
      return el;
    }
  };

  function regEvent(el, op, type, fn) {
    var touch = {
        mouseup: 'touchend',
        mousedown: 'touchstart',
        mousemove: 'touchmove'
      },
      $el = angular.element(el);

    if (type !== 'wheel') {
      $el[op](touch[type], fn);
    }
    $el[op](type, fn);
  }

  function never() {
    return false;
  }

  function always() {
    return true;
  }

  function nextEl(el) {
    return el.nextElementSibling || manually();

    function manually() {
      var sibling = el;
      do {
        sibling = sibling.nextSibling;
      } while (sibling && sibling.nodeType !== 1);
      return sibling;
    }
  }

  //Cannot use angular.isElement because we need to check plain dom element, no jQlite wrapped
  function isElement(o) {
    return (
      typeof HTMLElement === 'object' ? o instanceof HTMLElement : //DOM2
      o && typeof o === 'object' && o !== null && o.nodeType === 1 && typeof o.nodeName === 'string'
    );
  }

  function lookupClass(className) {
    var cached = _cache[className];
    if (cached) {
      cached.lastIndex = 0;
    } else {
      _cache[className] = cached = new RegExp('(?:^|\\s)' + className + '(?:\\s|$)', 'g');
    }
    return cached;
  }

  function addClass(el, className) {
    var current = el.className;
    if (!current.length) {
      el.className = className;
    } else if (!lookupClass(className).test(current)) {
      el.className += ' ' + className;
    }
  }

  function rmClass(el, className) {
    el.className = el.className.replace(lookupClass(className), ' ').trim();
  }

  function hasClass(el, className) {
    return (' ' + el.className + ' ').indexOf(' ' + className + ' ') > -1;
  }

  function getEventHost(e) {
    // on touchend event, we have to use `e.changedTouches`
    // see http://stackoverflow.com/questions/7192563/touchend-event-properties
    // see https://github.com/bevacqua/dragula/issues/34
    if (e.targetTouches && e.targetTouches.length) {
      return e.targetTouches[0];
    }
    if (e.changedTouches && e.changedTouches.length) {
      return e.changedTouches[0];
    }
    return e;
  }

  function getCoord(coord, e) {
    var host = getEventHost(e);
    var missMap = {
      pageX: 'clientX', // IE8
      pageY: 'clientY' // IE8
    };
    if (coord in missMap && !(coord in host) && missMap[coord] in host) {
      coord = missMap[coord];
    }
    return host[coord];
  }

  function getRectWidth(rect) {
    return rect.width || (rect.right - rect.left);
  }

  function getRectHeight(rect) {
    return rect.height || (rect.bottom - rect.top);
  }

  function domIndexOf(child, parent) {
    return Array.prototype.indexOf.call(angular.element(parent).children(), child);
  }

  function fireEvent(target, e) {
    if (target.dispatchEvent) {
      target.dispatchEvent(e);
    } else {
      target.fireEvent('on' + e.eventType, e);
    }
  }

}]);

},{"./dragularModule":2}]},{},[2]);




angular
  .module('app', ['ui.bootstrap','dragularModule'])
  .controller('MainCtrl', ['$scope','$element', 'dragularService', function MainCtrl($scope,$element, dragularService) {
    $scope.tmpList = [
    {
        "objectID": 1063,
        "objectName": "Test Summernote",
        "objectDesc": "Test",
        "objectDescPriv": "",
        "createdTime": "2015-04-19T09:13:01.143",
        "updatedTime": "2015-04-19T09:13:01.143",
        "ObjType": 0,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 4
    },
    {
        "objectID": 1064,
        "objectName": "Winning!",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-04-19T09:46:53.307",
        "updatedTime": "2015-04-19T09:46:53.307",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 5
    },
    {
        "objectID": 1071,
        "objectName": "Sample Questionnaire",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-04-29T20:55:17.707",
        "updatedTime": "2015-04-29T20:55:17.707",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 6
    },
    {
        "objectID": 1072,
        "objectName": "Shiny New Questionnaire",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-04-30T01:18:08.967",
        "updatedTime": "2015-04-30T01:18:08.967",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 7
    },
    {
        "objectID": 1079,
        "objectName": "Our New Questionnaire",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-05-08T19:58:43.033",
        "updatedTime": "2015-05-08T19:58:43.033",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 8
    },
    {
        "objectID": 1080,
        "objectName": "My New Questionnaire",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-05-17T12:28:46.323",
        "updatedTime": "2015-05-17T12:28:46.323",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 9
    },
    {
        "objectID": 1081,
        "objectName": "My New Questionnaire",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-05-17T12:44:39.137",
        "updatedTime": "2015-05-17T12:44:39.137",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 10
    },
    {
        "objectID": 1083,
        "objectName": "Demo",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-05-18T13:59:04.05",
        "updatedTime": "2015-05-18T13:59:04.05",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 11
    },
    {
        "objectID": 1084,
        "objectName": "My New Questionnaire",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-05-20T16:50:50.207",
        "updatedTime": "2015-05-20T16:50:50.207",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 12
    },
    {
        "objectID": 1088,
        "objectName": "Check Test",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-06-04T16:05:03.103",
        "updatedTime": "2015-06-04T16:05:03.103",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 13
    },
    {
        "objectID": 1089,
        "objectName": "Multi Test",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-06-04T16:13:00.673",
        "updatedTime": "2015-06-04T16:13:00.673",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 14
    },
    {
        "objectID": 1094,
        "objectName": "A Sample",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-06-13T17:07:46.923",
        "updatedTime": "2015-06-13T17:07:46.923",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 15
    },
    {
        "objectID": 1095,
        "objectName": "Enrollatron",
        "objectDesc": "Watch me enroll stuff",
        "objectDescPriv": "",
        "createdTime": "2015-06-15T06:04:03.603",
        "updatedTime": "2015-06-15T06:04:03.603",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 16
    },
    {
        "objectID": 1103,
        "objectName": "HAM-A",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-06-24T15:58:26.7",
        "updatedTime": "2015-06-24T15:58:26.7",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 18
    },
    {
        "objectID": 1106,
        "objectName": "Format test",
        "objectDesc": "x",
        "objectDescPriv": "",
        "createdTime": "2015-06-24T16:49:43.66",
        "updatedTime": "2015-06-24T16:49:43.66",
        "ObjType": 0,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 19
    },
    {
        "objectID": 1107,
        "objectName": "My New Questionnaire",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-06-24T16:51:03.723",
        "updatedTime": "2015-06-24T16:51:03.723",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 20
    },
    {
        "objectID": 1109,
        "objectName": "My New Questionnaire",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-06-26T12:08:30.937",
        "updatedTime": "2015-06-26T12:08:30.937",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 21
    },
    {
        "objectID": 1110,
        "objectName": "Quick CRM Survey",
        "objectDesc": "Test",
        "objectDescPriv": "",
        "createdTime": "2015-06-26T12:26:07.387",
        "updatedTime": "2015-06-26T12:26:07.387",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 22
    },
    {
        "objectID": 1122,
        "objectName": "PHQ9",
        "objectDesc": "Description",
        "objectDescPriv": "",
        "createdTime": "2015-07-01T15:13:16.717",
        "updatedTime": "2015-07-01T15:13:16.717",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 28
    },
    {
        "objectID": 1097,
        "objectName": "HAM-D",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-06-15T16:11:21.687",
        "updatedTime": "2015-06-15T16:11:21.687",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u03",
        "myPermLevel": 4,
        "displayNum": 30
    },
    {
        "objectID": 1098,
        "objectName": "Demographic data",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-06-15T17:16:27.27",
        "updatedTime": "2015-06-15T17:16:27.27",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u03",
        "myPermLevel": 4,
        "displayNum": 31
    },
    {
        "objectID": 1100,
        "objectName": "Study exclusion criteria survey",
        "objectDesc": "HAMD- 28 Items",
        "objectDescPriv": "",
        "createdTime": "2015-06-15T17:20:26.317",
        "updatedTime": "2015-06-15T17:20:26.317",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u03",
        "myPermLevel": 4,
        "displayNum": 32
    },
    {
        "objectID": 1141,
        "objectName": "New Survey",
        "objectDesc": "Description",
        "objectDescPriv": "",
        "createdTime": "2015-08-06T17:13:07.357",
        "updatedTime": "2015-08-06T17:13:07.357",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 34
    },
    {
        "objectID": 1142,
        "objectName": "Test - Aug 10",
        "objectDesc": "Description",
        "objectDescPriv": "",
        "createdTime": "2015-08-10T19:41:43.233",
        "updatedTime": "2015-08-10T19:41:43.233",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 35
    },
    {
        "objectID": 1145,
        "objectName": "Demographic Information",
        "objectDesc": "Basic Demographic Information",
        "objectDescPriv": "",
        "createdTime": "2015-08-11T01:49:49.81",
        "updatedTime": "2015-08-11T01:49:49.81",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u02",
        "myPermLevel": 1,
        "displayNum": 37
    },
    {
        "objectID": 1143,
        "objectName": "SF-36",
        "objectDesc": "Description",
        "objectDescPriv": "",
        "createdTime": "2015-08-10T22:51:30.607",
        "updatedTime": "2015-08-10T22:51:30.607",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u02",
        "myPermLevel": 1,
        "displayNum": 38
    },
    {
        "objectID": 1147,
        "objectName": "Slider Test",
        "objectDesc": "Description",
        "objectDescPriv": "",
        "createdTime": "2015-08-11T20:59:34.007",
        "updatedTime": "2015-08-11T20:59:34.007",
        "ObjType": 2,
        "isDiscoverable": 0,
        "ownerName": "u01",
        "myPermLevel": 4,
        "displayNum": 41
    }
];
  $scope.simpleProtocol = [{ objectName: 'test' },{ objectName: 'something else' }, ];
  $scope.drake = dragularService();
  $scope.dragularObjects = {
            containersModel: $scope.tmpList,
            nameSpace: "common", 
            scope: $scope
        };
  $scope.dragularSimpleProtocol = {
            containersModel: $scope.simpleProtocol,
            nameSpace: "common",
            scope: $scope
        };
  $scope.drake.containers.push($scope.tmpList);
  $scope.drake.containers.push($scope.simpleProtocol);
  }]);