<j:jelly xmlns:j="jelly:core" xmlns:st="jelly:stapler" xmlns:l="/lib/layout">

    <l:layout norefresh="true">

        <j:set var="resourcesURL" value="${resURL}/plugin/vanadium-build-monitor-plugin" />
        <j:set var="jobsURL" value="${rootURL}/job" />
        <j:set var="angularVersion" value="1.1.5" />

        <l:header>
            <link rel="stylesheet" href="${resourcesURL}/styles/normalize.css"/>
            <link rel="stylesheet" href="${resourcesURL}/styles/bootstrap-combined.2.3.2.min.css"/>
            <link rel="stylesheet" href="${resourcesURL}/styles/angular-slider.css"/>

            <link rel="stylesheet" href="${resourcesURL}/themes/industrial.css"/>
            <link rel="stylesheet" href="${rootURL}/vanadium-build-monitor-plugin/style.css"/>

            <script src="${resURL}/scripts/yui/cookie/cookie-min.js"></script>

            <script src="${resourcesURL}/vendor/modernizr.custom.27682.js"></script>
            <script src="${resourcesURL}/vendor/angular-${angularVersion}.min.js"></script>
            <script src="${resourcesURL}/vendor/ui-bootstrap-custom-tpls-0.4.0.js"></script>
            <script src="${resourcesURL}/vendor/angular-slider-0.1.6.js"></script>
            <script src="${resourcesURL}/vendor/angular-slugify-1.0.0.js"></script>
        </l:header>

        <l:main-panel>
            <div class="build-monitor dashboard"
                 data-ng-app="buildMonitor"
                 data-ng-controller="JobViews">
                <header>
                    <a class="oncall" href="${rootURL}/" title="Jenkins">{{oncall}}</a>
                    <h1><a href="configure" title="Configure the '${it.displayName}' view">{{title}}</a></h1>
                </header>

                <st:include page="main-settings.jelly"/>

                <j:choose>
                    <j:when test="${it.isEmpty()}">
                        <st:include page="main-empty.jelly"/>
                    </j:when>
                    <j:otherwise>
                        <st:include page="main-jobViews.jelly"/>
                    </j:otherwise>
                </j:choose>
            </div>

            <script>
                /*
                 * todo: (13.08.2013) Replace the below workaround with a custom Jelly tag (ExposeBindTag)
                 *   extending either org.kohsuke.stapler.jelly.BindTag or AbstractStaplerTag,
                 *   that would supersede currently defective BindTag implementation:
                 *   - https://groups.google.com/forum/#!topic/jenkinsci-dev/S9bhX4ts0g4
                 *   - https://issues.jenkins-ci.org/browse/JENKINS-18641
                 *
                 *   Defect in BindTag manifests itself by causing a JavaScript error and preventing scripts after
                 *   the &lt;st:bind&gt; invocation from executing, which results in an "empty Build Monitor".
                 *   The issue occurs on Jenkins 1.521-1.526, only if the jQuery plugin is used.
                 *
                 * Motivation behind a custom Jelly tag:
                 *   Original implementation of the BindTag doesn't provide an easy way of handling AJAX errors,
                 *   which may happen if a network connection is lost or when Jenkins is restarted (which then makes
                 *   Stapler's binding hash obsolete and Jenkins return 404 for any subsequent requests).
                 *
                 *   Custom Jelly tag should generate a JSON object exposing the binding, leaving the implementation
                 *   of the proxy to the Developer. It makes more sense for a developer to require a binding adapter
                 *   implementation specific to their JavaScript framework of choice, rather than for Stapler to try
                 *   to predict what JavaScript libraries will ever be used with it in the future...
                 */
                window.originalMakeStaplerProxy = window.makeStaplerProxy;
                window.makeStaplerProxy = function(url, crumb, methods) {
                    return { url: url, crumb: crumb, methods: methods }
                };
                window.bindings={};
            </script>
            <st:bind var="window.bindings['buildMonitor']" value="${it}" />
            <script>
                window.makeStaplerProxy = window.originalMakeStaplerProxy;
                delete window.originalMakeStaplerProxy;
            </script>

            <script src="${resourcesURL}/scripts/app.js"></script>
            <script src="${resourcesURL}/scripts/cron.js"></script>
            <script src="${resourcesURL}/scripts/services.js"></script>
            <script src="${resourcesURL}/scripts/jenkins.js"></script>
            <script src="${resourcesURL}/scripts/controllers.js"></script>
            <script src="${resourcesURL}/scripts/templates.js"></script>
            <script src="${resourcesURL}/scripts/settings.js"></script>
            <script>
                'use strict';

                angular.

                    module('buildMonitor').

                    config(function(proxyProvider, cookieJarProvider, hashCodeProvider) {
                        var hashCodeOf = hashCodeProvider.hashCodeOf;

                        proxyProvider.configureProxiesUsing(window.bindings);

                        cookieJarProvider.describe({
                            label:     'buildMonitor.' + hashCodeOf('${it.displayName}'),
                            shelfLife: 365
                        });
                    });
            </script>
        </l:main-panel>
    </l:layout>
</j:jelly>