<commit_before>import React from "react";
import ReactDOM from "react-dom";
import Collapsible from "react-collapsible";

class GeoDashHelp extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            LngObject: {},
        };
        fetch(this.props.documentRoot + "/locale/geodashhelp_" + this.props.browserLanguage + ".json")
            .then(res => res.json())
            .then(data => this.setState({ LngObject: data }));
    }
    render() {
        return (
            <div className="container-fluid">
                <br style={{ clear:"both" }} />
                <div className="col-xl-10 offset-xl-1 col-lg-10 offset-lg-1 justify-content-center">
                    <h1>{this.state.LngObject.title}</h1>
                    <Collapsible
                        trigger={this.state.LngObject.head_image_collection_widget}
                        triggerTagName="h2"
                    >
                        <img
                            src={this.props.documentRoot + "/img/image_collection_widget.gif"}
                            className="previewImg"
                            onClick={(e) => this.toggleHelpImage(e)}
                        />
                        <br className="previewbreak"/>
                        <ol>
                            {this.getLi(this.state.LngObject.click_add_widget)}
                            {this.getLi(this.state.LngObject.select_image_collection)}
                            {this.getLi(this.state.LngObject.choose_basemap)}
                            <li>
                                <span>{this.state.LngObject.select_data}</span>
                                <ol style={{ listStyleType: "lower-alpha" }}>
                                    {this.getLi(this.state.LngObject.ic_data_info_preset)}
                                    <li>
                                        {this.state.LngObject.ic_data_info_configure}
                                        <ol style={{ listStyleType: "lower-roman" }}>
                                            {this.getLi("Landsat 5 - B1, B2, B3, B4, B5, B6, B7")}
                                            {this.getLi("Landsat 7 - B1, B2, B3, B4, B5, B6_VCID_1, B6_VCID_2, B7, B8")}
                                            {this.getLi("Landsat 8 - B1, B2, B3, B4, B5, B6, B7, B8, B9, B10, B11")}
                                            {this.getLi("Sentinel 2 - B1, B2, B3, B4, B5, B6, B7, B8, B8a, B9, B10, B11, B12")}
                                        </ol>
                                    </li>
                                    <li>
                                        <span data-tag="custom_widget_info"></span>
                                        <ol style={{ listStyleType: "lower-roman" }}>
                                            {this.getLi(" Offline Carbon Monoxide - COPERNICUS/S5P/OFFL/L3_CO\n" +
                                                "                                                {\"{\"bands\":\"CO_column_number_density,H2O_column_number_density,cloud_height\",\"min\":\"0\",\"max\":\"0.5\"}\"}\n" +
                                                "                                            2018-01-01 to 2018-12-31")}
                                            {this.getLi(this.state.LngObject.custom_widget_warning)}
                                        </ol>
                                    </li>
                                </ol>
                            </li>
                            {this.getLi(this.state.LngObject.select_date_range)}
                            {this.getLi(this.state.LngObject.click_create)}
                            {this.getLi(this.state.LngObject.reposition)}
                        </ol>
                    </Collapsible>
                    <Collapsible trigger={this.state.LngObject.add_time_series_graph} triggerTagName="h2">
                        <img
                            src={this.props.documentRoot + "/img/time_series_graph_widget.gif"}
                            className="previewImg"
                            onClick={(e) => this.toggleHelpImage(e)}
                        />
                        <br className="previewbreak"/>
                        <ol>
                            <li>
                                {this.state.LngObject.click_add_widget}
                            </li>
                            <li>
                                {this.state.LngObject.select_time_series}
                            </li>
                            <li>
                                <span>{this.state.LngObject.select_data}</span>
                                <ol style={{ listStyleType: "lower-alpha" }}>
                                    <li>
                                        {this.state.LngObject.configured_graph}
                                    </li>
                                    <li>
                                        <span>{this.state.LngObject.custom_graph}</span>
                                        <ol style={{ listStyleType: "lower-roman" }}>
                                            <li>
                                                {this.state.LngObject.image_collection_graph}
                                            </li>
                                            <li>
                                                {this.state.LngObject.band_to_graph}
                                            </li>
                                            <li>
                                                {this.state.LngObject.graph_reducer}
                                            </li>
                                        </ol>
                                    </li>
                                </ol>
                            </li>
                            <li>
                                {this.state.LngObject.select_date_range}
                            </li>
                            <li>
                                {this.state.LngObject.click_create}
                            </li>
                            <li>{this.state.LngObject.reposition}</li>
                        </ol>
                    </Collapsible>
                    <Collapsible
                        trigger={this.state.LngObject.add_stats_widget}
                        triggerTagName="h2"
                    >
                        <img
                            src={this.props.documentRoot + "/img/statistics_widget.gif"}
                            className="previewImg"
                            onClick={(e) => this.toggleHelpImage(e)}
                        />
                        <br className="previewbreak"/>
                        <ol>
                            {this.getLi(this.state.LngObject.click_add_widget)}
                            {this.getLi(this.state.LngObject.select_stats)}
                            {this.getLi(this.state.LngObject.give_title)}
                            {this.getLi(this.state.LngObject.click_create)}
                            {this.getLi(this.state.LngObject.reposition)}
                        </ol>
                        <br style={{clear:"both;"}}/>
                    </Collapsible>
                    <Collapsible
                        trigger={this.state.LngObject.add_dual_image_collection}
                        triggerTagName="h2"
                    >
                        <img
                            src={this.props.documentRoot + "/img/dual_image_collection_widget.gif"}
                            className="previewImg"
                            onClick={(e) => this.toggleHelpImage(e)}
                        />
                        <br className="previewbreak"/>
                        <ol>
                            {this.getLi(this.state.LngObject.click_add_widget)}
                            {this.getLi(this.state.LngObject.select_dual_image_collection)}
                            {this.getLi(this.state.LngObject.choose_basemap)}
                            <li>
                                <span data-tag="select_data">{this.state.LngObject.select_data}</span>
                                <ol style={{listStyleType: "lower-alpha"}}>
                                    {this.getLi(this.state.LngObject.ic_data_info_preset)}
                                    <li data-tag="ic_data_info_configure">
                                        {this.state.LngObject.ic_data_info_configure}
                                        <ol style={{listStyleType: "lower-roman"}}>
                                            {this.getLi("Landsat 5 - B1, B2, B3, B4, B5, B6, B7")}
                                            {this.getLi("Landsat 7 - B1, B2, B3, B4, B5, B6_VCID_1, B6_VCID_2, B7, B8")}
                                            {this.getLi("Landsat 8 - B1, B2, B3, B4, B5, B6, B7, B8, B9, B10, B11")}
                                            {this.getLi("Sentinel 2 - B1, B2, B3, B4, B5, B6, B7, B8, B8a, B9, B10, B11, B12")}
                                        </ol>
                                    </li>
                                    {this.getLi(this.state.LngObject.image_asset)}
                                    <li>
                                        <span data-tag="image_collection_asset">{this.state.LngObject.image_collection_asset}</span>
                                        <ol style={{listStyleType: "lower-alpha"}}>
                                            {this.getLi(this.state.LngObject.give_title)}
                                            <li>
                                                <span>{this.state.LngObject.enter_image_asset}</span> users/ValeriaContessa/Indonesia_2000
                                            </li>
                                            <li>
                                                <span>{this.state.LngObject.enter_image_asset_params} </span> {"{\"bands\":\"B4,B5,B3\",\"min\":\"10,0,10\",\"max\":\"120,90,70\"}"}
                                            </li>
                                            {this.getLi(this.state.LngObject.skip_date)}
                                        </ol>
                                    </li>
                                    <li>
                                        <span data-tag="custom_widget_info">{this.state.LngObject.custom_widget_info}</span>
                                        <ol style={{listStyleType: "lower-roman"}}>
                                            {this.getLi("Offline Carbon Monoxide - COPERNICUS/S5P/OFFL/L3_CO {\"bands\":\"CO_column_number_density,H2O_column_number_density,cloud_height\",\"min\":\"0\",\"max\":\"0.5\"} <br /> 2018-01-01 to 2018-12-31")}
                                            {this.getLi(this.state.LngObject.custom_widget_warning)}
                                        </ol><commit_msg>fixed tag issue<commit_after>import React from "react";
import ReactDOM from "react-dom";
import Collapsible from "react-collapsible";

class GeoDashHelp extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            LngObject: {},
        };
        fetch(this.props.documentRoot + "/locale/geodashhelp_" + this.props.browserLanguage + ".json")
            .then(res => res.json())
            .then(data => this.setState({ LngObject: data }));
    }
    render() {
        return (
            <div className="container-fluid">
                <br style={{ clear:"both" }} />
                <div className="col-xl-10 offset-xl-1 col-lg-10 offset-lg-1 justify-content-center">
                    <h1>{this.state.LngObject.title}</h1>
                    <Collapsible
                        trigger={this.state.LngObject.head_image_collection_widget}
                        triggerTagName="h2"
                    >
                        <img
                            src={this.props.documentRoot + "/img/image_collection_widget.gif"}
                            className="previewImg"
                            onClick={(e) => this.toggleHelpImage(e)}
                        />
                        <br className="previewbreak"/>
                        <ol>
                            {this.getLi(this.state.LngObject.click_add_widget)}
                            {this.getLi(this.state.LngObject.select_image_collection)}
                            {this.getLi(this.state.LngObject.choose_basemap)}
                            <li>
                                <span>{this.state.LngObject.select_data}</span>
                                <ol style={{ listStyleType: "lower-alpha" }}>
                                    {this.getLi(this.state.LngObject.ic_data_info_preset)}
                                    <li>
                                        {this.state.LngObject.ic_data_info_configure}
                                        <ol style={{ listStyleType: "lower-roman" }}>
                                            {this.getLi("Landsat 5 - B1, B2, B3, B4, B5, B6, B7")}
                                            {this.getLi("Landsat 7 - B1, B2, B3, B4, B5, B6_VCID_1, B6_VCID_2, B7, B8")}
                                            {this.getLi("Landsat 8 - B1, B2, B3, B4, B5, B6, B7, B8, B9, B10, B11")}
                                            {this.getLi("Sentinel 2 - B1, B2, B3, B4, B5, B6, B7, B8, B8a, B9, B10, B11, B12")}
                                        </ol>
                                    </li>
                                    <li>
                                        <span data-tag="custom_widget_info"></span>
                                        <ol style={{ listStyleType: "lower-roman" }}>
                                            {this.getLi(" Offline Carbon Monoxide - COPERNICUS/S5P/OFFL/L3_CO\n" +
                                                "                                                {\"{\"bands\":\"CO_column_number_density,H2O_column_number_density,cloud_height\",\"min\":\"0\",\"max\":\"0.5\"}\"}\n" +
                                                "                                            2018-01-01 to 2018-12-31")}
                                            {this.getLi(this.state.LngObject.custom_widget_warning)}
                                        </ol>
                                    </li>
                                </ol>
                            </li>
                            {this.getLi(this.state.LngObject.select_date_range)}
                            {this.getLi(this.state.LngObject.click_create)}
                            {this.getLi(this.state.LngObject.reposition)}
                        </ol>
                    </Collapsible>
                    <Collapsible trigger={this.state.LngObject.add_time_series_graph} triggerTagName="h2">
                        <img
                            src={this.props.documentRoot + "/img/time_series_graph_widget.gif"}
                            className="previewImg"
                            onClick={(e) => this.toggleHelpImage(e)}
                        />
                        <br className="previewbreak"/>
                        <ol>
                            <li>
                                {this.state.LngObject.click_add_widget}
                            </li>
                            <li>
                                {this.state.LngObject.select_time_series}
                            </li>
                            <li>
                                <span>{this.state.LngObject.select_data}</span>
                                <ol style={{ listStyleType: "lower-alpha" }}>
                                    <li>
                                        {this.state.LngObject.configured_graph}
                                    </li>
                                    <li>
                                        <span>{this.state.LngObject.custom_graph}</span>
                                        <ol style={{ listStyleType: "lower-roman" }}>
                                            <li>
                                                {this.state.LngObject.image_collection_graph}
                                            </li>
                                            <li>
                                                {this.state.LngObject.band_to_graph}
                                            </li>
                                            <li>
                                                {this.state.LngObject.graph_reducer}
                                            </li>
                                        </ol>
                                    </li>
                                </ol>
                            </li>
                            <li>
                                {this.state.LngObject.select_date_range}
                            </li>
                            <li>
                                {this.state.LngObject.click_create}
                            </li>
                            <li>{this.state.LngObject.reposition}</li>
                        </ol>
                    </Collapsible>
                    <Collapsible
                        trigger={this.state.LngObject.add_stats_widget}
                        triggerTagName="h2"
                    >
                        <img
                            src={this.props.documentRoot + "/img/statistics_widget.gif"}
                            className="previewImg"
                            onClick={(e) => this.toggleHelpImage(e)}
                        />
                        <br className="previewbreak"/>
                        <ol>
                            {this.getLi(this.state.LngObject.click_add_widget)}
                            {this.getLi(this.state.LngObject.select_stats)}
                            {this.getLi(this.state.LngObject.give_title)}
                            {this.getLi(this.state.LngObject.click_create)}
                            {this.getLi(this.state.LngObject.reposition)}
                        </ol>
                        <br style={{clear:"both;"}}/>
                    </Collapsible>
                    <Collapsible
                        trigger={this.state.LngObject.add_dual_image_collection}
                        triggerTagName="h2"
                    >
                        <img
                            src={this.props.documentRoot + "/img/dual_image_collection_widget.gif"}
                            className="previewImg"
                            onClick={(e) => this.toggleHelpImage(e)}
                        />
                        <br className="previewbreak"/>
                        <ol>
                            {this.getLi(this.state.LngObject.click_add_widget)}
                            {this.getLi(this.state.LngObject.select_dual_image_collection)}
                            {this.getLi(this.state.LngObject.choose_basemap)}
                            <li>
                                <span data-tag="select_data">{this.state.LngObject.select_data}</span>
                                <ol style={{listStyleType: "lower-alpha"}}>
                                    {this.getLi(this.state.LngObject.ic_data_info_preset)}
                                    <li data-tag="ic_data_info_configure">
                                        {this.state.LngObject.ic_data_info_configure}
                                        <ol style={{listStyleType: "lower-roman"}}>
                                            {this.getLi("Landsat 5 - B1, B2, B3, B4, B5, B6, B7")}
                                            {this.getLi("Landsat 7 - B1, B2, B3, B4, B5, B6_VCID_1, B6_VCID_2, B7, B8")}
                                            {this.getLi("Landsat 8 - B1, B2, B3, B4, B5, B6, B7, B8, B9, B10, B11")}
                                            {this.getLi("Sentinel 2 - B1, B2, B3, B4, B5, B6, B7, B8, B8a, B9, B10, B11, B12")}
                                        </ol>
                                    </li>
                                    {this.getLi(this.state.LngObject.image_asset)}
                                    <li>
                                        <span data-tag="image_collection_asset">{this.state.LngObject.image_collection_asset}</span>
                                        <ol style={{listStyleType: "lower-alpha"}}>
                                            {this.getLi(this.state.LngObject.give_title)}
                                            <li>
                                                <span>{this.state.LngObject.enter_image_asset}</span> users/ValeriaContessa/Indonesia_2000
                                            </li>
                                            <li>
                                                <span>{this.state.LngObject.enter_image_asset_params} </span> {"{\"bands\":\"B4,B5,B3\",\"min\":\"10,0,10\",\"max\":\"120,90,70\"}"}
                                            </li>
                                            {this.getLi(this.state.LngObject.skip_date)}
                                        </ol>
                                    </li>
                                    <li>
                                        <span data-tag="custom_widget_info">{this.state.LngObject.custom_widget_info}</span>
                                        <ol style={{listStyleType: "lower-roman"}}>
                                            {this.getLi("Offline Carbon Monoxide - COPERNICUS/S5P/OFFL/L3_CO {\"bands\":\"CO_column_number_density,H2O_column_number_density,cloud_height\",\"min\":\"0\",\"max\":\"0.5\"} \n 2018-01-01 to 2018-12-31")}
                                            {this.getLi(this.state.LngObject.custom_widget_warning)}
                                        </ol>
{'fraction_non_alphanumeric': 0.10635774879138922, 'fraction_numerical': 0.01614521572562255, 'mean_word_length': 0.8148485350107598, 'pattern_counts': {'":': 18, '<': 206, '<?xml version=': 0, '>': 218, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 244, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '667024', 'n_tokens_mistral': 5359, 'n_tokens_neox': 5120, 'n_words': 679}