Source

article / article / templates / contact.html

Full commit
{% extends "theme_base.html" %}

{% block extra_head %}
<script type="text/javascript">
    $(document).ready(function () {
        $('.answer-text').on('show', function () {
        console.log("show answer-text");
        if ($(this).parent('li').hasClass('accordion_closed')) {
            $(this).parent('li').removeClass('accordion_closed').addClass('accordion_open');
        } 
    });
    
    $('.answer-text').on('hidden', function () {
        console.log("hidden answer-text");
        if ($(this).parent('li').hasClass('accordion_open')) {
            $(this).parent('li').removeClass('accordion_open').addClass('accordion_closed');
        } 
    });
    
    $('ul.faq-categories a').click( function(e){
        e.preventDefault();
        var cat_id = $(this).data('id');
        $('.faq-search .faq-cat').hide();
        $('.faq-search .faq-cat[data-id=' + cat_id + ']').show();
        $('.search-wrapper').stop().animate({left: -540}, 'slow');
    });
    
    $('.detail-panel .faq-back').click( function(e){
        e.preventDefault();
        $('.search-wrapper').stop().animate({left: 0}, 'slow', function() {
            $('.faq-search .faq-cat').hide();
        });
    });
    
});
</script>
{% endblock %}

{% block head_title %} Contact Form {% endblock %}
{% block body_class %}contactPage{% endblock %}

{% block body %}   

{% load generic_flatblocks %}
{% load verbatim %}

<div id="content">

    <div class="container">
        <div class="row">
            <div class="span15">
                <ul class="breadc clearfix">
                    <li><a href="/">Home</a></li>
                    <li><a href="{% url contact %}">Contact</a></li>
                </ul>
                <h1 class="page-title">Contact</h1>
            </div>
        </div>
    </div>

    <!-- Content -->
    <div id="outer-wrapper" ng-app="hhfaq">

        <div class="container">

            <div class="wrapper-box page">

                <div class="row">
                    <div class="span7">
                        {% if success %}
                            <span class="btn btn-success"><i class="icon-ok icon-white"></i> Your message has been sent!</span>
                        {% else %}
                            <script src="{{ STATIC_URL }}js/angular.min.js"></script>
                            <script src="{{ STATIC_URL }}js/angular-resource.min.js"></script>
                            <script src="{{ STATIC_URL }}js/faq.js"></script>
                        {% endif %}
                        <h2 class="title">Do you have a Question?</h2>
                        <h3 class="subtitle">With any luck, we already have an answer for you.</h3>
                        <div class="faq-search">
                            <div class="faq-search-input-area">
                                <form method="#">                   
                                    <input ng-model="userq" type="text" id="id_faq_search" name="faqSearch" placeholder="Type a Keyword to Search our FAQ">
                                </form>
                            </div><!-- / faq search input area -->
                            <div class="search-wrapper">
                                <div class="faq-questions main-panel">

                                    {% verbatim %}
                                    <div class="faq-cat" data-id="1" ng-controller="FAQCtrl">
                                        <div class="faq-questions-header">
                                            <!--<a href="#" class="faq-back">Back</a>-->
                                            <h4 ng-show="userq">Search results for <em>{{ userq }}</em></h4>
                                        </div><!-- / faq questions header -->
                                        <ul class="faq-questions-list">
                                            <li ng-repeat="faq in questions.objects | filter:userq" data-toggle="collapse" data-target="#answer-text-{{ faq.id }}" class="accordion-question accordion_closed" ng-click="faq.selected=!faq.selected" ng-class="{ 'accordion_open' : faq.selected }">
                                                <span class="question-text">{{ faq.post_title }}</span>
                                                <div class="collapse answer-text" id="answer-text-{{ faq.id }}" ng-bind-html-unsafe="faq.post_content"></div>
                                            </li>

                                        </ul>
                                    </div><!-- / faq-cat -->
                                    {% endverbatim %}

                                    <!-- Reactive once categories are available.
                                    <div class="faq-questions-header">
                                        <h4>See popular questions about...</h4>
                                    </div>--><!-- / faq questions header -->
                                    <!--
                                    <ul class="faq-categories">
                                        <li><a href="#" data-id="1">Nutrition</a></li>
                                        <li><a href="#" data-id="2">Low-Fat Cooking</a></li>
                                        <li><a href="#" data-id="3">Substitutions</a></li>
                                        <li><a href="#" data-id="4">All FAQs</a></li>
                                    </ul>
                                -->
                                </div>
                    
                                <div class="faq-questions detail-panel">

                                    <!-- Move angular app back here when categories are ready. -->
                        
                                </div>
                            </div><!-- /search-wrapper -->
                        </div><!-- / faq search -->

                        <div ng-hide="checked">
                            <h3 class="subtitle">Do you still need to email Lindsay?</h2>
                            <div class="askcontact">
                                <label for="yescontact" class="yescontact">Yes</label>
                                <input id="yescontact" type="checkbox" ng-model="checked">
                            </div>
                        </div>

                        {% load crispy_forms_tags %}
                        <div ng-show="checked">
                            {% crispy form %}
                        </div>

                    </div> <!-- span7 -->
                </div> <!-- row -->
            </div> <!-- / wrapper-box -->
        </div> <!-- container -->
    </div><!-- / outer-wrapper -->
</div> <!-- / content -->

{% endblock %}