index.html

---
layout: default
---

<section class="trip-planner" ng-controller="TripController">
    <section class="trip-description">
        <p>A tool written for Outdoor Adventures for creating a list of this semester's trips to be submitted to AS Marketing for publication on the AS website.</p>
    </section>

    <section class="trip-toolbar row">
        <div class="col-sm-6">
            <button class="btn btn-primary" data-toggle="modal" data-target="#tripEditor">
                <i class="fa fa-plus"></i>
               <span>Add Trip</span>
            </button>
        </div>

        <div class="col-sm-6 text-right">
            <button class="btn btn-primary" ngf-select ng-model="tripFile" accept="application/json">
                <i class="fa fa-folder-open-o"></i>
                <span>Open</span>
            </button>

            <button class="btn btn-primary" ng-click="downloadTrips()">
                <i class="fa fa-download"></i>
                <span>Download</span>
            </button>
        </div>
    </section>

    <div ng-show="planner.trips.length == 0" class="empty-trips text-center">
        <p>There aren't any trips! Click "Add Trip" to start adding trips or open your "trips.json" file by selecting the "Open" button.</p>
    </div>

    <section class="trip-list">
        <article class="row" ng-repeat="trip in planner.trips track by $index">
            <div class="col-md-2 text-center">
                [[trip.date]]
            </div>
            <div class="col-md-6">
                [[trip.name]]
            </div>
            <div class="col-md-4 text-right">
                <div id="trip-title-[[$index]]" class="trip-template">
                    [[trip.date]] &mdash; [[trip.name]]
                </div>
                <div id="trip-body-[[$index]]" class="trip-template">
                    <h4>[[trip.name]]</h4>
                    <p>[[trip.desc]]</p>
                    <p>
                        <strong>Trip includes:</strong>
                    </p>
                    <ul>
                        <li ng-repeat="include in trip.includes">
                            [[include]]
                        </li>
                    </ul>
                    <p>
                        <strong>Trip excludes:</strong>
                    </p>
                    <ul>
                        <li ng-repeat="exclude in trip.excludes">
                            [[exclude]]
                        </li>
                    </ul>
                    <p>
                        <strong>Meeting location:</strong> [[trip.location]]
                    </p>
                    <p>
                        <strong>Strenuosity Level:</strong> [[trip.level]]
                    </p>
                    <p>
                        <strong>Cost</strong>
                    </p>
                    <ul>
                        <li>Student: [[trip.studentPrice]]</li>
                        <li>Non-student: [[trip.nonStudentPrice]]</li>
                    </ul>
                </div>
                <button class="btn btn-info btn-sm" ng-click="copyTripTitle($index)">
                    <i class="fa fa-files-o"></i>
                    <span>Copy Title</span>
                </button>
                <button class="btn btn-info btn-sm" ng-click="copyTripBody($index)">
                    <i class="fa fa-files-o"></i>
                    <span>Copy Body</span>
                </button>
                <button class="btn btn-primary btn-sm" ng-click="editTrip($index)" data-toggle="modal" data-target="#tripEditor">
                    <i class="fa fa-pencil"></i>
                    <span>Edit</span>
                </button>
                <a class="btn btn-danger btn-sm" ng-click="deleteTrip($index)" href="#" data-toggle="modal" data-target="#deleteConfirmation">
                    <i class="fa fa-trash"></i>
                    <span>Delete</span>
                </a>
            </div>
        </article>
    </section>

    {% include tripEditor.html %}
    {% include deleteConfirmation.html %}
</section>