oscarleiva
/
energylink


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

  <head>
    <meta charset="utf-8" />
    <title>Angular DragDrop (Demo)</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="css/styles.css" />
    <script data-require="angular.js@1.4.x" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js" data-semver="1.4.3"></script>
    <script src="http://pc035860.github.io/angular-highlightjs/angular-highlightjs.min.js"></script>
    <script src="js/app.js"></script>
    <script src="../draganddrop.js"></script>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">
  </head>

  <body >
    <div class="container">
        <div class="row topRow">
            <h4 class="heading">
                Drag and drop between the two lists.
            </h4>
        </div>
        
        <h3>Beasts</h3>
        
        <p>Left column of beasts is not draggable and accepts both beasts and priests</p>
        
        <hr>
        
        <div class="row" ng-controller="MainCtrl">
            <div class="col-xs-6">
                <ul ui-on-drop="onDrop($event,$data,men)" drag-enter-class="on-drag-enter-custom"
                    drop-channel="beasts,priests"
                    drop-validate="dropValidateHandler($drop, $event, $data)">
                    <li ui-draggable="false" drag="man" drag-channel="beasts"
                        on-drop-success="dropSuccessHandler($event,$index,men)"
                        ng-repeat="man in men track by $index">
                        {{man}}
                    </li>
                </ul>
            </div>
            <div class="col-xs-6">
                <ul ui-on-drop="onDrop($event,$data,women)"
                    drop-channel="beasts"
                    drop-validate="dropValidateHandler($drop, $event, $data)">
                    <li ui-draggable="true" drag="woman" drag-channel="beasts"
                        on-drop-success="dropSuccessHandler($event,$index,women)"
                        ng-repeat="woman in women track by $index">
                        {{woman}}
                    </li>
                </ul>
            </div>
        </div>
        
        <hr>
        
        <h3>Priests</h3>
        
        <hr>
        
        <div class="row" ng-controller="MainCtrl">
            <div class="col-xs-6">
                <ul ui-on-drop="onDrop($event,$data,men)"
                    drop-channel="priests"
                    drop-validate="dropValidateHandler($drop, $event, $data)">
                    <li ui-draggable="true" drag="man"
                        drag-channel="priests"
                        on-drop-success="dropSuccessHandler($event,$index,men)"
                        ng-repeat="man in men track by $index">
                        {{man}}
                    </li>
                </ul>
            </div>
            <div class="col-xs-6">
                <ul ui-on-drop="onDrop($event,$data,women)"
                    drop-channel="priests"
                    drop-validate="dropValidateHandler($drop, $event, $data)">
                    <li ui-draggable="true" drag="woman"
                        drag-channel="priests"
                        on-drop-success="dropSuccessHandler($event,$index,women)"
                        ng-repeat="woman in women track by $index">
                        {{woman}}
                    </li>
                </ul>
            </div>
        </div>
        
        <hr>
        
        <h3>Terrorists</h3>
        
        <p>Each terrorist list item accepts a new terrorist. Shows inserting into a particular
        position in an array.</p>
        
        <hr>
        
        
        <div class="row" ng-controller="MainCtrl">
            <div class="col-xs-6">
                <ul>
                    <li ui-draggable="true" drag="man"
                        drag-channel="terrorists2"
                        drop-validate="dropValidateHandler($drop, $event, $data)"
                    drag-hover-class="on-drag-hover-custom"
                    on-drop-success="dropSuccessHandler($event,$index,men)"
                    ui-on-drop="onDrop($event,$data,men,$index)" drop-channel="terrorists1"
                    ng-repeat="man in men track by $index">
                        {{man}}
                    </li>
                </ul>
            </div>
            <div class="col-xs-6">
                <ul>
                    <li ui-draggable="true" drag="woman"
                        drag-channel="terrorists1"
                        drop-validate="dropValidateHandler($drop, $event, $data)"
                    drag-hover-class="on-drag-hover-custom"
                    ui-on-drop="onDrop($event,$data,women,$index)" drop-channel="terrorists2"
                    on-drop-success="dropSuccessHandler($event,$index,women)"
                    ng-repeat="woman in women track by $index">
                        {{woman}}
                    </li>
                </ul>
            </div>
        </div>
    </div>
  </body>

</html>