Mercurial > hg > dml-open-vis

view src/DML/MainVisBundle/Resources/views/Default/index.html.twig @ 0:493bcb69166c

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
added public content
author Daniel Wolff
date Tue, 09 Feb 2016 20:54:02 +0100
parents
children
line wrap: on
line source
{% set embedCss = false %}
{% set embedJs = false %}
{% set lang = app.request.locale|split('_')[0] %}
{# {% spaceless_and_one_line %}#}
{% spaceless %}
<!doctype html>
<!--[if (lte IE 9) ]>    <html lang="{{ lang }}" class="lteie9 nojs"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html lang="{{ lang }}" class="nojs"><!--<![endif]-->
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />  {# stuff for ie #}
    <meta name="viewport" content="width=1230{#, initial-scale=1#}"> {# Attempt to fix page width on iphones #}
    {% stylesheets output='all.css' filter="less,?uglifycss" combine=true
        '@DMLVendorAssetsBundle/Resources/assets/meyerweb/reset.css'
        '@DMLVendorAssetsBundle/Resources/assets/jquery.ui/1.11.0/jquery.ui.min.css'
        '@DMLMainVisBundle/Resources/assets/legal.less'
        '@DMLMainVisBundle/Resources/assets/jquery.ui.less'
        '@DMLMainVisBundle/Resources/assets/fonts/OpenSans.less'
        '@DMLMainVisBundle/Resources/assets/page.less'
        '@DMLMainVisBundle/Resources/assets/bem-blocks/*.less'
        '@DMLMainVisBundle/Resources/assets/bem-blocks/*/*.less'
        %}
    {% if embedCss %}
        <style type="text/css">{{ render(asset_url) }}</style>
    {% else %}
        <link rel="stylesheet" href="{{ asset_url }}" type="text/css" media="all" />
    {% endif %}
    {% endstylesheets %}
{% if (enableJasmine) %}
    {% stylesheets output='testing.css' filter="less,uglifycss" combine=true
        '@DMLVendorAssetsBundle/Resources/assets/jasmine/2.1.3/lib/jasmine-2.1.3/jasmine.css'
        %}
    {% if embedCss %}
        <style type="text/css">{{ render(asset_url) }}</style>
    {% else %}
        <link rel="stylesheet" href="{{ asset_url }}" type="text/css" media="all" />
    {% endif %}
    {% endstylesheets %}
{% endif %}
    <title>{{ project.shortTitle }} VIS – a tool for analysing large music collections</title>
    {# http://www.favicon-generator.org/ #}
    <link rel="apple-touch-icon" sizes="57x57" href="./$/favicons/apple-icon-57x57.png">
    <link rel="apple-touch-icon" sizes="60x60" href="./$/favicons/apple-icon-60x60.png">
    <link rel="apple-touch-icon" sizes="72x72" href="./$/favicons/apple-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="76x76" href="./$/favicons/apple-icon-76x76.png">
    <link rel="apple-touch-icon" sizes="114x114" href="./$/favicons/apple-icon-114x114.png">
    <link rel="apple-touch-icon" sizes="120x120" href="./$/favicons/apple-icon-120x120.png">
    <link rel="apple-touch-icon" sizes="144x144" href="./$/favicons/apple-icon-144x144.png">
    <link rel="apple-touch-icon" sizes="152x152" href="./$/favicons/apple-icon-152x152.png">
    <link rel="apple-touch-icon" sizes="180x180" href="./$/favicons/apple-icon-180x180.png">
    <link rel="icon" type="image/png" sizes="192x192"  href="./$/favicons/android-icon-192x192.png">
    <link rel="icon" type="image/png" sizes="32x32" href="./$/favicons/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="96x96" href="./$/favicons/favicon-96x96.png">
    <link rel="icon" type="image/png" sizes="16x16" href="./$/favicons/favicon-16x16.png">
    <link rel="manifest" href="./$/favicons/manifest.json">
    <meta name="msapplication-TileColor" content="#ffffff">
    <meta name="msapplication-TileImage" content="./$/favicons/ms-icon-144x144.png">
    <meta name="theme-color" content="#ffffff">
    <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
    <link rel="icon" type="image/x-icon" href="./favicon.ico" sizes="16x16">
    {# add special css classes for IE #}
    <script type="text/javascript">document.documentElement.className = document.documentElement.className.replace("nojs", "js"); if(Function("/*@cc_on return 10===document.documentMode@*/")()){document.documentElement.className += " ie ie10";}; if(!!navigator.userAgent.match(/Trident.*rv[ :]*11\./)){document.documentElement.className += " ie ie11";}</script>
</head>

<body>
<div class="app">
    <div class="app__main-menu main-menu">
        <div class="main-menu__bar main-menu-bar">
            <div class="main-menu-bar__logo">{{ project.shortTitle }} VIS</div>
            <ul class="main-menu-bar__items main-menu-bar__items_block_help">
                <li class="main-menu-bar__item main-menu-bar__item_action_help"><a>what is this?</a></li>
            </ul>
            <ul class="main-menu-bar__items main-menu-bar__items_block_undoredo">
                <li class="main-menu-bar__item main-menu-bar__item_action_undo"><a>undo</a></li>
                <li class="main-menu-bar__item main-menu-bar__item_action_redo"><a>redo</a></li>
            </ul>
            <ul class="main-menu-bar__items main-menu-bar__items_block_misc">
                <li class="main-menu-bar__item main-menu-bar__item_action_share"><a href="#">share this state</a></li>
                <li class="main-menu-bar__item main-menu-bar__item_action_bookmarks main-menu-bar__item_location_last"><a href="#">save or reopen a state</a></li>
                {#<li class="main-menu-bar__item main-menu-bar__item_action_downloads main-menu-bar__item_location_last"><a href="#">data downloads</a></li>#}
                <li class="main-menu-bar__item main-menu-bar__item_action_change-mode">
                    <a class="main-menu-bar__item-a_mode_2recordings" href="#">music recordings</a>
                    <a class="main-menu-bar__item-a_mode_2collections" href="#">music collections</a>
                </li>
            </ul>
        </div>
    </div>
    <div class="app__main-region main-region">
        <div class="main-region__config-grid config-grid">
            <div class="config-grid__header"></div>
            <div class="config-grid__panel config-grid-panel config-grid-panel_dimension_entity">
                <div class="config-grid-panel__background"></div>
                <div class="config-grid-panel__commands">
                    {#<div class="config-grid-panel__command-group config-grid-panel__command-group_type_previous-next">
                        <div class="config-grid-panel__command config-grid-panel__command_action_previous"><i></i></div>
                        <div class="config-grid-panel__command config-grid-panel__command_action_next"><i></i></div>
                    </div>#}
                    <div class="config-grid-panel__command-group config-grid-panel__command-group_type_clone-delete">
                        <div class="config-grid-panel__command config-grid-panel__command_action_clone"><i></i></div>
                        <div class="config-grid-panel__command config-grid-panel__command_action_delete"><i></i></div>
                    </div>
                    <div class="config-grid-panel__command-group config-grid-panel__command-group_type_discard-apply">
                        <div class="config-grid-panel__command config-grid-panel__command_action_discard"><i></i></div>
                        <div class="config-grid-panel__command config-grid-panel__command_action_apply"><i></i></div>
                    </div>
                </div>
            </div>
            <div class="config-grid__panel config-grid-panel config-grid-panel_dimension_view">
                <div class="config-grid-panel__background"></div>
                <div class="config-grid-panel__commands">
                    {#<div class="config-grid-panel__command-group config-grid-panel__command-group_type_previous-next">
                        <div class="config-grid-panel__command config-grid-panel__command_action_previous"><i></i></div>
                        <div class="config-grid-panel__command config-grid-panel__command_action_next"><i></i></div>
                    </div>#}
                    <div class="config-grid-panel__command-group config-grid-panel__command-group_type_clone-delete">
                        <div class="config-grid-panel__command config-grid-panel__command_action_clone"><i></i></div>
                        <div class="config-grid-panel__command config-grid-panel__command_action_delete"><i></i></div>
                    </div>
                    <div class="config-grid-panel__command-group config-grid-panel__command-group_type_discard-apply">
                        <div class="config-grid-panel__command config-grid-panel__command_action_discard"><i></i></div>
                        <div class="config-grid-panel__command config-grid-panel__command_action_apply"><i></i></div>
                    </div>
                </div>
                </div>
            <div class="config-grid-cells">
            </div>
            <div class="config-grid__utils">
                <div class="config-grid__loader"></div>
                <noscript class="config-grid__loading-error config-grid__loading-error_type_noscript">{{ project.shortTitle }} visualisations cannot be drawn without javascript. Please <a href="http://www.enable-javascript.com/" target="_blank">enable it</a> in the browser settings.</noscript>
                <div class="config-grid__loading-error config-grid__loading-error_type_old-ie">The browser you are using is too old to draw interactive visualisations. Please <a href="http://windows.microsoft.com/en-gb/internet-explorer/download-ie" target="_blank">update Internet Explorer</a> or download an alternative browser <span style="white-space: nowrap;">(e.g. <a href="https://www.google.com/chrome/browser/desktop/" target="_blank">Chrome</a> or <a href="https://www.mozilla.org/en-GB/firefox/new/" target="_blank">Firefox</a>).</span></div>
            </div>
        </div>
    </div>
    <div class="app__notifications">
    </div>
    <div class="app__help">
    </div>
    <div class="collections-vis__config-panel collections-vis__config-panel_type_collections">
    </div>
    <div class="collections-vis__config-panel collections-vis__config-panel_type_perspectives">
    </div>
</div>
    {# emulate quicker load on first launch #}
    <script type="text/javascript">if (localStorage && !localStorage.getItem("dml..latest-visit") && document.getElementsByClassName) {document.getElementsByClassName("config-grid")[0].className += " config-grid_type_collection";}</script>
{% if (enableJasmine) %}<div class="jasmine"></div>{% endif %}
{# <noscript class="p-gageovis__bad-browser">{{ 'badbrowser' | trans | raw }}</noscript>#}
{% javascripts output='vendor.js' filter="?uglifyjs2"
    '@DMLVendorAssetsBundle/Resources/assets/jquery/2.1.1/jquery.min.js'
    '@DMLVendorAssetsBundle/Resources/assets/jquery.bemhelpers/2.1.3-modif/jquery.bemhelpers.js'
    '@DMLVendorAssetsBundle/Resources/assets/jquery.sticky-kit/1.0.4/jquery.sticky-kit.min.js'
    '@DMLVendorAssetsBundle/Resources/assets/jquery.hotkeys/0.8/jquery.hotkeys.js'
    '@DMLVendorAssetsBundle/Resources/assets/jquery.mousewheel/3.1.12/jquery.mousewheel.min.js'
    '@DMLVendorAssetsBundle/Resources/assets/jquery.textrange/1.3.0/jquery.textrange.js'
    '@DMLVendorAssetsBundle/Resources/assets/jquery.preventMacBackScroll/modif/jquery.preventMacBackScroll.js'
    '@DMLVendorAssetsBundle/Resources/assets/jquery.jplayer/2.9.2/jquery.jplayer.js'

    '@DMLVendorAssetsBundle/Resources/assets/jquery.ui/1.11.0/jquery.ui.min.js'
    '@DMLVendorAssetsBundle/Resources/assets/scrollfix/0.1/scrollfix.js'
    '@DMLVendorAssetsBundle/Resources/assets/jquery.scroll-to/dev/jquery.scroll-to.js'

    '@DMLVendorAssetsBundle/Resources/assets/js-logger/0.9.14/js-logger.js'
    '@DMLVendorAssetsBundle/Resources/assets/underscore/1.8.2/underscore-min.js'
    '@DMLVendorAssetsBundle/Resources/assets/underscore.string/2.3.3/underscore.string.min.js'
    '@DMLVendorAssetsBundle/Resources/assets/backbone/1.1.2_modif/backbone.js'
    '@DMLVendorAssetsBundle/Resources/assets/backbone.marionette/2.3.2/backbone.marionette.min.js'
    '@DMLVendorAssetsBundle/Resources/assets/backbone.marionette/dev/TemplateCache.loadTemplate_fixed.js'

    '@DMLVendorAssetsBundle/Resources/assets/vega/2.2.6/d3.min.js'
    '@DMLVendorAssetsBundle/Resources/assets/vega/2.2.6/d3.geo-projection.min.js'
    '@DMLVendorAssetsBundle/Resources/assets/vega/2.2.6/topojson.js'
    '@DMLVendorAssetsBundle/Resources/assets/vega/2.2.6/d3.layout.cloud.js'
    '@DMLVendorAssetsBundle/Resources/assets/vega/2.2.6/vega.js'

%}
{% if embedJs %}<script type="text/javascript">{{ render(asset_url) }}</script>{% else %}<script type="text/javascript" src="{{ asset_url }}"></script>{% endif %}
{% endjavascripts %}

{# % javascripts output='vendor_ui.js' filter="?uglifyjs2" combine=true
%}
{% if embedJs %}<script type="text/javascript">{{ render(asset_url) }}</script>{% else %}<script type="text/javascript" src="{{ asset_url }}"></script>{% endif %}
{% endjavascripts %}

{% javascripts output='vendor_backbone.js' filter="?uglifyjs2" combine=true
%}
{% if embedJs %}<script type="text/javascript">{{ render(asset_url) }}</script>{% else %}<script type="text/javascript" src="{{ asset_url }}"></script>{% endif %}
{% endjavascripts %#}

{% javascripts output='app.js' filter="?uglifyjs2"

    '@DMLMainVisBundle/Resources/assets/legal.js'

    '@DMLMainVisBundle/Resources/assets/lib/jquery.eventsugar/jquery.eventsugar.js'
    '@DMLMainVisBundle/Resources/assets/lib/jquery.ui/combobox.js'
    '@DMLMainVisBundle/Resources/assets/lib/underscore.mixins/underscore.isEventAnAttemptToOpenANewTab.js'
    '@DMLMainVisBundle/Resources/assets/lib/underscore.mixins/underscore.isSimpleObject.js'
    '@DMLMainVisBundle/Resources/assets/lib/underscore.mixins/underscore.uniqueId.js'
    '@DMLMainVisBundle/Resources/assets/lib/vega/vega.expr.centroid.js'
    '@DMLMainVisBundle/Resources/assets/lib/vega/vega.filter.centroid.js'

    '@DMLMainVisBundle/Resources/assets/marionette/*.js'
    '@DMLMainVisBundle/Resources/assets/marionette/*/*.js'
    '@DMLMainVisBundle/Resources/assets/marionette/*/*/*.js'
    '@DMLMainVisBundle/Resources/assets/marionette/*/*/*/*.js'
%}
{% if embedJs %}<script type="text/javascript">{{ render(asset_url) }}</script>{% else %}<script type="text/javascript" src="{{ asset_url }}"></script>{% endif %}
{% endjavascripts %}

{#

%}
#}
{#

#}
{#
<script type="text/javascript">$(function(){setTimeout(function() { App.start({musicLibrary: {{ musicLibrary | json_encode | raw }} {% if (app.debug) %}, enableJasmine: {{ enableJasmine ? "true" : "false" }}{% endif %}})}, 100);});</script>
#}
<script type="text/javascript">$(window).load(function(){App.start({musicLibrary: {{ musicLibrary | json_encode | raw }} {% if (app.debug) %}, enableJasmine: {{ enableJasmine ? "true" : "false" }}{% endif %}});});</script>

{% if (enableJasmine) %}
{% javascripts output='testing.js' filter="?uglifyjs2"
    '@DMLVendorAssetsBundle/Resources/assets/jasmine/2.1.3/lib/jasmine-2.1.3/jasmine.js'
    '@DMLVendorAssetsBundle/Resources/assets/jasmine/2.1.3/lib/jasmine-2.1.3/jasmine-html_modif.js'

    '@DMLMainVisBundle/Resources/assets/jasmine/boot.js'
    '@DMLMainVisBundle/Resources/assets/jasmine/helpers.js'
    '@DMLMainVisBundle/Resources/assets/jasmine/*/*.js'
    '@DMLMainVisBundle/Resources/assets/jasmine/*/*/*.js'
    '@DMLMainVisBundle/Resources/assets/jasmine/*/*/*/*.js'
    %}
    {% if embedJs %}
        <script type="text/javascript">{{ render(asset_url) }}</script>
    {% else %}
        <script type="text/javascript" src="{{ asset_url }}"></script>
    {% endif %}
{% endjavascripts %}
{% endif %}
{% include 'DMLMainVisBundle:Components/templates:_.html.twig' %}
{% include 'KachkaevCountersBundle::counters.html.twig' %}
</body>
</html>
{#
<script type="template/html" id="vis_pc__hint">
    <div class="vis__hint vis_pc__hint">Frequency corresponds to opacity (50.0 → 100%).<% if (hasCyclic) { %> Cyclic sequences (those that have the same chord more than once) are in blue.<% } %></div>
</script>
#}
{% endspaceless %}

<!-- The front-end of DML VIS was designed and developed by Alexander Kachkaev, giCente, City University London (2015) -->