<commit_before><!DOCTYPE html>
<html>
  <head>
    
        <meta charset="utf-8">
        <title>
            MARCO Planning Tool
        </title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="">
        <meta name="author" content="">
  
        <!-- FROM RATCHET -->
        <!-- Sets initial viewport load and disables zooming  -->
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
        <!-- Makes your prototype chrome-less once bookmarked to your phone's home screen -->
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">        
        <!-- Include the compiled Ratchet CSS -->
        <link rel="stylesheet" href="{{MEDIA_URL}}/marco-proto/assets/ratchet/ratchet.css">
        <!-- END RATCHET -->
        
        
        <!-- Le styles -->
        <link href="{{MEDIA_URL}}/marco/css/bootstrap.css" rel="stylesheet">
        <link href="{{MEDIA_URL}}/marco/css/marco_style.css" rel="stylesheet">
        <link href="{{MEDIA_URL}}/marco-proto/assets/css/scalebar-thin.css" rel="stylesheet">
        <link href="{{MEDIA_URL}}/marco-proto/assets/css/style.css" rel="stylesheet">
        <link href="{{MEDIA_URL}}/marco-proto/assets/css/pageguide.css" rel="stylesheet">

        <link href="{{MEDIA_URL}}/marco/css/smoothness/jquery-ui-1.9.1.custom.css" rel="stylesheet">
        <link href="{{MEDIA_URL}}/marco-proto/assets/css/jquery.mCustomScrollbar.css" rel="stylesheet">
        <link href="{{MEDIA_URL}}marco/css/jquery.jscrollpane.css" rel="stylesheet">
        <!--<link href="{{MEDIA_URL}}/marco-proto/assets/css/jScrollPane.css" rel="stylesheet">-->
        <!--<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/themes/base/jquery-ui.css"
        type="text/css" media="all" />-->
        <link rel="shortcut icon" href="{{MEDIA_URL}}marco/ico/favicon.ico">

        <style>
        .navbar .nav > li:hover > a, .navbar .nav > li.active > a, .navbar .nav > li:hover > a:visited {
            height: 30px;
           
        }
        .navbar .nav > li > a {
            height: 25px;
        }

        </style>
        <link rel="apple-touch-icon-precomposed" sizes="144x144" href="{{MEDIA_URL}}/marco-proto/assets/ico/apple-touch-icon-144-precomposed.png">
        <link rel="apple-touch-icon-precomposed" sizes="114x114" href="{{MEDIA_URL}}/marco-proto/assets/ico/apple-touch-icon-114-precomposed.png">
        <link rel="apple-touch-icon-precomposed" sizes="72x72" href="{{MEDIA_URL}}/marco-proto/assets/ico/apple-touch-icon-72-precomposed.png">
        <link rel="apple-touch-icon-precomposed" href="{{MEDIA_URL}}/marco-proto/assets/ico/apple-touch-icon-57-precomposed.png">
        
        <!-- MORE RATCHET -->
        <!-- Include the compiled Ratchet JS -->
        <script src="{{MEDIA_URL}}/marco-proto/assets/ratchet/ratchet.js"></script>

        <!-- Intro paragraph styles. Delete once you start using this page -->
        <style type="text/css">
            .welcome {
              line-height: 1.5;
              color: #555;
            }
        </style>
        <!-- END RATCHET -->
        
        
        <!-- Google Analytics -->
        <script type="text/javascript">

          var _gaq = _gaq || [];
          _gaq.push(['_setAccount', 'UA-35841423-1']);
          _gaq.push(['_trackPageview']);

          (function() {
            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
          })();

        </script>
        
        <style type="text/css">
            
            #aggregated-attribute-overlay {
                position: absolute;
                /*border-radius: 4px; can't tell if I want this or not...*/
                bottom: 0;
                left: 0;
                top: auto;
                height: 130px;
                min-width: 100%;
                max-width: 100%;
                z-index: 950; 
                /*overflow-x: hidden;
                overflow-y: auto;*/
                /*overflow: auto;*/
                font-size: 12px;
                /* RGBa with 0.6 opacity */
                background-color: rgba(60, 110, 160, 0.65);
                /* For IE 5.5 - 7*/
                filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#bb2d8998, endColorstr=#bb2d8998);
                /* For IE 8*/
                -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#bb2d8998, endColorstr=#bb2d8998)";
            }
            #aggregated-attribute-content {
                height: 110px;
            }
            #aggregated-attribute-content .mCustomScrollBox {
                height: 110px;
            }
            #aggregated-attribute-content .mCSB_scrollTools {
                height: 80px;
            }
            .olControlScaleBarWrapper {
                display: none;
            }
            div.olControlZoom a {
                width: 26px !important;
                height: 26px !important;
                font-size: 20px !important;
            }
            #embedded-marco-logo {
                margin-left: 25px;
                margin-bottom: 17px;
                width: 133px;
            }
        </style>

    </head>
    
    
    <body style="margin: 0px; padding: 0px; height: 100%;">
    

        <!-- Make sure all your bars are the first things in your <body> -->
        <header class="bar-title" style="padding-bottom: 0px">
            <a id="mobile-data-button" class="button pull-left" style="position: absolute">
                Data
                <span class="count" data-bind="text: activeLayers().length"></span>
            </a>
            <a id="mobile-map-left-button" class="button pull-left" style="display: none; position: absolute">
                Map
            </a>
            <h1 class="title">
                <img id="embedded-marco-logo" src="{{MEDIA_URL}}marco/img/marco-logo-transparent-short.png"/>
            </h1>
            <a id="mobile-legend-button" class="button pull-right">
                Legend
                <span class="count" data-bind="text: activeLegendLayers().length"></span>
            </a>
            <a id="mobile-map-right-button" class="button pull-right" style="display: none">
                Map
            </a>
            <a id="mobile-data-right-button" class="button pull-right" style="display: none">
                Data
                <span class="count" data-bind="text: activeLayers().length"></span>
            </a>
        </header>

        <!-- Wrap all non-bar HTML in the .content div (this is actually what scrolls) -->
        <div class="content" style="overflow: hidden;">
            <!--
            <div id="loading" style="height: 100%; top: 44px;">
                <h2>Loading...</h2>
            </div>
            -->
            <div id="myCarousel" class="carousel slide" style="height: 100%;">
                <!-- Carousel items -->
                <div class="carousel-inner" style="height: 100%; overflow: hidden;">
                    
                    <!-- SUBLAYER MENU PANEL -->
                    <div class="item" style="height: 100%; overflow: auto;">
                        {% include "mobile-sublayer-menu.html" %}
                    </div>
                    
                    <!-- DATA PANEL -->
                    <div class="item" style="height: 100%; overflow: hidden;">
                        {% include "mobile-data.html" %}
                    </div>
                
                    <!-- MAP PANEL -->
                    <div class="active item" style="height: 100%; overflow: hidden;">
                        <div id="fullscreen" style="height: 100%; overflow: hidden;">
                            <!-- Map Panel -->
                            <div id="map-panel" class="span12" style="height: 100%;">       
                            
                                <div class="row-fluid" data-bind="visible: showMapPanel" style="height: 100%;">
                                    <div class="span12" style="height: 100%;">
                                        <div class="row-fluid" style="height: 100%;"><commit_msg>expanding mobile screen view to full width<commit_after><!DOCTYPE html>
<html>
  <head>
    
        <meta charset="utf-8">
        <title>
            MARCO Planning Tool
        </title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="">
        <meta name="author" content="">
  
        <!-- FROM RATCHET -->
        <!-- Sets initial viewport load and disables zooming  -->
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
        <!-- Makes your prototype chrome-less once bookmarked to your phone's home screen -->
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">        
        <!-- Include the compiled Ratchet CSS -->
        <link rel="stylesheet" href="{{MEDIA_URL}}/marco-proto/assets/ratchet/ratchet.css">
        <!-- END RATCHET -->
        
        
        <!-- Le styles -->
        <link href="{{MEDIA_URL}}/marco/css/bootstrap.css" rel="stylesheet">
        <link href="{{MEDIA_URL}}/marco/css/marco_style.css" rel="stylesheet">
        <link href="{{MEDIA_URL}}/marco-proto/assets/css/scalebar-thin.css" rel="stylesheet">
        <link href="{{MEDIA_URL}}/marco-proto/assets/css/style.css" rel="stylesheet">
        <link href="{{MEDIA_URL}}/marco-proto/assets/css/pageguide.css" rel="stylesheet">

        <link href="{{MEDIA_URL}}/marco/css/smoothness/jquery-ui-1.9.1.custom.css" rel="stylesheet">
        <link href="{{MEDIA_URL}}/marco-proto/assets/css/jquery.mCustomScrollbar.css" rel="stylesheet">
        <link href="{{MEDIA_URL}}marco/css/jquery.jscrollpane.css" rel="stylesheet">
        <!--<link href="{{MEDIA_URL}}/marco-proto/assets/css/jScrollPane.css" rel="stylesheet">-->
        <!--<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/themes/base/jquery-ui.css"
        type="text/css" media="all" />-->
        <link rel="shortcut icon" href="{{MEDIA_URL}}marco/ico/favicon.ico">

        <style>
        .navbar .nav > li:hover > a, .navbar .nav > li.active > a, .navbar .nav > li:hover > a:visited {
            height: 30px;
           
        }
        .navbar .nav > li > a {
            height: 25px;
        }

        </style>
        <link rel="apple-touch-icon-precomposed" sizes="144x144" href="{{MEDIA_URL}}/marco-proto/assets/ico/apple-touch-icon-144-precomposed.png">
        <link rel="apple-touch-icon-precomposed" sizes="114x114" href="{{MEDIA_URL}}/marco-proto/assets/ico/apple-touch-icon-114-precomposed.png">
        <link rel="apple-touch-icon-precomposed" sizes="72x72" href="{{MEDIA_URL}}/marco-proto/assets/ico/apple-touch-icon-72-precomposed.png">
        <link rel="apple-touch-icon-precomposed" href="{{MEDIA_URL}}/marco-proto/assets/ico/apple-touch-icon-57-precomposed.png">
        
        <!-- MORE RATCHET -->
        <!-- Include the compiled Ratchet JS -->
        <script src="{{MEDIA_URL}}/marco-proto/assets/ratchet/ratchet.js"></script>

        <!-- Intro paragraph styles. Delete once you start using this page -->
        <style type="text/css">
            .welcome {
              line-height: 1.5;
              color: #555;
            }
        </style>
        <!-- END RATCHET -->
        
        
        <!-- Google Analytics -->
        <script type="text/javascript">

          var _gaq = _gaq || [];
          _gaq.push(['_setAccount', 'UA-35841423-1']);
          _gaq.push(['_trackPageview']);

          (function() {
            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
          })();

        </script>
        
        <style type="text/css">
            
            #aggregated-attribute-overlay {
                position: absolute;
                /*border-radius: 4px; can't tell if I want this or not...*/
                bottom: 0;
                left: 0;
                top: auto;
                height: 130px;
                min-width: 100%;
                max-width: 100%;
                z-index: 950; 
                /*overflow-x: hidden;
                overflow-y: auto;*/
                /*overflow: auto;*/
                font-size: 12px;
                /* RGBa with 0.6 opacity */
                background-color: rgba(60, 110, 160, 0.65);
                /* For IE 5.5 - 7*/
                filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#bb2d8998, endColorstr=#bb2d8998);
                /* For IE 8*/
                -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#bb2d8998, endColorstr=#bb2d8998)";
            }
            #aggregated-attribute-content {
                height: 110px;
            }
            #aggregated-attribute-content .mCustomScrollBox {
                height: 110px;
            }
            #aggregated-attribute-content .mCSB_scrollTools {
                height: 80px;
            }
            .olControlScaleBarWrapper {
                display: none;
            }
            div.olControlZoom a {
                width: 26px !important;
                height: 26px !important;
                font-size: 20px !important;
            }
            #embedded-marco-logo {
                margin-left: 25px;
                margin-bottom: 17px;
                width: 133px;
            }
        </style>

    </head>
    
    
    <body style="margin: 0px; padding: 0px; height: 100%;">
    

        <!-- Make sure all your bars are the first things in your <body> -->
        <header class="bar-title" style="padding-bottom: 0px">
            <a id="mobile-data-button" class="button pull-left" style="position: absolute">
                Data
                <span class="count" data-bind="text: activeLayers().length"></span>
            </a>
            <a id="mobile-map-left-button" class="button pull-left" style="display: none; position: absolute">
                Map
            </a>
            <h1 class="title">
                <img id="embedded-marco-logo" src="{{MEDIA_URL}}marco/img/marco-logo-transparent-short.png"/>
            </h1>
            <a id="mobile-legend-button" class="button pull-right">
                Legend
                <span class="count" data-bind="text: activeLegendLayers().length"></span>
            </a>
            <a id="mobile-map-right-button" class="button pull-right" style="display: none">
                Map
            </a>
            <a id="mobile-data-right-button" class="button pull-right" style="display: none">
                Data
                <span class="count" data-bind="text: activeLayers().length"></span>
            </a>
        </header>

        <!-- Wrap all non-bar HTML in the .content div (this is actually what scrolls) -->
        <div class="content" style="overflow: hidden;">
            <!--
            <div id="loading" style="height: 100%; top: 44px;">
                <h2>Loading...</h2>
            </div>
            -->
            <div id="myCarousel" class="carousel slide" style="height: 100%;">
                <!-- Carousel items -->
                <div class="carousel-inner" style="height: 100%; overflow: hidden;">
                    
                    <!-- SUBLAYER MENU PANEL -->
                    <div class="item" style="height: 100%; overflow: auto;">
                        {% include "mobile-sublayer-menu.html" %}
                    </div>
                    
                    <!-- DATA PANEL -->
                    <div class="item" style="height: 100%; overflow: hidden;">
                        {% include "mobile-data.html" %}
                    </div>
                
                    <!-- MAP PANEL -->
                    <div class="active item" style="height: 100%; overflow: hidden;">
                        <div id="fullscreen" style="height: 100%; overflow: hidden;">
                            <!-- Map Panel -->
                            <div id="map-panel" class="span12" style="height: 100%; width: 100%; margin-left: 0px;">       
                            
                                <div class="row-fluid" data-bind="visible: showMapPanel" style="height: 100%;">
                                    <div class="span12" style="height: 100%;">
                                        <div class="row-fluid" style="height: 100%;">
{'fraction_non_alphanumeric': 0.15479659633989976, 'fraction_numerical': 0.021331157477561487, 'mean_word_length': 1.6578376703841389, 'pattern_counts': {'":': 0, '<': 203, '<?xml version=': 0, '>': 219, 'https://': 2, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 8, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4880008', 'n_tokens_mistral': 5318, 'n_tokens_neox': 4758, 'n_words': 945}