CaffGeek/MBACNationals

<div>
    <div class="container" data-ng-controller="ReservationController">
        <h2>Drag attendees to assign them to rooms</h2>

        <div class="row clearfix">
            <h3></h3>
            <div class="col-sm-2">
                <div class="column noHotelRoom" data-droppable="" data-drop="removeFromRoom">
                    <a id="{{p.Id}}" class="occupant" data-draggable="" data-ng-repeat="p in model.participants | filter:unassignedRoom">{{p.Name}}</a>
                </div>    
                <div>
                    <address ng-repeat="hotel in model.hotels">
                        <strong>{{hotel.Name}}</strong><br>
                        <a href="tel:{{hotel.PhoneNumber}}">{{hotel.PhoneNumber}}</a><br/>
                        <a href="{{hotel.Website}}">Website</a>
                        <ul>
                            <li ng-repeat="t in hotel.RoomTypes">{{t}}</li>
                        </ul>
                    </address>
                </div>        
            </div>
            
            <div class="col-sm-10">
                <div data-ng-repeat="y in [1, 2, 3, 4, 5]" class="hotelRooms">
                    <div data-ng-repeat="x in [1, 2, 3, 4, 5]" class="col-sm-3">
                        <h6>
                            Room #{{calcBin(y,x)}}
                            <select id="binType{{calcBin(y,x)}}"
                                    data-ng-model="getRoomByBin(y,x).Type"
                                    data-ng-change="setRoomType((y-1)*5+x)"
                                    data-ng-options="t for t in model.hotels[0].RoomTypes track by t">
                            </select>
                            Checkin: <input data-ng-model="getRoomByBin(y,x).Checkin" type="date" placeholder="yyyy-MM-dd" required data-ng-change="setCheckin((y-1)*5+x)" />
                            Checkout: <input data-ng-model="getRoomByBin(y,x).Checkout" type="date" placeholder="yyyy-MM-dd" required data-ng-change="setCheckin((y-1)*5+x)" />
                        </h6> 
                        <div id="bin{{calcBin(y,x)}}" data-droppable="{{calcBin(y,x)}}" data-drop="addToRoom">
                            <a id="{{p.Id}}" class="occupant" data-draggable="" data-ng-repeat="p in model.participants | filter:isThisRoom(y,x)">{{p.Name}}</a>
                        </div>
                    </div>
                </div>

                <div>
                    <h5>Special Instructions</h5>
                    <textarea data-ng-model="model.instructions" class="col-sm-12"></textarea>
                    <a href="" data-ng-click="saveInstructions()" class="btn btn-primary btn-large pull-right">Save Instructions</a>
                </div>
            </div>
        </div>
    </div>
</div>