{% extends 'admin/base.html.twig' %}

{% block title %}2-Digit Cipcode Ranking | Admin | Universities.com{% endblock %}

{% block body %}

    <div class="row">
        <div class="col-12">
            <div class="page-title-box">
                <div class="page-title-right mb-3">
                    <ol class="breadcrumb m-0">
                        <li class="breadcrumb-item"><a href="{{ path("admin_dashboard") }}">Dashboard</a></li>
                        <li class="breadcrumb-item">Rankings</li>
                        <li class="breadcrumb-item active">2-Digit Cipcode Ranking</li>
                    </ol>
                </div>
                <h1 class="fw-light mb-3">2-Digit Cipcode Ranking</h1>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-xxl-3">
            <div class="card">
                <div class="card-body">
                    <h4 class="header-title">Data and Weights</h4>
                    {{ form_start(form) }}

                    {{ form_widget(form._token) }}

                    {{ form_row(form.year) }}
                    {{ form_row(form.code) }}

                    <ul class="nav nav-tabs nav-bordered mb-3">
                        <li class="nav-item">
                            <a href="#ipeds-weights" data-bs-toggle="tab" aria-expanded="false" class="nav-link">
                                IPEDS
                            </a>
                        </li>
                        <li class="nav-item">
                            <a href="#college-scorecard-weights" data-bs-toggle="tab" aria-expanded="true" class="nav-link active">
                                College Scorecard
                            </a>
                        </li>
                    </ul>

                    <div class="tab-content">
                        <div class="tab-pane" id="ipeds-weights">
                            <div class="mb-2 row">
                                <label class="col-form-label col-sm-8">Total</label>
                                <div class="col-sm-4 text-end pcttot"></div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_acceptance_rate">Acceptance Rate</label>
                                <div class="col-sm-4">
                                    {{ form_widget(form.acceptance_rate) }}
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_standardized_testing">Standardized Testing</label>
                                <div class="col-sm-4">
                                    {{ form_widget(form.standardized_testing) }}
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_admission_yield">Admission Yield</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.admission_yield) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_diversity_of_students">Diversity of Students</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.diversity_of_students) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_first_year_retention">First Year Retention</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.first_year_retention) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_graduation_rate">Graduation Rate</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.graduation_rate) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_non_white_graduation_rate">Non-white Graduation Rate</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.non_white_graduation_rate) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_pell_grant_graduation_rate">Pell Grant Graduation Rate</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.pell_grant_graduation_rate) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_student_faculty_ratio">Student Faculty Ratio</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.student_faculty_ratio) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_tenured_instructors">Tenured or Tenure-track Instructors</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.tenured_instructors) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_percent_irps">% of Full-time <abbr title="Instructional, Research or Public Service">IRPS</abbr> Staff</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.percent_irps) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_diversity_irps">Diversity of Full-time <abbr title="Instructional, Research or Public Service">IRPS</abbr> Staff</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.diversity_irps) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_undergrad_aid_pct">% of Undergraduates Receiving Aid</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.undergrad_aid_pct) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_undergrad_aid_amt">Average Aid Package Size</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.undergrad_aid_amt) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_undergrad_aid_net_price">Average Net Price</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.undergrad_aid_net_price) }}
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="tab-pane show active" id="college-scorecard-weights">
                            <div class="mb-2 row">
                                <label class="col-form-label col-sm-8">Total</label>
                                <div class="col-sm-4 text-end pcttot"></div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_certificates">Undergraduate Certficate or Diploma</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.certificates) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_associates">Associate's Degree</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.associates) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_bachelors">Bachelors's Degree</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.bachelors) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_post_bach_cert">Post-baccalaureate Certificate</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.post_bach_cert) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_masters">Masters's Degree</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.masters) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_doctors">Doctoral Degree</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.doctors) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_first_prof_degree">First Professional Degree</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.first_prof_degree) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_grad_prof_degree">Graduate/Professional Degree</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.grad_prof_degree) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_median_total_debt_bachelors">Median Total Debt - Bachelor's</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.median_total_debt_bachelors) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_median_total_debt_associates">Median Total Debt - Associates's</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.median_total_debt_associates) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_median_earnings_bachelors">Median Earnings - Bachelors's</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.median_earnings_bachelors) }}
                                    </div>
                                </div>
                            </div>
                            <div class="mb-2 row">
                                <label class="col-form-label required col-sm-8" for="cip2_weight_median_earnings_associates">Median Earnings - Associates's</label>
                                <div class="col-sm-4">
                                    <div class="input-group">
                                        {{ form_widget(form.median_earnings_associates) }}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-sm-12 text-end">
                            <button type="submit" id="cip2_weight_run" name="cip2_weight[run]" class="btn-secondary btn btn-sm">Run</button>
                        </div>
                    </div>

                    {{ form_end(form, {"render_rest":false}) }}
                </div>
            </div>
        </div>
        <div class="col-xxl-9">
            <div class="card">
                <div class="card-body">
                    <table id="cip2_rankings" class="table dt-responsive nowrap w-100">
                        <thead>
                            <tr>
                                <th>Rank</th>
                                <th>School</th>
                                <th>Overall Score</th>

                                <th><abbr title="Certificates or Disploma">Cert</abbr></th>
                                <th><abbr title="Associate's Degree">Asso</abbr></th>
                                <th><abbr title="Bachelor's Degree">Bach</abbr></th>
                                <th><abbr title="Post-baccalaureate Certificate">PBC</abbr></th>
                                <th><abbr title="Master's Degree">Mast</abbr></th>
                                <th><abbr title="Doctoral Degree">Doct</abbr></th>
                                <th><abbr title="First Professional Degree">FPD</abbr></th>
                                <th><abbr title="Graduate/Professional Degree">GPD</abbr></th>
                                <th><abbr title="Median Total Debt - Bachelors">MTDB</abbr></th>
                                <th><abbr title="Median Total Debt - Associates">MTDA</abbr></th>
                                <th><abbr title="Median Earnings - Bachelors">MEB</abbr></th>
                                <th><abbr title="Median Earnings - Associates">MEA</abbr></th>
                            </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>

                </div>
            </div>
        </div>
    </div>

{% endblock %}

{% block stylesheets %}
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/dt-1.10.24/b-1.7.0/kt-2.6.1/r-2.2.7/sl-1.3.3/datatables.min.css"/>
    {{ parent() }}
{% endblock %}

{% block scripts %}
    {{ parent() }}
    <script defer type="text/javascript" src="https://cdn.datatables.net/v/bs4/dt-1.10.24/b-1.7.0/kt-2.6.1/r-2.2.7/sl-1.3.3/datatables.min.js"></script>
    <script>

        {% if data %}
        var cip2_data = {{ data | raw }};
        {% else %}
        var cip2_data = [];
        {% endif %}

        window.addEventListener('DOMContentLoaded', function(e) {
            $('#cip2_rankings').DataTable({
                data: cip2_data,
                rowId: 'id',
                columns: [
                    { title: 'Rank', data: 'rank' },
                    { title: 'School', data: 'name' },
                    { title: 'Score', data: 'score', render: $.fn.dataTable.render.number(',', '.', 3)},
                    { title: '<abbr title="Certificates or Diploma">Cert</abbr>', data: 'cert', render: $.fn.dataTable.render.number(',', '.', 3) },
                    { title: '<abbr title="Associate\'s Degree">Asso</abbr>', data: 'asso', render: $.fn.dataTable.render.number(',', '.', 3) },
                    { title: '<abbr title="Bachelor\'s Degree">Bach</abbr>', data: 'bach', render: $.fn.dataTable.render.number(',', '.', 3) },
                    { title: '<abbr title="Post-baccalaureate Certificate">PBC</abbr>', data: 'pbc', render: $.fn.dataTable.render.number(',', '.', 3) },
                    { title: '<abbr title="Master\'s Degree">Mast</abbr>', data: 'mast', render: $.fn.dataTable.render.number(',', '.', 3) },
                    { title: '<abbr title="Doctoral Degree">Doct</abbr>', data: 'doct', render: $.fn.dataTable.render.number(',', '.', 3) },
                    { title: '<abbr title="First Professional Degree">FPD</abbr>', data: 'fpd', render: $.fn.dataTable.render.number(',', '.', 3)},
                    { title: '<abbr title="Graduate/Professional Degree">GPD</abbr>', data: 'gpd', render: $.fn.dataTable.render.number(',', '.', 3)},
                    { title: '<abbr title="Median Total Debt - Bachelors">MTDB</abbr>', data: 'mtdb', render: $.fn.dataTable.render.number(',', '.', 3) },
                    { title: '<abbr title="Median Total Debt - Associates">MTDA</abbr>', data: 'mtda', render: $.fn.dataTable.render.number(',', '.', 3) },
                    { title: '<abbr title="Median Earnings - Bachelors">MEB</abbr>', data: 'meb', render: $.fn.dataTable.render.number(',', '.', 3) },
                    { title: '<abbr title="Median Earnings - Associates">MEA</abbr>', data: 'mea', render: $.fn.dataTable.render.number(',', '.', 3) }
                ]
            });

            var updateTotal = function($pane) {
                var $tot = $pane.find('.pcttot');

                var vals = $pane.find('input[type="text"]').map(function(i, e) { return parseFloat(e.value) }).get();
                var tot = 0.0;
                for (var k in vals) {
                    tot += vals[k];
                }

                $tot.text(tot + '%');
            };

            $('.tab-pane').on('change', 'input', function(e) {
                var $that = $(e.currentTarget),
                    $pane = $that.closest('.tab-pane');

                updateTotal($pane);
            });

            $('.tab-pane').each(function() {
                var $pane = $(this);
                updateTotal($pane);
            });
        });
    </script>
{% endblock %}