<commit_before><!-- @@include('../assets/_header.tpl', {"title": "Bubble Chart"}) -->

<div class="container">
    <div class="buttons">

        <!-- @@include('../assets/_menu.tpl') -->

        <label>|</label>

        <div id="dropdown-size" class="wrapper-dropdown" tabindex="1">
            <span>Size</span>
            <ul class="dropdown">
                <li><a onclick="phoneSize('line-chart')">Mobile Portrait</a>
                </li>
                <li><a onclick="phoneSize('line-chart', 'landscape')">Mobile Landscape</a>
                </li>
                <li><a onclick="randomSize('line-chart')">Random Size</a>
                </li>
                <li><a onclick="fullSize('line-chart')">Full Screen</a>
                </li>
            </ul>
        </div>

        <button onclick="randomSize('line-chart')">RANDOM</button>

        <label>|</label>

        <div id="dropdown-language" class="wrapper-dropdown" tabindex="1">
            <span>Language</span>
            <ul class="dropdown">
                <li><a onclick="setLanguage('en')">English</a>
                </li>
                <li><a onclick="setLanguage('pt')">Portuguese</a>
                </li>
            </ul>
        </div>
    </div>
    <div class="buttons">

        <button disabled>HOOKS:</button>

        <div id="dropdown-number" title="Y Axis" class="wrapper-dropdown" tabindex="1">
            <span>Y</span>
            <ul class="dropdown">
                <li><a onclick="hook('axis_y', 'indicator', 'pop')">Population</a></li>
                <li><a onclick="hook('axis_y', 'indicator', 'gdp_per_cap')">GDP</a></li>
                <li><a onclick="hook('axis_y', 'indicator', 'lex')">Lex</a></li>
            </ul>
        </div>


        <div id="dropdown-label" title="Color of Bubbles" class="wrapper-dropdown" tabindex="1">
            <span>Entities</span>
            <ul class="dropdown">
                <li><a onclick="filterEntities(['*'], ['world'])">World</a></li>
                <li><a onclick="filterEntities(['*'], ['region'])">4 regions</a></li>
                <li><a onclick="filterEntities(['swe'], ['country'])">A single country</a></li>
                <li><a onclick="filterEntities(['swe','usa'], ['country'])">Two countries</a></li>
            </ul>
        </div>


    </div>
    
    
    
    <div id="line-chart" class="placeholder"></div>

</div>
<div class="aux">
    <button onclick="shareLink()">SHARE LINK</button>

    <p>Current State:</p>
    <pre id="state" class="json_box" contentEditable="true"></pre>
    <button onclick="setCurrentState()">SET STATE</button>
</div>
</body>
<script>
var myVizabi;

$(function() {

    var options = {
        //state
        state: url.state || {

            //time properties
            time: {
                start: 1990,
                end: 2012,
                step: 1,
                speed: 300,
                value: 1990,
                formatInput: "%Y"
            },

            //entities we want to show
            entities: {
                show: {
                    dim: "geo",
                    filter: {
                        "geo": ["ago", "arg", "aus", "swe"],
                        "geo.category": ["country"]
                    }
                }
            },

            //how we show it
            marker: {
                dimensions: ["entities", "time"],
                type: "geometry",
                shape: "line",
                label: {
                    use: "property",
                    value: "geo.name"
                },<commit_msg>added state version<commit_after><!-- @@include('../assets/_header.tpl', {"title": "Bubble Chart"}) -->

<div class="container">
    <div class="buttons">

        <!-- @@include('../assets/_menu.tpl') -->

        <label>|</label>

        <div id="dropdown-size" class="wrapper-dropdown" tabindex="1">
            <span>Size</span>
            <ul class="dropdown">
                <li><a onclick="phoneSize('line-chart')">Mobile Portrait</a>
                </li>
                <li><a onclick="phoneSize('line-chart', 'landscape')">Mobile Landscape</a>
                </li>
                <li><a onclick="randomSize('line-chart')">Random Size</a>
                </li>
                <li><a onclick="fullSize('line-chart')">Full Screen</a>
                </li>
            </ul>
        </div>

        <button onclick="randomSize('line-chart')">RANDOM</button>

        <label>|</label>

        <div id="dropdown-language" class="wrapper-dropdown" tabindex="1">
            <span>Language</span>
            <ul class="dropdown">
                <li><a onclick="setLanguage('en')">English</a>
                </li>
                <li><a onclick="setLanguage('pt')">Portuguese</a>
                </li>
            </ul>
        </div>
    </div>
    <div class="buttons">

        <button disabled>HOOKS:</button>

        <div id="dropdown-number" title="Y Axis" class="wrapper-dropdown" tabindex="1">
            <span>Y</span>
            <ul class="dropdown">
                <li><a onclick="hook('axis_y', 'indicator', 'pop')">Population</a></li>
                <li><a onclick="hook('axis_y', 'indicator', 'gdp_per_cap')">GDP</a></li>
                <li><a onclick="hook('axis_y', 'indicator', 'lex')">Lex</a></li>
            </ul>
        </div>


        <div id="dropdown-label" title="Color of Bubbles" class="wrapper-dropdown" tabindex="1">
            <span>Entities</span>
            <ul class="dropdown">
                <li><a onclick="filterEntities(['*'], ['world'])">World</a></li>
                <li><a onclick="filterEntities(['*'], ['region'])">4 regions</a></li>
                <li><a onclick="filterEntities(['swe'], ['country'])">A single country</a></li>
                <li><a onclick="filterEntities(['swe','usa'], ['country'])">Two countries</a></li>
            </ul>
        </div>


    </div>
    
    
    
    <div id="line-chart" class="placeholder"></div>

</div>
<div class="aux">
    <button onclick="shareLink()">SHARE LINK</button>

    <p>Current State:</p>
    <pre id="state" class="json_box" contentEditable="true"></pre>
    <button onclick="setCurrentState()">SET STATE</button>
</div>
</body>
<script>
var myVizabi;

$(function() {

    var options = {
        //state
        state: url.state || {
            version: "1",

            //time properties
            time: {
                start: 1990,
                end: 2012,
                step: 1,
                speed: 300,
                value: 1990,
                formatInput: "%Y"
            },

            //entities we want to show
            entities: {
                show: {
                    dim: "geo",
                    filter: {
                        "geo": ["ago", "arg", "aus", "swe"],
                        "geo.category": ["country"]
                    }
                }
            },

            //how we show it
            marker: {
                dimensions: ["entities", "time"],
                type: "geometry",
                shape: "line",
                label: {
                    use: "property",
                    value: "geo.name"
                },
{'fraction_non_alphanumeric': 0.18788046485888213, 'fraction_numerical': 0.005949086884338683, 'mean_word_length': 1.569854248133665, 'pattern_counts': {'":': 6, '<': 215, '<?xml version=': 0, '>': 215, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1201128', 'n_tokens_mistral': 2166, 'n_tokens_neox': 2019, 'n_words': 384}