<commit_before>{% extends "chart-editor.twig" %}

{% block content %}

{{ parent() }}

<script type="text/javascript">
$(function() {

    var chart = DW.currentChart;

    chart.onChange(reload);

    chart.sync('#has-horizontal-headers', 'metadata.data.horizontal-header');
    // vertical header setting will be synched after data has loaded
    chart.sync('#describe-source-name', 'metadata.describe.source-name');
    chart.sync('#describe-source-url', 'metadata.describe.source-url');
    chart.sync('input:radio[name=transpose]', 'metadata.data.transpose');

    chart.sync('#number-format', 'metadata.describe.number-format');
    chart.sync('#number-divisor', 'metadata.describe.number-divisor');
    chart.sync('#number-append', 'metadata.describe.number-append');
    chart.sync('#number-prepend', 'metadata.describe.number-prepend');

    // swap between currency and unit
    function swapUnitAndCurrency() {
        if ($('#number-format').val()[0] == 'c') {
            $('#number-currency').show();
            $('#number-unit').hide();
        } else {
            $('#number-currency').hide();
            $('#number-unit').show();
        }
        $('#number-currency, #number-unit, #number-divisor').attr('disabled', $('#number-format').val() == '-');
    }
    $('#number-format').change(swapUnitAndCurrency);
    swapUnitAndCurrency();

    // update currency in number-format select
    function updateCurrencyInNumberFormat() {
        var curOpt = $('#number-format option[value=c], #number-format option[value=c0]');
        Globalize.culture("{{ chartLocale }}").numberFormat.currency.symbol = $('#number-currency option:selected').data('symbol');
        curOpt.each(function(i, el) {
            el = $(el);
            el.html(Globalize.format(1234.56, el.val()));
        });
    }
    updateCurrencyInNumberFormat();
    $('#number-currency').change(updateCurrencyInNumberFormat);

    // update data table after format changes
    $('.number-format').change(function() {
        updateTable(DW.dataView, chart);
    });

    function updateTable(dataset, chart) {

        function isNone(val) {
            return val === null || val === undefined || (_.isNumber(val) && isNaN(val));
        }

        console.log(dataset);

        var table = $('#data-preview'),
            horzHeaders = chart.get('metadata.data.horizontal-header'),
            vertHeaders = chart.get('metadata.data.vertical-header'),
            transpose = chart.get('metadata.data.transpose'),
            i, colCnt = dataset.series().length + (dataset.hasRowNames() ? 1 : 0);
        table.html('');  // empty table
        table.append('<thead><tr></tr><thead><tbody></tbody>');

        table.addClass(transpose ? 'row-series' : 'column-series');
        table.removeClass(transpose ? 'column-series' : 'row-series');

        for (i=0; i < colCnt; i++) {
            table.append('<colgroup style="width:'+(100 / colCnt)+'%" />');
        }

        if (horzHeaders) {
            var thead = $('thead tr', table);
            if (vertHeaders) thead.append('<th></th>');
            _.each(dataset.series(), function(s) {
                thead.append('<th>'+(!isNone(s.name) ? '<span>'+s.name+'</span>' : '')+'</th>');
            });
        }

        if (vertHeaders) table.addClass('vert-header'); else table.removeClass('vert-header');

        var tbody = $('tbody', table);
        dataset.eachRow(function(row) {
            var tr = $('<tr></tr>');
            if (dataset.hasRowNames()) {
                tr.append('<th><span>'+(!isNone(dataset.rowName(row)) ? dataset.rowName(row) : '')+'</span></th>');
            }
            dataset.eachSeries(function(s, i) {
                var val = s.data[row];
                val = chart.formatValue(val, true);
                tr.append('<td>'+(!isNone(s.data[row]) ? val : '')+'</td>');
            });
            tbody.append(tr);
        });

    }

    function reload(f) {
        chart.dataset(function(ds) {
            if (f === undefined) {
                if (chart.get('metadata.data.vertical-header') === undefined) {
                    chart.set('metadata.data.vertical-header', isNaN(ds.series(0).data[0]));
                }
                chart.sync('#has-vertical-headers', 'metadata.data.vertical-header');
            }
            DW.dataset = ds;
            updateTable(ds, chart);
        }, true);
    }

    reload();

    $('#describe-proceed').click(function(e) {
        chart.save();
    });

});

</script>

<div class="dw-create-describe">

    <div class="row">

        <div class="span8">

            <h2>{% trans "Check and Describe Your Data" %}</h2>

            <p>{% trans "Please check if the data format was recognized correctly. If not, please <a data-toggle='modal' href='/popup/help/describe'>help Datawrapper to understand your data</a>." %}</p>


            <form class="form-inline">
                <div id="csv-parse-options" class="row">
                    <div class="span4">
                    </div>
                    <div class="span4">

                    </div>
                </div>
            </form>

            <div style="overflow-x:scroll; overflow-y: visible; width:100%">
                <table id="data-preview" class="table table-striped">
                </table>
            </div>
        </div>

        <div class="span4"><div class="well">

            <h3>{% trans "Describe your data" %}</h3>
            
            <div style="margin-bottom:15px;">
                
                <div class="half">
                    <p>
                        <label class="radio"><input type="radio" name="transpose" value="yes" /> {% trans "Data series in rows" %}</label>
                        <label class="radio"><input type="radio" name="transpose" value="no" /> {% trans "Data series in columns" %}</label>
                    </p>

                </div><div class="half">
                    <p>
                        <label class="checkbox"><input id="has-horizontal-headers" type="checkbox" checked="checked"> {% trans "First row as label" %}</label>
                        <label class="checkbox"><input id="has-vertical-headers" type="checkbox"> {% trans "First column as label" %}</label>
                    </p>
                </div>
                <div class="clearfix"></div>
            </div>

            <h3>{% trans "Output number format" %}</h3>

            <div class="form-horizontal compact">
                <div class="control-group">
                    <label class="control-label" for="text-title">{% trans "Decimals after point" %}</label>
                    <div class="controls">
                       <select id="number-format" class="select span2 number-format">
                            <option value="-">{% trans "keep original" %}</option>
                            {% for id, format in numberformats %}
                                <option value="{{ id }}">{{ format }}</option>
                            {% endfor %}
                        </select>
                    </div>
                </div>


                <div class="control-group">
                    <label class="control-label" for="text-title">{% trans "Prepend/Append" %}</label>
                    <div class="controls">
                        <input type="text" id="number-prepend" style="width:2em;text-align:right" /> ### <input type="text" id="number-append" style="width:2em" />
                    </div>
                </div>


                <div class="control-group">
                    <label class="control-label" for="text-title">{% trans "Devide numbers by" %}</label>
                    <div class="controls">
                        <select class="span1 number-format" id="number-divisor">
                            <option value="0">-</option>
                            <option value="3">{% trans "1000" %}</option>
                            <option value="6">{% trans "1 million" %}</option>
                            <option value="9">{% trans "1 billion" %}</option>
                        </select>
                    </div>
                </div>

            </div>

            <h3>{% trans "Credit the source" %}</h3>
            <p>
                <label>{% trans "Who published the data in the first place?" %}</label>
                <input id="describe-source-name" type="text" placeholder="name of the organisation">
            </p>
            <p>
                <label>{% trans "If possible, please provide a link the source data" %}</label>
                <input id="describe-source-url" type="text" placeholder="http://">
            </p>
            <!--<h3>{% trans "Annotate data" %}</h3>
            <p>{% trans "To make the data more useful for your readers you can add details to individual data points or an entire series. This information will be displayed in the visualisations." %} <a href="#">{% trans "Learn more" %}</a></p>
            <button class="btn"><i class="icon-th-list"></i> {% trans "Annotate series" %}</button> <button class="btn"><i class="icon-th"></i> {% trans "Annotate data point" %}</button>
            -->

                <a href="visualize" class="pull-right btn-large btn btn-primary" id="describe-proceed">{% trans "Visualize" %} <i class="icon-chevron-right icon-white"></i></a>
                <a class="btn" href="upload"><i class="icon-chevron-left"></i> {% trans "Back" %}</a>
                <div class="clearfix"></div>
        </div></div>
    </div>

    <div class="row">
        <div class="span12">


        </div>
    </div>
</div>


{% endblock %}<commit_msg>removed log output<commit_after>{% extends "chart-editor.twig" %}

{% block content %}

{{ parent() }}

<script type="text/javascript">
$(function() {

    var chart = DW.currentChart;

    chart.onChange(reload);

    chart.sync('#has-horizontal-headers', 'metadata.data.horizontal-header');
    // vertical header setting will be synched after data has loaded
    chart.sync('#describe-source-name', 'metadata.describe.source-name');
    chart.sync('#describe-source-url', 'metadata.describe.source-url');
    chart.sync('input:radio[name=transpose]', 'metadata.data.transpose');

    chart.sync('#number-format', 'metadata.describe.number-format');
    chart.sync('#number-divisor', 'metadata.describe.number-divisor');
    chart.sync('#number-append', 'metadata.describe.number-append');
    chart.sync('#number-prepend', 'metadata.describe.number-prepend');

    // swap between currency and unit
    function swapUnitAndCurrency() {
        if ($('#number-format').val()[0] == 'c') {
            $('#number-currency').show();
            $('#number-unit').hide();
        } else {
            $('#number-currency').hide();
            $('#number-unit').show();
        }
        $('#number-currency, #number-unit, #number-divisor').attr('disabled', $('#number-format').val() == '-');
    }
    $('#number-format').change(swapUnitAndCurrency);
    swapUnitAndCurrency();

    // update currency in number-format select
    function updateCurrencyInNumberFormat() {
        var curOpt = $('#number-format option[value=c], #number-format option[value=c0]');
        Globalize.culture("{{ chartLocale }}").numberFormat.currency.symbol = $('#number-currency option:selected').data('symbol');
        curOpt.each(function(i, el) {
            el = $(el);
            el.html(Globalize.format(1234.56, el.val()));
        });
    }
    updateCurrencyInNumberFormat();
    $('#number-currency').change(updateCurrencyInNumberFormat);

    // update data table after format changes
    $('.number-format').change(function() {
        updateTable(DW.dataView, chart);
    });

    function updateTable(dataset, chart) {

        function isNone(val) {
            return val === null || val === undefined || (_.isNumber(val) && isNaN(val));
        }

        var table = $('#data-preview'),
            horzHeaders = chart.get('metadata.data.horizontal-header'),
            vertHeaders = chart.get('metadata.data.vertical-header'),
            transpose = chart.get('metadata.data.transpose'),
            i, colCnt = dataset.series().length + (dataset.hasRowNames() ? 1 : 0);
        table.html('');  // empty table
        table.append('<thead><tr></tr><thead><tbody></tbody>');

        table.addClass(transpose ? 'row-series' : 'column-series');
        table.removeClass(transpose ? 'column-series' : 'row-series');

        for (i=0; i < colCnt; i++) {
            table.append('<colgroup style="width:'+(100 / colCnt)+'%" />');
        }

        if (horzHeaders) {
            var thead = $('thead tr', table);
            if (vertHeaders) thead.append('<th></th>');
            _.each(dataset.series(), function(s) {
                thead.append('<th>'+(!isNone(s.name) ? '<span>'+s.name+'</span>' : '')+'</th>');
            });
        }

        if (vertHeaders) table.addClass('vert-header'); else table.removeClass('vert-header');

        var tbody = $('tbody', table);
        dataset.eachRow(function(row) {
            var tr = $('<tr></tr>');
            if (dataset.hasRowNames()) {
                tr.append('<th><span>'+(!isNone(dataset.rowName(row)) ? dataset.rowName(row) : '')+'</span></th>');
            }
            dataset.eachSeries(function(s, i) {
                var val = s.data[row];
                val = chart.formatValue(val, true);
                tr.append('<td>'+(!isNone(s.data[row]) ? val : '')+'</td>');
            });
            tbody.append(tr);
        });

    }

    function reload(f) {
        chart.dataset(function(ds) {
            if (f === undefined) {
                if (chart.get('metadata.data.vertical-header') === undefined) {
                    chart.set('metadata.data.vertical-header', isNaN(ds.series(0).data[0]));
                }
                chart.sync('#has-vertical-headers', 'metadata.data.vertical-header');
            }
            DW.dataset = ds;
            updateTable(ds, chart);
        }, true);
    }

    reload();

    $('#describe-proceed').click(function(e) {
        chart.save();
    });

});

</script>

<div class="dw-create-describe">

    <div class="row">

        <div class="span8">

            <h2>{% trans "Check and Describe Your Data" %}</h2>

            <p>{% trans "Please check if the data format was recognized correctly. If not, please <a data-toggle='modal' href='/popup/help/describe'>help Datawrapper to understand your data</a>." %}</p>


            <form class="form-inline">
                <div id="csv-parse-options" class="row">
                    <div class="span4">
                    </div>
                    <div class="span4">

                    </div>
                </div>
            </form>

            <div style="overflow-x:scroll; overflow-y: visible; width:100%">
                <table id="data-preview" class="table table-striped">
                </table>
            </div>
        </div>

        <div class="span4"><div class="well">

            <h3>{% trans "Describe your data" %}</h3>
            
            <div style="margin-bottom:15px;">
                
                <div class="half">
                    <p>
                        <label class="radio"><input type="radio" name="transpose" value="yes" /> {% trans "Data series in rows" %}</label>
                        <label class="radio"><input type="radio" name="transpose" value="no" /> {% trans "Data series in columns" %}</label>
                    </p>

                </div><div class="half">
                    <p>
                        <label class="checkbox"><input id="has-horizontal-headers" type="checkbox" checked="checked"> {% trans "First row as label" %}</label>
                        <label class="checkbox"><input id="has-vertical-headers" type="checkbox"> {% trans "First column as label" %}</label>
                    </p>
                </div>
                <div class="clearfix"></div>
            </div>

            <h3>{% trans "Output number format" %}</h3>

            <div class="form-horizontal compact">
                <div class="control-group">
                    <label class="control-label" for="text-title">{% trans "Decimals after point" %}</label>
                    <div class="controls">
                       <select id="number-format" class="select span2 number-format">
                            <option value="-">{% trans "keep original" %}</option>
                            {% for id, format in numberformats %}
                                <option value="{{ id }}">{{ format }}</option>
                            {% endfor %}
                        </select>
                    </div>
                </div>


                <div class="control-group">
                    <label class="control-label" for="text-title">{% trans "Prepend/Append" %}</label>
                    <div class="controls">
                        <input type="text" id="number-prepend" style="width:2em;text-align:right" /> ### <input type="text" id="number-append" style="width:2em" />
                    </div>
                </div>


                <div class="control-group">
                    <label class="control-label" for="text-title">{% trans "Devide numbers by" %}</label>
                    <div class="controls">
                        <select class="span1 number-format" id="number-divisor">
                            <option value="0">-</option>
                            <option value="3">{% trans "1000" %}</option>
                            <option value="6">{% trans "1 million" %}</option>
                            <option value="9">{% trans "1 billion" %}</option>
                        </select>
                    </div>
                </div>

            </div>

            <h3>{% trans "Credit the source" %}</h3>
            <p>
                <label>{% trans "Who published the data in the first place?" %}</label>
                <input id="describe-source-name" type="text" placeholder="name of the organisation">
            </p>
            <p>
                <label>{% trans "If possible, please provide a link the source data" %}</label>
                <input id="describe-source-url" type="text" placeholder="http://">
            </p>
            <!--<h3>{% trans "Annotate data" %}</h3>
            <p>{% trans "To make the data more useful for your readers you can add details to individual data points or an entire series. This information will be displayed in the visualisations." %} <a href="#">{% trans "Learn more" %}</a></p>
            <button class="btn"><i class="icon-th-list"></i> {% trans "Annotate series" %}</button> <button class="btn"><i class="icon-th"></i> {% trans "Annotate data point" %}</button>
            -->

                <a href="visualize" class="pull-right btn-large btn btn-primary" id="describe-proceed">{% trans "Visualize" %} <i class="icon-chevron-right icon-white"></i></a>
                <a class="btn" href="upload"><i class="icon-chevron-left"></i> {% trans "Back" %}</a>
                <div class="clearfix"></div>
        </div></div>
    </div>

    <div class="row">
        <div class="span12">


        </div>
    </div>
</div>


{% endblock %}
{'fraction_non_alphanumeric': 0.17827124623845594, 'fraction_numerical': 0.005292103351665456, 'mean_word_length': 1.9098731884057971, 'pattern_counts': {'":': 0, '<': 321, '<?xml version=': 0, '>': 319, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3602241', 'n_tokens_mistral': 5522, 'n_tokens_neox': 5199, 'n_words': 1147}