\n
\n \n \n { children }\n
\n \n \n { tableCaption }\n
\n
\n );\n }\n}\n\nBootstrapTable.propTypes = {\n keyField: PropTypes.string.isRequired,\n data: PropTypes.array.isRequired,\n columns: PropTypes.array.isRequired,\n bootstrap4: PropTypes.bool,\n remote: PropTypes.oneOfType([PropTypes.bool, PropTypes.shape({\n pagination: PropTypes.bool\n })]),\n noDataIndication: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\n striped: PropTypes.bool,\n bordered: PropTypes.bool,\n hover: PropTypes.bool,\n tabIndexCell: PropTypes.bool,\n id: PropTypes.string,\n classes: PropTypes.string,\n headerClasses: PropTypes.string,\n bodyClasses: PropTypes.string,\n wrapperClasses: PropTypes.string,\n headerWrapperClasses: PropTypes.string,\n condensed: PropTypes.bool,\n caption: PropTypes.oneOfType([\n PropTypes.node,\n PropTypes.string\n ]),\n pagination: PropTypes.object,\n filter: PropTypes.object,\n cellEdit: PropTypes.object,\n selectRow: PropTypes.shape({\n mode: PropTypes.oneOf([\n Const.ROW_SELECT_SINGLE,\n Const.ROW_SELECT_MULTIPLE,\n Const.ROW_SELECT_DISABLED\n ]).isRequired,\n clickToSelect: PropTypes.bool,\n clickToExpand: PropTypes.bool,\n clickToEdit: PropTypes.bool,\n hideSelectAll: PropTypes.bool,\n onSelect: PropTypes.func,\n onSelectAll: PropTypes.func,\n style: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),\n classes: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n nonSelectable: PropTypes.array,\n nonSelectableStyle: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n nonSelectableClasses: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n bgColor: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n hideSelectColumn: PropTypes.bool,\n selectionRenderer: PropTypes.func,\n selectionHeaderRenderer: PropTypes.func,\n headerColumnStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),\n selectColumnStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),\n selectColumnPosition: PropTypes.oneOf([\n Const.INDICATOR_POSITION_LEFT,\n Const.INDICATOR_POSITION_RIGHT\n ])\n }),\n expandRow: PropTypes.shape({\n renderer: PropTypes.func,\n expanded: PropTypes.array,\n onExpand: PropTypes.func,\n onExpandAll: PropTypes.func,\n nonExpandable: PropTypes.array,\n showExpandColumn: PropTypes.bool,\n onlyOneExpanding: PropTypes.bool,\n expandByColumnOnly: PropTypes.bool,\n expandColumnRenderer: PropTypes.func,\n expandHeaderColumnRenderer: PropTypes.func,\n expandColumnPosition: PropTypes.oneOf([\n Const.INDICATOR_POSITION_LEFT,\n Const.INDICATOR_POSITION_RIGHT\n ]),\n className: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n parentClassName: PropTypes.oneOfType([PropTypes.string, PropTypes.func])\n }),\n rowStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),\n rowEvents: PropTypes.object,\n rowClasses: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n filtersClasses: PropTypes.string,\n filterPosition: PropTypes.oneOf([\n Const.FILTERS_POSITION_TOP,\n Const.FILTERS_POSITION_INLINE,\n Const.FILTERS_POSITION_BOTTOM\n ]),\n footerClasses: PropTypes.string,\n defaultSorted: PropTypes.arrayOf(PropTypes.shape({\n dataField: PropTypes.string.isRequired,\n order: PropTypes.oneOf([Const.SORT_DESC, Const.SORT_ASC]).isRequired\n })),\n sort: PropTypes.shape({\n dataField: PropTypes.string,\n order: PropTypes.oneOf([Const.SORT_DESC, Const.SORT_ASC]),\n sortFunc: PropTypes.func,\n sortCaret: PropTypes.func\n }),\n defaultSortDirection: PropTypes.oneOf([Const.SORT_DESC, Const.SORT_ASC]),\n overlay: PropTypes.func,\n onTableChange: PropTypes.func,\n onSort: PropTypes.func,\n onFilter: PropTypes.func,\n onExternalFilter: PropTypes.func,\n onDataSizeChange: PropTypes.func,\n // Inject from toolkit\n search: PropTypes.shape({\n searchText: PropTypes.string,\n searchContext: PropTypes.func\n }),\n setDependencyModules: PropTypes.func\n};\n\nBootstrapTable.defaultProps = {\n bootstrap4: false,\n remote: false,\n striped: false,\n bordered: true,\n hover: false,\n condensed: false,\n noDataIndication: null,\n selectRow: {\n mode: Const.ROW_SELECT_DISABLED,\n selected: [],\n hideSelectColumn: true\n },\n expandRow: {\n renderer: undefined,\n expanded: [],\n nonExpandable: []\n },\n cellEdit: {\n mode: null,\n nonEditableRows: []\n },\n filterPosition: Const.FILTERS_POSITION_INLINE\n};\n\nexport default BootstrapTable;\n","import _ from '../utils';\nimport ColumnResolver from './column-resolver';\n\nexport default ExtendBase =>\n class TableResolver extends ColumnResolver(ExtendBase) {\n validateProps() {\n const { keyField } = this.props;\n if (!keyField) {\n throw new Error('Please specify a field as key via keyField');\n }\n if (this.visibleColumnSize(false) <= 0) {\n throw new Error('No visible columns detected');\n }\n }\n\n isEmpty() {\n return this.props.data.length === 0;\n }\n\n visibleRows() {\n const { data, hiddenRows, keyField } = this.props;\n if (!hiddenRows || hiddenRows.length === 0) return data;\n return data.filter((row) => {\n const key = _.get(row, keyField);\n return !_.contains(hiddenRows, key);\n });\n }\n };\n","export default ExtendBase =>\n class ColumnResolver extends ExtendBase {\n visibleColumnSize(includeSelectColumn = true) {\n let columnLen;\n if (this.props.columnToggle && this.props.columnToggle.toggles) {\n const columns = this.props.columnToggle.toggles;\n columnLen = Object.keys(columns).filter(name => columns[name]).length;\n } else {\n columnLen = this.props.columns.filter(c => !c.hidden).length;\n }\n if (!includeSelectColumn) return columnLen;\n if (this.props.selectRow && !this.props.selectRow.hideSelectColumn) {\n columnLen += 1;\n }\n if (this.props.expandRow && this.props.expandRow.showExpandColumn) {\n columnLen += 1;\n }\n return columnLen;\n }\n };\n","/* eslint camelcase: 0 */\n/* eslint react/require-default-props: 0 */\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport Const from '../const';\n\nexport default (\n dataOperator,\n isRemoteSort,\n handleSortChange\n) => {\n const SortContext = React.createContext();\n\n class SortProvider extends React.Component {\n static propTypes = {\n data: PropTypes.array.isRequired,\n columns: PropTypes.array.isRequired,\n children: PropTypes.node.isRequired,\n defaultSorted: PropTypes.arrayOf(PropTypes.shape({\n dataField: PropTypes.string.isRequired,\n order: PropTypes.oneOf([Const.SORT_DESC, Const.SORT_ASC]).isRequired\n })),\n sort: PropTypes.shape({\n dataField: PropTypes.string,\n order: PropTypes.oneOf([Const.SORT_DESC, Const.SORT_ASC]),\n sortFunc: PropTypes.func\n }),\n defaultSortDirection: PropTypes.oneOf([Const.SORT_DESC, Const.SORT_ASC])\n }\n\n constructor(props) {\n super(props);\n let sortOrder;\n let sortColumn;\n const { defaultSorted, defaultSortDirection, sort } = props;\n\n if (defaultSorted && defaultSorted.length > 0) {\n sortOrder = defaultSorted[0].order || defaultSortDirection;\n sortColumn = this.initSort(defaultSorted[0].dataField, sortOrder);\n } else if (sort && sort.dataField && sort.order) {\n sortOrder = sort.order;\n sortColumn = this.initSort(sort.dataField, sortOrder);\n }\n this.state = { sortOrder, sortColumn };\n }\n\n componentDidMount() {\n const { sortOrder, sortColumn } = this.state;\n if (isRemoteSort() && sortOrder && sortColumn) {\n handleSortChange(sortColumn.dataField, sortOrder);\n }\n }\n\n UNSAFE_componentWillReceiveProps(nextProps) {\n const { sort, columns } = nextProps;\n if (sort && sort.dataField && sort.order) {\n this.setState({\n sortOrder: sort.order,\n sortColumn: columns.find(col => col.dataField === sort.dataField)\n });\n }\n }\n\n initSort(sortField, sortOrder) {\n let sortColumn;\n const { columns } = this.props;\n const sortColumns = columns.filter(col => col.dataField === sortField);\n if (sortColumns.length > 0) {\n sortColumn = sortColumns[0];\n\n if (sortColumn.onSort) {\n sortColumn.onSort(sortField, sortOrder);\n }\n }\n return sortColumn;\n }\n\n handleSort = (column) => {\n const sortOrder = dataOperator.nextOrder(column, this.state, this.props.defaultSortDirection);\n\n if (column.onSort) {\n column.onSort(column.dataField, sortOrder);\n }\n\n if (isRemoteSort()) {\n handleSortChange(column.dataField, sortOrder);\n }\n this.setState(() => ({\n sortOrder,\n sortColumn: column\n }));\n }\n\n render() {\n let { data } = this.props;\n const { sort } = this.props;\n const { sortOrder, sortColumn } = this.state;\n if (!isRemoteSort() && sortColumn) {\n const sortFunc = sortColumn.sortFunc ? sortColumn.sortFunc : (sort && sort.sortFunc);\n data = dataOperator.sort(data, sortOrder, { ...sortColumn, sortFunc });\n }\n\n return (\n \n
\n )\n}\n\n{\n /* \n \n \n
\n \n
\n \n \n 
{' '}\n \n \n Tell the story of the match differently\n \n
\n \n FOReCAST\n Tell the story of the match differently\n
*/\n}\n","export default {\n PAGINATION_SIZE: 5,\n PAGE_START_INDEX: 1,\n With_FIRST_AND_LAST: true,\n SHOW_ALL_PAGE_BTNS: false,\n SHOW_TOTAL: false,\n PAGINATION_TOTAL: null,\n FIRST_PAGE_TEXT: '<<',\n PRE_PAGE_TEXT: '<',\n NEXT_PAGE_TEXT: '>',\n LAST_PAGE_TEXT: '>>',\n NEXT_PAGE_TITLE: 'next page',\n LAST_PAGE_TITLE: 'last page',\n PRE_PAGE_TITLE: 'previous page',\n FIRST_PAGE_TITLE: 'first page',\n SIZE_PER_PAGE_LIST: [10, 25, 30, 50],\n HIDE_SIZE_PER_PAGE: false,\n HIDE_PAGE_LIST_ONLY_ONE_PAGE: false\n};\n","import Const from './const';\n\nconst getNormalizedPage = (\n page,\n pageStartIndex\n) => {\n const offset = Math.abs(1 - pageStartIndex);\n return page + offset;\n};\n\nconst endIndex = (\n page,\n sizePerPage,\n pageStartIndex\n) => (getNormalizedPage(page, pageStartIndex) * sizePerPage) - 1;\n\nconst startIndex = (\n end,\n sizePerPage,\n) => end - (sizePerPage - 1);\n\nexport const alignPage = (\n dataSize,\n prevDataSize,\n page,\n sizePerPage,\n pageStartIndex\n) => {\n if (prevDataSize < dataSize) return page;\n if (page < pageStartIndex) return pageStartIndex;\n if (dataSize <= 0) return pageStartIndex;\n if ((page >= (Math.floor(dataSize / sizePerPage) + pageStartIndex)) && pageStartIndex === 1) {\n return Math.ceil(dataSize / sizePerPage);\n }\n if (page >= Math.floor(dataSize / sizePerPage) && pageStartIndex === 0) {\n const newPage = Math.ceil(dataSize / sizePerPage);\n return newPage - Math.abs((Const.PAGE_START_INDEX - pageStartIndex));\n }\n return page;\n};\n\nexport const getByCurrPage = (\n data,\n page,\n sizePerPage,\n pageStartIndex\n) => {\n const dataSize = data.length;\n if (!dataSize) return [];\n\n const end = endIndex(page, sizePerPage, pageStartIndex);\n const start = startIndex(end, sizePerPage);\n\n const result = [];\n for (let i = start; i <= end; i += 1) {\n result.push(data[i]);\n if (i + 1 === dataSize) break;\n }\n return result;\n};\n","/* eslint react/prop-types: 0 */\n/* eslint react/require-default-props: 0 */\n/* eslint no-lonely-if: 0 */\n/* eslint camelcase: 0 */\nimport React from 'react';\nimport EventEmitter from 'events';\nimport Const from './const';\nimport { alignPage } from './page';\n\nconst StateContext = React.createContext();\n\nclass StateProvider extends React.Component {\n constructor(props) {\n super(props);\n this.handleChangePage = this.handleChangePage.bind(this);\n this.handleDataSizeChange = this.handleDataSizeChange.bind(this);\n this.handleChangeSizePerPage = this.handleChangeSizePerPage.bind(this);\n\n let currPage;\n let currSizePerPage;\n const { options } = props.pagination;\n const sizePerPageList = options.sizePerPageList || Const.SIZE_PER_PAGE_LIST;\n\n // initialize current page\n if (typeof options.page !== 'undefined') {\n currPage = options.page;\n } else if (typeof options.pageStartIndex !== 'undefined') {\n currPage = options.pageStartIndex;\n } else {\n currPage = Const.PAGE_START_INDEX;\n }\n\n // initialize current sizePerPage\n if (typeof options.sizePerPage !== 'undefined') {\n currSizePerPage = options.sizePerPage;\n } else if (typeof sizePerPageList[0] === 'object') {\n currSizePerPage = sizePerPageList[0].value;\n } else {\n currSizePerPage = sizePerPageList[0];\n }\n\n this.currPage = currPage;\n this.dataSize = options.totalSize;\n this.currSizePerPage = currSizePerPage;\n this.dataChangeListener = new EventEmitter();\n this.dataChangeListener.on('filterChanged', this.handleDataSizeChange);\n }\n\n getPaginationProps = () => {\n const { pagination: { options }, bootstrap4, tableId } = this.props;\n const { currPage, currSizePerPage, dataSize } = this;\n const withFirstAndLast = typeof options.withFirstAndLast === 'undefined' ?\n Const.With_FIRST_AND_LAST : options.withFirstAndLast;\n const alwaysShowAllBtns = typeof options.alwaysShowAllBtns === 'undefined' ?\n Const.SHOW_ALL_PAGE_BTNS : options.alwaysShowAllBtns;\n const hideSizePerPage = typeof options.hideSizePerPage === 'undefined' ?\n Const.HIDE_SIZE_PER_PAGE : options.hideSizePerPage;\n const hidePageListOnlyOnePage = typeof options.hidePageListOnlyOnePage === 'undefined' ?\n Const.HIDE_PAGE_LIST_ONLY_ONE_PAGE : options.hidePageListOnlyOnePage;\n const pageStartIndex = typeof options.pageStartIndex === 'undefined' ?\n Const.PAGE_START_INDEX : options.pageStartIndex;\n return {\n ...options,\n bootstrap4,\n tableId,\n page: currPage,\n sizePerPage: currSizePerPage,\n pageStartIndex,\n hidePageListOnlyOnePage,\n hideSizePerPage,\n alwaysShowAllBtns,\n withFirstAndLast,\n dataSize,\n sizePerPageList: options.sizePerPageList || Const.SIZE_PER_PAGE_LIST,\n paginationSize: options.paginationSize || Const.PAGINATION_SIZE,\n showTotal: options.showTotal,\n pageListRenderer: options.pageListRenderer,\n pageButtonRenderer: options.pageButtonRenderer,\n sizePerPageRenderer: options.sizePerPageRenderer,\n paginationTotalRenderer: options.paginationTotalRenderer,\n sizePerPageOptionRenderer: options.sizePerPageOptionRenderer,\n firstPageText: options.firstPageText || Const.FIRST_PAGE_TEXT,\n prePageText: options.prePageText || Const.PRE_PAGE_TEXT,\n nextPageText: options.nextPageText || Const.NEXT_PAGE_TEXT,\n lastPageText: options.lastPageText || Const.LAST_PAGE_TEXT,\n prePageTitle: options.prePageTitle || Const.PRE_PAGE_TITLE,\n nextPageTitle: options.nextPageTitle || Const.NEXT_PAGE_TITLE,\n firstPageTitle: options.firstPageTitle || Const.FIRST_PAGE_TITLE,\n lastPageTitle: options.lastPageTitle || Const.LAST_PAGE_TITLE,\n onPageChange: this.handleChangePage,\n onSizePerPageChange: this.handleChangeSizePerPage\n };\n }\n\n setPaginationRemoteEmitter = (remoteEmitter) => {\n this.remoteEmitter = remoteEmitter;\n }\n\n getPaginationRemoteEmitter = () => this.remoteEmitter || this.props.remoteEmitter;\n\n UNSAFE_componentWillReceiveProps(nextProps) {\n const { custom } = nextProps.pagination.options;\n\n // user should align the page when the page is not fit to the data size when remote enable\n if (this.isRemotePagination() || custom) {\n if (typeof nextProps.pagination.options.page !== 'undefined') {\n this.currPage = nextProps.pagination.options.page;\n }\n if (typeof nextProps.pagination.options.sizePerPage !== 'undefined') {\n this.currSizePerPage = nextProps.pagination.options.sizePerPage;\n }\n if (typeof nextProps.pagination.options.totalSize !== 'undefined') {\n this.dataSize = nextProps.pagination.options.totalSize;\n }\n }\n }\n\n isRemotePagination = () => {\n const e = {};\n this.remoteEmitter.emit('isRemotePagination', e);\n return e.result;\n };\n\n handleDataSizeChange(newDataSize) {\n const { pagination: { options } } = this.props;\n const pageStartIndex = typeof options.pageStartIndex === 'undefined' ?\n Const.PAGE_START_INDEX : options.pageStartIndex;\n this.currPage = alignPage(\n newDataSize,\n this.dataSize,\n this.currPage,\n this.currSizePerPage,\n pageStartIndex\n );\n this.dataSize = newDataSize;\n this.forceUpdate();\n }\n\n handleChangePage(currPage) {\n const { currSizePerPage } = this;\n const { pagination: { options } } = this.props;\n\n if (options.onPageChange) {\n options.onPageChange(currPage, currSizePerPage);\n }\n\n this.currPage = currPage;\n\n if (this.isRemotePagination()) {\n this.getPaginationRemoteEmitter().emit('paginationChange', currPage, currSizePerPage);\n return;\n }\n this.forceUpdate();\n }\n\n handleChangeSizePerPage(currSizePerPage, currPage) {\n const { pagination: { options } } = this.props;\n\n if (options.onSizePerPageChange) {\n options.onSizePerPageChange(currSizePerPage, currPage);\n }\n\n this.currPage = currPage;\n this.currSizePerPage = currSizePerPage;\n\n if (this.isRemotePagination()) {\n this.getPaginationRemoteEmitter().emit('paginationChange', currPage, currSizePerPage);\n return;\n }\n this.forceUpdate();\n }\n\n render() {\n const paginationProps = this.getPaginationProps();\n const pagination = {\n ...this.props.pagination,\n options: paginationProps\n };\n\n return (\n - \n {\n props.pages.map((pageProps) => {\n if (props.pageButtonRenderer) {\n return props.pageButtonRenderer({\n ...pageProps,\n onPageChange: props.onPageChange\n });\n }\n return (\n
\n
\n );\n }\n}\n\nPagination.propTypes = {\n dataSize: PropTypes.number.isRequired,\n sizePerPageList: PropTypes.array.isRequired,\n currPage: PropTypes.number.isRequired,\n currSizePerPage: PropTypes.number.isRequired,\n onPageChange: PropTypes.func.isRequired,\n onSizePerPageChange: PropTypes.func.isRequired,\n disablePageTitle: PropTypes.bool,\n pageStartIndex: PropTypes.number,\n paginationSize: PropTypes.number,\n showTotal: PropTypes.bool,\n pageListRenderer: PropTypes.func,\n pageButtonRenderer: PropTypes.func,\n sizePerPageRenderer: PropTypes.func,\n paginationTotalRenderer: PropTypes.func,\n sizePerPageOptionRenderer: PropTypes.func,\n firstPageText: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n prePageText: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n nextPageText: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n lastPageText: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n nextPageTitle: PropTypes.string,\n prePageTitle: PropTypes.string,\n firstPageTitle: PropTypes.string,\n lastPageTitle: PropTypes.string,\n withFirstAndLast: PropTypes.bool,\n alwaysShowAllBtns: PropTypes.bool,\n hideSizePerPage: PropTypes.bool,\n hidePageListOnlyOnePage: PropTypes.bool,\n bootstrap4: PropTypes.bool\n};\n\nPagination.defaultProps = {\n disablePageTitle: false,\n bootstrap4: false,\n pageStartIndex: Const.PAGE_START_INDEX,\n paginationSize: Const.PAGINATION_SIZE,\n withFirstAndLast: Const.With_FIRST_AND_LAST,\n alwaysShowAllBtns: Const.SHOW_ALL_PAGE_BTNS,\n showTotal: Const.SHOW_TOTAL,\n pageListRenderer: null,\n pageButtonRenderer: null,\n sizePerPageRenderer: null,\n paginationTotalRenderer: Const.PAGINATION_TOTAL,\n sizePerPageOptionRenderer: null,\n firstPageText: Const.FIRST_PAGE_TEXT,\n prePageText: Const.PRE_PAGE_TEXT,\n nextPageText: Const.NEXT_PAGE_TEXT,\n lastPageText: Const.LAST_PAGE_TEXT,\n sizePerPageList: Const.SIZE_PER_PAGE_LIST,\n nextPageTitle: Const.NEXT_PAGE_TITLE,\n prePageTitle: Const.PRE_PAGE_TITLE,\n firstPageTitle: Const.FIRST_PAGE_TITLE,\n lastPageTitle: Const.LAST_PAGE_TITLE,\n hideSizePerPage: Const.HIDE_SIZE_PER_PAGE,\n hidePageListOnlyOnePage: Const.HIDE_PAGE_LIST_ONLY_ONE_PAGE\n};\n\nexport default paginationHandler(Pagination);\n","/* eslint react/prop-types: 0 */\n/* eslint react/require-default-props: 0 */\n/* eslint no-lonely-if: 0 */\nimport React from 'react';\nimport PropTypes from 'prop-types';\n\nimport Const from './const';\nimport Pagination from './pagination';\nimport { getByCurrPage, alignPage } from './page';\nimport createBaseContext from './state-context';\n\nconst { Provider } = createBaseContext();\n\nconst PaginationDataContext = React.createContext();\n\nclass PaginationDataProvider extends Provider {\n static propTypes = {\n data: PropTypes.array.isRequired,\n remoteEmitter: PropTypes.object.isRequired,\n isRemotePagination: PropTypes.func.isRequired\n }\n\n // eslint-disable-next-line camelcase, react/sort-comp\n UNSAFE_componentWillReceiveProps(nextProps) {\n super.UNSAFE_componentWillReceiveProps(nextProps);\n const { currSizePerPage } = this;\n const { custom, onPageChange } = nextProps.pagination.options;\n\n const pageStartIndex = typeof nextProps.pagination.options.pageStartIndex !== 'undefined' ?\n nextProps.pagination.options.pageStartIndex : Const.PAGE_START_INDEX;\n\n // user should align the page when the page is not fit to the data size when remote enable\n if (!this.isRemotePagination() && !custom) {\n const newPage = alignPage(\n nextProps.data.length,\n this.props.data.length,\n this.currPage,\n currSizePerPage,\n pageStartIndex\n );\n\n if (this.currPage !== newPage) {\n if (onPageChange) {\n onPageChange(newPage, currSizePerPage);\n }\n this.currPage = newPage;\n }\n }\n if (nextProps.onDataSizeChange && nextProps.data.length !== this.props.data.length) {\n nextProps.onDataSizeChange({ dataSize: nextProps.data.length });\n }\n }\n\n isRemotePagination = () => this.props.isRemotePagination();\n\n renderDefaultPagination = () => {\n if (!this.props.pagination.options.custom) {\n const {\n page: currPage,\n sizePerPage: currSizePerPage,\n dataSize,\n ...rest\n } = this.getPaginationProps();\n return (\n \n
\n {\n pageListRenderer ? pageListRenderer({\n pages,\n onPageChange\n }) : (\n \n
\n )\n }\n {cell.toUpperCase()}
\n ),\n },\n ];\n this.columns = [...this.defaultcols];\n this.state = {\n checkTeamName: false,\n selected_matchids: null,\n selected_teamid: null,\n matches: [],\n page: 1,\n sizePerPage: 20,\n sizePerPageList: SizePerPageList,\n };\n }\n\n\n componentDidMount() {\n\n // this.fetchData();\n let retrievedObject = localStorage.getItem('matches_filter');\n\n if(retrievedObject != null) {\n var match_filter = JSON.parse(retrievedObject);\n for(var i = 0; i < this.columns.length; i++) {\n\n if (this.columns[i].dataField == 'start_date' ) {\n this.columns[i].filter.props.defaultValue = {\n date: new Date(match_filter.start_date),\n comparator: Comparator.GT,\n };\n\n }\n if (this.columns[i].dataField == 'series.series_name') {\n this.columns[i].filter.props.defaultValue = match_filter.series_name;\n\n }\n if (this.columns[i].dataField == 'url' ) {\n this.columns[i].filter.props.defaultValue = match_filter.match_id;\n\n }\n }\n\n this.fetchData(\n this.state.page,\n this.state.sizePerPage,\n match_filter.match_id,\n match_filter.start_date,\n match_filter.series_name,\n match_filter.result_id);\n }\n else {\n this.fetchData();\n }\n\n }\n handleFilterResult(e) {\n\n this.selectedItem = e;\n this.result_ids = e.url;\n this.current_filter = {};\n this.columns = [\n {\n dataField: 'url',\n text: 'Match ID',\n sort: true,\n filter: textFilter({\n delay: 1000,\n }),\n formatter: (cell, row) => (\n {this.urlarg(cell)} \n ),\n },\n {\n dataField: 'team1_id.team_name',\n text: 'Team',\n sort: true,\n formatter: (cell) => cell,\n filter: textFilter({\n delay: 3000\n })\n },\n {\n dataField: 'team2_id.team_name',\n },\n {\n formatter: (cell) => this.fortmatDate(cell),\n dataField: 'start_date',\n text: 'Start Date',\n sort: true,\n filter: dateFilter(),\n },\n {\n dataField: 'series.series_name',\n text: 'Series Name',\n filter: textFilter(),\n sort: true,\n },\n {\n dataField: 'venue_id.ground_name',\n text: 'Ground Name',\n sort: true,\n },\n {\n dataField: 'winner_team_id.team_name',\n text: 'Winner Team',\n sort: true,\n },\n ];\n this.fetchData(this.state.page,this.state.sizePerPage,\n null, null, null, null,this.result_ids, null\n );\n\n }\n async fetchData(\n page = this.state.page,\n pageSize = this.state.sizePerPage,\n matchId = null,\n startDate = null,\n seriesName = null,\n result_id = null,\n team_name = null\n ) {\n let response = await getMatches(\n page,\n pageSize,\n matchId,\n startDate,\n seriesName,\n result_id,\n team_name\n );\n const filter = JSON.stringify({match_id: matchId, start_date: startDate, series_name: seriesName});\n if (matchId != null || startDate != null || seriesName != null) {\n localStorage.setItem(\"matches_filter\", filter);\n }else {\n localStorage.removeItem(\"matches_filter\");\n }\n\n\n this.setState({\n checkTeamName: false,\n totalSize: response.data.count,\n matches: response.data.results,\n page: page,\n sizePerPage: pageSize,\n });\n }\n fortmatDate = (date) => {\n const objMoment = moment(date).utc();\n return objMoment.format('MMM Do YYYY, h:mm A'); // \"Sunday, February 14th 2010, 3:25:50 pm\"\n };\n shouldComponentUpdate(nextProps, nextState, nextContext) {\n const cols = [...this.columns];\n let tempCols = [];\n for (let i = 0; i < cols.length; i++) {\n let col = cols[i];\n if (col.dataField) {\n if (col.dataField in this.current_filter) {\n if (this.current_filter[col.dataField].filterType === 'DATE') {\n col.filter.props.defaultValue = {\n date: new Date(this.current_filter[col.dataField].filterVal),\n comparator: Comparator.GT,\n };\n } else {\n col.filter.props.defaultValue = this.current_filter[\n col.dataField\n ].filterVal;\n }\n }\n }\n tempCols.push(col);\n }\n this.columns = tempCols;\n return true;\n }\n\n handleTableChange = async (\n type,\n {\n page,\n sizePerPage,\n filters,\n sortField,\n sortOrder,\n cellEdit,\n sizePerPageList,\n }\n ) => {\n this.current_filter = filters;\n let matchId = '';\n let team_name = '';\n let startDate = '';\n let seriesName = '';\n \n if (filters['team1_id.team_name']) {\n team_name = filters['team1_id.team_name'].filterVal; \n\n } else {\n team_name = '';\n }\n\n if (filters.url) {\n matchId = filters.url.filterVal;\n } else {\n matchId = this.columns[0].filter.props.defaultValue || null;\n }\n \n if (filters.start_date) {\n startDate = filters.start_date.filterVal;\n } else {\n if (this.columns[3].filter.props.defaultValue) {\n startDate = moment(\n this.columns[3].filter.props.defaultValue.date\n ).format('YYYY-MM-DDTh:mm:ss');\n } else {\n startDate = null;\n }\n }\n if (filters['series.series_name']) {\n seriesName = filters['series.series_name'].filterVal;\n } else {\n seriesName = this.columns[4].filter.props.defaultValue || null;\n }\n\n this.fetchData(page, sizePerPage, matchId, startDate, seriesName, this.result_ids, team_name);\n };\n\n getMatchID = (match_id) => {\n var id = match_id.split('/');\n var len = id.length;\n return '/matchinfo/' + id[len - 2];\n };\n urlarg(id) {\n var url = id.split('/');\n var argcheck = url[url.length - 2];\n\n return argcheck;\n }\n getTeam1List = async() => {\n var tempteamdict = { 0: 'All' };\n\n const response = await httpClient.get(process.env.REACT_APP_API_ENDPOINT + '/api/teams/?page_size=1000');\n const results = response.data.results ;\n for(var i = 0 ; i < results.length; i++) {\n const url = this.urlarg(results[i].url);\n tempteamdict[this.urlarg(results[i].url)] = results[i].team_name;\n }\n return tempteamdict;\n };\n\n resetFilter = () => {\n localStorage.removeItem(\"matches_filter\");\n this.current_filter = {};\n for(var i = 0; i < this.columns.length; i++) {\n if(this.columns[i].filter != null) {\n this.columns[i].filter.props.defaultValue = null;\n }\n }\n this.fetchData();\n }\n\n render() {\n const RemotePagination = ({\n data,\n page,\n sizePerPage,\n onTableChange,\n totalSize,\n sizePerPageList,\n }) => (\n\n {\n if(row.provider_id.provider_name == 'espncricinfo') {\n return null;\n }else if(row.provider_id.provider_name == 'cricbuzz') {\n return { backgroundColor: \"blanchedalmond\" }\n }else {\n return { backgroundColor: \"rgb(209,76,112\t)\" }\n }\n \n \n } }\n />\n
\n );\n const listResults = this.results.map((item) => (\n // eslint-disable-next-line jsx-a11y/anchor-is-valid\n \n \n
\n );\n }\n}\n\nexport default Matches;\n","//@format\nimport React, { useState, useEffect } from 'react';\n\nimport httpClient from \"../api/httpClient\";\n\n\nexport default function VideoEventMapping(props) {\n const [clips, setClips] = useState([]);\n const [image, setImage] = useState(null);\n const [camera, setCamera] = useState(1);\n var match_id = props.match.params.matchid;\n\n useEffect(() => {\n fetchClips(match_id);\n }, []);\n\n\n async function fetchClips(match_id) {\n try {\n const clips = await httpClient.get(`http://tvc.theworkpc.com:8000/api/validation/delivery-list-db/${match_id}`);\n setClips(clips.data.map(item => {\n item.isSelected = false;\n return item;\n }));\n } catch {\n console.log('Error : fetchClips');\n }\n }\n\n async function fetchImages(match_id, clip, framepos = null, camera = 0) {\n const frame_start = clip.start_frame;\n const frame_end = clip.end_frame;\n\n try {\n const res = await httpClient.get(`http://tvc.theworkpc.com:8000/api/validation/delivery-frame-validation/${match_id}/${frame_start}/${frame_end}/${framepos}/${camera}/`);\n let image = res.data;\n image.clip = clip;\n setImage(res.data);\n } catch {\n console.log('Error : fetchImages');\n alert(\"Services Error\");\n }\n }\n\n const onSelectClip = e => {\n const buttonValue = e.target.value;\n const _clips = clips.map(item => {\n item.isSelected = item.clip == buttonValue ? true : false;\n return item;\n });\n setClips(_clips);\n const cl = clips[buttonValue - 1];\n fetchImages(match_id, cl, cl.start_frame, camera);\n }\n const onClickNextFrame = () => {\n const nextFrame = image.frame_num + 1;\n if (nextFrame > image.clip.end_frame) {\n return;\n }\n fetchImages(match_id, image.clip, nextFrame, camera);\n }\n const onClickPreviousFrame = () => {\n const preFrame = image.frame_num - 1;\n if (preFrame < image.clip.start_frame) {\n return;\n }\n fetchImages(match_id, image.clip, preFrame, camera);\n }\n\n\n const onDelete = async (clip) => {\n const frame_start = clip.start_frame;\n const frame_end = clip.end_frame;\n const body = {\n 'frame_start': frame_start,\n 'frame_end': frame_end,\n }\n\n\n try {\n let res = await httpClient.post(`/api/validation/delete_event/${match_id}`, body);\n if (res.data == 'Success') {\n\n alert(\"Success\");\n }\n } catch {\n alert(\"Error. Delete not success\");\n }\n }\n\n const getbalanceClass = (clip) => {\n if (clip.batter_balance) {\n return \"\"\n }\n return \"text-white bg-secondary\"\n }\n\n const onSave = async (clip) => {\n const frame_start = clip.start_frame;\n const frame_end = clip.end_frame;\n const inning = clip.inning;\n const over = clip.over;\n const ball = clip.ball;\n const batter_event_id = clip.batter_event_id;\n const batter_balance = clip.batter_balance;\n\n const body = {\n 'frame_start': frame_start,\n 'frame_end': frame_end,\n 'inning': inning,\n 'over': over,\n 'ball': ball,\n 'batter_event_id': batter_event_id,\n 'batter_balance': batter_balance\n }\n try {\n let res = await httpClient.post(`/api/validation/add-update-event/${match_id}`, body);\n if (res.data == 'Success') {\n fetchClips(match_id);\n alert(\"Success\");\n }\n } catch {\n alert(\"Event not create or update.\");\n }\n }\n\n\n const onSetCamera = (camera) => {\n\n }\n const getRowClass = (clip) => {\n if(clip.isSelected) {\n return \"bg-info\";\n }\n if(clip.manual_update) {\n return \"bg-success\"\n }\n return \"\"\n }\n const getBroadcast = async (clip, e) => {\n if (e.key !== 'Enter') {\n return ;\n }\n const frame_start = clip.start_frame;\n const frame_end = clip.end_frame;\n\n try {\n const res = await httpClient.get(`http://tvc.theworkpc.com:8000/api/validation/delivery-frame-broadcast/${match_id}/${frame_start}/${frame_end}/${clip.board_castnum}/${camera}/`);\n // let broadcast_encoded_string = res.data.broadcast_encoded_string;\n // let clip = image.clip;\n // setImage(image.clip);\n let img = {...image};\n img.broadcast_encoded_string = res.data.broadcast_encoded_string;\n \n setImage(img);\n\n } catch {\n console.log('Error : fetchImages');\n alert(\"Services Error\");\n }\n }\n\n return (\n \n
\n \n Cricket Matches\n
\n\n \n {this.selectedItem.result_type.replace(/\\b\\w/g, (l) => l.toUpperCase()) }\n \n \n \n \n
\n \n\n \n
\n );\n}","import React, { Component } from 'react';\nimport { Scatter } from 'react-chartjs-2';\nimport {getTeamLogo} from '../../config/utils'\n\n\nimport { default_team1_color } from '../../config/constant';\nimport { default_team2_color } from '../../config/constant';\nimport httpClient from '../../api/httpClient';\n\nconst options = {\n responsive: true,\n aspectRatio: 1,\n showLines: true,\n spanGaps: true,\n scales: {\n xAxes: [\n {\n display: true,\n type: 'linear',\n position: 'bottom',\n gridLines: {\n color: 'rgba(0, 0, 0, 0)',\n },\n },\n ],\n yAxes: [\n {\n display: true,\n type: 'linear',\n position: 'bottom',\n gridLines: {\n color: 'rgba(0, 0, 0, 0)',\n },\n },\n ],\n },\n tooltips: {\n callbacks: {\n label: function (tooltipItem, data) {\n if (data.datasets[tooltipItem.datasetIndex].labels)\n return (\n 'Wicket: ' +\n data.datasets[tooltipItem.datasetIndex].labels[tooltipItem.index] +\n ' (' +\n 'Ball: ' +\n tooltipItem.xLabel +\n ')'\n );\n else if (tooltipItem.datasetIndex == 2)\n return (\n 'Ball: ' +\n tooltipItem.xLabel +\n ', Draw prob: ' +\n tooltipItem.yLabel +\n '%'\n );\n else\n return (\n 'Ball: ' +\n tooltipItem.xLabel +\n ', Win prob: ' +\n tooltipItem.yLabel +\n '%'\n );\n },\n },\n },\n legend: {\n labels: {\n filter: function (legendItem, chartData) {\n return (\n legendItem.text != ['Inning 1'] && legendItem.text != ['Inning 2']\n );\n },\n },\n },\n};\n\nconst teamFlag = {\n 185: 'pt.svg',\n 18: 'gi.svg',\n 3770: 'bb.svg',\n 40: 'af.svg',\n 45: 'mt.svg',\n 42: 'be.svg',\n 126: 'cz.svg',\n 161: 'lu.svg',\n 164: 'mv.svg',\n 207: 'th.svg',\n 108: 'bh.svg',\n 27: 'ae.svg',\n 15: 'nl.svg',\n 20: 'pg.svg',\n 21: 'ar.svg',\n 117: 'br.svg',\n 44: 'cl.svg',\n 139: 'hu.svg',\n 150: 'is.svg',\n 3793: 'gy.svg',\n 3802: 'jm.svg',\n 112: 'bt.svg',\n 28: 'na.svg',\n 5: 'nz.svg',\n 200: 'es.svg',\n 1094: 'gg.svg',\n 175: 'no.svg',\n 9: 'zw.svg',\n 31: 'it.svg',\n 19: 'hk.svg',\n 4083: 'je.svg',\n 16: 'my.svg',\n 26: 'ke.svg',\n 34: 'ug.svg',\n 178: 'pe.svg',\n 12: 'bm.svg',\n 188: 'ro.svg',\n 179: 'ph.svg',\n 17: 'ca.svg',\n 32: 'np.svg',\n 25: 'bd.svg',\n 13: 'dk.svg',\n 209: 'tr.svg',\n 35: 'de.svg',\n 41: 'at.svg',\n 115: 'bz.svg',\n 4082: 'cr.svg',\n 183: 'pa.svg',\n 135: 'gh.svg',\n 173: 'ng.svg',\n 192: 'ws.svg',\n 116: 'bw.svg',\n 191: 'rw.svg',\n 7: 'pk.svg',\n 142: 'id.svg',\n 39: 'ky.svg',\n 216: 'vu.svg',\n 172: 'nc.svg',\n 10: 'fj.svg',\n 36: 'jp.svg',\n 165: 'mx.svg',\n 29: 'ie.svg',\n 30: 'gb-sct.svg',\n 3: 'za.svg',\n 8: 'lk.svg',\n 2: 'au.svg',\n 6: 'in.svg',\n 1: 'gb-eng.svg',\n 23: 'sg.svg',\n 37: 'om.svg',\n 187: 'qa.svg',\n 154: 'sa.svg',\n 38: 'kw.svg',\n};\n\nexport default class Winlossplot extends Component {\n constructor(props) {\n super(props);\n this.state = {\n matchName: null,\n battingTeamID: null,\n team1name: null,\n team2name: null,\n team1colour: null,\n team2colour: null,\n team1winprob: [],\n team2winprob: [],\n drawprob: [],\n ballnumber: [],\n innings1: [],\n innings2: [],\n wicketPoints: [],\n wicketLabels: [],\n imageUrl: [],\n format: \"\",\n };\n }\n\n componentDidMount() {\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n this.fetchData();\n setInterval(() => {\n this.fetchData();\n }, 10000);\n\n }\n\n \n \n fetchData() {\n \n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n let temp1prob = [];\n let temp2prob = [];\n let tempdrawprob = [];\n let lastInn1Ball = [];\n let lastInn2Ball = [];\n let tempWicketPts = [];\n let tempWicketLabels = [];\n \n \n fetch(\n process.env.REACT_APP_API_ENDPOINT + '/api/predictions/runs/' + matchId\n )\n .then((res) => res.json())\n .then((out) => {\n \n \n this.setState({\n \n matchName: out.gameState.matchName,\n battingTeamID: out.gameState.battingTeamId,\n format: out.gameState.format,\n });\n })\n .catch((err) => {\n throw err;\n });\n\n fetch(\n process.env.REACT_APP_API_ENDPOINT +\n '/api/predictions/plots/result/' +\n matchId\n )\n .then((res) => res.json())\n .then((out) => {\n \n for (let i = 0; i < Object.keys(out.predictionsPerInning).length; i++) {\n lastInn1Ball =\n out.predictionsPerInning[0].ballNumber[\n Object.keys(out.predictionsPerInning[0].ballNumber).length - 1\n ];\n lastInn2Ball =\n out.predictionsPerInning[i].ballNumber[\n Object.keys(out.predictionsPerInning[i].ballNumber).length - 1\n ];\n for (\n let j = 0;\n j < Object.keys(out.predictionsPerInning[i].ballNumber).length;\n j++\n ) {\n temp1prob.push({\n x: out.predictionsPerInning[i].ballNumber[j],\n y: out.predictionsPerInning[i].winProbs.team1WinProb[j],\n });\n temp2prob.push({\n x: out.predictionsPerInning[i].ballNumber[j],\n y: out.predictionsPerInning[i].winProbs.team2WinProb[j],\n });\n tempdrawprob.push({\n x: out.predictionsPerInning[i].ballNumber[j],\n y: out.predictionsPerInning[i].winProbs.drawProb[j],\n });\n }\n }\n for (let i = 0; i < Object.keys(out.wickets).length; i++) {\n tempWicketPts.push({ x: out.wickets[i].ballNumber, y: 50 });\n tempWicketLabels.push(\n out.wickets[i].playerOut + ' | ' + out.wickets[i].wicketKind\n );\n }\n \n let team1Color = out.team1Color ? out.team1Color : default_team1_color;\n let team2Color = out.team2Color ? out.team2Color : default_team2_color;\n \n this.setState({\n team1colour: team1Color,\n team2colour: team2Color,\n team1winprob: temp1prob,\n team2winprob: temp2prob,\n drawprob: tempdrawprob,\n team1name: out.team1Name,\n team2name: out.team2Name,\n innings1: [\n { x: lastInn1Ball, y: 0 },\n { x: lastInn1Ball, y: 100 },\n ],\n innings2: [\n { x: lastInn2Ball, y: 0 },\n { x: lastInn2Ball, y: 100 },\n ],\n wicketPoints: tempWicketPts,\n wicketLabels: tempWicketLabels,\n });\n })\n .catch((err) => {\n throw err;\n });\n }\n\n render() {\n return (\n \n
\n \n \n \n \n
\n
\n\n | Clip | \nStartFrame | \nEndFrame | \nInning | \nOver | \nBall | \n\n | \n | |
|---|---|---|---|---|---|---|---|---|
| \n | {clip.start_frame} | \n{clip.end_frame} | \nclip.inning = e.target.value} type=\"number\"/> | \nclip.over = e.target.value} type=\"number\"/> | \nclip.ball = e.target.value} type=\"number\"/> | \n\n {clip.isSelected && (\n {\n const _clips = clips.map(item => {\n if(item.clip == clip.clip){\n item.batter_balance = !item.batter_balance;\n }\n return item;\n });\n setClips(_clips);\n\n }} type=\"button\" value=\"Balance\"/>)\n }\n | \n\n {clip.isSelected && (\n onSave(clip)} type=\"button\" value=\"Save\"/>)\n }\n | \n\n {clip.isSelected && (\n onDelete(clip)} type=\"button\" value=\"Delete\"/>)\n }\n | \n
\n
\n \n
\n \n \n \n Camera \n \n
\n {image != null && (\n \n 
\n \n \n
\n ) }\n Clip: {image.clip.clip}
\n \n \n\n
\n \n
\n \n FrameNum: {image.frame_num}\n
\n \n \n \n
\n \n \n image.clip.board_castnum = e.target.value} onKeyDown={e => getBroadcast(image.clip, e)} type=\"text\"/>\n
\n Broadcast
\nClip
\nBatting Clip
\n\n
\n );\n }\n}\n","import httpClient from './httpClient';\n\nconst GET_TEAM_BOWLING = '/api/stats/teams/teams-bowling';\nconst GET_TEAM_BATTING = '/api/stats/teams/teams-batting';\nconst GET_INNING_ECONRATE = '/api/stats/innings/innings-econrate';\nconst GET_INNING_WICKETS = '/api/stats/innings/innings-wickets';\n\nconst GET_INNING_RUNRATE = '/api/stats/innings/innings-runrate';\nconst GET_INNING_BOUNDARIES = '/api/stats/innings/innings-boundaries';\nconst GET_INNING_DOTBALL = '/api/stats/innings/innings-dotballs';\nconst GET_INNING_player_RUN_DISTRIBUTION =\n '/api/stats/innings/player-run-distribution';\nconst GET_LINEUP_SUMMARY = '/api/stats/lineup/lineup-summary';\nconst GET_BEST_PARTNERSHIP_LEAGUE =\n '/api/stats/partnerships/best-partnership-league';\nconst GET_BEST_PARTNERSHIP_MATCH =\n '/api/stats/partnerships/best-partnership-match';\nconst GET_RUN_RATE = '/api/stats/graph/run-rate';\nconst GET_INNING_DETAILS = '/api/stats/match/match-inning-details';\nconst GET_LAST_BALL_DETAILS = '/api/stats/match/match-last-ball-details';\nconst GET_LEAGUE_RESULT_SUMMARY = '/api/stats/league/league-results-summary';\nconst GET_MOST_WICKET_TAKERS = '/api/stats/wickettakers/most-wicket-takers-league';\nconst GET_TEAM_MATCH_NUMBER = '/api/stats/team/team-matches-number';\n\nconst GET_TEAM_LOSSWIN_BY_SEASON = '/api/stats/team/team-margin-losswin-by-season-series';\n\nconst GET_PLAYER_BOWLING_INDICATORS = '/api/stats/players/player-bowling-indicators';\nconst GET_PLAYER_BATTING_INDICATORS = '/api/stats/players/player-batting-indicators';\n\n\nconst GET_MATCH_REGULAR_STATS = '/api/stats/match/match-regular-stats';\n\n\nconst getTeamsBowling = (matchId) => {\n return httpClient.get(GET_TEAM_BOWLING, {\n params: {\n match_id: matchId,\n },\n });\n};\nconst getTeamsBatting = (matchId) => {\n return httpClient.get(GET_TEAM_BATTING, {\n params: {\n match_id: matchId,\n },\n });\n};\n\nconst getInningEconrate = (matchId) => {\n return httpClient.get(GET_INNING_ECONRATE, {\n params: {\n match_id: matchId,\n },\n });\n};\nconst getInningWickets = (matchId) => {\n return httpClient.get(GET_INNING_WICKETS, {\n params: {\n match_id: matchId,\n },\n });\n};\nconst getInningRunrate = (matchId) => {\n return httpClient.get(GET_INNING_RUNRATE, {\n params: {\n match_id: matchId,\n },\n });\n};\n\nconst getInningboundaries = (matchId) => {\n return httpClient.get(GET_INNING_BOUNDARIES, {\n params: {\n match_id: matchId,\n },\n });\n};\nconst getInningDotballs = (matchId) => {\n return httpClient.get(GET_INNING_DOTBALL, {\n params: {\n match_id: matchId,\n },\n });\n};\nconst getInningPlayerRunDistribution = (matchId) => {\n return httpClient.get(GET_INNING_player_RUN_DISTRIBUTION, {\n params: {\n match_id: matchId,\n },\n });\n};\n\nconst getLineupSummary = (matchId) => {\n return httpClient.get(GET_LINEUP_SUMMARY, {\n params: {\n match_id: matchId,\n },\n });\n};\n\nconst getBestPartnershipLeague = (series_id) => {\n return httpClient.get(GET_BEST_PARTNERSHIP_LEAGUE, {\n params: {\n series_id: series_id,\n page_size: 10\n },\n });\n};\n\nconst getBestPartnershipMatch = (matchId) => {\n return httpClient.get(GET_BEST_PARTNERSHIP_MATCH, {\n params: {\n match_id: matchId,\n },\n });\n};\n\nconst getRunRate = (matchId) => {\n return httpClient.get(GET_RUN_RATE, {\n params: {\n match_id: matchId,\n },\n });\n};\n\nconst getMatchInningDetail = (matchId) => {\n return httpClient.get(GET_INNING_DETAILS, {\n params: {\n match_id: matchId,\n },\n });\n};\n\nconst getLastBallDetails = (matchId) => {\n return httpClient.get(GET_LAST_BALL_DETAILS, {\n params: {\n match_id: matchId,\n },\n });\n};\n\nconst getLeagueResultSummary = (seriesId) => {\n return httpClient.get(GET_LEAGUE_RESULT_SUMMARY, {\n params: {\n series_id: seriesId,\n },\n });\n};\n\nconst getMostWicketTaker = (seriesId) => {\n return httpClient.get(GET_MOST_WICKET_TAKERS, {\n params: {\n series_id: seriesId,\n },\n });\n};\n\nconst getTeamMatchNumber = (teamId) => {\n return httpClient.get(GET_TEAM_MATCH_NUMBER, {\n params: {\n team_id: teamId,\n },\n });\n};\n\nconst getTeamLossWinBySeason = (teamId) => {\n return httpClient.get(GET_TEAM_LOSSWIN_BY_SEASON, {\n params: {\n team_id: teamId,\n },\n });\n};\n\nconst getPLayerBowlingIndicator = (teamId) => {\n return httpClient.get(GET_PLAYER_BOWLING_INDICATORS, {\n params: {\n team_id: teamId,\n page_size: 10\n },\n });\n};\n\nconst getPLayerBattingIndicator = (teamId) => {\n return httpClient.get(GET_PLAYER_BATTING_INDICATORS, {\n params: {\n team_id: teamId,\n page_size: 10\n },\n });\n};\n\nconst getMatchRegularStats = (matchId) => {\n return httpClient.get(GET_MATCH_REGULAR_STATS, {\n params: {\n match_id: matchId\n },\n });\n};\n\n\nexport {\n getTeamsBowling,\n getTeamsBatting,\n getInningEconrate,\n getInningWickets,\n getInningRunrate,\n getInningboundaries,\n getInningDotballs,\n getInningPlayerRunDistribution,\n getLineupSummary,\n getBestPartnershipLeague,\n getBestPartnershipMatch,\n getRunRate,\n getMatchInningDetail,\n getLastBallDetails,\n getLeagueResultSummary,\n getMostWicketTaker,\n getTeamMatchNumber,\n getTeamLossWinBySeason,\n getPLayerBowlingIndicator,\n getPLayerBattingIndicator,\n getMatchRegularStats\n};\n","import React, { Component } from \"react\";\nimport { Line } from \"react-chartjs-2\";\nimport $ from \"jquery\";\nimport {getRunRate} from '../../api/stats.api';\nimport { getMatch } from \"../../api/match.api\";\nasync function fetchPages(url, page_num, max_pages = 10000, acc) {\n let page = await fetch(url + \"\" + page_num).then((response) =>\n response.json()\n );\n if (page.next == null || page_num >= max_pages) {\n return acc.concat(page.results);\n } else {\n return await fetchPages(\n url,\n page_num + 1,\n max_pages,\n acc.concat(page.results)\n );\n }\n}\n\nvar matchId = \"1173064\";\nconst colour = [\n { teamName: \"WestIndies\", teamid: 4, code: \"#6e0237\" },\n { teamName: \"Pakistan\", teamid: 7, code: \"#00563b\" },\n { teamName: \"Afghanistan\", teamid: 40, code: \"#0033ee\" },\n { teamName: \"Bangladesh\", teamid: 25, code: \"#005400\" },\n { teamName: \"India\", teamid: 6, code: \"#007fff\" },\n { teamName: \"SouthAfrica\", teamid: 3, code: \"#006651\" },\n { teamName: \"Australia\", teamid: 2, code: \"#ffdf00\" },\n { teamName: \"England\", teamid: 1, code: \"#011e3d\" },\n { teamName: \"NewZealand\", teamid: 5, code: \"#000000\" },\n { teamName: \"Canada\", teamid: 17, code: \"#ea3c57\" },\n { teamName: \"Netherlands\", teamid: 15, code: \"#ee7c09\" },\n { teamName: \"PapuaNewGuinea\", teamid: 20, code: \"#000000\" },\n { teamName: \"SriLanka\", teamid: 8, code: \"#000080\" },\n { teamName: \"Zimbabwe\", teamid: 9, code: \"#ff0000\" },\n { teamName: \"Kenya\", teamid: 26, code: \"#006629\" },\n { teamName: \"Ireland\", teamid: 29, code: \"#00cc62\" },\n { teamName: \"UAE\", teamid: 27, code: \"#333333\" },\n { teamName: \"Bermuda\", teamid: 12, code: \"#6e8fd4\" },\n { teamName: \"Scotland\", teamid: 30, code: \"#002a5e\" },\n { teamName: \"HongKong\", teamid: 19, code: \"#000000\" },\n { teamName: \"Nepal\", teamid: 32, code: \"#000080\" },\n { teamName: \"Oman\", teamid: 37, code: \"#ff0000\" },\n { teamName: \"Malaysia\", teamid: 16, code: \"#000000\" },\n { teamName: \"Singapore\", teamid: 23, code: \"#ef3340\" },\n { teamName: \"Islamabad United\", teamid: 5795, code: \"#F05705\" },\n { teamName: \"Karachi Kings\", teamid: 5793, code: \"#4287f5\" },\n { teamName: \"Quetta Gladiators\", teamid: 5797, code: \"#64169C\" },\n { teamName: \"Multan Sultans\", teamid: 6413, code: \"#0d8c46\" },\n { teamName: \"Peshawar Zalmi\", teamid: 5791, code: \"#f7db20\" },\n { teamName: \"Lahore Qalandars\", teamid: 5799, code: \"#a2db27\" },\n];\n\nconst options = {\n legend: {\n display: false,\n },\n scales: {\n yAxes: [\n {\n scaleLabel: {\n display: true,\n labelString: \"Runs\",\n },\n ticks: {\n beginAtZero: true,\n callback: function (value) {\n if (value % 1 === 0) {\n return value;\n }\n }\n }\n },\n ],\n },\n tooltips: {\n callbacks: {\n label: function (tooltipItem, data) {\n return (\n data.datasets[tooltipItem.datasetIndex].label +\n \" | \" +\n \"Runs: \" +\n tooltipItem.yLabel\n );\n },\n },\n },\n};\n\nconst results = [\n {\n id: 328829,\n season_name: \"2019/20\",\n series_id: 13620,\n series_name: \"Singapore tour of Thailand\",\n match_id: 1217738,\n description: null,\n team_id: 207,\n team_name: \"Thailand\",\n inning: 2,\n over: 15,\n over_runs: 0,\n cumulative_runs: 2,\n runrate: \"0.13\",\n },\n];\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nexport default class warmgraph extends Component {\n constructor(props) {\n super(props);\n this.state = {\n team1colour: null,\n team2colour: null,\n imageUrl: [],\n team1id: null,\n team1name: null,\n team2id: null,\n team2name: null,\n\n team1over: [],\n\n team2over: [],\n\n team3over: [],\n\n team4over: [],\n };\n }\n\n async componentDidMount() {\n\n var url = document.URL.split(\"/\");\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length-1];\n }else {\n matchId = this.props.match_id;\n }\n\n\n this.loadData(matchId);\n\n }\n\n async loadData(matchId) {\n var temp1 = [];\n var temp2 = [];\n var temp3 = [];\n var temp4 = [];\n var temp = [];\n var finaltemp1 = [];\n var finaltemp2 = [];\n var finaltemp3 = [];\n var finaltemp4 = [];\n\n var temp1id = null;\n var temp1name = null;\n var temp2id = null;\n var temp2name = null;\n let tempColor1 = null;\n let tempColor2 = null;\n\n\n let out = (await getMatch(matchId)).data;\n temp1name = out.batting_first_team_id?.team_name;\n\n this.setState({\n team1name: out.batting_first_team_id?.team_name,\n team2name:\n out.team1_id.team_name == temp1name\n ? out.team2_id?.team_name\n : out.team1_id?.team_name,\n });\n\n\n\n\n var allResults = (await getRunRate(matchId)).data;\n\n for (let i = 0; i < Object.keys(allResults).length; i++) {\n if (allResults[i].inning == 1) {\n temp1.push(allResults[i]);\n } else if (allResults[i].inning == 2) {\n temp2.push(allResults[i]);\n } else if (allResults[i].inning == 3) {\n temp3.push(allResults[i]);\n } else if (allResults[i] == 4) {\n temp4.push(allResults[i]);\n }\n }\n let temp1counter = 0;\n temp1id = 0;\n temp2id = 0;\n\n for (let i = 0; i < Object.keys(temp1).length; i++) {\n if (i > 0) {\n if (temp1[i].over != temp1[i - 1].over) {\n finaltemp1.push(temp1[i].over_runs + finaltemp1[temp1counter - 1]);\n temp1counter = temp1counter + 1;\n }\n } else {\n finaltemp1.push(temp1[i].over_runs);\n temp1counter = temp1counter + 1;\n temp1id = temp1[i].team_id;\n }\n }\n\n let temp2counter = 0;\n\n for (let i = 0; i < Object.keys(temp2).length; i++) {\n if (i > 0) {\n if (temp2[i].over != temp2[i - 1].over) {\n finaltemp2.push(temp2[i].over_runs + finaltemp2[temp2counter - 1]);\n temp2counter = temp2counter + 1;\n }\n } else {\n finaltemp2.push(temp2[i].over_runs);\n temp2counter = temp2counter + 1;\n temp2id = temp2[i].team_id;\n }\n }\n\n let temp3counter = 0;\n\n for (let i = 0; i < Object.keys(temp3).length; i++) {\n if (i > 0) {\n if (temp3[i].over != temp3[i - 1].over) {\n finaltemp3.push(temp3[i].over_runs + finaltemp3[temp3counter - 1]);\n temp3counter = temp3counter + 1;\n }\n } else {\n finaltemp3.push(temp3[i].over_runs);\n temp3counter = temp3counter + 1;\n }\n }\n\n let temp4counter = 0;\n\n for (let i = 0; i < Object.keys(temp4).length; i++) {\n if (i > 0) {\n if (temp4[i].over != temp4[i - 1].over) {\n finaltemp4.push(temp4[i].over_runs + finaltemp4[temp4counter - 1]);\n temp4counter = temp4counter + 1;\n }\n } else {\n finaltemp4.push(temp4[i].over_runs);\n temp4counter = temp4counter + 1;\n }\n }\n\n for (let i = 0; i < Object.keys(colour).length; i++) {\n if (temp1id === colour[i].teamid) {\n tempColor1 = colour[i].code;\n }\n if (temp2id === colour[i].teamid) {\n tempColor2 = colour[i].code;\n }\n }\n if (tempColor1 == null) {\n tempColor1 = \"rgba(0,0,139,0.8)\";\n }\n if (tempColor2 == null) {\n tempColor2 = \"rgba(255,99,132,0.8)\";\n }\n\n this.setState({\n team1over: finaltemp1,\n team2over: finaltemp2,\n team3over: finaltemp3,\n team4over: finaltemp4,\n\n team1colour: tempColor1,\n team2colour: tempColor2,\n team1id: temp1id,\n team2id: temp2id,\n });\n }\n\n getTeam1Logo(teamId) {\n\n if (teamId in teamFlag && teamId !== 4){\n var link = '/flags/svg/'+teamFlag[teamId]\n return \n
\n \n
\n \n
\n );\n }\n}\n","import React, { useState, useEffect } from 'react';\nimport Winlossplot from '../widgets/components/winlossplot';\nimport httpClient from \"../api/httpClient\";\nimport Warmgraph from \"../widgets/components/warmgraph\";\nlet match_ids = [1386751935, 429302306,1692671063,1237463499,1044349428,50706280,1147092101,254833007,1852510621,\n\t\t1431432192,1936787217,881364142,1628493406,975854587,597858106,93158441,270427875,1589961030,28849712,\n\t\t1979632594,1281798291,1078720140,1787177892,1363977735,2137899288,1525922637,802771137,816268981,187632502\n,473243882,1981122009,1020395708,2073598751];\n\t\tconst venue_ids = [1030927900,735933157,1110378340,15505216,836643483,\n\t\t1744558839,909553582,110208812,1860783990,2086628415,1150467922,\n\t\t376300169,192975769,1750718160,827896493,318471962,1657968392\n,1833259985,1301728079,1405993973,791775256,1453997027\n,628243371,677050484,2135296903,1980448774,2102480994,8343358,930911073,297034685,1655132202,585816947,2122332220];\nexport default function NationalT20Series() {\n\n\t// useEffect(() => {\n // fetchData();\n // }, []);\n\n\t// async function fetchData() {\n\t\t\n\t// }\n\tvar data = match_ids.map(function(e, i) {\n\t return {match_id: e,venue_id: venue_ids[i]};\n\t});\n\treturn \n
\n \n {\" \"}\n {this.getTeam1Logo(this.state.team1id)}\n
\n \n {\" \"}\n {this.getTeam2Logo(this.state.team2id)}\n
\n \n
\n \n\t\t
\n}","\nimport React, { useState, useEffect } from 'react';\nimport httpClient from \"../api/httpClient\";\n\nlet match_ids = [728204900, 1380603802, 1543725020, 277648840];\n\n\n\nexport default function CoachMatch() {\n const [matches, setMatches] = useState([]);\n\n\n useEffect(() => {\n fetchMatches();\n }, []);\n\n async function fetchMatches() {\n let res = await httpClient.get('/api/matches', {\n params: { match_id: `[${match_ids}]`, page_size: 50 }\n });\n setMatches(res.data.results);\n }\n function getMatchId(url) {\n \n \tconst arr = url.split(\"/\");\n \treturn arr[arr.length-2];\n }\n return (\n \n\t\t\t{data.map((result) =>\n\t\t\t
\n\t\n\t\t\t\t
\n\t\t\t)}\n\t\t\n\t\t\t\t
\n\t\t\t\t\n\t\t\t\t \n\t\t\t\t
\n\t\t\t\t \n\t\t\t\t \n\t\t\t\t
\n\t\t\t\t \n\t\t\t\t \n\t\t\t\t \n\t\t\t\t
\n\t\t\t\t \n \n \n
\n );\n}\n","import React, { useState, useEffect } from 'react';\nimport Winlossplot from '../widgets/components/winlossplot';\nimport httpClient from \"../api/httpClient\";\n\n//Malaysia ,277648840 ,1543725020\nlet match_ids = [1386751935, 429302306, 1692671063, 1237463499, 1044349428, 50706280, 1147092101, 254833007, 1852510621,\n 1431432192, 1936787217, 881364142, 1628493406, 975854587, 597858106, 93158441, 270427875, 1589961030, 28849712,\n 1979632594, 1281798291, 1078720140, 1787177892, 1363977735, 2137899288, 1525922637, 802771137, 816268981, 187632502, 473243882, 1981122009, 1020395708, 2073598751\n \n];\n\n\n\nexport default function CoachMatch() {\n const [matches, setMatches] = useState([]);\n\n\n useEffect(() => {\n fetchMatches();\n }, []);\n\n async function fetchMatches() {\n let res = await httpClient.get('/api/matches', {\n params: { match_id: `[${match_ids}]`, page_size: 50 }\n });\n setMatches(res.data.results);\n }\n function getMatchId(url) {\n \n \tconst arr = url.split(\"/\");\n \treturn arr[arr.length-2];\n }\n return (\n \n
\n \n
\n National T20 Cup
\n\n
\n \n {matches.map((m, index) =>\n \t
\n \n \n \t\t{`Matches ${index + 1}`}\n\t\t\t \n\t\t\t\t\t
\n )}\n {m.description}
\n\t\t\t\t\n \n \n
\n );\n}","import React, { useState, useEffect } from 'react';\nimport httpClient from \"../api/httpClient\";\nimport { getMatch } from '../api/match.api'\n\n\nexport default function CoachMatchTeams(props) {\n const [match, setMatch] = useState({});\n const [teamPlayers, setTeamPlayers] = useState([]);\n const [teamBatters, setTeamBatters] = useState([]);\n const [isBowlers, setIsBowler] = useState(true);\n\n var match_id = props.match.params.matchid;\n\n useEffect(() => {\n fetchMatches();\n fetchBowler();\n fetchBatters();\n }, []);\n\n async function fetchMatches() {\n const res = await getMatch(match_id);\n setMatch(res.data);\n }\n\n async function fetchBowler() {\n const res = await httpClient.get('/api/stats/match-bowlers/',{\n\t\t\tparams: { match_id: match_id }\n })\n \n setTeamPlayers(res.data);\n }\n\n async function fetchBatters() {\n const res = await httpClient.get('/api/stats/match-batters/',{\n params: { match_id: match_id }\n })\n \n setTeamBatters(res.data);\n }\n\n function getObjectId(url) {\n \tconst arr = url.split(\"/\");\n \treturn arr[arr.length-2];\n }\n\n return (\n \n
\n \n
\n National T20 Cup
\n\n
\n \n {matches.map((m, index) =>\n \t
\n \n \n \t\t{`Matches ${index + 1}`}\n\t\t\t \n\t\t\t\t\t
\n )}\n {m.description}
\n\t\t\t\t\n \n \n\n
\n );\n}\n","import httpClient from './httpClient';\nconst GET_PLAYERS = '/api/players/';\n\nconst getPlayers = (page, perPage, playerId, fullName, cardLong, cardShort) => {\n return httpClient.get(GET_PLAYERS, {\n params: {\n page: page,\n page_size: perPage,\n player_id: playerId,\n full_name: fullName,\n card_long: cardLong,\n card_short: cardShort\n }\n });\n};\n\nconst getPlayer = (id) => {\n return httpClient.get(`/api/players/${id}`);\n};\n\nexport { getPlayers,getPlayer };\n","import React, { useState, useEffect } from \"react\";\nimport httpClient from \"../api/httpClient\";\nimport { getBallEventIds, getMatch } from \"../api/match.api\";\nimport { getPlayer } from \"../api/player.api\";\nimport { Doughnut, HorizontalBar, Bar, Scatter } from \"react-chartjs-2\";\n\n\nimport fileDownload from 'js-file-download';\n\nconst token = localStorage.getItem(\"access_token\");\nexport default function BowlerStats(props) {\n const [match, setMatch] = useState({});\n const [noBall, setNoball] = useState({});\n const [player, setPlayer] = useState({});\n const [speed, setSpeeds] = useState([]);\n const [broadcastIds, setBroadcastIds] = useState([]);\n const [videoUrl, setVideoUrl] = useState(\"http://172.104.172.200/stats/arm.mp4\");\n // const [video2Url, setVideo2Url] = useState(\"http://172.104.172.200/stats/arm.mp4\");\n // const [video3Url, setVideo3Url] = useState(\"http://172.104.172.200/stats/arm.mp4\");\n const [ballDeliveries, setBallDeliveries] = useState([]);\n const [event, setEvent] = useState({});\n var match_id = props.match.params.match_id;\n var player_id = props.match.params.player_id;\n\n useEffect(() => {\n fetchMatch();\n fetchPlayer();\n fetchBallDelivery();\n fetchNoBallDelivery();\n fetchDeliverySpeed();\n }, []);\n\n async function fetchBallDelivery() {\n const res = await httpClient.get(\"/api/stats/ball-delivery/\", {\n params: { match_id: match_id, player_id: player_id },\n });\n\n if (res.data.length > 0) {\n // setVideoUrl(`${process.env.REACT_APP_API_ENDPOINT}/cea/api/clips/${res.data[0].event_id}`);\n // setEvent(res.data[0]);\n selectEvent(res.data[0]);\n }\n setBallDeliveries(res.data);\n }\n\n async function fetchDeliverySpeed() {\n const res = await httpClient.get(\"/api/stats/delivery-speeds/\", {\n params: { match_id: match_id, player_id: player_id },\n });\n setSpeeds(res.data);\n }\n\n async function fetchNoBallDelivery() {\n const res = await httpClient.get(\"/api/stats/noball-delivery/\", {\n params: { match_id: match_id, player_id: player_id },\n });\n let data = res.data;\n data[\"legal_ball\"] = data.total - data.no_ball;\n setNoball(data);\n }\n\n async function fetchMatch() {\n const res = await getMatch(match_id);\n setMatch(res.data);\n }\n async function fetchPlayer() {\n const res = await getPlayer(player_id);\n setPlayer(res.data);\n }\n\n const selectEvent = async (event) => {\n\n setVideoUrl(`${process.env.REACT_APP_API_ENDPOINT}/cea/api/clips/${event.event_id}?access_token=${token}`);\n setEvent(event);\n\n const res = await getBallEventIds(event.event_id);\n \n setBroadcastIds(res.data);\n\n\n }\n const displayTime = (time) => {\n var _time = Math.floor(time);\n\n const min = Math.floor(_time / 60);\n var seconds = _time - min * 60;\n return `${min}:${seconds}`\n\n }\n\n const isDismiss = (dismiss) => {\n if (dismiss) {\n return \"True\";\n }\n return \"False\";\n\n }\n const downLoadVideo = (e, videoUrl) => {\n e.preventDefault()\n let arr = videoUrl.split(\"/\");\n let id = arr[arr.length - 1]\n httpClient.get(videoUrl, {\n responseType: 'blob',\n }).then(res => {\n fileDownload(res.data, `clip_${id}.webm`);\n });\n\n\n\n }\n return (\n \n
\n \n
\n {match.description}
\n\n
\n\n\n \n \n \n
\n\n {isBowlers && teamPlayers.map((teamplayer, index) =>\n \n
\n )}\n {!isBowlers && teamBatters.map((teambatter, index) =>\n {teamplayer.team_name}
\n\n {teamplayer.bowlers.map((p, index) =>\n
\n \n {`Bowler: ${p.player_id}`}\n
\n )}\n {p.short_name}
\n\n
\n )}\n {teambatter.team_name}
\n\n {teambatter['batters'].map((p, index) =>\n
\n \n {`Batter: ${p.player_id}`}\n
\n )}\n {p.short_name}
\n\n
\n );\n}\n","import React, { useState, useEffect } from \"react\";\nimport httpClient from \"../api/httpClient\";\nimport {getBallEventIds ,getMatch } from \"../api/match.api\";\nimport { getPlayer } from \"../api/player.api\";\nimport { Pie, Doughnut, HorizontalBar, Bar, Scatter } from \"react-chartjs-2\";\nimport fileDownload from \"js-file-download\";\nconst token = localStorage.getItem(\"access_token\");\nexport default function BatterStats(props) {\n const [match, setMatch] = useState({});\n const [balance, setBalance] = useState({});\n const [stance, setStance] = useState({});\n const [player, setPlayer] = useState({});\n const [speed, setSpeed] = useState([]);\n const [broadcastIds, setBroadcastIds] = useState([]);\n const [ct_distance, setDistance] = useState([]);\n\n const [videoUrl, setVideoUrl] = useState(\n \"http://172.104.172.200/stats/arm.mp4\"\n );\n const [videoEvents, setVideoEvents] = useState([]);\n const [event, setEvent] = useState({});\n var match_id = props.match.params.match_id;\n var player_id = props.match.params.player_id;\n\n useEffect(() => {\n fetchMatch();\n fetchPlayer();\n fetchBallDelivery();\n }, []);\n\n async function fetchBallDelivery() {\n const res = await httpClient.get(\"/api/stats/batting-delivery/\", {\n params: { match_id: match_id, player_id: player_id },\n });\n\n if (res.data.length > 0) {\n selectEvent(res.data[0]);\n }\n \n var balace = 0;\n var unbalance = 0;\n var stance = {};\n var speeds = [];\n var distances= [];\n for (var i = 0; i < res.data.length; i++) {\n var event = res.data[i];\n \n if (!(event.context.kpis?.batsman_stance in stance)) {\n stance[event.context.kpis?.batsman_stance] = 1;\n } else {\n stance[event.context.kpis?.batsman_stance] += 1;\n }\n\n speeds.push(event.context.kpis?.ball_speed); \n distances.push(Math.round(event.context.kpis?.contact_pt_distance * 100) / 100);\n if (event.context.kpis?.kpi3_balance_level) {\n balace += 1;\n } else {\n unbalance += 1;\n }\n }\n\n\n if (res.data.length == 0) {\n return;\n }\n const balance_percent = Math.floor((100 * balace) / res.data.length);\n setSpeed(speeds);\n setStance(stance);\n setBalance({ balace: balace, unbalace: unbalance });\n setDistance(distances);\n setVideoEvents(res.data);\n }\n\n async function fetchMatch() {\n const res = await getMatch(match_id);\n setMatch(res.data);\n }\n async function fetchPlayer() {\n const res = await getPlayer(player_id);\n setPlayer(res.data);\n }\n\n const selectEvent = async (event) => {\n setVideoUrl( `${process.env.REACT_APP_API_ENDPOINT}/cea/api/clips/${event.event_id}?access_token=${token}`);\n setEvent(event);\n const res = await getBallEventIds(event.event_id);\n setBroadcastIds(res.data);\n };\n const displayTime = (time) => {\n var _time = Math.floor(time);\n\n const min = Math.floor(_time / 60);\n var seconds = _time - min * 60;\n return `${min}:${seconds}`;\n };\n const downLoadVideo = (e, videoUrl) => {\n e.preventDefault();\n let arr = videoUrl.split(\"/\");\n let id = arr[arr.length - 1];\n httpClient\n .get(videoUrl, {\n responseType: \"blob\",\n })\n .then((res) => {\n fileDownload(res.data, `clip_${id}.webm`);\n });\n };\n\n return (\n {match.description}
\n Bowler: {player.short_name}
\n \n
\n \n \n\n downLoadVideo(e, videoUrl)}> Click to download \n\n {/* \n downLoadVideo(e,`${videoUrl}?clipType=1`) }> Click to download \n \n downLoadVideo(e,`${videoUrl}?clipType=2`) }> Click to download */}\n {broadcastIds.map(e => {\n return \n })}\n
\n \n \n \n
\n
\n | \n Delivery\n | \nTime | \nArm Flex | \nFFC | \nRuns | \nDismissal | \nIs Wide | \n
|---|---|---|---|---|---|---|
| {index + 1} | \n{displayTime(b.time)} | \n{Math.round(b.arm_flex * 100) / 100} | \n{b.ffc} cm | \n{b.total_runs} | \n{b.dismiss ? \"TRUE\" : \"FALSE\"} | \n{b.is_wide ? \"TRUE\" : \"FALSE\"} | \n
\n
\n BOWLING
\n\n
\n \n
\n PERCENTAGE OF NO BALLS
\n\n index + 1),\n datasets: [\n {\n label: \"Wirst Distance\",\n data: speed.map((s, index) => s.wirst_dict),\n backgroundColor: speed.map(\n (s, index) => \"rgb(255, 99, 132)\"\n ),\n borderColor: speed.map((s, index) => \"rgb(255, 99, 132)\"),\n borderWidth: 1,\n },\n ],\n }}\n width={100}\n height={50}\n />\n
\n WIRST MAP
\n\n
\n \n {\n return { x: s.ball_speed, y: (index + 1) }\n }),\n backgroundColor: \"#000000\",\n },\n ],\n }}\n options={\n {\n responsive: true,\n plugins: {\n legend: {\n position: 'top',\n },\n title: {\n display: true,\n text: 'Chart.js Scatter Chart'\n }\n }\n }\n }\n />\n
\n BALL SPEED
\n\n\n index + 1),\n datasets: [\n {\n label: \"Run Up Speed\",\n data: speed.map((s, index) => s.run_up_speed),\n backgroundColor: speed.map(\n (s, index) => \"rgba(54, 162, 235, 0.2)\"\n ),\n borderColor: speed.map((s, index) => \"rgba(54, 162, 235, 0.2)\"),\n borderWidth: 1,\n },\n ],\n }}\n />\n
\n RUN UP SPEED
\n\n\n
\n );\n}\n","/* eslint-disable no-unused-expressions */\n/* eslint-disable jsx-a11y/anchor-is-valid */\nimport React from 'react';\nimport '../assets/styles/subnavigation.css';\n\nexport default function SubNavigationbar(props) {\n const listItems = props.items.map((item) => (\n {match.description}
\n Batter: {player.short_name}
\n \n
\n \n \n downLoadVideo(e, videoUrl)}>\n {\" \"}\n Click to download{\" \"}\n \n\n {broadcastIds.map(e => {\n return \n })}\n
\n \n \n \n
\n
\n | \n Delivery\n | \nTime | \nBalance Level | \nRuns | \nDismissal | Is Wide | \nStance | \nBall Speed | \nContact Distance | \n{index + 1} | \n{displayTime(b.time)} | \n{b.total_runs} | \n\n {b.dismiss ? \"TRUE\" : \"FALSE\"}\n | \n\n {b.is_wide ? \"TRUE\" : \"FALSE\"}\n | \n{b.context.kpis?.batsman_stance} | \n{b.context.kpis?.ball_speed} | \n{Math.round(b.context.kpis?.contact_pt_distance* 100) / 100} | \n \n ))}\n
|---|
\n
\n \n
\n BALANCED LEVEL OF STRIKER
\n\n key.toUpperCase()),\n datasets: [\n {\n data: Object.values(stance),\n backgroundColor: [\"rgb(255, 99, 132)\", \"rgb(54, 162, 235)\"],\n },\n ],\n }}\n />\n
\n BASTMAN STANCE
\n\n
\n {/* \n index + 1),\n datasets: [\n {\n label: \"Ball Speed\",\n data: speed.map((s, index) => s),\n backgroundColor: speed.map(\n (s, index) => \"rgba(19, 141, 117)\"\n ),\n borderColor: speed.map((s, index) => \"rgba(54, 162, 235, 0.2)\"),\n borderWidth: 1,\n },\n ],\n }}\n />\n
\n BALL SPEED
\n\n\n index + 1),\n datasets: [\n {\n label: \"Contact Distance\",\n data: ct_distance.map((s, index) => s),\n backgroundColor: ct_distance.map(\n (s, index) => \"rgba(240, 178, 122)\"\n ),\n borderColor: ct_distance.map((s, index) => \"rgba(54, 162, 235, 0.2)\"),\n borderWidth: 1,\n },\n ],\n }}\n />\n
\n CONTACT DISTANCE
\n\n\n {\n return { x: s.context.kpis.bat_contact_point.ball_bat_contact_point_x, \n y: s.context.kpis.bat_contact_point.ball_bat_contact_point_y }\n }),\n backgroundColor: \"#FF3366\",\n pointRadius: 5,\n\n },\n ],\n }}\n options={{\n responsive: true,\n maintainAspectRatio: false,\n \n\n\n plugins: {\n legend: {\n position: \"top\",\n },\n title: {\n display: false,\n },\n },\n scales: {\n xAxes: [{\n gridLines: {\n drawOnChartArea: false\n }\n }],\n yAxes: [{\n gridLines: {\n drawOnChartArea: false\n }\n }]\n }\n }}\n />\n
*/}\n BAT & BALL CONTACT MAP
\n{listItems}
;\n}\n","import httpClient from \"./httpClient\";\n\nconst OUTLIERS = \"/api/stats/outliers/\";\n\nconst getOutliers = (type, date, end_date, series_id) => {\n\treturn httpClient.get(`${OUTLIERS}`, {\n\t\tparams: {\n\t\t\ttype: type,\n\t\t\tstart_date: new Date(date).toISOString(),\n\t\t\tend_date: new Date(end_date).toISOString(),\n\t\t\tseries_id: series_id\n\t\t},\n\t});\n};\n\nexport { getOutliers };","import httpClient from './httpClient';\n\nconst GET_LEAGUES = '/api/series/';\n\nconst getLeagues = (page, perPage, leagueId, catagory, seriesName) => {\n return httpClient.get(GET_LEAGUES, {\n params: {\n page: page,\n page_size: perPage,\n series_id: leagueId,\n series_category_name: catagory,\n series_name: seriesName,\n },\n });\n};\n\n\nconst getSeries = (series_name) => {\n return httpClient.get('/api/series', {\n params: {\n page_size: 500,\n series_name: series_name\n },\n });\n};\n\nconst getOulierSeries = (series_name, start_date, end_date) => {\n return httpClient.get('/api/outlier-series', {\n params: {\n series_name: series_name,\n start_date: new Date(start_date).toISOString(),\n end_date: new Date(end_date).toISOString(),\n },\n });\n};\n\nconst getLeague = (id) => {\n return httpClient.get(`/api/series/${id}/`);\n};\n\nexport { getLeagues, getLeague, getSeries,getOulierSeries };\n","import React, { Component } from \"react\";\nimport { Container, Row, Col } from \"reactstrap\";\nimport Menu from \"./components/Menu\";\nimport SubNavigation from \"./components/SubNavigationbar\";\nimport BootstrapTable from \"./react-bootstrap-table2\";\nimport DatePicker from \"react-datepicker\";\nimport \"react-datepicker/dist/react-datepicker.css\";\nimport Select from \"react-select\";\nimport { DebounceInput } from \"react-debounce-input\";\nimport { FiChevronUp, FiChevronDown } from \"react-icons/fi\";\n\nimport { ReactSearchAutocomplete } from \"react-search-autocomplete\";\n\nimport filterFactory, {\n\ttextFilter,\n\tselectFilter,\n\tComparator,\n\tdateFilter,\n} from \"./react-bootstrap-table2-filter\";\nimport httpClient from \"./api/httpClient\";\nimport { getOutliers } from \"./api/outliers.api\";\nimport { getMatch } from \"./api/match.api\";\nimport { getOulierSeries, getLeague } from \"./api/leagues.api\";\n\nimport {\n\tbatting_columns,\n\tbowling_columns,\n\tteams_outlier_cols,\n\tvenue_outlier_cols,\n} from \"./config/constant\";\n\nexport default class Outliers extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\n\t\tthis.state = {\n\t\t\tplayers: [],\n\t\t\toutlier_cols: [],\n\t\t\ttype: \"most_sixes\",\n\t\t\toutlier_name: \"Most Sixs\",\n\t\t\tbatting_columns: batting_columns,\n\t\t\tbowling_columns: bowling_columns,\n\t\t\tteams_columns: teams_outlier_cols,\n\t\t\tvenue_columns: venue_outlier_cols,\n\t\t\tstart_date: \"01/01/2021\",\n\t\t\tend_date: Date(),\n\t\t\tseries_id: \"\",\n\t\t\tseries_name: \"\",\n\t\t\tseries: [],\n\t\t\tisHideBatting: false,\n\t\t\tisHideBowling: false,\n\t\t\tisHideTeam: false,\n\t\t\tisHideVenue: false,\n\t\t};\n\t}\n\n\n\n\tcomponentDidMount = async () => {\n\t\tconst res = await getLeague(this.props.match.params.seriesid);\n\t\tconst series_name = this.urlarg(res.data.url);\n\n\t\tthis.setState({ ...this.state, series_name: res.data.series_name });\n\t\tthis.fetchData(\n\t\t\tthis.state.type,\n\t\t\tthis.state.start_date,\n\t\t\t\"Most Sixs\",\n\t\t\tthis.state.end_date,\n\t\t\tthis.props.match.params.series_id\n\t\t);\n\t};\n\tfetchMatch = async (matchid) => {\n\t\tconst response = await getMatch(matchid);\n\t\tconst series_url = response.data.series.url;\n\t\tconst series_id = this.urlarg(series_url);\n\t\tthis.setState({ series_id: series_id });\n\t};\n\n\tfetchSeries = async (name) => {\n\t\tconst response = await getOulierSeries(\n\t\t\tname,\n\t\t\tthis.state.start_date,\n\t\t\tthis.state.end_date\n\t\t);\n\t\tconst series = response.data.map((series) => {\n\t\t\treturn {\n\t\t\t\tid: series.series_id,\n\t\t\t\tname: series.series_name,\n\t\t\t};\n\t\t});\n\t\tthis.setState({ series: series });\n\t};\n\n\turlarg = (id) => {\n\t\tvar url = id.split(\"/\");\n\t\tvar argcheck = url[url.length - 2];\n\t\treturn argcheck;\n\t};\n\n\tfetchData = async (type, start_date, name, end_date, series_id) => {\n\t\tconst response = await getOutliers(\n\t\t\ttype,\n\t\t\tstart_date,\n\t\t\tend_date,\n\t\t\tseries_id\n\t\t);\n\t\tconst data = response.data;\n\t\tlet keys = [];\n\t\tif (data.length > 0) {\n\t\t\tkeys = Object.keys(data[0]);\n\t\t}\n\t\tthis.setState({\n\t\t\toutlier_cols: keys,\n\t\t\tplayers: data,\n\t\t\ttype: type,\n\t\t});\n\t\tthis.setState({ outlier_name: name });\n\t\twindow.scrollTo(0, 0);\n\t};\n\n\tonBattingClick(col) {\n\t\tfor (var i = 0; i < this.state.batting_columns.length; i++) {\n\t\t\tvar item = this.state.batting_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\tfor (var i = 0; i < this.state.bowling_columns.length; i++) {\n\t\t\tvar item = this.state.bowling_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\tfor (var i = 0; i < this.state.teams_columns.length; i++) {\n\t\t\tvar item = this.state.teams_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\tfor (var i = 0; i < this.state.venue_columns.length; i++) {\n\t\t\tvar item = this.state.venue_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\n\t\t// this.setState({ outlier_name: col.name });\n\t\tthis.fetchData(\n\t\t\tcol.type,\n\t\t\tthis.state.start_date,\n\t\t\tcol.name,\n\t\t\tthis.state.end_date,\n\t\t\tthis.state.series_id\n\t\t);\n\t}\n\n\tonBowlingClick(col) {\n\t\tfor (var i = 0; i < this.state.batting_columns.length; i++) {\n\t\t\tvar item = this.state.batting_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\tfor (var i = 0; i < this.state.bowling_columns.length; i++) {\n\t\t\tvar item = this.state.bowling_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\tfor (var i = 0; i < this.state.teams_columns.length; i++) {\n\t\t\tvar item = this.state.teams_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\tfor (var i = 0; i < this.state.venue_columns.length; i++) {\n\t\t\tvar item = this.state.venue_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\t// this.setState({ outlier_name: col.name });\n\t\t// this.fetchData(col.type, this.state.start_date, col.name);\n\t\tthis.fetchData(\n\t\t\tcol.type,\n\t\t\tthis.state.start_date,\n\t\t\tcol.name,\n\t\t\tthis.state.end_date,\n\t\t\tthis.state.series_id\n\t\t);\n\t}\n\n\tonTeamsClick(col) {\n\t\tfor (var i = 0; i < this.state.batting_columns.length; i++) {\n\t\t\tvar item = this.state.batting_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\tfor (var i = 0; i < this.state.bowling_columns.length; i++) {\n\t\t\tvar item = this.state.bowling_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\tfor (var i = 0; i < this.state.teams_columns.length; i++) {\n\t\t\tvar item = this.state.teams_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\tfor (var i = 0; i < this.state.venue_columns.length; i++) {\n\t\t\tvar item = this.state.venue_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\tthis.fetchData(\n\t\t\tcol.type,\n\t\t\tthis.state.start_date,\n\t\t\tcol.name,\n\t\t\tthis.state.end_date,\n\t\t\tthis.state.series_id\n\t\t);\n\t}\n\n\tonVenueClick(col) {\n\t\tfor (var i = 0; i < this.state.batting_columns.length; i++) {\n\t\t\tvar item = this.state.batting_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\tfor (var i = 0; i < this.state.bowling_columns.length; i++) {\n\t\t\tvar item = this.state.bowling_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\tfor (var i = 0; i < this.state.teams_columns.length; i++) {\n\t\t\tvar item = this.state.teams_columns[i];\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\tfor (var i = 0; i < this.state.venue_columns.length; i++) {\n\t\t\tvar item = this.state.venue_columns[i];\n\n\t\t\titem.is_selected = false;\n\t\t\tif (item.type == col.type) {\n\t\t\t\titem.is_selected = true;\n\t\t\t}\n\t\t}\n\t\t// this.setState({ outlier_name: col.name });\n\t\tthis.fetchData(\n\t\t\tcol.type,\n\t\t\tthis.state.start_date,\n\t\t\tcol.name,\n\t\t\tthis.state.end_date,\n\t\t\tthis.state.series_id\n\t\t);\n\t}\n\n\tonDateChange(date) {\n\t\tthis.setState({ start_date: date.toLocaleDateString() });\n\t\t// this.fetchData(this.state.type, date.toLocaleDateString());\n\t\tthis.fetchData(\n\t\t\tthis.state.type,\n\t\t\tthis.state.start_date,\n\t\t\tthis.state.outlier_name,\n\t\t\tthis.state.end_date,\n\t\t\tthis.state.series_id\n\t\t);\n\t}\n\tonEndDateChange(date) {\n\t\tthis.setState({ end_date: date.toLocaleDateString() });\n\t\t// this.fetchData(this.state.type, date.toLocaleDateString());\n\t\tthis.fetchData(\n\t\t\tthis.state.type,\n\t\t\tthis.state.start_date,\n\t\t\tthis.state.outlier_name,\n\t\t\tthis.state.end_date,\n\t\t\tthis.state.series_id\n\t\t);\n\t}\n\thandleChangeSeriesId(seriesId) {\n\t\tthis.setState({ series_id: seriesId });\n\n\t\tthis.fetchData(\n\t\t\tthis.state.type,\n\t\t\tthis.state.start_date,\n\t\t\tthis.state.outlier_name,\n\t\t\tthis.state.end_date,\n\t\t\tthis.state.series_id\n\t\t);\n\t}\n\trender() {\n\t\tfunction renderContent(col, player) {\n\t\t\tif (col == \"batter_id\" || col == \"bowler_id\") {\n\t\t\t\treturn (\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t\t {\n\t\t\t\t\t\t\t\t\tthis.setState({\n\t\t\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t\t\tisHideVenue: !this.state.isHideVenue,\n\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tVenue\n\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t{!this.state.isHideVenue &&\n\t\t\t\t\t\t\t\tthis.state.venue_columns.map((col) => {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t
\n\t\t\t\t\n\t\t\t\t\t {\n\t\t\t\t\t\t\t\t\tthis.setState({\n\t\t\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t\t\tisHideTeam: !this.state.isHideTeam,\n\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tTeams\n\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t{!this.state.isHideTeam &&\n\t\t\t\t\t\t\t\tthis.state.teams_columns.map((col) => {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t {\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tthis.setState({\n\t\t\t\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t\t\t\tisHideBowling: !this.state\n\t\t\t\t\t\t\t\t\t\t\t\t.isHideBowling,\n\t\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tBowling\n\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t{!this.state.isHideBowling &&\n\t\t\t\t\t\t\t\tthis.state.bowling_columns.map((col) => {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\tLeaders
\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t{!this.state.isHideBatting &&\n\t\t\t\t\t\t\t\tthis.state.batting_columns.map((col) => {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.onBattingClick(col)\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{col.name}\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t})}\n\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.onBowlingClick(col)\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{col.name}\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t})}\n\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.onTeamsClick(col)\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{col.name}\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.onVenueClick(col)\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{col.name}\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t
\n\t\t\t\t\n\t\t\t\n\t\t);\n\t}\n}","import React, { Component } from \"react\";\nimport { HorizontalBar } from \"react-chartjs-2\";\nimport { getTeamLogo } from \"../../config/utils\";\nimport { getEvaluate } from \"../../api/match.api\";\nexport default class ActualExpectedPredictedRuns extends Component {\n constructor(props) {\n super(props);\n this.state = {\n\n matchname: null,\n battingTeam: \"\",\n chart_datas: [],\n };\n }\n\n componentDidMount() {\n this.fetchData();\n }\n\n async fetchData() {\n var url = document.URL.split(\"/\");\n let matchId = \"\";\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n\n const response = await getEvaluate(matchId);\n\n let chart_datas = [];\n let matchname = \"\";\n for (var i = 0; i < response.data.length; i++) {\n\n const data = response.data[i];\n matchname = data.match_description;\n const modelPredictionRuns = data.player_predictions.map(function (\n player\n ) {\n return player.model_predicted_runs;\n });\n const expectedRuns = data.player_predictions.map(function (player) {\n return player.expected_runs;\n });\n const currentRuns = data.player_predictions.map(function (player) {\n return player.current_runs;\n });\n const playerNames = data.player_predictions.map(function (player) {\n return player.player_name;\n });\n\n chart_datas.push({\n expectedruns: expectedRuns,\n currentruns: currentRuns,\n predictedruns: modelPredictionRuns,\n playernames: playerNames,\n matchname: data.match_description,\n battingTeam: data.batting_team,\n });\n }\n\n this.setState({ chart_datas: chart_datas,\n matchname: matchname\n\n });\n\n\n }\n\n render() {\n return (\n \n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\tthis.onDateChange(date)\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\tEnd Date \n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\tthis.onEndDateChange(date)\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t{this.state.outlier_name}
\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\tStart Date \n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\tSeries: {this.state.series_name}\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t
\n\n\t\t\t\t\t\t\t| POS | \n\t\t\t\t\t\t\t\t\t\t{this.state.outlier_cols.map((col) => {\n\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t{col.toUpperCase()}\n\t\t\t\t\t\t\t\t\t\t\t\t | \n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t
|---|---|
| {index + 1} | \n\t\t\t\t\t\t\t\t\t\t\t\t{this.state.outlier_cols.map(\n\t\t\t\t\t\t\t\t\t\t\t\t\t(col) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn renderContent(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcol,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tplayer\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t
\n
\n );\n }\n}","import React, { Component } from \"react\";\nimport { HorizontalBar } from \"react-chartjs-2\";\nimport { getTeamLogo } from \"../../config/utils\";\nimport { getEvaluate } from \"../../api/match.api\";\nexport default class ActualExpectedPredictedBalls extends Component {\n constructor(props) {\n super(props);\n this.state = {\n currentruns: [],\n predictedruns: [],\n expectedruns: [],\n playernames: [],\n matchname: null,\n battingTeam: \"\",\n chart_datas: [],\n };\n }\n\n componentDidMount() {\n this.fetchData();\n }\n\n async fetchData() {\n var url = document.URL.split(\"/\");\n let matchId = \"\";\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n\n const response = await getEvaluate(matchId);\n\n let chart_datas = [];\n let matchname = \"\";\n for (var i = 0; i < response.data.length; i++) {\n const data = response.data[i];\n matchname = data.match_description;\n const modelPredictionBalls = data.player_predictions.map(function (\n player\n ) {\n return player.model_predicted_balls;\n });\n const expectedBalls = data.player_predictions.map(function (player) {\n return player.average_balls_faced;\n });\n const currentBalls = data.player_predictions.map(function (player) {\n return player.current_balls;\n });\n const playerNames = data.player_predictions.map(function (player) {\n return player.player_name;\n });\n\n chart_datas.push({\n expectedballs: expectedBalls,\n currentballs: currentBalls,\n predictedballs: modelPredictionBalls,\n playernames: playerNames,\n matchname: data.match_description,\n battingTeam: data.batting_team,\n });\n }\n\n this.setState({ chart_datas: chart_datas,\n matchname: matchname\n });\n }\n\n render() {\n return (\n \n
\n \n {this.state.matchname}\n
\n\n {this.state.chart_datas.map((data) => {\n return (\n \n
\n );\n })}\n \n \n Batting Team: {data.battingTeam}\n \n
\n \n
\n );\n }\n}","import React, { Component } from \"react\";\nimport { HorizontalBar } from \"react-chartjs-2\";\nimport { getTeamLogo } from \"../../config/utils\";\nimport { getEvaluate } from \"../../api/match.api\";\nimport { Container, Row, Col } from \"reactstrap\";\nexport default class PlayerOfMatch extends Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.state = {\n\t\t\tplayer_of_the_matchs: [],\n\t\t};\n\t}\n\n\tcomponentDidMount() {\n\t\tthis.fetchData();\n\t}\n\n\tasync fetchData() {\n\t\tvar url = document.URL.split(\"/\");\n\t\tlet matchId = \"\";\n\t\tif (!this.props.match_id) {\n\t\t\tmatchId = url[url.length - 1];\n\t\t} else {\n\t\t\tmatchId = this.props.match_id;\n\t\t}\n\n\t\tconst response = await getEvaluate(matchId);\n\t\tlet cur_player_of_the_match = [];\n\n\t\tfor (var i = 0; i < response.data.length; i++) {\n\t\t\tconst data = response.data[i];\n\n\t\t\tcur_player_of_the_match.push(data);\n\t\t}\n\t\tthis.setState({ player_of_the_matchs: cur_player_of_the_match });\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t\n
\n \n {this.state.matchname}\n
\n\n {this.state.chart_datas.map((data) => {\n return (\n \n
\n );\n })}\n \n \n Batting Team: {data.battingTeam}\n \n
\n \n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\tBatting team: {data.batting_team}\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
\n\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\tBest batter:
\n\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t{data.player_of_the_match.max_actual_by_expected_ratio.map(\n\t\t\t\t\t\t\t\t\t(player) => {\n\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t{player.player}{\" \"}
\n\t\t\t\t\t\t\t\t\t\t\t\t\tActual/expected:{\" \"}\n\t\t\t\t\t\t\t\t\t\t\t\t\t{player.actual_runs}/\n\t\t\t\t\t\t\t\t\t\t\t\t\t{player.expected_runs}\n\n\t\t\t\t\t\t\t\t\t\t\t
\n\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{/*{\n\t\t\t\t\t\t\t\t\tdata.player_of_the_match\n\t\t\t\t\t\t\t\t\t\t.max_actual_by_expected_ratio.player\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\tActual/expected: {data.player_of_the_match\n\t\t\t\t\t\t\t\t\t\t.max_actual_by_expected_ratio.actual_runs}/{data.player_of_the_match\n\t\t\t\t\t\t\t\t\t\t.max_actual_by_expected_ratio.expected_runs}\n\t\t\t\t\t\t\t\t*/}\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\tActual/expected:{\" \"}\n\t\t\t\t\t\t\t\t\t\t\t\t\t{player.actual_runs}/\n\t\t\t\t\t\t\t\t\t\t\t\t\t{player.expected_runs}\n\n\t\t\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\tWorst batter:{\" \"}\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\tdata.player_of_the_match\n\t\t\t\t\t\t\t\t\t\t.min_actual_by_expected_ratio.player\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\tActual/expected:{\" \"}\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tdata.player_of_the_match\n\t\t\t\t\t\t\t\t\t\t\t.min_actual_by_expected_ratio\n\t\t\t\t\t\t\t\t\t\t\t.actual_runs\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t/\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tdata.player_of_the_match\n\t\t\t\t\t\t\t\t\t\t\t.min_actual_by_expected_ratio\n\t\t\t\t\t\t\t\t\t\t\t.expected_runs\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t{data.player_of_the_match\n\t\t\t\t\t\t\t\t\t\t.best_bowler !== null &&\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\tBest bowler:{\" \"}\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\tdata.player_of_the_match\n\t\t\t\t\t\t\t\t\t\t.best_bowler.bowler\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\tRun saved:{\" \"}\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tdata.player_of_the_match\n\t\t\t\t\t\t\t\t\t\t.best_bowler.runs_saved\n\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\tWickets:{\" \"}\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tdata.player_of_the_match\n\t\t\t\t\t\t\t\t\t\t.best_bowler.wickets\n\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\n\n\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t \n\t\t\t\t
\n\t\t\t\t\t\t\t{/* */}\n\t\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t{/* */}\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\tActual Expected Predicted Runs\n\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\tActual Expected Predicted Balls\n\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n
\n )\n }\n}\n","import React, { Component } from 'react'\nimport { Doughnut } from 'react-chartjs-2'\n// import { getTeamLogo } from '../../config/utils';\n// import '../../widgets/WigetApp.css';\nimport { getTeamLogoUrl } from '../../config/utils'\nimport { getMatchRegularStats } from '../../api/stats.api'\nimport { default_team1_color } from '../../config/constant'\nimport { default_team2_color } from '../../config/constant'\nimport httpClient from '../../api/httpClient'\nexport default class Winlossprob extends Component {\n constructor (props) {\n super(props)\n this.state = {\n team1winprob: null,\n team2winprob: null,\n team1name: null,\n team2name: null,\n team1colour: null,\n team2colour: null,\n team1logo: null,\n team2logo: null,\n drawprob: null,\n matchname: null,\n teamID: null,\n imageUrl: [],\n matchData: []\n }\n }\n\n componentDidMount () {\n this.fethPrematch()\n this.fetchData()\n this.intervalId = setInterval(() => {\n this.fetchData()\n }, 10000)\n }\n componentWillUnmount () {\n clearInterval(this.intervalId)\n }\n\n async fethPrematch () {\n var url = document.URL.split('/')\n let matchId = ''\n if (!this.props.match_id) {\n matchId = url[url.length - 1]\n } else {\n matchId = this.props.match_id\n }\n try {\n\n const res = await httpClient.get(\n `/api/predictions/get-prematch-preds/${matchId}`\n )\n\n if (res.data.error == undefined || res.data.error == null) {\n const data = res.data\n\n this.setState({\n team1name: data['team1'],\n team2name: data['team2'],\n team1winprob: data['team1_percent'],\n team2winprob: data['team2_percent'],\n drawprob: data['tie_percent']\n })\n }\n } catch {\n // Do not thing\n\n }\n }\n\n async fetchData () {\n var url = document.URL.split('/')\n let matchId = ''\n if (!this.props.match_id) {\n matchId = url[url.length - 1]\n } else {\n matchId = this.props.match_id\n }\n\n var tempcurruns = []\n var temppredruns = []\n var temppname = []\n let tempColor1 = null\n let tempColor2 = null\n\n fetch(\n process.env.REACT_APP_API_ENDPOINT + '/api/predictions/result/' + matchId\n )\n .then(res => res.json())\n .then(out => {\n let tempColor1 = out.gameState.teams[0]?.team_color\n ? out.gameState.teams[0]?.team_color\n : default_team1_color\n let tempColor2 = out.gameState.teams[1]?.team_color\n ? out.gameState.teams[1]?.team_color\n : default_team2_color\n\n\n this.setState({\n team1logo: out.gameState.teams[0].team_logo,\n team2logo: out.gameState.teams[1].team_logo,\n\n team1name: out.gameState.teams[0].teamName,\n team2name: out.gameState.teams[1].teamName,\n team1winprob:\n out.gameState.teams[0].teamId == out.predOutcomes.winProb[0].teamId\n ? out.predOutcomes.winProb[0].winProbPct\n : out.predOutcomes.winProb[1].winProbPct,\n team2winprob:\n out.gameState.teams[1].teamId == out.predOutcomes.winProb[1].teamId\n ? out.predOutcomes.winProb[1].winProbPct\n : out.predOutcomes.winProb[0].winProbPct,\n drawprob: out.predOutcomes.drawProb,\n matchname: out.gameState.matchName,\n teamID: out.gameState.battingTeamId,\n team1colour: tempColor1,\n team2colour: tempColor2\n })\n })\n .catch(err => {\n throw err\n })\n let matchData = (await getMatchRegularStats(matchId)).data\n this.setState({ matchData: matchData })\n }\n\n // getTeamLogo = teamName => {\n // if (teamName == this.state.team1name) {\n // if (this.state.team1logo == null) {\n // return null\n // }\n // return ``\n // // return `https://forecast.tvconal.com/cea/api/teamlogo/?access_token=d00b64cb-16a8-442e-b5f2-251bc418bd45`\n // } else {\n // if (this.state.team2logo == null) {\n // return null\n // }\n // return `https://p.imgci.com${this.state.team2logo}`\n // }\n // }\n\n getTeamColor = teamName => {\n if (teamName == this.state.team1name) {\n return this.state.team1colour\n } else {\n return this.state.team2colour\n }\n }\n render () {\n return (\n \n
\n \n\n
\n \n \n
\n \n {this.state.matchData.map(item => (\n
\n \n \n \n \n\n {item.team_name}\n \n \n
\n ))}\n \n {item?.total_run != null && item?.wicket_lost != null && (\n \n {item?.total_run}/ {item?.wicket_lost}\n \n )}\n \n\n
\n \n {item?.over == null ? \"\" : `${item?.over + 1} Overs`}\n\n
\n \n {`${this.state.team2winprob}%`}
\n \n {`${this.state.team1winprob}%`}
\n {`${this.state.drawprob}%`}
\n \n
\n \n
\n \n \n )\n }\n}\n","import React, { Component } from 'react';\nimport { HorizontalBar } from 'react-chartjs-2';\n//import '../WigetApp.css'\nimport { getTeamLogo } from '../../config/utils';\n\nexport default class Scorecard extends Component {\n constructor(props) {\n super(props);\n this.state = {\n currentruns: [],\n predictedruns: [],\n playernames: [],\n matchname: null,\n teamID: null,\n imageUrl: [],\n teams: [],\n };\n }\n\n componentDidMount() {\n this.fetchData();\n this.intervalId = setInterval(() => {\n this.fetchData();\n }, 10000);\n }\n componentWillUnmount() {\n clearInterval(this.intervalId);\n }\n fetchData() {\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n\n var tempcurruns = [];\n var temppredruns = [];\n var temppname = [];\n var curTeams = [];\n\n // let baseURL = process.env.REACT_APP_API_ENDPOINT + \"/matches/predictions/\";\n // let matchId = \"1185313\";\n fetch(\n process.env.REACT_APP_API_ENDPOINT + '/api/predictions/runs/' + matchId\n )\n .then((res) => res.json())\n .then((out) => {\n let temp = out.currentInning;\n\n for (let i = 0; i < Object.keys(out.currentInning).length; i++) {\n tempcurruns.push(out.currentInning[i].currentRuns);\n temppredruns.push(out.currentInning[i].predictedRuns);\n temppname.push(out.currentInning[i].playerName);\n }\n for(var i = 0; i < out.gameState.teams.length ; i++) {\n let t = out.gameState.teams[i];\n \n }\n this.setState({\n currentruns: tempcurruns,\n predictedruns: temppredruns,\n playernames: temppname,\n matchname: out.gameState.matchName,\n teamID: out.gameState.battingTeamId,\n teams: out.gameState.teams\n });\n })\n .catch((err) => {\n throw err;\n });\n }\n\n getBattingTeam() {\n this.state.teams.forEach(t => {\n if(t.teamID === this.state.teamID){\n return t.teamName;\n }\n })\n }\n\n render() {\n return (\n \n {this.state.team1name}\n
\n TIE
\n {this.state.team2name}
\n \n
\n );\n }\n}\n","import React, { Component } from 'react';\nimport { HorizontalBar } from 'react-chartjs-2';\nimport { getTeamLogo } from '../../config/utils';\n//import '../WigetApp.css'\nconst teamFlag = {\n 185: 'pt.svg',\n 18: 'gi.svg',\n 3770: 'bb.svg',\n 40: 'af.svg',\n 45: 'mt.svg',\n 42: 'be.svg',\n 126: 'cz.svg',\n 161: 'lu.svg',\n 164: 'mv.svg',\n 207: 'th.svg',\n 108: 'bh.svg',\n 27: 'ae.svg',\n 15: 'nl.svg',\n 20: 'pg.svg',\n 21: 'ar.svg',\n 117: 'br.svg',\n 44: 'cl.svg',\n 139: 'hu.svg',\n 150: 'is.svg',\n 3793: 'gy.svg',\n 3802: 'jm.svg',\n 112: 'bt.svg',\n 28: 'na.svg',\n 5: 'nz.svg',\n 200: 'es.svg',\n 1094: 'gg.svg',\n 175: 'no.svg',\n 9: 'zw.svg',\n 31: 'it.svg',\n 19: 'hk.svg',\n 4083: 'je.svg',\n 16: 'my.svg',\n 26: 'ke.svg',\n 34: 'ug.svg',\n 178: 'pe.svg',\n 12: 'bm.svg',\n 188: 'ro.svg',\n 179: 'ph.svg',\n 17: 'ca.svg',\n 32: 'np.svg',\n 25: 'bd.svg',\n 13: 'dk.svg',\n 209: 'tr.svg',\n 35: 'de.svg',\n 41: 'at.svg',\n 115: 'bz.svg',\n 4082: 'cr.svg',\n 183: 'pa.svg',\n 135: 'gh.svg',\n 173: 'ng.svg',\n 192: 'ws.svg',\n 116: 'bw.svg',\n 191: 'rw.svg',\n 7: 'pk.svg',\n 142: 'id.svg',\n 39: 'ky.svg',\n 216: 'vu.svg',\n 172: 'nc.svg',\n 10: 'fj.svg',\n 36: 'jp.svg',\n 165: 'mx.svg',\n 29: 'ie.svg',\n 30: 'gb-sct.svg',\n 3: 'za.svg',\n 8: 'lk.svg',\n 2: 'au.svg',\n 6: 'in.svg',\n 1: 'gb-eng.svg',\n 23: 'sg.svg',\n 37: 'om.svg',\n 187: 'qa.svg',\n 154: 'sa.svg',\n 38: 'kw.svg',\n};\n\nexport default class Scorecard extends Component {\n constructor(props) {\n super(props);\n this.state = {\n currentballs: [],\n predictedballs: [],\n playernames: [],\n matchname: null,\n teamID: null,\n imageUrl: [],\n };\n }\n\n componentDidMount() {\n this.fetchData();\n this.intervalId = setInterval(() => {\n this.fetchData();\n }, 10000);\n }\n componentWillUnmount() {\n clearInterval(this.intervalId);\n }\n fetchData() {\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n\n var tempcurballs = [];\n var temppredballs = [];\n var temppname = [];\n\n fetch(\n process.env.REACT_APP_API_ENDPOINT + '/api/predictions/balls/' + matchId\n )\n .then((res) => res.json())\n .then((out) => {\n let temp = out.currentInning;\n for (let i = 0; i < Object.keys(out.currentInning).length; i++) {\n tempcurballs.push(out.currentInning[i].currentBallsFaced);\n temppredballs.push(out.currentInning[i].predictedBallsFaced);\n temppname.push(out.currentInning[i].playerName);\n }\n this.setState({\n currentballs: tempcurballs,\n predictedballs: temppredballs,\n playernames: temppname,\n matchname: out.gameState.matchName,\n teamID: out.gameState.battingTeamId,\n });\n })\n .catch((err) => {\n throw err;\n });\n }\n\n render() {\n return (\n \n \n
\n \n {/* \n Current Batting Team: {this.getBattingTeam()}\n */}\n \n
\n \n
\n );\n }\n}\n","import React, { Component } from 'react';\nimport $ from 'jquery';\nimport { HorizontalBar } from 'react-chartjs-2';\nimport player1 from '../img/sample-player-1.png';\nimport player2 from '../img/sample-player-2.png';\nimport curballicon from '../img/balls-icon.png';\nimport curovericon from '../img/overs-icon.png';\nimport httpClient from '../../api/httpClient';\n//import '../WigetApp.css'\nimport {getTeamLogo} from '../../config/utils'\n\n\nexport default class Scorecard extends Component {\n constructor(props) {\n super(props);\n this.intervalId= null;\n this.state = {\n matchName: null,\n battingId: null,\n curball: null,\n inningNum: null,\n curovers: null,\n player1name: null,\n player1prob: null,\n player1remprob: null,\n player2name: null,\n player2prob: null,\n player2remprob: null,\n imageUrl: [],\n };\n }\n\n componentDidMount() {\n this.fetchData();\n this.intervalId = setInterval(() => {\n this.fetchData();\n }, 10000);\n }\n componentWillUnmount() {\n clearInterval(this.intervalId);\n }\n\n async fetchData() {\n var url = document.URL.split('/');\n var Param3 = url[url.length - 1];\n var result = document.URL.split('/');\n var Param2 = result[result.length - 2];\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n try {\n const response = await httpClient.get(process.env.REACT_APP_API_ENDPOINT + '/api/predictions/wicket/' + matchId);\n const out = response.data;\n this.setState({\n matchName: out.gameState.matchName,\n battingId: out.gameState.battingTeamId,\n curball: out.gameState.ballNumber,\n inningNum: out.gameState.inningNumber,\n curovers: out.gameState.overNumber,\n player1name: out.nextWicket[0].playerName,\n player1prob: out.nextWicket[0].outProb,\n player1remprob: 100 - out.nextWicket[0].outProb,\n player2name: out.nextWicket[1].playerName,\n player2prob: out.nextWicket[1].outProb,\n player2remprob: 100 - out.nextWicket[1].outProb,\n });\n }catch(ex){\n\n }\n\n // let baseURL = process.env.REACT_APP_API_ENDPOINT + '/matches/predictions/';\n\n // let baseURL = \"/data/MatchInfoAPI/\" //If no api using this url\n\n\n // fetch(\n // process.env.REACT_APP_API_ENDPOINT + '/api/predictions/wicket/' + matchId\n // )\n // // .then((res) => {\n // // if (res.status === 200){\n // // return res.json()\n // // }\n\n // // })\n // .then((res) => {\n // if (res.status === 200) {\n // let out = res.json();\n\n // this.setState({\n // matchName: out.gameState.matchName,\n // battingId: out.gameState.battingTeamId,\n // curball: out.gameState.ballNumber,\n // inningNum: out.gameState.inningNumber,\n // curovers: out.gameState.overNumber,\n // player1name: out.nextWicket[0].playerName,\n // player1prob: out.nextWicket[0].outProb,\n // player1remprob: 100 - out.nextWicket[0].outProb,\n // player2name: out.nextWicket[1].playerName,\n // player2prob: out.nextWicket[1].outProb,\n // player2remprob: 100 - out.nextWicket[1].outProb,\n // });\n // }\n\n\n // })\n // .catch((err) => {\n // throw err;\n // });\n }\n\n\n\n render() {\n return (\n \n \n
\n \n {/* \n Current Batting Team: \n */}\n \n
\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport $ from \"jquery\";\nimport { Radar } from \"react-chartjs-2\";\nimport httpClient from \"../../api/httpClient\";\nimport Select from \"react-select\";\n\nexport default class WicketPreds extends Component {\n constructor(props) {\n super(props);\n this.state = {\n bowlers: [],\n selectOption: [{ value: 1, label: 1 }],\n data: {},\n };\n }\n async componentDidMount() {\n var url = document.URL.split(\"/\");\n let matchId = \"\";\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n this.matchId = matchId;\n await this.fetchData(matchId, null);\n }\n\n // selectOption = [\n // { value: 1, label: 1 },\n // // { value: \"strawberry\", label: \"Strawberry\" },\n // // { value: \"vanilla\", label: \"Vanilla\" },\n // ];\n\n color = [\"#ff6384\", \"#36a2eb\", \"#cc65fe\", \"#ffce56\"];\n\n fetchData = async (matchId, ball_number) => {\n if (ball_number == null) {\n var response = await httpClient.get(`/api/predictions/fow/${matchId}`);\n } else {\n var response = await httpClient.get(\n `/api/predictions/fow/${matchId}/${ball_number}`\n );\n }\n\n let data = response.data;\n\n let dataSet = [];\n let ball_numbers = data.ball_numbers.map((ball) => {\n return { value: ball, label: ball };\n });\n this.setState({ selectOption: ball_numbers });\n\n if (response.data.predictedWicketTakers.currentInnings.length == 0) {\n return;\n }\n\n\n const bowlers = response.data.predictedWicketTakers.currentInnings[0]?.bowlers.map(\n (bowler) => {\n return bowler.player_name;\n }\n );\n\n for (\n var i = 0;\n i < response.data.predictedWicketTakers.currentInnings.length;\n i++\n ) {\n const batterData = response.data.predictedWicketTakers.currentInnings[i];\n const values = response.data.predictedWicketTakers.currentInnings[\n i\n ]?.bowlers.map((bowler) => {\n return bowler.value;\n });\n let chartdata = {\n label: batterData.name,\n data: values,\n backgroundColor: this.color[i],\n borderColor: this.color[i],\n borderWidth: 2,\n fill: false,\n };\n dataSet.push(chartdata);\n }\n\n data = {\n labels: bowlers,\n datasets: dataSet,\n };\n\n this.setState({ data: data });\n };\n\n options = {\n scale: {\n ticks: { beginAtZero: true },\n },\n };\n\n change = (event) => {\n // this.setState({value: event.target.value});\n\n this.fetchData(this.matchId, event.value);\n };\n\n render() {\n return (\n \n {/*
\n \n {this.state.matchName}\n
*/}\n \n {/* \n Current Batting Team: \n */}\n {/*
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n \n Inning Number: {this.state.inningNum}\n \n
\n \n
\n \n
\n \n
\n
\n \n
\n \n
\n \n
\n \n
\n \n {this.state.player1name}\n
\n \n
\n \n
\n \n
\n \n
\n \n {this.state.player2name}\n
\n \n
\n \n
\n \n
\n
\n );\n }\n}","import React, { useState, Component, useEffect } from 'react'\nimport httpClient from '../../api/httpClient'\nimport { Bar } from 'react-chartjs-2'\nimport { onCopyToClibboard } from '../../config/utils'\n\nimport '../../assets/styles/widget.css'\n\nexport default function GoldIndex ({ match_id }) {\n var url = document.URL.split('/')\n\n if (match_id) {\n var matchId = match_id\n } else {\n var matchId = url[url.length - 1]\n }\n const [teamIndexs, setTeamIndexs] = useState([])\n const [team1, setTeam1] = useState(null)\n const [team2, setTeam2] = useState(null)\n\n useEffect(() => {\n const fetch = async () => {\n let res = await httpClient.get(`/api/preds/power-index/${matchId}`)\n\n let data = res.data\n data.forEach(t => {\n let bow = t.bowling_impact_indices\n for (var i = 0; i < t.batting_impact_indices.length; i++) {\n t.batting_impact_indices[i]['bowling_impact_index'] = bow.filter(\n a => a.player_id == t.batting_impact_indices[i].player_id\n )[0].bowling_impact_index\n }\n })\n\n data.forEach(t => {\n t.batting_impact_indices.sort(\n (a, b) => b.batting_impact_index - a.batting_impact_index\n )\n })\n setTeamIndexs(data)\n if (data.length == 2) {\n\n setTeam1({...data[0], display:true})\n setTeam2({...data[1], display:false })\n }\n }\n fetch()\n }, [match_id])\n\n return (\n \n
\n\n\n\n )\n}\n","import React from 'react';\n\n\nfunction copyTextToClipboard(text) {\n var textArea = document.createElement(\"textarea\");\n textArea.style.position = \"fixed\";\n textArea.style.top = 0;\n textArea.style.left = 0;\n textArea.style.width = \"2em\";\n textArea.style.height = \"2em\";\n textArea.style.padding = 0;\n textArea.style.border = \"none\";\n textArea.style.outline = \"none\";\n textArea.style.boxShadow = \"none\";\n textArea.style.background = \"transparent\";\n textArea.value = text\n document.body.appendChild(textArea);\n textArea.focus();\n textArea.select();\n try {\n var successful = document.execCommand(\"copy\");\n var msg = successful ? \"successful\" : \"unsuccessful\";\n alert(\"Copying to clipboard command was \" + msg);\n } catch (err) {\n alert(\"Oops, unable to copy\");\n }\n document.body.removeChild(textArea);\n }\n\nconst widgetContainer = (WrappedComponent, data) => {\n function onCopyToClibboard() {\n let iframe = data.iframe ? data.iframe : \"\";\n // iframe = iframe + \"access_token=02bd8798-0d7f-4e1a-b2a3-eca455a4ee7\";\n copyTextToClipboard(iframe);\n }\n\n const NewComponent = props => {\n return (\n \n Batsman Power IndexBowler Power Index
\n \n\n \n\n {team1 != null && (\n
\n\n\n {/* \n
\n ) }\n\n\n {team2 != null && (\n \n
\n \n
\n {team1.team_name}
\n\n {team1.batting_impact_indices.map(b => {\n return (\n
\n \n \n {b.bowling_impact_index}{' '}\n \n \n {b.batting_impact_index}{' '}\n \n {b.player_name} \n
\n )\n })}\n \n
\n ) }\n\n \n
\n \n
\n {team2.team_name}
\n\n {team2.batting_impact_indices.map(b => {\n return (\n
\n \n \n {b.bowling_impact_index}{' '}\n \n \n {b.batting_impact_index}{' '}\n \n {b.player_name} \n
\n )\n })}\n \n\n
*/}\n \n
\n\n \n
\n \n Batsman Power Index\n Bowler Power Index\n
\n \n {teamIndexs.map(t => {\n return (\n
\n \n
\n )\n })}\n \n
\n {t.team_name}
\n\n {t.batting_impact_indices.map(b => {\n return (\n
\n \n \n {b.bowling_impact_index}{' '}\n \n \n {b.batting_impact_index}{' '}\n \n {b.player_name} \n
\n )\n })}\n \n \n Copy to Clipboard\n \n
\n )\n }\n return NewComponent;\n};\n\nexport default widgetContainer;\n","import React, { useState, Component, useEffect } from \"react\";\nimport httpClient from \"../../api/httpClient\";\nimport { Doughnut, Bar } from 'react-chartjs-2';\n\n\nexport default function WinlossChart({ match_id }) {\n var url = document.URL.split('/');\n if (match_id) {\n var matchId = match_id;\n } else {\n var matchId = url[url.length - 1];\n }\n\n const [matchStats, setMatchStats] = useState([]);\n const [predResult, setPreresult] = useState({});\n\n useEffect(() => {\n\n let fetchData = async () => {\n const dbMatchID = (await httpClient.get(`api/preds/decode/${matchId}`)).data;\n const res = await httpClient.get(`/api/stats/match/match-regular-stats/?match_id=${dbMatchID}`);\n setMatchStats(res.data);\n const pred_res = await httpClient.get(`/api/predictions/result/${dbMatchID}`);\n var data = pred_res.data;\n data.predOutcomes.winProb.forEach(t => {\n t[\"teamName\"] = data.gameState.teams.filter(l => l.teamId == t.teamId)[0].teamName;\n })\n\n setPreresult(data);\n };\n fetchData();\n\n }, []);\n\n return (\n \n {/* {matchStats.map(m => {\n return (\n
\n );\n}","import React, { useState, Component, useEffect } from \"react\";\nimport httpClient from \"../../api/httpClient\";\nimport { Bar } from 'react-chartjs-2';\n\n\nexport default function BatterEvaluation({ match_id }) {\n var url = document.URL.split('/');\n if (match_id) {\n var matchId = match_id;\n } else {\n var matchId = url[url.length - 1];\n }\n const [team_evaluations, setTeamsEvaluations] = useState([]);\n\n useEffect( () => {\n const fetchData = async() => {\n const venue_match_id = (await httpClient.get(`/api/preds/encode/${matchId}`)).data;\n const res = await httpClient.get(`/api/preds/evaluation-index/${venue_match_id}`)\n \n setTeamsEvaluations(res.data);\n };\n fetchData();\n }, [match_id]);\n\n return (\n \n {m.team_name}\n {m.over ? `${m.total_run}/${m.wicket_lost}` : \"--\"}\n {m.over ? ` RR: ${m.run_rate}` : \"\"}\n
\n );\n })} */}\n \n
\n \n \n
\n );\n\n}","import React, { useState, Component, useEffect } from \"react\";\nimport httpClient from \"../../api/httpClient\";\nimport { Bar } from 'react-chartjs-2';\n\nexport default function BowlerEvaluation({ match_id }) {\n var url = document.URL.split('/');\n if (match_id) {\n var matchId = match_id;\n } else {\n var matchId = url[url.length - 1];\n }\n const [team_evaluations, setTeamsEvaluations] = useState([]);\n\n useEffect(() => {\n const fetchData = async () => {\n const venue_match_id = (await httpClient.get(`/api/preds/encode/${matchId}`)).data;\n const res = await httpClient.get(`/api/preds/evaluation-index/${venue_match_id}`)\n setTeamsEvaluations(res.data);\n };\n fetchData();\n }, [match_id]);\n return (\n \n {team_evaluations.map(t => {\n return (\n
\n\n \n {\n return bat.batsman_name;\n }),\n datasets: [\n {\n backgroundColor: 'gold',\n label: \"Expected Runs\",\n data: t.batsman_evaluation.map((bat) => {\n return (\n bat.expected_runs\n );\n }),\n },\n {\n // backgroundColor: [],\n label: \"Actual Runs\",\n backgroundColor: 'coral',\n data: t.batsman_evaluation.map((bat) => {\n return (\n bat.actual_runs\n );\n }),\n },\n ],\n }}\n \n />\n
\n )\n })}\n {t.team_name}
\n\n
\n );\n\n}","\nimport React, { useState, Component, useEffect } from \"react\";\nimport httpClient from \"../../api/httpClient\";\nimport {getMatch} from \"../../api/match.api\";\nimport { Bar } from 'react-chartjs-2';\nimport { onCopyToClibboard } from \"../../config/utils\";\n\n\nexport default function WicketChange({ match_id }) {\n var url = document.URL.split('/');\n if (match_id) {\n var matchId = match_id;\n } else {\n var matchId = url[url.length - 1];\n }\n \n \n const [partnerships, setPartnerships] = useState([]);\n\n useEffect(() => {\n const fetchData = async () => {\n\n let matchRes = await getMatch(matchId);\n let res = await httpClient.get(`/api/preds/t20i-partnership-break-prob/${matchId}`)\n \n let data = res.data;\n data.forEach(t => {\n let bowlers = []\n for (var key in t.bowler_dismissal_probability) {\n const item = { name: key, value: t.bowler_dismissal_probability[key] }\n bowlers.push(item);\n }\n bowlers.sort((a, b) => b.value - a.value)\n t[\"bowlers\"] = bowlers\n })\n\n setPartnerships(data);\n };\n fetchData();\n }, [match_id]);\n\n return (\n \n {team_evaluations.map(t => {\n return (\n
\n \n {\n return bow.bowler_name;\n }),\n datasets: [\n {\n backgroundColor: '#19398a',\n label: \"Expected StrikeRate\",\n data: t.bowler_evaluation.map((bow) => {\n return (\n bow.expected_sr\n );\n }),\n },\n {\n // backgroundColor: [],\n label: \"StrikeRate\",\n backgroundColor: 'coral',\n data: t.bowler_evaluation.map((bow) => {\n return (\n bow.actual_sr\n );\n }),\n },\n ],\n }}\n />\n
\n )\n })}\n {t.team_name}
\n\n
\n );\n}","import React, { Component } from \"react\";\nimport axios from \"axios\";\nimport { Container, Row, Col } from \"reactstrap\";\n\nimport SubNavigation from \"./components/SubNavigationbar\";\nimport Menu from \"./components/Menu\";\nimport \"./assets/styles/individualMatch.css\";\nimport Winlossplot from \"./widgets/components/winlossplot\";\nimport Teamscorepredplot from \"./widgets/components/teamscorepredplot\";\nimport Winlossprob from \"./widgets/components/winlossprob\";\nimport PlayerRuns from \"./widgets/components/playerruns\";\nimport PlayerBalls from \"./widgets/components/playerballs\";\nimport Nextwicket from \"./widgets/components/nextwicket\";\nimport WicketPred from \"./widgets/components/wicket_preds\";\nimport { getMatch } from \"./api/match.api\";\nimport GoldIndex from \"./widgets/components/gold_index\";\nimport widgetContainer from \"./components/WidgetContainer\";\nimport WinlossChart from \"./widgets/components/winloss_chart\";\nimport BatterEvaluation from \"./widgets/components/batter_evaluation\";\nimport BowlerEvaluation from \"./widgets/components/bowler_evaluation\";\nimport WicketChange from \"./widgets/components/wicket_change\";\nimport httpClient from \"./api/httpClient\";\n// - Match results\n// - match details\n// - balls details\nexport class IndividualMatchPrediction extends Component {\n navHeaders = [\n {\n isSelected: true,\n title: \"Predictions/Results\",\n path: `/matchprediction/${this.props.match.params.matchid}`,\n },\n {\n title: \"Match Stats\",\n path: `/match/${this.props.match.params.matchid}`,\n },\n {\n title: \"Balls Details\",\n path: `/ballsInfo/${this.props.match.params.matchid}`,\n },\n {\n title: \"New Predictions/Results\",\n path: `/new_matchprediction/${this.props.match.params.matchid}`,\n },\n {\n title: \"Lineup Shuffing\",\n path: `/lineupshuffing/${this.props.match.params.matchid}`,\n },\n // {\n // title: \"Outliers\",\n // path: `/Outliers/${this.props.match.params.matchid}`,\n // },\n {\n title: 'Player Evaluation',\n path: `/evaluate/${this.props.match.params.matchid}`,\n },\n {\n title: \"Match Tracking\",\n path: `/match-status/${this.props.match.params.matchid}`,\n },\n ];\n state = {\n match: [],\n team1: [],\n team2: [],\n venue: [],\n encoded_match_id: null,\n };\n\n componentDidMount() {\n this.fetchmatch(this.props.match.params.matchid);\n }\n async fetchmatch(match_id) {\n const response = await getMatch(match_id);\n const encoded_match_id = (await httpClient.get(`/api/preds/encode/${match_id}`)).data;\n this.setState({\n match: response.data,\n match_id: this.getMatchID(response.data.url),\n team1: response.data.team1_id,\n team1_url: this.getTeamUrl(\n this.props.match.params.matchid,\n this.getMatchID(response.data.team1_id.url)\n ),\n team2: response.data.team2_id,\n team2_url: this.getTeamUrl(\n this.props.match.params.matchid,\n this.getMatchID(response.data.team2_id.url)\n ),\n venue: response.data.venue_id,\n ball_url: this.getBallUrl(this.getMatchID(response.data.url)),\n matchdetail_url: this.getMatchDetailUrl(\n this.getMatchID(response.data.url)\n ),\n encoded_match_id: encoded_match_id\n });\n }\n\n getMatchID = (url) => {\n var url_array = url.split(\"/\");\n var len = url_array.length;\n var match_id = url_array[len - 2];\n return match_id;\n };\n\n getBallUrl = (match_id) => {\n return \"/ballsInfo/\" + match_id;\n };\n\n getMatchDetailUrl = (match_id) => {\n return \"/match/\" + match_id;\n };\n\n getTeamUrl = (match_id, team_id) => {\n return \"/teammatchplayerInfo/\" + match_id + \"/\" + team_id;\n };\n\n render() {\n const options = {\n matchid: this.props.match.params.matchid,\n winlossprob:\n '',\n winlossplot:\n '',\n teamscorepreictionplot:\n '',\n playerruns:\n '',\n playerballs:\n '',\n nextwicket:\n '',\n wicketPreds:\n '',\n };\n\n const MatchDetails = ({\n match_id,\n start_date,\n end_date,\n team1_name,\n team1_url,\n team2_name,\n team2_url,\n ground_name,\n country,\n ball_url,\n matchdetail_url,\n }) => (\n \n
\n\n \n
\n Wicket Chances
\n \n
\n \n {partnerships.map(b => {\n return (\n
\n \n
\n );\n })}\n \n
\n\n Batter: {b.batter_name}
\n\n
\n \n
\n {b.bowlers[1].name}
\n \n
\n 2nd
\n \n
\n {b.bowlers[0].name}
\n \n
\n 1st
\n \n
\n {b.bowlers[2].name}
\n \n
\n 3rd
\n \n \n Match ID: {match_id}\n
\n \n \n \n \n Start Date: {start_date}\n
\n \n \n \n \n End Date: {end_date}\n
\n \n \n \n \n Team 1: {`${team1_name}`} \n
\n \n \n \n \n Team 2: {team2_name} \n
\n \n \n \n \n Ground Name: {ground_name}\n
\n \n \n \n \n Win Loss Plot\n
\n \n {/* */}\n \n \n Team Score Prediction Plot\n
\n \n {/* */}\n \n \n Win Loss Probability\n
\n \n {/* */}\n \n \n Player Runs\n
\n \n \n \n BF Predictions\n
\n \n \n \n \n Next Wicket\n
\n \n {/* */}\n \n \n Wicket Taker Probability\n
\n \n {/* */}\n \n \n
\n );\n }\n}\n\nexport default IndividualMatchPrediction;","import React from 'react';\n\nexport default function Iframe(props) {\n\n function copyTextToClipboard(text) {\n var textArea = document.createElement(\"textarea\");\n textArea.style.position = \"fixed\";\n textArea.style.top = 0;\n textArea.style.left = 0;\n textArea.style.width = \"2em\";\n textArea.style.height = \"2em\";\n textArea.style.padding = 0;\n textArea.style.border = \"none\";\n textArea.style.outline = \"none\";\n textArea.style.boxShadow = \"none\";\n textArea.style.background = \"transparent\";\n textArea.value = text;\n document.body.appendChild(textArea);\n textArea.focus();\n textArea.select();\n try {\n var successful = document.execCommand(\"copy\");\n var msg = successful ? \"successful\" : \"unsuccessful\";\n alert(\"Copying to clipboard command was \" + msg);\n } catch (err) {\n alert(\"Oops, unable to copy\");\n }\n document.body.removeChild(textArea);\n }\n\n function onCopyToClibboard() {\n const iframe = props.iframe ? props.iframe : \"\";\n copyTextToClipboard(iframe);\n }\n\n return (\n \n
\n\n \n
\n \n Individual Matches Results\n
\n\n \n \n Copy to Clipboard\n \n
\n );\n}\n","import React, { Component } from 'react';\nimport $ from 'jquery';\nimport ProgressBar from 'react-bootstrap/ProgressBar';\nimport curballicon from '../img/balls-icon.png';\nimport curovericon from '../img/overs-icon.png';\nimport { getTeamLogo } from '../../config/utils';\nimport { getMatchInningDetail, getLastBallDetails } from '../../api/stats.api';\nconst teamFlag = {\n 185: 'pt.svg',\n 18: 'gi.svg',\n 3770: 'bb.svg',\n 40: 'af.svg',\n 45: 'mt.svg',\n 42: 'be.svg',\n 126: 'cz.svg',\n 161: 'lu.svg',\n 164: 'mv.svg',\n 207: 'th.svg',\n 108: 'bh.svg',\n 27: 'ae.svg',\n 15: 'nl.svg',\n 20: 'pg.svg',\n 21: 'ar.svg',\n 117: 'br.svg',\n 44: 'cl.svg',\n 139: 'hu.svg',\n 150: 'is.svg',\n 3793: 'gy.svg',\n 3802: 'jm.svg',\n 112: 'bt.svg',\n 28: 'na.svg',\n 5: 'nz.svg',\n 200: 'es.svg',\n 1094: 'gg.svg',\n 175: 'no.svg',\n 9: 'zw.svg',\n 31: 'it.svg',\n 19: 'hk.svg',\n 4083: 'je.svg',\n 16: 'my.svg',\n 26: 'ke.svg',\n 34: 'ug.svg',\n 178: 'pe.svg',\n 12: 'bm.svg',\n 188: 'ro.svg',\n 179: 'ph.svg',\n 17: 'ca.svg',\n 32: 'np.svg',\n 25: 'bd.svg',\n 13: 'dk.svg',\n 209: 'tr.svg',\n 35: 'de.svg',\n 41: 'at.svg',\n 115: 'bz.svg',\n 4082: 'cr.svg',\n 183: 'pa.svg',\n 135: 'gh.svg',\n 173: 'ng.svg',\n 192: 'ws.svg',\n 116: 'bw.svg',\n 191: 'rw.svg',\n 7: 'pk.svg',\n 142: 'id.svg',\n 39: 'ky.svg',\n 216: 'vu.svg',\n 172: 'nc.svg',\n 10: 'fj.svg',\n 36: 'jp.svg',\n 165: 'mx.svg',\n 29: 'ie.svg',\n 30: 'gb-sct.svg',\n 3: 'za.svg',\n 8: 'lk.svg',\n 2: 'au.svg',\n 6: 'in.svg',\n 1: 'gb-eng.svg',\n 23: 'sg.svg',\n 37: 'om.svg',\n 187: 'qa.svg',\n 154: 'sa.svg',\n 38: 'kw.svg',\n};\n\nexport default class Scorecard extends Component {\n constructor(props) {\n super(props);\n this.state = {\n teamname: null,\n teamId: null,\n imageUrl: [],\n\n team1name: null,\n team1Id: null,\n team1total: 0,\n team1wickets: 0,\n team1predicted: null,\n team2name: null,\n team2Id: null,\n team2total: 0,\n team2wickets: 0,\n team2predicted: null,\n\n matchName: null,\n curball: null,\n curovers: null,\n inningNum: null,\n battingId: null,\n bowlingId: null,\n };\n }\n\n componentDidMount() {\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n this.loadData(matchId);\n }\n async loadData(matchId) {\n let tempscore = null;\n let tempwickets = null;\n\n let data = (await getMatchInningDetail(matchId)).data;\n fetch(\n process.env.REACT_APP_API_ENDPOINT +\n '/api/stats/match/match-inning-details/?match_id=' +\n matchId\n );\n\n if (data.length > 0) {\n\n if (data.length == 2) {\n this.setState({\n team1name: data[0].batting_team_name,\n team1Id: data[0].batting_team_id,\n team1total: data[0].total_runs,\n team1wickets: data[0].wickets,\n team2name: data[0].bowling_team_name,\n team2Id: data[0].bowling_team_id,\n team2total: data[1].total_runs,\n team2wickets: data[1].wickets,\n matchName: data[0].description,\n inningNum: data[1].inning,\n battingId: data[1].batting_team_id,\n bowlingId: data[0].batting_team_id,\n });\n } else {\n this.setState({\n team1name: data[0].batting_team_name,\n team1Id: data[0].batting_team_id,\n team1total: data[0].total_runs,\n team1wickets: data[0].wickets,\n team2name: data[0].bowling_team_name,\n team2Id: data[0].bowling_team_id,\n team2total: '0',\n team2wickets: '0',\n matchName: data[0].description,\n inningNum: data[0].inning,\n battingId: data[0].batting_team_id,\n bowlingId: data[0].bowling_team_id,\n });\n }\n }\n\n let matchData = (await getLastBallDetails(matchId)).data;\n if (matchData.length > 0) {\n this.setState({\n curball: matchData[0].ball,\n curovers: matchData[0].over,\n });\n }\n // fetch(\n // process.env.REACT_APP_API_ENDPOINT +\n // '/api/stats/match/match-last-ball-details/?match_id=' +\n // matchId\n // )\n // .then((res) => res.json())\n // .then((out) => {\n // if (out.results.length > 0) {\n // this.setState({\n // curball: out.results[0].ball,\n // curovers: out.results[0].over,\n // });\n // }\n // })\n // .catch((err) => {\n // throw err;\n // });\n }\n\n getTeam1Logo(teamId) {\n if (teamId in teamFlag && teamId !== 4) {\n var link = '/flags/svg/' + teamFlag[teamId];\n return (\n \n
\n \n \n );\n }\n}\n","import React, { Component } from 'react';\nimport $ from 'jquery';\nimport { getLineupSummary } from '../../api/stats.api';\n\nexport default class LineupsSummary extends Component {\n constructor(props) {\n super(props);\n this.state = {\n team1Id: null,\n team1Name: null,\n teamLineup: [],\n team1Lineup: [],\n team2Lineup: [],\n\n team2Id: null,\n team2Name: null,\n\n matchName: null,\n };\n }\n\n async componentDidMount() {\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n this.loadData(matchId);\n }\n\n async loadData(matchId) {\n var temp1 = [];\n var temp2 = [];\n\n const allResults = (await getLineupSummary(matchId)).data;\n\n for (let i = 0; i < Object.keys(allResults).length; i++) {\n if (allResults[i].innings_number == 2) {\n temp2.push(allResults[i]);\n } else {\n temp1.push(allResults[i]);\n }\n }\n\n var tempteam1 = [];\n var tempteam2 = [];\n\n var tempteam1name = [];\n var tempteam2name = [];\n\n var team1 = null;\n var team2 = null;\n\n for (let i = 0; i < Object.keys(temp1).length; i++) {\n if (!tempteam1name.includes(temp1[i]?.card_long)) {\n tempteam1.push(temp1[i]);\n tempteam1name.push(temp1[i]?.card_long);\n team1 = temp1[i].team_name;\n }\n }\n\n for (let i = 0; i < Object.keys(temp2).length; i++) {\n if (!tempteam2name.includes(temp2[i]?.card_long)) {\n tempteam2.push(temp2[i]);\n tempteam2name.push(temp2[i]?.card_long);\n team2 = temp2[i].team_name;\n }\n }\n this.setState({\n team2Name: team2,\n team2Lineup: tempteam2,\n teamLineup: tempteam1,\n team1Lineup: tempteam1,\n team1Name: team1,\n matchName: allResults[0]?.description,\n });\n }\n\n onClickTeam1() {\n this.setState({\n teamLineup: this.state.team1Lineup,\n });\n\n $('#team2').removeClass('activate');\n $('#team1').addClass('activate');\n }\n\n onClickTeam2() {\n this.setState({\n teamLineup: this.state.team2Lineup,\n });\n\n $('#team1').removeClass('activate');\n $('#team2').addClass('activate');\n }\n\n getDismissal(data) {\n if (data == 'no data') {\n return '';\n } else if (data == 'not out') {\n return (\n \n );\n } else {\n return data;\n }\n }\n\n render() {\n return (\n \n
\n \n \n Current Batting Team:\n \n {this.state.team1name}\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n \n Inning Number : {this.state.inningNum}\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n {this.getTeam1Logo(this.state.team1Id)}\n
\n \n \n \n {('00' + this.state.team1total).slice(-3)}\n \n \n \n {('00' + this.state.team1wickets).slice(-3)}\n \n
\n \n \n VS\n \n
\n \n
\n \n {this.getTeam2Logo(this.state.team2Id)}\n
\n \n \n \n {('00' + this.state.team2total).slice(-3)}\n \n \n \n {('00' + this.state.team2wickets).slice(-3)}\n \n
\n \n
\n );\n }\n}\n","import React, { Component } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport { getTeamsBowling,getTeamsBatting } from '../../api/stats.api';\n\nconst colour = [\n { teamName: 'WestIndies', teamid: 4, code: '#6e0237' },\n { teamName: 'Pakistan', teamid: 7, code: '#00563b' },\n { teamName: 'Afghanistan', teamid: 40, code: '#0033ee' },\n { teamName: 'Bangladesh', teamid: 25, code: '#005400' },\n { teamName: 'India', teamid: 6, code: '#007fff' },\n { teamName: 'SouthAfrica', teamid: 3, code: '#006651' },\n { teamName: 'Australia', teamid: 2, code: '#ffdf00' },\n { teamName: 'England', teamid: 1, code: '#011e3d' },\n { teamName: 'NewZealand', teamid: 5, code: '#000000' },\n { teamName: 'Canada', teamid: 17, code: '#ea3c57' },\n { teamName: 'Netherlands', teamid: 15, code: '#ee7c09' },\n { teamName: 'PapuaNewGuinea', teamid: 20, code: '#000000' },\n { teamName: 'SriLanka', teamid: 8, code: '#000080' },\n { teamName: 'Zimbabwe', teamid: 9, code: '#ff0000' },\n { teamName: 'Kenya', teamid: 26, code: '#006629' },\n { teamName: 'Ireland', teamid: 29, code: '#00cc62' },\n { teamName: 'UAE', teamid: 27, code: '#333333' },\n { teamName: 'Bermuda', teamid: 12, code: '#6e8fd4' },\n { teamName: 'Scotland', teamid: 30, code: '#002a5e' },\n { teamName: 'HongKong', teamid: 19, code: '#000000' },\n { teamName: 'Nepal', teamid: 32, code: '#000080' },\n { teamName: 'Oman', teamid: 37, code: '#ff0000' },\n { teamName: 'Malaysia', teamid: 16, code: '#000000' },\n { teamName: 'Singapore', teamid: 23, code: '#ef3340' },\n { teamName: 'Islamabad United', teamid: 5795, code: '#F05705' },\n { teamName: 'Karachi Kings', teamid: 5793, code: '#4287f5' },\n { teamName: 'Quetta Gladiators', teamid: 5797, code: '#64169C' },\n { teamName: 'Multan Sultans', teamid: 6413, code: '#0d8c46' },\n { teamName: 'Peshawar Zalmi', teamid: 5791, code: '#f7db20' },\n { teamName: 'Lahore Qalandars', teamid: 5799, code: '#a2db27' },\n];\n\nconst teamFlag = {\n 185: 'pt.svg',\n 18: 'gi.svg',\n 3770: 'bb.svg',\n 40: 'af.svg',\n 45: 'mt.svg',\n 42: 'be.svg',\n 126: 'cz.svg',\n 161: 'lu.svg',\n 164: 'mv.svg',\n 207: 'th.svg',\n 108: 'bh.svg',\n 27: 'ae.svg',\n 15: 'nl.svg',\n 20: 'pg.svg',\n 21: 'ar.svg',\n 117: 'br.svg',\n 44: 'cl.svg',\n 139: 'hu.svg',\n 150: 'is.svg',\n 3793: 'gy.svg',\n 3802: 'jm.svg',\n 112: 'bt.svg',\n 28: 'na.svg',\n 5: 'nz.svg',\n 200: 'es.svg',\n 1094: 'gg.svg',\n 175: 'no.svg',\n 9: 'zw.svg',\n 31: 'it.svg',\n 19: 'hk.svg',\n 4083: 'je.svg',\n 16: 'my.svg',\n 26: 'ke.svg',\n 34: 'ug.svg',\n 178: 'pe.svg',\n 12: 'bm.svg',\n 188: 'ro.svg',\n 179: 'ph.svg',\n 17: 'ca.svg',\n 32: 'np.svg',\n 25: 'bd.svg',\n 13: 'dk.svg',\n 209: 'tr.svg',\n 35: 'de.svg',\n 41: 'at.svg',\n 115: 'bz.svg',\n 4082: 'cr.svg',\n 183: 'pa.svg',\n 135: 'gh.svg',\n 173: 'ng.svg',\n 192: 'ws.svg',\n 116: 'bw.svg',\n 191: 'rw.svg',\n 7: 'pk.svg',\n 142: 'id.svg',\n 39: 'ky.svg',\n 216: 'vu.svg',\n 172: 'nc.svg',\n 10: 'fj.svg',\n 36: 'jp.svg',\n 165: 'mx.svg',\n 29: 'ie.svg',\n 30: 'gb-sct.svg',\n 3: 'za.svg',\n 8: 'lk.svg',\n 2: 'au.svg',\n 6: 'in.svg',\n 1: 'gb-eng.svg',\n 23: 'sg.svg',\n 37: 'om.svg',\n 187: 'qa.svg',\n 154: 'sa.svg',\n 38: 'kw.svg',\n};\n\nexport default class topmatchcontributor extends Component {\n constructor(props) {\n super(props);\n this.state = {\n team1Lineup: [],\n team1bat1: [],\n team1bat2: [],\n team1bat3: [],\n\n team1bowl1ob: [],\n team1bowl2ob: [],\n team1bowl3ob: [],\n\n team1bowl1name: [],\n team1bowl2name: [],\n team1bowl3name: [],\n\n team2bowl1ob: [],\n team2bowl2ob: [],\n team2bowl3ob: [],\n\n team2bowl1name: [],\n team2bowl2name: [],\n team2bowl3name: [],\n\n team1show1ob: [],\n team1show2ob: [],\n team1show3ob: [],\n\n team1show1name: [],\n team1show2name: [],\n team1show3name: [],\n\n team2show1ob: [],\n team2show2ob: [],\n team2show3ob: [],\n\n team2show1name: [],\n team2show2name: [],\n team2show3name: [],\n\n team1bowleconrate1ob: [],\n team1bowleconrate2ob: [],\n team1econrate3ob: [],\n\n team1bowleconrate1name: [],\n team1bowleconrate2name: [],\n team1bowleconrate3name: [],\n\n team2bowleconrate1ob: [],\n team2bowleconrate2ob: [],\n team2bowleconrate3ob: [],\n\n team2bowleconrate1name: [],\n team2bowleconrate2name: [],\n team2bowleconrate3name: [],\n\n team1bat1ob: [],\n team1bat2ob: [],\n team1bat3ob: [],\n\n team1bat1name: [],\n team1bat2name: [],\n team1bat3name: [],\n\n team2bat1ob: [],\n team2bat2ob: [],\n team2bat3ob: [],\n\n team2bat1name: [],\n team2bat2name: [],\n team2bat3name: [],\n\n team1batcontribution1ob: [],\n team1batcontribution2ob: [],\n team1batcontribution3ob: [],\n\n team1bat1contributionname: [],\n team1bat2contributionname: [],\n team1bat3contributionname: [],\n\n team2bat1contributionob: [],\n team2bat2contributionob: [],\n team2bat3contributionob: [],\n\n team2bat1contributionname: [],\n team2bat2contributionname: [],\n team2bat3contributionname: [],\n\n team2Lineup: [],\n\n matchName: null,\n team1colour: null,\n team2colour: null,\n imageUrl: [],\n teamid1: null,\n teamid2: null,\n teamname1: null,\n teamname2: null,\n type: null,\n };\n }\n\n async componentDidMount() {\n var temp = [];\n var tempBowlArrT1 = [];\n var tempBowlArrT2 = [];\n var tempBowlEconRateArrT1 = [];\n var tempBowlEconRateArrT2 = [];\n var tempBatArrT1 = [];\n var tempBatArrT2 = [];\n var tempBatContributionArrT1 = [];\n var tempBatContributionArrT2 = [];\n var tempteamid1 = null;\n var tempteamid2 = null;\n var tempColor1 = null;\n var tempColor2 = null;\n\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n\n const response = await getTeamsBowling(matchId);\n const allResults = response?.data;\n\n for (let i = 0; i < Object.keys(allResults).length; i++) {\n if (allResults[i].innings_number == 1) {\n tempBowlArrT1.push(allResults[i]);\n tempteamid1 = allResults[i].team_id;\n } else {\n tempBowlArrT2.push(allResults[i]);\n tempteamid2 = allResults[i].team_id;\n }\n }\n for (let i = 0; i < Object.keys(colour).length; i++) {\n if (tempteamid1 === colour[i].teamid) {\n tempColor1 = colour[i].code;\n }\n if (tempteamid2 === colour[i].teamid) {\n tempColor2 = colour[i].code;\n }\n }\n if (tempColor1 == null) {\n tempColor1 = 'rgba(179,181,198,1)';\n }\n if (tempColor2 == null) {\n tempColor2 = 'rgba(255,99,132,1)';\n }\n\n tempBowlEconRateArrT1 = tempBowlArrT1.sort(function (a, b) {\n return b.economy_rate - a.economy_rate;\n });\n tempBowlEconRateArrT1 = tempBowlEconRateArrT1.slice(0, 3);\n tempBowlEconRateArrT2 = tempBowlArrT2.sort(function (a, b) {\n return b.economy_rate - a.economy_rate;\n });\n tempBowlEconRateArrT2 = tempBowlEconRateArrT2.slice(0, 3);\n\n tempBowlArrT1 = tempBowlArrT1.sort(function (a, b) {\n return b.wickets - a.wickets;\n });\n tempBowlArrT1 = tempBowlArrT1.slice(0, 3);\n tempBowlArrT2 = tempBowlArrT2.sort(function (a, b) {\n return b.wickets - a.wickets;\n });\n tempBowlArrT2 = tempBowlArrT2.slice(0, 3);\n\n this.setState({\n team2Lineup: tempBowlArrT2,\n team1Lineup: tempBowlArrT1,\n\n team1bowl1ob: tempBowlArrT1[0]?.wickets,\n team1bowl2ob: tempBowlArrT1[1]?.wickets,\n team1bowl3ob: tempBowlArrT1[2]?.wickets,\n\n team1bowl1name: tempBowlArrT1[0]?.card_long,\n team1bowl2name: tempBowlArrT1[1]?.card_long,\n team1bowl3name: tempBowlArrT1[2]?.card_long,\n team2bowl1ob: tempBowlArrT2[0]?.wickets,\n team2bowl2ob: tempBowlArrT2[1]?.wickets,\n team2bowl3ob: tempBowlArrT2[2]?.wickets,\n\n team2bowl1name: tempBowlArrT2[0]?.card_long,\n team2bowl2name: tempBowlArrT2[1]?.card_long,\n team2bowl3name: tempBowlArrT2[2]?.card_long,\n\n team1show1ob: tempBowlArrT1[0]?.wickets,\n team1show2ob: tempBowlArrT1[1]?.wickets,\n team1show3ob: tempBowlArrT1[2]?.wickets,\n\n team1show1name: tempBowlArrT1[0]?.card_long,\n team1show2name: tempBowlArrT1[1]?.card_long,\n team1show3name: tempBowlArrT1[2]?.card_long,\n\n team2show1ob: tempBowlArrT2[0]?.wickets,\n team2show2ob: tempBowlArrT2[1]?.wickets,\n team2show3ob: tempBowlArrT2[2]?.wickets,\n\n team2show1name: tempBowlArrT2[0]?.card_long,\n team2show2name: tempBowlArrT2[1]?.card_long,\n team2show3name: tempBowlArrT2[2]?.card_long,\n\n team1bowleconrate1ob: tempBowlEconRateArrT1[0]?.economy_rate,\n team1bowleconrate2ob: tempBowlEconRateArrT1[1]?.economy_rate,\n team1bowleconrate3ob: tempBowlEconRateArrT1[2]?.economy_rate,\n\n team1bowleconrate1name: tempBowlEconRateArrT1[0]?.card_long,\n team1bowleconrate2name: tempBowlEconRateArrT1[1]?.card_long,\n team1bowleconrate3name: tempBowlEconRateArrT1[2]?.card_long,\n\n team2bowleconrate1ob: tempBowlEconRateArrT2[0]?.economy_rate,\n team2bowleconrate2ob: tempBowlEconRateArrT2[1]?.economy_rate,\n team2bowleconrate3ob: tempBowlEconRateArrT2[2]?.economy_rate,\n\n team2bowleconrate1name: tempBowlEconRateArrT2[0]?.card_long,\n team2bowleconrate2name: tempBowlEconRateArrT2[1]?.card_long,\n team2bowleconrate3name: tempBowlEconRateArrT2[2]?.card_long,\n\n team1colour: tempColor1,\n team2colour: tempColor2,\n team1Id: tempBowlArrT1[0]?.team_id,\n team2Id: tempBowlArrT2[0]?.team_id,\n teamname1: tempBowlArrT1[0]?.team_name,\n teamname2: tempBowlArrT2[0]?.team_name,\n type: 'Wicket',\n });\n\n const battingresponse = await getTeamsBatting(matchId);\n const battingResults = battingresponse?.data;\n for (let i = 0; i < Object.keys(battingResults).length; i++) {\n if (battingResults[i].innings_number == 1) {\n tempBatArrT1.push(battingResults[i]);\n tempteamid1 = battingResults[i].team_id;\n } else {\n tempBatArrT2.push(battingResults[i]);\n tempteamid2 = battingResults[i].team_id;\n }\n }\n tempBatContributionArrT1 = tempBatArrT1.sort(function (a, b) {\n return b.run_contribution - a.run_contribution;\n });\n tempBatContributionArrT1 = tempBatContributionArrT1.slice(0, 3);\n tempBatContributionArrT2 = tempBatArrT2.sort(function (a, b) {\n return b.run_contribution - a.run_contribution;\n });\n tempBatContributionArrT2 = tempBatContributionArrT2.slice(0, 3);\n\n tempBatArrT1 = tempBatArrT1.sort(function (a, b) {\n return b.runs_score - a.runs_score;\n });\n tempBatArrT1 = tempBatArrT1.slice(0, 3);\n tempBatArrT2 = tempBatArrT2.sort(function (a, b) {\n return b.runs_score - a.runs_score;\n });\n tempBatArrT2 = tempBatArrT2.slice(0, 3);\n\n this.setState({\n team1bat1ob: tempBatArrT1[0]?.runs_score,\n team1bat2ob: tempBatArrT1[1]?.runs_score,\n team1bat3ob: tempBatArrT1[2]?.runs_score,\n\n team1bat1name: tempBatArrT1[0]?.card_long,\n team1bat2name: tempBatArrT1[1]?.card_long,\n team1bat3name: tempBatArrT1[2]?.card_long,\n\n team2bat1ob: tempBatArrT2[0]?.runs_score,\n team2bat2ob: tempBatArrT2[1]?.runs_score,\n team2bat3ob: tempBatArrT2[2]?.runs_score,\n\n team2bat1name: tempBatArrT2[0]?.card_long,\n team2bat2name: tempBatArrT2[1]?.card_long,\n team2bat3name: tempBatArrT2[2]?.card_long,\n\n team1batcontribution1ob: tempBatContributionArrT1[0]?.run_contribution,\n team1batcontribution2ob: tempBatContributionArrT1[1]?.run_contribution,\n team1batcontribution3ob: tempBatContributionArrT1[2]?.run_contribution,\n\n team1batcontribution1name: tempBatContributionArrT1[0]?.card_long,\n team1batcontribution2name: tempBatContributionArrT1[1]?.card_long,\n team1batcontribution3name: tempBatContributionArrT1[2]?.card_long,\n\n team2batcontribution1ob: tempBatContributionArrT2[0]?.run_contribution,\n team2batcontribution2ob: tempBatContributionArrT2[1]?.run_contribution,\n team2batcontribution3ob: tempBatContributionArrT2[2]?.run_contribution,\n\n team2batcontribution1name: tempBatContributionArrT2[0]?.card_long,\n team2batcontribution2name: tempBatContributionArrT2[1]?.card_long,\n team2batcontribution3name: tempBatContributionArrT2[2]?.card_long,\n });\n }\n\n onChangeTop(event) {\n // eslint-disable-next-line default-case\n switch (event.target.value) {\n case 'batscores':\n this.setState({\n team1show1ob: this.state.team1bat1ob,\n team1show2ob: this.state.team1bat2ob,\n team1show3ob: this.state.team1bat3ob,\n\n team1show1name: this.state.team1bat1name,\n team1show2name: this.state.team1bat2name,\n team1show3name: this.state.team1bat3name,\n\n team2show1ob: this.state.team2bat1ob,\n team2show2ob: this.state.team2bat2ob,\n team2show3ob: this.state.team2bat3ob,\n\n team2show1name: this.state.team2bat1name,\n team2show2name: this.state.team2bat2name,\n team2show3name: this.state.team2bat3name,\n type: 'Batsmen scored',\n });\n break;\n case 'batcontribution':\n this.setState({\n team1show1ob: this.state.team1batcontribution1ob,\n team1show2ob: this.state.team1batcontribution2ob,\n team1show3ob: this.state.team1batcontribution3ob,\n\n team1show1name: this.state.team1batcontribution1name,\n team1show2name: this.state.team1batcontribution2name,\n team1show3name: this.state.team1batcontribution3name,\n\n team2show1ob: this.state.team2batcontribution1ob,\n team2show2ob: this.state.team2batcontribution2ob,\n team2show3ob: this.state.team2batcontribution3ob,\n\n team2show1name: this.state.team2batcontribution1name,\n team2show2name: this.state.team2batcontribution2name,\n team2show3name: this.state.team2batcontribution3name,\n type: 'Contribution Rate',\n });\n break;\n case 'bowlwicket':\n this.setState({\n team1show1ob: this.state.team1bowl1ob,\n team1show2ob: this.state.team1bowl2ob,\n team1show3ob: this.state.team1bowl3ob,\n\n team1show1name: this.state.team1bowl1name,\n team1show2name: this.state.team1bowl2name,\n team1show3name: this.state.team1bowl3name,\n\n team2show1ob: this.state.team2bowl1ob,\n team2show2ob: this.state.team2bowl2ob,\n team2show3ob: this.state.team2bowl3ob,\n\n team2show1name: this.state.team2bowl1name,\n team2show2name: this.state.team2bowl2name,\n team2show3name: this.state.team2bowl3name,\n type: 'Wicket taker',\n });\n break;\n case 'bowleconrate':\n this.setState({\n team1show1ob: this.state.team1bowleconrate1ob,\n team1show2ob: this.state.team1bowleconrate2ob,\n team1show3ob: this.state.team1bowleconrate3ob,\n\n team1show1name: this.state.team1bowleconrate1name,\n team1show2name: this.state.team1bowleconrate2name,\n team1show3name: this.state.team1bowleconrate3name,\n\n team2show1ob: this.state.team2bowleconrate1ob,\n team2show2ob: this.state.team2bowleconrate2ob,\n team2show3ob: this.state.team2bowleconrate3ob,\n\n team2show1name: this.state.team2bowleconrate1name,\n team2show2name: this.state.team2bowleconrate2name,\n team2show3name: this.state.team2bowleconrate3name,\n type: 'Economy Rate',\n });\n break;\n }\n }\n\n getTeam1Logo(teamId) {\n if (teamId in teamFlag && teamId !== 4) {\n var link = '/flags/svg/' + teamFlag[teamId];\n return (\n \n \n
\n \n
\n \n
\n \n
\n \n \n \n
\n
\n | {this.state.team1Name} | \n\n {this.state.team2Name}\n | \n
|---|---|
| {lineup?.card_long} | \n\n {this.state.team2Lineup[index]?.card_long}\n | \n
\n
\n );\n }\n}\n","import React, { Component } from 'react'\nimport {Polar} from 'react-chartjs-2';\n//import '../WigetApp.css'\nimport {getInningboundaries} from '../../api/stats.api'\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nexport default class Boundaries extends Component {\n constructor(props) {\n super(props);\n this.state = {\n\n imageUrl: [],\n inn1PP: null,\n inn1MO: null,\n inn1DO: null,\n inn2PP: null,\n inn2MO: null,\n inn2DO: null,\n inn1BatId: null,\n inn1TeamName: null,\n inn2BatId: null,\n inn2TeamName: null,\n description: null\n\n }\n }\n\ncomponentDidMount() {\n var url = document.URL.split(\"/\");\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length-1];\n }else {\n matchId = this.props.match_id;\n }\n\n this.loadData(matchId);\n}\n\nasync loadData(matchId) {\n var temp1pp= null;\n var temp1mo= null;\n var temp1do= null;\n var temp1batid= null;\n var temp1name= \"\\xa0\";\n\n var temp2pp= null;\n var temp2mo= null;\n var temp2do= null;\n var temp2batid= null;\n var temp2name= \"\\xa0\";\n\n let data = (await getInningboundaries(matchId)).data;\n for (let i = 0; i < data.length; i++) {\n let item = data[i];\n if(item.inning == 1){\n temp1pp= item.powerplay_boundaries;\n temp1mo = item.middleover_boundaries;\n temp1do = item.deathover_boundaries;\n temp1batid = item.batting_team_id;\n temp1name = item.batting_team_name;\n }\n else {\n temp2pp= item.powerplay_boundaries;\n temp2mo = item.middleover_boundaries;\n temp2do = item.deathover_boundaries;\n temp2batid = item.batting_team_id;\n temp2name = item.batting_team_name;\n }\n }\n this.setState({\n inn1PP: temp1pp,\n inn1MO: temp1mo,\n inn1DO: temp1do,\n inn2PP: temp2pp,\n inn2MO: temp2mo,\n inn2DO: temp2do,\n inn1BatId: temp1batid,\n inn1TeamName: temp1name,\n inn2BatId: temp2batid,\n inn2TeamName: temp2name,\n })\n\n\n}\n\ngetTeam1Logo(teamId) {\n\n if (teamId in teamFlag && teamId !==4 ){\n var link = '/flags/svg/'+teamFlag[teamId]\n return \n
\n \n \n {this.getTeam1Logo(this.state.team1Id)}\n
\n \n \n {this.getTeam2Logo(this.state.team2Id)}\n
\n \n
\n\n \n \n \n \n \n \n \n
\n Top 3
\n \n
\n \n
\n )\n }\n}\n","import React, { Component } from 'react';\nimport { Polar } from 'react-chartjs-2';\n//import '../WigetApp.css'\nimport { getTeamLogo } from '../../config/utils';\nimport { getInningDotballs } from '../../api/stats.api';\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n};\nexport default class Dotballs extends Component {\n constructor(props) {\n super(props);\n this.state = {\n imageUrl: [],\n inn1PP: null,\n inn1MO: null,\n inn1DO: null,\n inn2PP: null,\n inn2MO: null,\n inn2DO: null,\n inn1BatId: null,\n inn2BatId: null,\n description: null,\n };\n }\n\n componentDidMount() {\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n this.loadData(matchId);\n }\n async loadData(matchId) {\n let data = (await getInningDotballs(matchId)).data;\n this.setState({\n inn1TeamName: data[0]?.batting_team_name,\n inn1PP: data[0]?.powerplay_dotballs,\n inn1MO: data[0]?.middleover_dotballs,\n inn1DO: data[0]?.deathover_dotballs,\n inn2PP: data[1]?.powerplay_dotballs,\n inn2MO: data[1]?.middleover_dotballs,\n inn2DO: data[1]?.deathover_dotballs,\n inn1BatId: data[0]?.batting_team_id,\n inn2BatId: data[1]?.batting_team_id,\n description: data[0]?.description,\n inn2TeamName: data[1]?.batting_team_name\n });\n }\n getTeam2Logo(teamId) {\n\n if (teamId in teamFlag && teamId !== 4) {\n var link = '/flags/svg/' + teamFlag[teamId]\n return \n\n \n
\n \n
\n\n \n
\n \n
\n \n 1st Inning: \n
\n \n {this.getTeam1Logo(this.state.inn1BatId)}\n
\n \n
\n\n {/* \n \n
\n \n \n
\n \n \n
\n \n
*/}\n\n \n Powerplay\n
\n \n Midover\n
\n \n Deathover\n
\n \n
\n \n 2nd Inning:\n
\n \n {this.getTeam2Logo(this.state.inn2BatId)}\n
\n \n\n {/*
\n\n \n Powerplay\n
\n \n Midover\n
\n \n Deathover\n
*/}\n\n \n Boundaries\n
\n \n
\n );\n }\n}\n","import React, { Component } from 'react';\nimport { Polar } from 'react-chartjs-2';\nimport { getTeamLogo } from '../../config/utils';\nimport { getInningWickets } from '../../api/stats.api';\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\nexport default class Wickets extends Component {\n constructor(props) {\n super(props);\n this.state = {\n imageUrl: [],\n inn1PP: null,\n inn1MO: null,\n inn1DO: null,\n inn2PP: null,\n inn2MO: null,\n inn2DO: null,\n inn1BatId: null,\n inn2BatId: null,\n description: null,\n };\n }\n\n componentDidMount() {\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n this.loadData(matchId);\n }\n\n async loadData(matchId) {\n let data = (await getInningWickets(matchId)).data;\n this.setState({\n inn1TeamName: data[0]?.batting_team_name,\n inn2TeamName: data[1]?.batting_team_name,\n inn1PP: data[0]?.powerplay_wickets_lost_4,\n inn1MO: data[0]?.middleover_wickets_lost_4,\n inn1DO: data[0]?.deathover_wickets_lost_4,\n inn2PP: data[1]?.powerplay_wickets_lost_4,\n inn2MO: data[1]?.middleover_wickets_lost_4,\n inn2DO: data[1]?.deathover_wickets_lost_4,\n inn1BatId: data[0]?.batting_team_id,\n inn2BatId: data[1]?.batting_team_id,\n description: data[0]?.description,\n });\n }\n getTeam1Logo(teamId) {\n\n if (teamId in teamFlag && teamId !==4 ){\n var link = '/flags/svg/'+teamFlag[teamId]\n return \n\n
\n \n
\n\n \n
\n \n
\n\n \n \n 1st Inning: \n \n
\n \n {this.getTeam1Logo(this.state.inn1BatId)}\n
\n\n\n \n
\n \n \n 2nd Inning:\n \n
\n \n {this.getTeam2Logo(this.state.inn1BatId)}\n
\n\n \n \n Dotballs\n \n
\n \n
\n );\n }\n}\n","import React, { Component } from 'react';\nimport { Bubble } from 'react-chartjs-2';\nimport { getTeamLogo } from '../../config/utils';\nimport { getInningEconrate, getInningWickets } from '../../api/stats.api';\n\nconst colour = [\n { teamid: 4, code: '#6e0237' },\n { teamid: 7, code: '#00563b' },\n { teamid: 40, code: '#0033ee' },\n { teamid: 25, code: '#005400' },\n { teamid: 6, code: '#007fff' },\n { teamid: 3, code: '#006651' },\n { teamid: 2, code: '#ffdf00' },\n { teamid: 1, code: '#011e3d' },\n { teamid: 5, code: '#000000' },\n { teamid: 17, code: '#ea3c57' },\n { teamid: 15, code: '#ee7c09' },\n { teamid: 20, code: '#000000' },\n { teamid: 8, code: '#000080' },\n { teamid: 9, code: '#ff0000' },\n { teamid: 26, code: '#006629' },\n { teamid: 29, code: '#00cc62' },\n { teamid: 27, code: '#333333' },\n { teamid: 12, code: '#6e8fd4' },\n { teamid: 30, code: '#002a5e' },\n { teamid: 19, code: '#000000' },\n { teamid: 32, code: '#000080' },\n { teamid: 37, code: '#ff0000' },\n { teamid: 16, code: '#000000' },\n { teamid: 23, code: '#ef3340' },\n];\n\nconst options = {\n scales: {\n xAxes: [\n {\n gridLines: {\n display: false,\n },\n display: true,\n ticks: {\n beginAtZero: true,\n max: 4,\n display: false,\n },\n },\n ],\n yAxes: [\n {\n gridLines: {\n display: false,\n },\n display: true,\n ticks: {\n beginAtZero: true, // minimum value will be 0.\n max: 9,\n display: false,\n },\n },\n ],\n },\n tooltips: {\n callbacks: {\n label: function (tooltipItem, data) {\n var rLabel =\n data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index].r;\n return (\n data.datasets[tooltipItem.datasetIndex].label + ': ' + rLabel / 5\n );\n },\n },\n },\n legend: {\n display: false,\n },\n};\n\nexport default class Scorecard extends Component {\n constructor(props) {\n super(props);\n this.state = {\n imageUrl: [],\n inn1ER: null,\n inn1Player: null,\n inn2ER: null,\n inn2Player: null,\n inn1BatId: null,\n inn2BatId: null,\n description: null,\n team1colour: null,\n team2colour: null,\n };\n }\n\n componentDidMount() {\n this.loadData();\n }\n\n async loadData() {\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n\n let tempColor1 = null;\n let tempColor2 = null;\n const data = (await getInningEconrate(matchId)).data;\n this.setState({\n inn1ER: data[0]?.economy_rate,\n inn1Player: data[0]?.card_long,\n inn2ER: data[0]?.economy_rate,\n inn2Player: data[0]?.card_long,\n description: data[0]?.description,\n });\n let inningWicketData = (await getInningWickets(matchId)).data;\n for (let i = 0; i < Object.keys(colour).length; i++) {\n if (inningWicketData[0]?.batting_team_id === colour[i].teamid) {\n tempColor2 = colour[i].code;\n }\n if (inningWicketData[1]?.batting_team_id === colour[i].teamid) {\n tempColor1 = colour[i].code;\n }\n }\n if (tempColor1 == null) {\n tempColor1 = 'rgba(179,181,198,1)';\n }\n if (tempColor2 == null) {\n tempColor2 = 'rgba(255,99,132,1)';\n }\n this.setState({\n team1name: inningWicketData[0]?.batting_team_name,\n team2name: inningWicketData[1]?.batting_team_name,\n inn1BatId: inningWicketData[0]?.batting_team_id,\n inn2BatId: inningWicketData[1]?.batting_team_id,\n team1colour: tempColor1,\n team2colour: tempColor2,\n });\n }\n\n getTeam1Logo(teamId) {\n\n return {this.state.team1name};\n }\n getTeam2Logo(teamId) {\n\n return {this.state.team2name};\n }\n\n render() {\n return (\n \n \n
\n \n
\n \n
\n \n
\n \n \n 1st Inning: \n \n
\n \n {this.getTeam1Logo(this.state.inn1BatId)}\n
\n \n \n
\n \n \n 2nd Inning:\n \n
\n \n {this.getTeam1Logo(this.state.inn1BatId)}\n
\n \n \n \n Wickets\n \n
\n \n
\n );\n }\n}\n","import React, { Component } from 'react';\nimport { Bubble } from 'react-chartjs-2';\nimport { getTeamLogo } from '../../config/utils';\nimport { getInningRunrate } from '../../api/stats.api';\nconst colour = [\n { teamid: 4, code: '#6e0237' },\n { teamid: 7, code: '#00563b' },\n { teamid: 40, code: '#0033ee' },\n { teamid: 25, code: '#005400' },\n { teamid: 6, code: '#007fff' },\n { teamid: 3, code: '#006651' },\n { teamid: 2, code: '#ffdf00' },\n { teamid: 1, code: '#011e3d' },\n { teamid: 5, code: '#000000' },\n { teamid: 17, code: '#ea3c57' },\n { teamid: 15, code: '#ee7c09' },\n { teamid: 20, code: '#000000' },\n { teamid: 8, code: '#000080' },\n { teamid: 9, code: '#ff0000' },\n { teamid: 26, code: '#006629' },\n { teamid: 29, code: '#00cc62' },\n { teamid: 27, code: '#333333' },\n { teamid: 12, code: '#6e8fd4' },\n { teamid: 30, code: '#002a5e' },\n { teamid: 19, code: '#000000' },\n { teamid: 32, code: '#000080' },\n { teamid: 37, code: '#ff0000' },\n { teamid: 16, code: '#000000' },\n { teamid: 23, code: '#ef3340' },\n];\n\nconst options = {\n scales: {\n xAxes: [\n {\n display: true,\n ticks: {\n beginAtZero: true,\n max: 3,\n display: true,\n },\n },\n ],\n yAxes: [\n {\n display: true,\n ticks: {\n beginAtZero: true, // minimum value will be 0.\n max: 20,\n display: true,\n },\n },\n ],\n },\n tooltips: {\n callbacks: {\n label: function (tooltipItem, data) {\n var rLabel =\n data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index].r;\n return (\n data.datasets[tooltipItem.datasetIndex].label + ': ' + rLabel / 2\n );\n },\n },\n },\n legend: {\n display: false,\n },\n};\n\nexport default class runrate extends Component {\n constructor(props) {\n super(props);\n this.state = {\n imageUrl: [],\n team1colour: null,\n team2colour: null,\n team1name: null,\n team2name: null,\n inn1PP: null,\n inn1MO: null,\n inn1DO: null,\n inn2PP: null,\n inn2MO: null,\n inn2DO: null,\n inn1BatId: null,\n inn2BatId: null,\n description: null,\n };\n }\n\n componentDidMount() {\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n this.loadData(matchId);\n }\n\n async loadData(matchId) {\n let tempColor1 = null;\n let tempColor2 = null;\n const data = (await getInningRunrate(matchId)).data;\n for (let i = 0; i < Object.keys(colour).length; i++) {\n if (data.batting_team_id === colour[i].teamid) {\n tempColor1 = colour[i].code;\n }\n if (data.batting_team_id === colour[i].teamid) {\n tempColor2 = colour[i].code;\n }\n }\n if (tempColor1 == null) {\n tempColor1 = 'rgba(179,181,198,1)';\n }\n if (tempColor2 == null) {\n tempColor2 = 'rgba(255,99,132,1)';\n }\n this.setState({\n\n inn1PP: data[0]?.powerplay_runrate,\n inn1MO: data[0]?.middleover_runrate,\n inn1DO: data[0]?.deathover_runrate,\n inn2PP: data[1]?.powerplay_runrate,\n inn2MO: data[1]?.middleover_runrate,\n inn2DO: data[1]?.deathover_runrate,\n inn1BatId: data[0]?.batting_team_id,\n inn2BatId: data[1]?.batting_team_id,\n team1name: data[0]?.batting_team_name,\n team2name: data[1]?.batting_team_name,\n description: data[0]?.description,\n team1colour: tempColor1,\n team2colour: tempColor2,\n });\n }\n getTeam1Logo(teamId) {\n\n return {this.state.team1name};\n }\n getTeam2Logo(teamId) {\n\n return {this.state.team2name};\n }\n render() {\n return (\n \n \n
\n \n
\n \n
\n \n
\n \n \n 1st Inning: \n \n
\n \n \n {this.getTeam1Logo(this.state.inn1BatId)}\n \n \n
\n \n
\n \n \n 2nd Inning:\n \n
\n \n \n {this.getTeam2Logo(this.state.inn2BatId)}\n \n \n
\n \n \n Best economy rate for each inning\n \n
\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport $ from \"jquery\";\n\nimport {getLineupSummary} from '../../api/stats.api';\n\nasync function fetchPages(url, page_num, max_pages = 10000, acc) {\n let page = await fetch(url + \"\" + page_num).then((response) =>\n response.json()\n );\n if (page.next == null || page_num >= max_pages) {\n return acc.concat(page.results);\n } else {\n return await fetchPages(\n url,\n page_num + 1,\n max_pages,\n acc.concat(page.results)\n );\n }\n}\n\nexport default class LineupsSummary extends Component {\n constructor(props) {\n super(props);\n this.state = {\n team1Id: null,\n team1Name: null,\n\n teamLineup: [],\n team1Lineup: [],\n team2Lineup: [],\n\n team2Id: null,\n team2Name: null,\n\n matchName: null,\n };\n }\n\n async componentDidMount() {\n var url = document.URL.split(\"/\");\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length-1];\n }else {\n matchId = this.props.match_id;\n }\n this.loadData(matchId);\n }\n\n async loadData(matchId) {\n var temp = [];\n var temp1 = [];\n var temp2 = [];\n let checker = [];\n\n let allResults = (await getLineupSummary(matchId)).data;\n for (let i = 0; i < Object.keys(allResults).length; i++) {\n if (allResults[i].innings_number === 2) {\n temp2.push(allResults[i]);\n } else {\n temp1.push(allResults[i]);\n }\n }\n\n var tempteam1 = [];\n var tempteam2 = [];\n\n var tempteam1name = [];\n var tempteam2name = [];\n\n var team1 = null;\n var team2 = null;\n\n for (let i = 0; i < Object.keys(temp1).length; i++) {\n if (!tempteam1name.includes(temp1[i].card_long)) {\n tempteam1.push(temp1[i]);\n tempteam1name.push(temp1[i].card_long);\n team1 = temp1[i].team_name;\n }\n }\n\n for (let i = 0; i < Object.keys(temp2).length; i++) {\n if (!tempteam2name.includes(temp2[i].card_long)) {\n tempteam2.push(temp2[i]);\n tempteam2name.push(temp2[i].card_long);\n team2 = temp2[i].team_name;\n }\n }\n this.setState({\n team2Name: team2,\n team2Lineup: tempteam2,\n teamLineup: tempteam1,\n team1Lineup: tempteam1,\n team1Name: team1,\n matchName: allResults[0]?.description,\n });\n }\n\n onClickTeam1() {\n this.setState({\n teamLineup: this.state.team1Lineup,\n });\n\n $(\"#team2\").removeClass(\"activate\");\n $(\"#team1\").addClass(\"activate\");\n }\n\n onClickTeam2() {\n this.setState({\n teamLineup: this.state.team2Lineup,\n });\n\n $(\"#team1\").removeClass(\"activate\");\n $(\"#team2\").addClass(\"activate\");\n }\n\n getDismissal(data) {\n if (data === \"no data\") {\n return \"\";\n } else if (data === \"not out\") {\n return (\n \n\n
\n \n
\n\n \n
\n \n
\n\n \n \n 1st Inning: \n \n
\n \n \n {this.getTeam1Logo(this.state.inn1BatId)}\n \n\n
\n \n
\n \n \n 2nd Inning:\n \n
\n \n \n {this.getTeam2Logo(this.state.inn2BatId)}\n \n\n
\n \n \n Run Rate\n \n
\n\n \n
\n\n \n \n \n {this.state.team1name}\n \n
\n \n \n \n {this.state.team2name}\n \n
\n \n
\n \n
\n \n \n PowerPlay\n \n
\n\n \n
\n \n \n MidOvers\n \n
\n\n \n
\n \n \n DeathOvers\n \n
\n\n \n
\n );\n }\n}\n","import React, { Component } from 'react';\nimport $ from 'jquery';\nimport { getTeamsBatting } from '../../api/stats.api';\n\nconst colour = [\n { teamid: 4, code: '#6e0237' },\n { teamid: 7, code: '#00563b' },\n { teamid: 40, code: '#0033ee' },\n { teamid: 25, code: '#005400' },\n { teamid: 6, code: '#007fff' },\n { teamid: 3, code: '#006651' },\n { teamid: 2, code: '#ffdf00' },\n { teamid: 1, code: '#011e3d' },\n { teamid: 5, code: '#000000' },\n { teamid: 17, code: '#ea3c57' },\n { teamid: 15, code: '#ee7c09' },\n { teamid: 20, code: '#000000' },\n { teamid: 8, code: '#000080' },\n { teamid: 9, code: '#ff0000' },\n { teamid: 26, code: '#006629' },\n { teamid: 29, code: '#00cc62' },\n { teamid: 27, code: '#333333' },\n { teamid: 12, code: '#6e8fd4' },\n { teamid: 30, code: '#002a5e' },\n { teamid: 19, code: '#000000' },\n { teamid: 32, code: '#000080' },\n { teamid: 37, code: '#ff0000' },\n { teamid: 16, code: '#000000' },\n { teamid: 23, code: '#ef3340' },\n { teamid: 5795, code: '#F05705' },\n { teamid: 5793, code: '#4287f5' },\n { teamid: 5797, code: '#64169C' },\n { teamid: 6413, code: '#0d8c46' },\n { teamid: 5791, code: '#f7db20' },\n { teamid: 5799, code: '#a2db27' },\n];\n\nexport default class teamheadtoheadbatting extends Component {\n constructor(props) {\n super(props);\n this.state = {\n team1Lineup: [],\n };\n }\n\n componentDidMount() {\n this.loadData();\n }\n async loadData() {\n var temp1 = [];\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n const response = await getTeamsBatting(matchId);\n let data = response?.data;\n data = data.sort(function (a, b) {\n return a.innings_number - b.innings_number;\n });\n this.setState({\n team1Lineup: data,\n });\n }\n\n getDismissal(data) {\n if (data == 'no data') {\n return '';\n } else if (data == 'not out') {\n return (\n \n \n
\n \n
\n \n
\n \n
\n \n \n \n
\n
\n | \n Player Name\n | \n\n Dismissal\n | \nB | \nR | \n
|---|---|---|---|
| {lineup.card_long} | \n{this.getDismissal(lineup.dismissal_type)} | \n{lineup.count} | \n{Math.round(lineup.sum)} | \n
\n \n {this.state.team1Name}\n \n \n \n {this.state.team2Name}\n \n
\n\n \n
\n );\n }\n}\n","import React, { Component } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport $ from 'jquery';\nimport { getTeamsBatting } from '../../api/stats.api';\n\nconst colour = [\n { teamid: 4, code: '#6e0237' },\n { teamid: 7, code: '#00563b' },\n { teamid: 40, code: '#0033ee' },\n { teamid: 25, code: '#005400' },\n { teamid: 6, code: '#007fff' },\n { teamid: 3, code: '#006651' },\n { teamid: 2, code: '#ffdf00' },\n { teamid: 1, code: '#011e3d' },\n { teamid: 5, code: '#000000' },\n { teamid: 17, code: '#ea3c57' },\n { teamid: 15, code: '#ee7c09' },\n { teamid: 20, code: '#000000' },\n { teamid: 8, code: '#000080' },\n { teamid: 9, code: '#ff0000' },\n { teamid: 26, code: '#006629' },\n { teamid: 29, code: '#00cc62' },\n { teamid: 27, code: '#333333' },\n { teamid: 12, code: '#6e8fd4' },\n { teamid: 30, code: '#002a5e' },\n { teamid: 19, code: '#000000' },\n { teamid: 32, code: '#000080' },\n { teamid: 37, code: '#ff0000' },\n { teamid: 16, code: '#000000' },\n { teamid: 23, code: '#ef3340' },\n { teamid: 5795, code: '#F05705' },\n { teamid: 5793, code: '#4287f5' },\n { teamid: 5797, code: '#64169C' },\n { teamid: 6413, code: '#0d8c46' },\n { teamid: 5791, code: '#f7db20' },\n { teamid: 5799, code: '#a2db27' },\n];\n\nconst teamFlag = {\n 185: 'pt.svg',\n 18: 'gi.svg',\n 3770: 'bb.svg',\n 40: 'af.svg',\n 45: 'mt.svg',\n 42: 'be.svg',\n 126: 'cz.svg',\n 161: 'lu.svg',\n 164: 'mv.svg',\n 207: 'th.svg',\n 108: 'bh.svg',\n 27: 'ae.svg',\n 15: 'nl.svg',\n 20: 'pg.svg',\n 21: 'ar.svg',\n 117: 'br.svg',\n 44: 'cl.svg',\n 139: 'hu.svg',\n 150: 'is.svg',\n 3793: 'gy.svg',\n 3802: 'jm.svg',\n 112: 'bt.svg',\n 28: 'na.svg',\n 5: 'nz.svg',\n 200: 'es.svg',\n 1094: 'gg.svg',\n 175: 'no.svg',\n 9: 'zw.svg',\n 31: 'it.svg',\n 19: 'hk.svg',\n 4083: 'je.svg',\n 16: 'my.svg',\n 26: 'ke.svg',\n 34: 'ug.svg',\n 178: 'pe.svg',\n 12: 'bm.svg',\n 188: 'ro.svg',\n 179: 'ph.svg',\n 17: 'ca.svg',\n 32: 'np.svg',\n 25: 'bd.svg',\n 13: 'dk.svg',\n 209: 'tr.svg',\n 35: 'de.svg',\n 41: 'at.svg',\n 115: 'bz.svg',\n 4082: 'cr.svg',\n 183: 'pa.svg',\n 135: 'gh.svg',\n 173: 'ng.svg',\n 192: 'ws.svg',\n 116: 'bw.svg',\n 191: 'rw.svg',\n 7: 'pk.svg',\n 142: 'id.svg',\n 39: 'ky.svg',\n 216: 'vu.svg',\n 172: 'nc.svg',\n 10: 'fj.svg',\n 36: 'jp.svg',\n 165: 'mx.svg',\n 29: 'ie.svg',\n 30: 'gb-sct.svg',\n 3: 'za.svg',\n 8: 'lk.svg',\n 2: 'au.svg',\n 6: 'in.svg',\n 1: 'gb-eng.svg',\n 23: 'sg.svg',\n 37: 'om.svg',\n 187: 'qa.svg',\n 154: 'sa.svg',\n 38: 'kw.svg',\n};\n\nexport default class teamheadtoheadbatting extends Component {\n constructor(props) {\n super(props);\n this.state = {\n team1Id: null,\n team1Name: null,\n team1Lineup: [],\n team2Lineup: [],\n team2Id: null,\n team2Name: null,\n matchName: null,\n player1: [],\n player2: [],\n team1colour: null,\n team2colour: null,\n imageUrl: [],\n };\n }\n\n componentDidMount() {\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n this.loadData(matchId);\n }\n\n async loadData(matchId) {\n var temp1 = [];\n var temp2 = [];\n let temp1id = null;\n let temp2id = null;\n let tempColor1 = null;\n let tempColor2 = null;\n let team1Name = null;\n let team2Name = null;\n const response = await getTeamsBatting(matchId);\n const data = response?.data;\n\n for (let i = 0; i < data.length; i++) {\n const item = data[i];\n if (item.innings_number === 1) {\n temp1.push(item);\n temp1id = item.team_id;\n team1Name = item.team_name;\n } else {\n temp2.push(item);\n temp2id = item.team_id;\n team2Name = item.team_name;\n }\n }\n\n for (let i = 0; i < Object.keys(colour).length; i++) {\n if (temp1[0]?.team_id === colour[i]?.teamid) {\n tempColor1 = colour[i].code;\n }\n if (temp1[0]?.team_id === colour[i]?.teamid) {\n tempColor2 = colour[i].code;\n }\n }\n\n if (tempColor1 == null) {\n tempColor1 = 'rgba(179,181,198,1)';\n }\n if (tempColor2 == null) {\n tempColor2 = 'rgba(255,99,132,1)';\n }\n this.setState({\n team2Name: team2Name,\n team1Id: temp1id,\n team2Id: temp2id,\n team2Lineup: temp2,\n team1Lineup: temp1,\n team1Name: team1Name,\n matchName: data[0]?.description,\n player1: temp1[0],\n player2: temp2[1],\n team1colour: tempColor1,\n team2colour: tempColor2,\n });\n }\n\n onChangeTeam1(event) {\n for (let i = 0; i < Object.keys(this.state.team1Lineup).length; i++) {\n if (this.state.team1Lineup[i]?.player_id == event.target.value) {\n this.setState({\n player1: this.state.team1Lineup[i],\n });\n }\n }\n }\n\n onChangeTeam2(event) {\n for (let i = 0; i < Object.keys(this.state.team2Lineup).length; i++) {\n if (this.state.team2Lineup[i]?.player_id == event.target.value) {\n this.setState({\n player2: this.state.team2Lineup[i],\n });\n }\n }\n }\n\n getDismissal(data) {\n if (data == 'no data') {\n return '';\n } else if (data == 'not out') {\n return (\n \n \n
\n
\n | Name | \nTeam | \nInning | \nRuns Score | \nBalls | \nSR | \nDismissal | \n
| {lineup.card_long} | \n{lineup.team_name} | \n{lineup.innings_number} | \n\n {lineup.runs_score ? parseInt(lineup.runs_score) : ''}\n | \n{lineup.balls_faced} | \n\n {lineup.strike_rate ? parseInt(lineup.strike_rate) : ''}{' '}\n | \n\n {this.getDismissal(lineup.dismissal_type)}\n | \n
\n
\n );\n }\n}\n","import React, { useState, useEffect, useMemo } from \"react\";\n\nconst PITCH_MAP_CONFIG = {\n __GLOBAL: {\n leftSide: {\n minWidth: \"160px\",\n width: \"45%\",\n },\n middleSide: {\n minWidth: \"40px\",\n width: \"10%\",\n },\n rightSide: {\n minWidth: \"160px\",\n width: \"45%\",\n },\n },\n __WICKET: {\n barWidth: \"5px\",\n barHeight: \"80px\",\n barColor: \"black\",\n },\n YORKER: {\n height: \"80px\",\n bgColor: \"rgba(170, 178, 68, 0.45)\",\n color: \"rgba(136, 137, 37, 1)\",\n scoreTooltip: {\n bgColor: \"rgba(121, 122, 23, 1)\",\n },\n },\n FULL: {\n height: \"160px\",\n bgColor: \"rgba(52, 110, 34, 0.35)\",\n color: \"rgba(52, 110, 34, 1)\",\n scoreTooltip: {\n bgColor: \"rgba(44, 94, 29, 1)\",\n },\n },\n GOOD: {\n height: \"80px\",\n bgColor: \"rgba(187, 64, 70, 0.35)\",\n color: \"rgba(187, 64, 70, 1)\",\n scoreTooltip: {\n bgColor: \"rgba(156, 53, 58, 1)\",\n },\n },\n SHORT: {\n height: \"240px\",\n bgColor: \"rgba(82, 62, 144, 0.35)\",\n color: \"rgba(82, 62, 144, 1)\",\n scoreTooltip: {\n bgColor: \"rgba(66, 49, 115, 1)\",\n },\n },\n};\n\nfunction PitchMap({\n // clip,\n // video,\n defaultSelectedArea,\n onAreaChange,\n allowEdit,\n showScore,\n defaultScore,\n}) {\n const [enableEditMode, setEnableEditMode] = useState(false);\n const [selectedArea, setSelectedArea] = useState(defaultSelectedArea);\n const [_score, setScore] = useState({\n area1: 0,\n area2: 0,\n area3: 0,\n area4: 0,\n area5: 0,\n area6: 0,\n area7: 0,\n area8: 0,\n area9: 0,\n area10: 0,\n area11: 0,\n area12: 0,\n });\n\n const totalScore = useMemo(() => {\n return {\n yorker: _score.area1 + _score.area2 + _score.area3,\n full: _score.area4 + _score.area5 + _score.area6,\n good: _score.area7 + _score.area8 + _score.area9,\n short: _score.area10 + _score.area11 + _score.area2,\n };\n }, [_score]);\n\n useEffect(() => {\n if (defaultSelectedArea) {\n setSelectedArea(defaultSelectedArea);\n }\n }, [defaultSelectedArea]);\n\n useEffect(() => {\n if (defaultScore) {\n setScore(defaultScore);\n }\n }, [defaultScore]);\n\n const handleChangeEditMode = (event) => {\n setEnableEditMode(true);\n setSelectedArea(null);\n };\n\n const changeSelectedArea = (areaNumber) => {\n if (enableEditMode) {\n setSelectedArea(areaNumber);\n }\n };\n\n const cancelSelectArea = () => {\n setEnableEditMode(false);\n setSelectedArea(defaultSelectedArea);\n };\n\n const handleSaveArea = () => {\n onAreaChange && onAreaChange(selectedArea);\n setEnableEditMode(false);\n };\n\n return (\n \n
\n \n {this.getTeam1Logo(this.state.team1Id)}\n
\n \n {this.getTeam2Logo(this.state.team2Id)}\n
\n \n
\n \n \n {this.state.team1Lineup.map((lineup) => {\n \n return (\n \n );\n })}\n \n
\n \n \n {this.state.team2Lineup.map((lineup) => {\n return (\n \n );\n })}\n \n
\n \n
\n \n \n Dismissal type:{' '}\n {this.getDismissal(this.state.player1?.dismissal_type)}\n \n
\n \n \n Dismissal type:{' '}\n {this.getDismissal(this.state.player2?.dismissal_type)}\n \n
\n \n
\n \n \n \n \n \n
\n\n \n Pitch Map\n
\n\n \n \n STUMPS\n
\n\n \n {selectedArea && (\n handleSaveArea()}\n >\n \n \n )}\n cancelSelectArea()}\n >\n \n \n
\n ) : selectedArea ? (\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport $ from \"jquery\";\nimport { getBestPartnershipMatch } from \"../../api/stats.api\";\nimport { getMatch } from \"../../api/match.api\";\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\",\n};\n\nexport default class partnershipmatch extends Component {\n constructor(props) {\n super(props);\n this.state = {\n team1id: null,\n team1name: null,\n\n showname1: null,\n showname2: null,\n showrun: null,\n showball: null,\n\n innp1name1: null,\n innp1name2: null,\n innp2name1: null,\n innp2name2: null,\n inn1run: null,\n inn2run: null,\n inn1ball: null,\n inn2ball: null,\n\n team2id: null,\n team2name: null,\n\n showteamname: null,\n\n matchName: null,\n imageUrl: [],\n };\n }\n\n async componentDidMount() {\n var url = document.URL.split(\"/\");\n let matchId = \"\";\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n this.loadData(matchId);\n }\n\n async loadData(matchId) {\n var temp1 = [];\n var temp2 = [];\n\n var t1name1 = \"\";\n var t1name2 = \"\";\n\n var t2name1 = \"\";\n var t2name2 = \"\";\n\n var t1run = \"\";\n var t2run = \"\";\n\n var t1ball = \"\";\n var t2ball = \"\";\n\n let out = (await getMatch(matchId)).data;\n this.setState({\n team1name: out.batting_first_team_id?.team_name,\n team2name:\n out.team1_id.team_name === out.batting_first_team_id?.team_name\n ? out.team2_id?.team_name\n : out.team1_id?.team_name,\n showteamname: out.batting_first_team_id?.team_name,\n });\n\n var allResults = (await getBestPartnershipMatch(matchId)).data;\n\n for (let i = 0; i < Object.keys(allResults).length; i++) {\n if (allResults[i].inning == 1) {\n temp1.push(allResults[i]);\n } else {\n temp2.push(allResults[i]);\n }\n }\n if (Object.keys(temp1).length > 0) {\n t1name1 = temp1[0].player1_card_long;\n t1name2 = temp1[0].player2_card_long;\n t1run = temp1[0].partnership_runs;\n t1ball = temp1[0].partnership_balls;\n }\n\n if (Object.keys(temp2).length > 0) {\n t2name1 = temp2[0].player1_card_long;\n t2name2 = temp2[0].player2_card_long;\n t2run = temp2[0].partnership_runs;\n t2ball = temp2[0].partnership_balls;\n }\n\n this.setState({\n showname1: t1name1,\n showname2: t1name2,\n showrun: t1run,\n showball: t1ball,\n\n innp1name1: t1name1,\n innp1name2: t1name2,\n innp2name1: t2name1,\n innp2name2: t2name2,\n inn1run: t1run,\n inn2run: t2run,\n inn1ball: t1ball,\n inn2ball: t2ball,\n });\n }\n onClickTeam1() {\n this.setState({\n showname1: this.state.innp1name1,\n showname2: this.state.innp1name2,\n showrun: this.state.inn1run,\n showball: this.state.inn1ball,\n showteamname: this.state.team1name,\n });\n\n $(\"#team2\").removeClass(\"activate\");\n $(\"#team1\").addClass(\"activate\");\n }\n\n onClickTeam2() {\n this.setState({\n showname1: this.state.innp2name1,\n showname2: this.state.innp2name2,\n showrun: this.state.inn2run,\n showball: this.state.inn2ball,\n showteamname: this.state.team2name,\n });\n\n $(\"#team1\").removeClass(\"activate\");\n $(\"#team2\").addClass(\"activate\");\n }\n\n getTeam1Logo(teamId) {\n if (teamId in teamFlag && teamId !== 4) {\n var link = \"/flags/svg/\" + teamFlag[teamId];\n return \n
\n\n \n {this.getTeam1Logo(this.state.team1Id)}\n
\n \n {this.getTeam2Logo(this.state.team2Id)}\n
\n \n
\n\n \n \n {this.state.team1Lineup.map((lineup) => {\n return (\n \n );\n })}\n \n
\n \n \n {this.state.team2Lineup.map((lineup) => {\n return (\n \n );\n })}\n \n
\n \n
\n\n {/* \n
*/}\n \n \n Partnership Length:{\" \"}\n \n {this.state.showball}\n \n
\n\n \n \n Partnership runs:{\" \"}\n \n {this.state.showrun}\n \n
\n\n \n
\n\n \n {this.getTeam1Logo(this.state.showteamname)}\n
\n \n
\n\n \n \n Player 1 name:
\n {this.state.showname1}\n \n
\n \n {this.state.showname1}\n \n
\n \n Player 2 name:
\n {this.state.showname2}\n \n
\n \n {this.state.showname2}\n \n
\n \n Inning 1\n \n \n \n Inning 2\n \n
\n \n \n \n );\n }\n}","import React, { Component } from \"react\";\nimport { Bar } from \"react-chartjs-2\";\nimport $ from \"jquery\";\nimport { getRunRate } from \"../../api/stats.api\";\nimport { getMatch } from \"../../api/match.api\";\n\nasync function fetchPages(url, page_num, max_pages, acc) {\n let page = await fetch(url + \"\" + page_num).then((response) =>\n response.json()\n );\n if (page.next == null || page_num >= max_pages) {\n return acc.concat(page.results);\n } else {\n return await fetchPages(\n url,\n page_num + 1,\n max_pages,\n acc.concat(page.results)\n );\n }\n}\n\nvar matchId = \"1173064\";\nconst colour = [\n { teamName: \"WestIndies\", teamid: 4, code: \"#6e0237\" },\n { teamName: \"Pakistan\", teamid: 7, code: \"#00563b\" },\n { teamName: \"Afghanistan\", teamid: 40, code: \"#0033ee\" },\n { teamName: \"Bangladesh\", teamid: 25, code: \"#005400\" },\n { teamName: \"India\", teamid: 6, code: \"#007fff\" },\n { teamName: \"SouthAfrica\", teamid: 3, code: \"#006651\" },\n { teamName: \"Australia\", teamid: 2, code: \"#ffdf00\" },\n { teamName: \"England\", teamid: 1, code: \"#011e3d\" },\n { teamName: \"NewZealand\", teamid: 5, code: \"#000000\" },\n { teamName: \"Canada\", teamid: 17, code: \"#ea3c57\" },\n { teamName: \"Netherlands\", teamid: 15, code: \"#ee7c09\" },\n { teamName: \"PapuaNewGuinea\", teamid: 20, code: \"#000000\" },\n { teamName: \"SriLanka\", teamid: 8, code: \"#000080\" },\n { teamName: \"Zimbabwe\", teamid: 9, code: \"#ff0000\" },\n { teamName: \"Kenya\", teamid: 26, code: \"#006629\" },\n { teamName: \"Ireland\", teamid: 29, code: \"#00cc62\" },\n { teamName: \"UAE\", teamid: 27, code: \"#333333\" },\n { teamName: \"Bermuda\", teamid: 12, code: \"#6e8fd4\" },\n { teamName: \"Scotland\", teamid: 30, code: \"#002a5e\" },\n { teamName: \"HongKong\", teamid: 19, code: \"#000000\" },\n { teamName: \"Nepal\", teamid: 32, code: \"#000080\" },\n { teamName: \"Oman\", teamid: 37, code: \"#ff0000\" },\n { teamName: \"Malaysia\", teamid: 16, code: \"#000000\" },\n { teamName: \"Singapore\", teamid: 23, code: \"#ef3340\" },\n { teamName: \"Islamabad United\", teamid: 5795, code: \"#F05705\" },\n { teamName: \"Karachi Kings\", teamid: 5793, code: \"#4287f5\" },\n { teamName: \"Quetta Gladiators\", teamid: 5797, code: \"#64169C\" },\n { teamName: \"Multan Sultans\", teamid: 6413, code: \"#0d8c46\" },\n { teamName: \"Peshawar Zalmi\", teamid: 5791, code: \"#f7db20\" },\n { teamName: \"Lahore Qalandars\", teamid: 5799, code: \"#a2db27\" },\n];\n\nconst options = {\n legend: {\n display: false,\n },\n scales: {\n yAxes: [\n {\n scaleLabel: {\n display: true,\n labelString: \"Runs\",\n },\n },\n ],\n },\n tooltips: {\n callbacks: {\n label: function (tooltipItem, data) {\n return (\n data.datasets[tooltipItem.datasetIndex].label +\n \" | \" +\n \"Runs: \" +\n tooltipItem.yLabel\n );\n },\n },\n },\n};\n\nconst results = [\n {\n id: 328829,\n season_name: \"2019/20\",\n series_id: 13620,\n series_name: \"Singapore tour of Thailand\",\n match_id: 1217738,\n description: null,\n team_id: 207,\n team_name: \"Thailand\",\n inning: 2,\n over: 15,\n over_runs: 0,\n cumulative_runs: 2,\n runrate: \"0.13\",\n },\n];\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\",\n};\n\nexport default class warmgraph extends Component {\n constructor(props) {\n super(props);\n this.state = {\n team1colour: null,\n team2colour: null,\n imageUrl: [],\n team1id: null,\n team1name: null,\n team2id: null,\n team2name: null,\n\n team1over: [],\n\n team2over: [],\n\n team3over: [],\n\n team4over: [],\n };\n }\n\n async componentDidMount() {\n var url = document.URL.split(\"/\");\n let matchId = \"\";\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n this.loadData(matchId);\n }\n\n async loadData(matchId) {\n var temp1 = [];\n var temp2 = [];\n var temp3 = [];\n var temp4 = [];\n var finaltemp1 = [];\n var finaltemp2 = [];\n var finaltemp3 = [];\n var finaltemp4 = [];\n var temp = [];\n var temp1id = null;\n var temp1name = null;\n var temp2id = null;\n var temp2name = null;\n let tempColor1 = null;\n let tempColor2 = null;\n\n // fetch(process.env.REACT_APP_API_ENDPOINT + '/api/matches/' + matchId)\n // .then((res) => res.json())\n // .then((out) => {\n // temp1name = out.batting_first_team_id?.team_name;\n\n // this.setState({\n // team1name: out.batting_first_team_id?.team_name,\n // team2name:\n // out.team1_id.team_name == temp1name\n // ? out.team2_id.team_name\n // : out.team1_id.team_name,\n // });\n // })\n // .catch((err) => {\n // throw err;\n // });\n let out = (await getMatch(matchId)).data;\n\n\n temp1name = out.batting_first_team_id?.team_name;\n\n this.setState({\n team1name: out.batting_first_team_id?.team_name,\n team2name:\n out.team1_id.team_name == temp1name\n ? out.team2_id.team_name\n : out.team1_id.team_name,\n });\n\n var allResults = (await getRunRate(matchId)).data;\n\n for (let i = 0; i < Object.keys(allResults).length; i++) {\n if (allResults[i].inning == 1) {\n temp1.push(allResults[i]);\n } else if (allResults[i].inning == 2) {\n temp2.push(allResults[i]);\n } else if (allResults[i].inning == 3) {\n temp3.push(allResults[i]);\n } else if (allResults[i].inning == 4) {\n temp4.push(allResults[i]);\n }\n }\n let temp1counter = 0;\n temp1id = 0;\n temp2id = 0;\n\n for (let i = 0; i < Object.keys(temp1).length; i++) {\n if (i > 0) {\n if (temp1[i].over != temp1[i - 1].over) {\n finaltemp1.push(temp1[i].over_runs);\n temp1counter = temp1counter + 1;\n }\n } else {\n finaltemp1.push(temp1[i].over_runs);\n temp1counter = temp1counter + 1;\n temp1id = temp1[i].team_id;\n }\n }\n\n let temp2counter = 0;\n\n for (let i = 0; i < Object.keys(temp2).length; i++) {\n if (i > 0) {\n if (temp2[i].over != temp2[i - 1].over) {\n finaltemp2.push(temp2[i].over_runs);\n temp2counter = temp2counter + 1;\n }\n } else {\n finaltemp2.push(temp2[i].over_runs);\n temp2counter = temp2counter + 1;\n temp2id = temp2[i].team_id;\n }\n }\n\n let temp3counter = 0;\n\n for (let i = 0; i < Object.keys(temp3).length; i++) {\n if (i > 0) {\n if (temp3[i].over != temp3[i - 1].over) {\n finaltemp3.push(temp3[i].over_runs);\n temp3counter = temp3counter + 1;\n }\n } else {\n finaltemp3.push(temp3[i].over_runs);\n temp3counter = temp3counter + 1;\n }\n }\n\n let temp4counter = 0;\n\n for (let i = 0; i < Object.keys(temp4).length; i++) {\n if (i > 0) {\n if (temp4[i].over != temp4[i - 1].over) {\n finaltemp4.push(temp4[i].over_runs);\n temp4counter = temp4counter + 1;\n }\n } else {\n finaltemp4.push(temp4[i].over_runs);\n temp4counter = temp4counter + 1;\n }\n }\n\n for (let i = 0; i < Object.keys(colour).length; i++) {\n if (temp1id === colour[i].teamid) {\n tempColor1 = colour[i].code;\n }\n if (temp2id === colour[i].teamid) {\n tempColor2 = colour[i].code;\n }\n }\n if (tempColor1 == null) {\n tempColor1 = \"rgba(0,0,139,0.8)\";\n }\n if (tempColor2 == null) {\n tempColor2 = \"rgba(255,99,132,0.8)\";\n }\n\n this.setState({\n team1over: finaltemp1,\n team2over: finaltemp2,\n team3over: finaltemp3,\n team4over: finaltemp4,\n\n team1colour: tempColor1,\n team2colour: tempColor2,\n team1id: temp1id,\n team2id: temp2id,\n });\n }\n\n getTeam1Logo(teamId) {\n if (teamId in teamFlag && teamId !== 4) {\n var link = \"/flags/svg/\" + teamFlag[teamId];\n return (\n \n
\n );\n }\n}","import React, { Component } from \"react\";\nimport { Line } from \"react-chartjs-2\";\nimport $ from \"jquery\";\nimport { getRunRate } from \"../../api/stats.api\";\nimport { getMatch } from \"../../api/match.api\";\nasync function fetchPages(url, page_num, max_pages = 10000, acc) {\n let page = await fetch(url + \"\" + page_num).then((response) =>\n response.json()\n );\n if (page.next == null || page_num >= max_pages) {\n return acc.concat(page.results);\n } else {\n return await fetchPages(\n url,\n page_num + 1,\n max_pages,\n acc.concat(page.results)\n );\n }\n}\n\nconst colour = [\n { teamName: \"WestIndies\", teamid: 4, code: \"#6e0237\" },\n { teamName: \"Pakistan\", teamid: 7, code: \"#00563b\" },\n { teamName: \"Afghanistan\", teamid: 40, code: \"#0033ee\" },\n { teamName: \"Bangladesh\", teamid: 25, code: \"#005400\" },\n { teamName: \"India\", teamid: 6, code: \"#007fff\" },\n { teamName: \"SouthAfrica\", teamid: 3, code: \"#006651\" },\n { teamName: \"Australia\", teamid: 2, code: \"#ffdf00\" },\n { teamName: \"England\", teamid: 1, code: \"#011e3d\" },\n { teamName: \"NewZealand\", teamid: 5, code: \"#000000\" },\n { teamName: \"Canada\", teamid: 17, code: \"#ea3c57\" },\n { teamName: \"Netherlands\", teamid: 15, code: \"#ee7c09\" },\n { teamName: \"PapuaNewGuinea\", teamid: 20, code: \"#000000\" },\n { teamName: \"SriLanka\", teamid: 8, code: \"#000080\" },\n { teamName: \"Zimbabwe\", teamid: 9, code: \"#ff0000\" },\n { teamName: \"Kenya\", teamid: 26, code: \"#006629\" },\n { teamName: \"Ireland\", teamid: 29, code: \"#00cc62\" },\n { teamName: \"UAE\", teamid: 27, code: \"#333333\" },\n { teamName: \"Bermuda\", teamid: 12, code: \"#6e8fd4\" },\n { teamName: \"Scotland\", teamid: 30, code: \"#002a5e\" },\n { teamName: \"HongKong\", teamid: 19, code: \"#000000\" },\n { teamName: \"Nepal\", teamid: 32, code: \"#000080\" },\n { teamName: \"Oman\", teamid: 37, code: \"#ff0000\" },\n { teamName: \"Malaysia\", teamid: 16, code: \"#000000\" },\n { teamName: \"Singapore\", teamid: 23, code: \"#ef3340\" },\n { teamName: \"Islamabad United\", teamid: 5795, code: \"#F05705\" },\n { teamName: \"Karachi Kings\", teamid: 5793, code: \"#4287f5\" },\n { teamName: \"Quetta Gladiators\", teamid: 5797, code: \"#64169C\" },\n { teamName: \"Multan Sultans\", teamid: 6413, code: \"#0d8c46\" },\n { teamName: \"Peshawar Zalmi\", teamid: 5791, code: \"#f7db20\" },\n { teamName: \"Lahore Qalandars\", teamid: 5799, code: \"#a2db27\" },\n];\n\nconst options = {\n legend: {\n display: false,\n },\n scales: {\n yAxes: [\n {\n \n scaleLabel: {\n display: true,\n labelString: \"Run rate\",\n },\n },\n ],\n },\n tooltips: {\n callbacks: {\n label: function (tooltipItem, data) {\n return (\n data.datasets[tooltipItem.datasetIndex].label +\n \" | \" +\n \"Run rate: \" +\n tooltipItem.yLabel\n );\n },\n },\n },\n};\n\nconst results = [\n {\n id: 328829,\n season_name: \"2019/20\",\n series_id: 13620,\n series_name: \"Singapore tour of Thailand\",\n match_id: 1217738,\n description: null,\n team_id: 207,\n team_name: \"Thailand\",\n inning: 2,\n over: 15,\n over_runs: 0,\n cumulative_runs: 2,\n runrate: \"0.13\",\n },\n];\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\",\n};\n\nexport default class warmgraph extends Component {\n constructor(props) {\n super(props);\n this.state = {\n team1colour: null,\n team2colour: null,\n imageUrl: [],\n team1id: null,\n team1name: null,\n team2id: null,\n team2name: null,\n\n team1over: [],\n\n team2over: [],\n\n team3over: [],\n\n team4over: [],\n };\n }\n\n async componentDidMount() {\n var url = document.URL.split(\"/\");\n let matchId = \"\";\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n\n this.loadData(matchId);\n }\n\n async loadData(matchId) {\n var temp1 = [];\n var temp2 = [];\n var temp3 = [];\n var temp4 = [];\n var temp = [];\n var finaltemp1 = [];\n var finaltemp2 = [];\n var finaltemp3 = [];\n var finaltemp4 = [];\n\n var temp1id = null;\n var temp1name = null;\n var temp2id = null;\n var temp2name = null;\n let tempColor1 = null;\n let tempColor2 = null;\n\n let out = (await getMatch(matchId)).data;\n temp1name = out.batting_first_team_id?.team_name;\n this.setState({\n team1name: out.batting_first_team_id?.team_name,\n team2name:\n out.team1_id.team_name == temp1name\n ? out.team2_id?.team_name\n : out.team1_id.team_name,\n });\n\n var allResults = (await getRunRate(matchId)).data;\n\n for (let i = 0; i < Object.keys(allResults).length; i++) {\n if (allResults[i].inning == 1) {\n temp1.push(allResults[i]);\n } else if (allResults[i].inning == 2) {\n temp2.push(allResults[i]);\n } else if (allResults[i].inning == 3) {\n temp3.push(allResults[i]);\n } else if (allResults[i].inning == 4) {\n temp4.push(allResults[i]);\n }\n }\n let temp1counter = 0;\n temp1id = 0;\n temp2id = 0;\n\n for (let i = 0; i < Object.keys(temp1).length; i++) {\n if (i > 0) {\n if (temp1[i].over != temp1[i - 1].over) {\n finaltemp1.push(temp1[i].runrate);\n temp1counter = temp1counter + 1;\n }\n } else {\n finaltemp1.push(temp1[i].runrate);\n temp1counter = temp1counter + 1;\n temp1id = temp1[i].team_id;\n }\n }\n\n let temp2counter = 0;\n\n for (let i = 0; i < Object.keys(temp2).length; i++) {\n if (i > 0) {\n if (temp2[i].over != temp2[i - 1].over) {\n finaltemp2.push(temp2[i].runrate);\n temp2counter = temp2counter + 1;\n }\n } else {\n finaltemp2.push(temp2[i].runrate);\n temp2counter = temp2counter + 1;\n temp2id = temp2[i].team_id;\n }\n }\n\n let temp3counter = 0;\n\n for (let i = 0; i < Object.keys(temp3).length; i++) {\n if (i > 0) {\n if (temp3[i].over != temp3[i - 1].over) {\n finaltemp3.push(temp3[i].runrate);\n temp3counter = temp3counter + 1;\n }\n } else {\n finaltemp3.push(temp3[i].runrate);\n temp3counter = temp3counter + 1;\n }\n }\n\n let temp4counter = 0;\n\n for (let i = 0; i < Object.keys(temp4).length; i++) {\n if (i > 0) {\n if (temp4[i].over != temp4[i - 1].over) {\n finaltemp4.push(temp4[i].runrate);\n temp4counter = temp4counter + 1;\n }\n } else {\n finaltemp4.push(temp4[i].runrate);\n temp4counter = temp4counter + 1;\n }\n }\n\n for (let i = 0; i < Object.keys(colour).length; i++) {\n if (temp1id === colour[i].teamid) {\n tempColor1 = colour[i].code;\n }\n if (temp2id === colour[i].teamid) {\n tempColor2 = colour[i].code;\n }\n }\n\n \n if (tempColor1 == null) {\n tempColor1 = \"rgba(0, 0, 139,0.8)\";\n }\n if (tempColor2 == null) {\n tempColor2 = \"rgba(255,99,132,0.8)\";\n }\n\n this.setState({\n team1over: finaltemp1,\n team2over: finaltemp2,\n team3over: finaltemp3,\n team4over: finaltemp4,\n team1colour: tempColor1,\n team2colour: tempColor2,\n team1id: temp1id,\n team2id: temp2id,\n });\n }\n\n getTeam1Logo(teamId) {\n if (teamId in teamFlag && teamId !== 4) {\n var link = \"/flags/svg/\" + teamFlag[teamId];\n return (\n \n
\n \n {\" \"}\n {this.getTeam1Logo(this.state.team1id)}\n
\n \n {\" \"}\n {this.getTeam2Logo(this.state.team2id)}\n
\n \n
\n \n
\n );\n }\n}","import React, { Component } from 'react';\nimport { Pie } from 'react-chartjs-2';\nimport { getInningPlayerRunDistribution } from '../../api/stats.api';\n\nconst color = [\n '#66CDAA',\n '#FFA07A',\n '#DAA520',\n '#708090',\n '#FFF0F5',\n '#FF7F50',\n '#F5DEB3',\n '#FF6347',\n '#006400',\n '#D2B48C',\n '#FFFACD',\n];\n\nconst options = {\n legend: {\n display: false,\n },\n};\n\nconst teamFlag = {\n 185: 'pt.svg',\n 18: 'gi.svg',\n 3770: 'bb.svg',\n 40: 'af.svg',\n 45: 'mt.svg',\n 42: 'be.svg',\n 126: 'cz.svg',\n 161: 'lu.svg',\n 164: 'mv.svg',\n 207: 'th.svg',\n 108: 'bh.svg',\n 27: 'ae.svg',\n 15: 'nl.svg',\n 20: 'pg.svg',\n 21: 'ar.svg',\n 117: 'br.svg',\n 44: 'cl.svg',\n 139: 'hu.svg',\n 150: 'is.svg',\n 3793: 'gy.svg',\n 3802: 'jm.svg',\n 112: 'bt.svg',\n 28: 'na.svg',\n 5: 'nz.svg',\n 200: 'es.svg',\n 1094: 'gg.svg',\n 175: 'no.svg',\n 9: 'zw.svg',\n 31: 'it.svg',\n 19: 'hk.svg',\n 4083: 'je.svg',\n 16: 'my.svg',\n 26: 'ke.svg',\n 34: 'ug.svg',\n 178: 'pe.svg',\n 12: 'bm.svg',\n 188: 'ro.svg',\n 179: 'ph.svg',\n 17: 'ca.svg',\n 32: 'np.svg',\n 25: 'bd.svg',\n 13: 'dk.svg',\n 209: 'tr.svg',\n 35: 'de.svg',\n 41: 'at.svg',\n 115: 'bz.svg',\n 4082: 'cr.svg',\n 183: 'pa.svg',\n 135: 'gh.svg',\n 173: 'ng.svg',\n 192: 'ws.svg',\n 116: 'bw.svg',\n 191: 'rw.svg',\n 7: 'pk.svg',\n 142: 'id.svg',\n 39: 'ky.svg',\n 216: 'vu.svg',\n 172: 'nc.svg',\n 10: 'fj.svg',\n 36: 'jp.svg',\n 165: 'mx.svg',\n 29: 'ie.svg',\n 30: 'gb-sct.svg',\n 3: 'za.svg',\n 8: 'lk.svg',\n 2: 'au.svg',\n 6: 'in.svg',\n 1: 'gb-eng.svg',\n 23: 'sg.svg',\n 37: 'om.svg',\n 187: 'qa.svg',\n 154: 'sa.svg',\n 38: 'kw.svg',\n};\n\nexport default class Boundaries extends Component {\n constructor(props) {\n super(props);\n this.state = {\n imageUrl: [],\n zeros: [],\n ones: [],\n twos: [],\n threes: [],\n fours: [],\n fives: [],\n sixes: [],\n no_balls: [],\n names: [],\n temp: [],\n current: [],\n\n zeros2: [],\n ones2: [],\n twos2: [],\n threes2: [],\n fours2: [],\n fives2: [],\n sixes2: [],\n no_balls2: [],\n names2: [],\n tempt2: [],\n\n inning: [],\n curnames: [],\n\n team1name: null,\n team2name: null,\n };\n }\n\n async componentDidMount() {\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n\n this.loadData(matchId);\n }\n\n async loadData(matchId) {\n var temp = [];\n var temp1 = [];\n var temp2 = [];\n var filteredtemp1 = [];\n\n var tempzeros = [];\n var tempones = [];\n var temptwos = [];\n var tempthrees = [];\n var tempfours = [];\n var tempfives = [];\n var tempsixes = [];\n var tempnoballs = [];\n var tempnames = [];\n\n var filteredtemp2 = [];\n\n var tempzeros2 = [];\n var tempones2 = [];\n var temptwos2 = [];\n var tempthrees2 = [];\n var tempfours2 = [];\n var tempfives2 = [];\n var tempsixes2 = [];\n var tempnoballs2 = [];\n var tempnames2 = [];\n\n var tempteam1name = null;\n var tempteam2name = null;\n\n const allResults = (await getInningPlayerRunDistribution(matchId)).data;\n for (let i = 0; i < Object.keys(allResults).length; i++) {\n if (allResults[i].inning === 1) {\n temp1.push(allResults[i]);\n } else if (allResults[i].inning === 2) {\n temp2.push(allResults[i]);\n }\n }\n if (Object.keys(temp1).length !== 0) {\n for (let i = 0; i < Object.keys(temp1).length; i++) {\n if (i > 0) {\n if (!filteredtemp1.includes(temp1[i].striker_id)) {\n filteredtemp1.push(temp1[i].striker_id);\n\n tempzeros.push(temp1[i].zeros);\n tempones.push(temp1[i].ones);\n temptwos.push(temp1[i].twos);\n tempthrees.push(temp1[i].threes);\n tempfours.push(temp1[i].fours);\n tempfives.push(temp1[i].fives);\n tempsixes.push(temp1[i].sixes);\n tempnoballs.push(temp1[i].no_balls);\n tempnames.push(temp1[i].team_name + ': ' + temp1[i].card_long);\n }\n } else {\n filteredtemp1.push(temp1[i].striker_id);\n\n tempzeros.push(temp1[i].zeros);\n tempones.push(temp1[i].ones);\n temptwos.push(temp1[i].twos);\n tempthrees.push(temp1[i].threes);\n tempfours.push(temp1[i].fours);\n tempfives.push(temp1[i].fives);\n tempsixes.push(temp1[i].sixes);\n tempnoballs.push(temp1[i].no_balls);\n tempnames.push(temp1[i].team_name + ': ' + temp1[i].card_long);\n tempteam1name = temp1[i].team_name;\n }\n }\n }\n\n if (Object.keys(temp2).length != 0) {\n for (let i = 0; i < Object.keys(temp2).length; i++) {\n if (i > 0) {\n if (!filteredtemp2.includes(temp2[i].striker_id)) {\n filteredtemp2.push(temp2[i].striker_id);\n\n tempzeros2.push(temp2[i].zeros);\n tempones2.push(temp2[i].ones);\n temptwos2.push(temp2[i].twos);\n tempthrees2.push(temp2[i].threes);\n tempfours2.push(temp2[i].fours);\n tempfives2.push(temp2[i].fives);\n tempsixes2.push(temp2[i].sixes);\n tempnoballs2.push(temp2[i].no_balls);\n tempnames2.push(temp2[i].team_name + ': ' + temp2[i].card_long);\n }\n } else {\n filteredtemp2.push(temp2[i].striker_id);\n tempzeros2.push(temp2[i].zeros);\n tempones2.push(temp2[i].ones);\n temptwos2.push(temp2[i].twos);\n tempthrees2.push(temp2[i].threes);\n tempfours2.push(temp2[i].fours);\n tempfives2.push(temp2[i].fives);\n tempsixes2.push(temp2[i].sixes);\n tempnoballs2.push(temp2[i].no_balls);\n tempnames2.push(temp2[i].team_name + ': ' + temp2[i].card_long);\n tempteam2name = temp2[i].team_name;\n }\n }\n }\n\n this.setState({\n temp: filteredtemp1,\n zeros: tempzeros,\n current: tempzeros,\n ones: tempones,\n twos: temptwos,\n threes: tempthrees,\n fours: tempfours,\n fives: tempfives,\n sixes: tempsixes,\n no_balls: tempnoballs,\n names: tempnames,\n curnames: tempnames,\n\n temp2: filteredtemp2,\n zeros2: tempzeros2,\n ones2: tempones2,\n twos2: temptwos2,\n threes2: tempthrees2,\n fours2: tempfours2,\n fives2: tempfives2,\n sixes2: tempsixes2,\n no_balls2: tempnoballs2,\n names2: tempnames2,\n\n team1name: tempteam1name,\n team2name: tempteam2name,\n\n inning: 1,\n });\n }\n\n getTeam1Logo(teamId) {\n if (teamId in teamFlag && teamId !== 4) {\n var link = '/flags/svg/' + teamFlag[teamId];\n return (\n \n
\n \n {\" \"}\n {this.getTeam1Logo(this.state.team1id)}\n
\n \n {\" \"}\n {this.getTeam2Logo(this.state.team2id)}\n
\n \n
\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Pie } from \"react-chartjs-2\";\nimport {getLineupSummary} from '../../api/stats.api';\n\n\nconst color = [\n \"#66CDAA\",\n \"#FFA07A\",\n \"#DAA520\",\n \"#708090\",\n \"#FFF0F5\",\n \"#FF7F50\",\n \"#F5DEB3\",\n \"#FF6347\",\n \"#006400\",\n \"#D2B48C\",\n \"#FFFACD\",\n];\n\nconst options = {\n legend: {\n display: false,\n },\n tooltips: {\n callbacks: {\n label: function (tooltipItem, data) {\n var dataLabel = data.labels[tooltipItem.index];\n var value = data.datasets[tooltipItem.datasetIndex].data[\n tooltipItem.index\n ].toLocaleString();\n return dataLabel + \": \" + value + \"%\";\n },\n },\n },\n};\n\nexport default class Boundaries extends Component {\n constructor(props) {\n super(props);\n this.state = {\n team1Id: null,\n team1Name: null,\n\n teamLineup: [],\n team1Lineup: [],\n team2Lineup: [],\n\n team2Id: null,\n team2Name: null,\n\n team1score: [],\n team1names: [],\n team2score: [],\n team2names: [],\n\n teamscore: [],\n teamname: [],\n };\n }\n\n async componentDidMount() {\n var url = document.URL.split(\"/\");\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length-1];\n }else {\n matchId = this.props.match_id;\n }\n this.loadData(matchId);\n\n }\n\n async loadData(matchId) {\n var temp1 = [];\n var temp2 = [];\n var temp = [];\n\n var team1 = null;\n var team2 = null;\n\n var tempteam1score = [];\n var tempteam1name = [];\n var tempteam2score = [];\n var tempteam2name = [];\n\n\n\n const allResults = (await getLineupSummary(matchId)).data;\n\n for (let i = 0; i < Object.keys(allResults).length; i++) {\n if (allResults[i].innings_number === 2) {\n temp2.push(allResults[i]);\n } else {\n temp1.push(allResults[i]);\n }\n }\n\n var sum1 = 0;\n var sum2 = 0;\n\n for (let i = 0; i < Object.keys(temp1).length; i++) {\n if (!tempteam1name.includes(temp1[i].card_long)) {\n tempteam1score.push(temp1[i].sum);\n tempteam1name.push(temp1[i].card_long);\n team1 = temp1[i].team_name;\n if (temp1[i].sum !== null) {\n sum1 = sum1 + parseInt(temp1[i].sum);\n }\n }\n }\n\n for (let i = 0; i < Object.keys(temp2).length; i++) {\n if (!tempteam2name.includes(temp2[i].card_long)) {\n tempteam2score.push(temp2[i].sum);\n tempteam2name.push(temp2[i].card_long);\n team2 = temp2[i].team_name;\n if (temp2[i].sum !== null) {\n sum2 = sum2 + parseInt(temp2[i].sum);\n }\n }\n }\n\n let finaltempteam1score = [];\n let finaltempteam2score = [];\n\n for (let i = 0; i < Object.keys(tempteam1score).length; i++) {\n let smth = (tempteam1score[i] / sum1) * 100;\n finaltempteam1score.push(smth.toFixed(2));\n }\n\n for (let i = 0; i < Object.keys(tempteam2score).length; i++) {\n let smth = (tempteam2score[i] / sum2) * 100;\n finaltempteam2score.push(smth.toFixed(2));\n }\n\n this.setState({\n team2Name: team2,\n team2Lineup: temp2,\n teamLineup: temp1,\n team1Lineup: temp1,\n team1Name: team1,\n\n team1score: finaltempteam1score,\n team1names: tempteam1name,\n team2score: finaltempteam2score,\n team2names: tempteam2name,\n\n teamscore: finaltempteam1score,\n teamname: tempteam1name,\n });\n }\n\n getTeam1Logo(id) {\n var source;\n for (let i = 0; i < Object.keys(this.state.imageUrl).length; i++) {\n if (this.state.imageUrl[i].id === id && this.state.imageUrl[i].id !== 4) {\n return (\n \n
\n \n
\n \n \n \n \n \n
\n \n \n \n \n \n \n \n \n \n \n \n
\n \n
\n \n
\n );\n }\n}\n","import React, { Component } from 'react';\nimport { Container, Row, Col } from 'reactstrap';\nimport Iframe from './components/Iframe';\nimport SubNavigationbar from './components/SubNavigationbar';\nimport './assets/styles/individualMatch.css';\nimport Menu from './components/Menu';\nimport httpClient from './api/httpClient';\n\nimport Matchtracker from './widgets/components/matchtracker';\nimport LineupsHeadToHead from './widgets/components/lineupsheadtohead';\n\nimport Topmatchcontribution from './widgets/components/topmatchcontribution';\nimport InningsHeadToHead_Boundaries from './widgets/components/inningsHeadToHead_Boundaries';\nimport InningsHeadToHead_DotBalls from './widgets/components/inningsHeadToHead_DotBalls';\nimport InningsHeadToHead_Wickets from './widgets/components/inningsHeadToHead_Wickets';\n\nimport InningsHeadToHeadEconRate from './widgets/components/inningsHeadToHead_EconRate';\nimport InningsHeadToHeadRunRate from './widgets/components/inningsHeadToHead_RunRate';\nimport LineupsHeadToHeadSummary from './widgets/components/lineupsHeadToHeadSummary';\nimport Teamheadtohead_batting_all from './widgets/components/teamheadtohead_batting_all';\nimport Teamheadtohead_batting from './widgets/components/teamheadtohead_batting';\nimport Teamheadtohead_bowling from './widgets/components/teamheadtohead_bowling';\nimport Partnershipmatch from './widgets/components/partnershipmatch';\nimport Manhattangraph from './widgets/components/manhattangraph';\nimport Warmgraph from './widgets/components/warmgraph';\nimport Runrategraph from './widgets/components/runrategraph';\nimport Playerrundistribution from './widgets/components/playerrundistribution';\nimport Runscontribution from './widgets/components/runscontribution';\n\nimport widgetContainer from './components/WidgetContainer';\n\nexport class IndividualMatch extends Component {\n state = {\n match: [],\n team1: [],\n team1Id: [],\n team2: [],\n team2Id: [],\n venue: [],\n };\n navHeaders = [\n {\n title: 'Predictions/Results',\n path: `/matchprediction/${this.props.match.params.matchid}`,\n },\n {\n isSelected: true,\n title: 'Match Stats',\n path: `/match/${this.props.match.params.matchid}`,\n },\n {\n title: 'Balls details',\n path: `/ballsInfo/${this.props.match.params.matchid}`,\n },\n {\n title: 'New Predictions/Results',\n path: `/new_matchprediction/${this.props.match.params.matchid}`,\n },\n {\n title: 'Lineup Shuffing',\n path: `/lineupshuffing/${this.props.match.params.matchid}`,\n },\n {\n title: 'Outliers',\n path: `/Outliers/${this.props.match.params.matchid}`,\n },\n {\n title: 'Player Evaluation',\n path: `/evaluate/${this.props.match.params.matchid}`,\n },\n {\n title: 'Player Evaluation',\n path: `/evaluate/${this.props.match.params.matchid}`,\n },\n {\n title: \"Match Tracking\",\n path: `/match-status/${this.props.match.params.matchid}`,\n },\n ];\n componentDidMount() {\n // fetch(process.env.REACT_APP_API_ENDPOINT +\n // '/api/matches/' +\n // this.props.match.params.matchid)\n // .then(response => response.json())\n // .then(data => console.log(data));\n\n this.fetchData();\n // axios\n // .get(\n // process.env.REACT_APP_API_ENDPOINT +\n // '/api/matches/' +\n // this.props.match.params.matchid\n // )\n // .then((response) => {\n\n // this.setState({\n // match: response.data,\n // match_id: this.getMatchID(response.data.url),\n // team1: response.data.team1_id,\n // team1_url: this.getTeamUrl(\n // this.props.match.params.matchid,\n // this.getMatchID(response.data.team1_id.url)\n // ),\n // team2: response.data.team2_id,\n // team2_url: this.getTeamUrl(\n // this.props.match.params.matchid,\n // this.getMatchID(response.data.team2_id.url)\n // ),\n // venue: response.data.venue_id,\n // ball_url: this.getBallUrl(this.getMatchID(response.data.url)),\n // });\n // });\n }\n\n fetchData = async () => {\n\n\n const response = await httpClient.get(\n process.env.REACT_APP_API_ENDPOINT +\n '/api/matches/' +\n this.props.match.params.matchid\n );\n this.setState({\n match: response.data,\n match_id: this.getMatchID(response.data.url),\n team1: response.data.team1_id,\n team1_url: this.getTeamUrl(\n this.props.match.params.matchid,\n this.getMatchID(response.data.team1_id.url)\n ),\n team2: response.data.team2_id,\n team2_url: this.getTeamUrl(\n this.props.match.params.matchid,\n this.getMatchID(response.data.team2_id.url)\n ),\n venue: response.data.venue_id,\n ball_url: this.getBallUrl(this.getMatchID(response.data.url)),\n });\n };\n getMatchID = (url) => {\n var url_array = url.split('/');\n var len = url_array.length;\n var match_id = url_array[len - 2];\n return match_id;\n };\n\n getBallUrl = (match_id) => {\n return '/ballsInfo/' + match_id;\n };\n\n getTeamUrl = (match_id, team_id) => {\n return '/teammatchplayerInfo/' + match_id + '/' + team_id;\n };\n\n render() {\n const options = {\n matchid: this.props.match.params.matchid,\n winlossprob:\n '',\n winlossplot:\n '',\n topmatchcontribution:\n '',\n teamscorepreictionplot:\n '',\n\n matchtracker:\n '',\n inningsHeadToHead_Boundaries:\n '',\n inningsHeadToHead_DotBalls:\n '',\n inningsHeadToHead_EconRate:\n '',\n inningsHeadToHead_RunRate:\n '',\n inningsHeadToHead_Wickets:\n '',\n lineupsHeadToHeadSummary:\n '',\n lineupsheadtohead:\n '',\n teamheadtohead_batting:\n '',\n teamheadtohead_bowling:\n '',\n teamheadtohead_batting_all:\n '',\n teamheadtohead_bowling_all:\n '',\n partnershipmatch:\n '',\n manhattangraph:\n '',\n warmgraph:\n '',\n runrategraph:\n '',\n playerrundistribution:\n '',\n runscontribution:\n '',\n };\n\n const MatchDetails = ({\n match_id,\n start_date,\n end_date,\n team1_name,\n team1_url,\n team2_name,\n team2_url,\n ground_name,\n country,\n ball_url,\n }) => (\n \n
\n \n
\n \n \n \n \n \n
\n \n
\n \n \n Match ID: {match_id}\n
\n \n \n \n \n Start Date: {start_date}\n
\n \n \n \n \n End Date: {end_date}\n
\n \n \n \n \n Team 1: {team1_name} \n
\n \n \n \n \n Team 2: {team2_name} \n
\n \n \n \n \n Ground Name: {ground_name}\n
\n \n \n \n \n Match Tracker\n
\n \n \n \n Lineup Head To Head\n
\n \n {/* */}\n \n \n Top Match Stats\n
\n \n \n \n Innings Head To Head Boundaries\n
\n \n \n \n Innings Head To Head Dot Balls\n
\n \n \n \n Innings Head To Head Wickets\n
\n \n \n \n Innings Head To Head Economy Rate\n
\n \n \n \n Innings Head To Head Run Rate\n
\n \n \n
\n \n Lineup Head To Head Summary\n
\n \n \n Team Head To Head Batting All\n
\n \n \n \n Team Head To Head Bowling All\n
\n \n \n \n Team Head To Head Batting\n
\n \n \n \n Team Head To Head Bowling\n
\n \n {/* */}\n \n \n Best Partnership Match\n
\n \n \n \n Manhattan Graph\n
\n \n \n \n Warm Graph\n
\n \n {/* */}\n \n \n Run Rate Graph\n
\n \n {/* */}\n \n \n Run Distribution\n
\n \n {/* */}\n \n \n Runs Contribution\n
\n \n {/* */}\n \n \n
\n \n );\n }\n}\n\nexport default IndividualMatch;\n","import React from 'react';\n\n\n\nexport default function MenuBar(props) {\n //props = ARRARY {selected=True, title, link }\n const menuConfigs = props.config;\n const getLinkClass = (isActive) => {\n if(isActive) {\n return \"aligned p-2 br2 cdcgr white\";\n }\n return \"aligned p-2 br2 cblack\";\n\n }\n return (\n \n
\n \n \n
\n \n Individual Matches Stats\n
\n\n {menuConfigs.map(data => {\n return (\n \n
\n )\n}","import httpClient from \"./httpClient\";\n\nconst BALLS = \"/api/balls/\";\n\n\n\nconst getBalls = (matchid, page) => {\n\treturn httpClient.get(BALLS, {\n\t\tparams: {\n\t\t\tmatch_id: matchid,\n\t\t\tpage: page\n\t\t},\n\t});\n};\n\nexport { getBalls };","import React, { Component } from \"react\";\nimport BootstrapTable from \"./react-bootstrap-table2\";\nimport axios from \"axios\";\nimport paginationFactory from \"./react-bootstrap-table2-paginator\";\nimport SubNavigationbar from \"./components/SubNavigationbar\";\nimport Menu from \"./components/Menu\";\nimport MenuBar from \"./components/v2/Menubar\";\nimport { getBalls } from \"./api/balls.api\";\nexport class BallsInfo extends Component {\n navHeaders = [\n {\n title: \"Predictions/Results\",\n path: `/matchprediction/${this.props.match.params.matchid}`,\n },\n {\n title: \"Match Stats\",\n path: `/match/${this.props.match.params.matchid}`,\n },\n {\n isSelected: true,\n title: \"Balls details\",\n path: `/ballsInfo/${this.props.match.params.matchid}`,\n },\n {\n title: \"New Predictions/Results\",\n path: `/new_matchprediction/${this.props.match.params.matchid}`,\n },\n {\n title: \"Lineup Shuffing\",\n path: `/lineupshuffing/${this.props.match.params.matchid}`,\n },\n // {\n // title: \"Outliers\",\n // path: `/Outliers/${this.props.match.params.matchid}`,\n // },\n {\n title: 'Player Evaluation',\n path: `/evaluate/${this.props.match.params.matchid}`,\n },\n {\n title: \"Match Tracking\",\n path: `/match-status/${this.props.match.params.matchid}`,\n },\n ];\n state = {\n balls: [],\n columns: [\n {\n dataField: \"ball_number\",\n text: \"ball_number\",\n sort: true,\n },\n {\n dataField: \"inning\",\n text: \"Inning\",\n sort: true,\n },\n {\n dataField: \"over\",\n text: \"Over\",\n sort: true,\n },\n {\n dataField: \"ball\",\n text: \"Ball\",\n sort: true,\n },\n {\n dataField: \"batsman_scored\",\n text: \"Batsman scored\",\n sort: true,\n },\n {\n dataField: \"total_runs\",\n text: \"Total Runs\",\n sort: true,\n },\n {\n dataField: \"extra_wide\",\n text: \"Extra Wide\",\n sort: true,\n },\n {\n dataField: \"extra_no_ball\",\n text: \"Extra No Ball\",\n sort: true,\n },\n {\n dataField: \"extra_bye\",\n text: \"Extra Bye\",\n sort: true,\n },\n {\n dataField: \"extra_leg_bye\",\n text: \"Extra Leg Bye\",\n sort: true,\n },\n {\n dataField: \"extra_runs\",\n text: \"Extra Runs\",\n sort: true,\n },\n {\n dataField: \"dismissal_text\",\n text: \"Dismissal Text\",\n sort: true,\n },\n {\n dataField: \"event\",\n text: \"Event\",\n sort: true,\n },\n {\n dataField: \"striker_id.card_long\",\n text: \"Striker\",\n sort: true,\n },\n {\n dataField: \"non_striker_id.card_long\",\n text: \"Non Striker\",\n sort: true,\n },\n {\n dataField: \"bowler_id.card_long\",\n text: \"Bowler\",\n sort: true,\n },\n {\n dataField: \"battingteam.team_name\",\n text: \"Batting Team\",\n sort: true,\n },\n {\n dataField: \"bowlingteam.team_name\",\n text: \"Bowling Team\",\n sort: true,\n },\n ],\n };\n\n async fetchData(matchId, page, sizePerPage = 10) {\n let response = await getBalls(matchId, page);\n\n this.setState({\n balls: response.data.results,\n totalSize: response.data.count,\n page: page,\n sizePerPage: sizePerPage,\n sizePerPageList: [\n {\n text: \"5\",\n value: 5,\n },\n {\n text: \"10\",\n value: 10,\n },\n ],\n });\n }\n componentDidMount() {\n this.fetchData(this.props.match.params.matchid, 1);\n }\n\n handleTableChange = (\n type,\n {\n page,\n sizePerPage,\n filters,\n sortField,\n sortOrder,\n cellEdit,\n sizePerPageList,\n }\n ) => {\n console.log(\n type,\n page,\n sizePerPage,\n filters,\n sortField,\n sortOrder,\n cellEdit\n );\n setTimeout(() => {\n this.fetchData(this.props.match.params.matchid , page, sizePerPage);\n }, 100);\n };\n\n getMatchID = (match_id) => {\n var id = match_id.split(\"/\");\n var len = id.length;\n return \"/\" + id[len - 2];\n };\n\n render() {\n const RemotePagination = ({\n data,\n page,\n sizePerPage,\n onTableChange,\n totalSize,\n sizePerPageList,\n }) => (\n \n {data.title}\n
\n \n );\n })}\n\n
\n );\n return (\n \n \n
\n );\n }\n}\n\nexport default BallsInfo;","import React, { Component } from 'react';\nimport BootstrapTable from './react-bootstrap-table2';\nimport paginationFactory from './react-bootstrap-table2-paginator';\nimport filterFactory, {\n textFilter,\n selectFilter,\n Comparator,\n} from './react-bootstrap-table2-filter';\nimport { getLeagues } from './api/leagues.api';\nimport { SizePerPageList } from './config/constant';\nimport Menu from './components/Menu'\nexport class Leagues extends Component {\n constructor(props) {\n super(props);\n this.current_filter = {};\n this.columns = [\n {\n dataField: 'url',\n text: 'League ID',\n sort: true,\n filter: textFilter(),\n formatter: (cell, row) => (\n {this.urlarg(cell)} \n ),\n },\n {\n dataField: 'series_category_name',\n text: 'Series Category',\n sort: true,\n formatter: (cell) => cell,\n filter: selectFilter({\n options: this.getSeriesCategoryNameList(),\n }),\n },\n {\n dataField: 'series_name',\n text: 'Series Name',\n sort: true,\n formatter: (cell) => cell,\n filter: selectFilter({\n options: this.getSeriesNameList(),\n }),\n },\n ];\n this.state = {\n checkSeriesName: false,\n checkSeriesCategoryName: false,\n selected_series_val: null,\n leaques: [],\n page: 1,\n sizePerPage: 20,\n sizePerPageList: SizePerPageList,\n };\n }\n componentDidMount() {\n this.fetchLeagues();\n }\n\n shouldComponentUpdate(nextProps, nextState, nextContext) {\n const cols = [...this.columns];\n let tempCols = [];\n for (let i = 0; i < cols.length; i++) {\n let col = cols[i];\n if (col.dataField) {\n if (col.dataField in this.current_filter) {\n if (this.current_filter[col.dataField].filterType === 'DATE') {\n col.filter.props.defaultValue = {\n date: new Date(this.current_filter[col.dataField].filterVal),\n comparator: Comparator.GT,\n };\n } else {\n col.filter.props.defaultValue = this.current_filter[\n col.dataField\n ].filterVal;\n }\n }\n }\n\n tempCols.push(col);\n }\n\n this.columns = tempCols;\n return true;\n }\n\n async fetchLeagues(\n page = this.state.page,\n perPage = this.state.sizePerPage,\n leagueId = null,\n catagory = null,\n seriesName = null\n ) {\n const response = await getLeagues(\n page,\n perPage,\n leagueId,\n catagory,\n seriesName\n );\n this.setState({\n totalSize: response.data.count,\n leaques: response.data.results,\n page: page,\n sizePerPage: perPage,\n });\n }\n\n handleTableChange = (\n type,\n {\n page,\n sizePerPage,\n filters,\n sortField,\n sortOrder,\n cellEdit,\n sizePerPageList,\n }\n ) => {\n this.current_filter = filters;\n\n let leaguesId = null;\n let catagory = null;\n let seriesName = null;\n if (filters.url) {\n leaguesId = filters.url.filterVal;\n } else {\n leaguesId = this.columns[0].filter.props.defaultValue || null;\n }\n if (filters['series_category_name']) {\n catagory = filters['series_category_name'].filterVal;\n } else {\n catagory = this.columns[1].filter.props.defaultValue || null;\n }\n\n if (filters['series_name']) {\n seriesName = filters['series_name'].filterVal;\n } else {\n seriesName = this.columns[2].filter.props.defaultValue || null;\n }\n this.fetchLeagues(page, sizePerPage, leaguesId, catagory, seriesName);\n };\n\n urlarg(id) {\n var url = id.split('/');\n var argcheck = url[url.length - 2];\n\n return argcheck;\n }\n\n getSeriesID = (series_id) => {\n var id = series_id.split('/');\n var len = id.length;\n return '/league/' + id[len - 2];\n };\n\n getMatchID = (match_id) => {\n var id = match_id.split('/');\n var len = id.length;\n return '/matchprediction/' + id[len - 2];\n };\n\n getSeriesNameList = () => {\n var tempdict = { '[]': 'All' };\n fetch(process.env.REACT_APP_API_ENDPOINT + '/api/series/?page_size=1000')\n .then((res) => res.json())\n .then((results) => {\n for (let i = 0; i < Object.keys(results.results).length; i++) {\n tempdict[results.results[i].series_name] =\n results.results[i].series_name;\n }\n })\n .catch((err) => {\n throw err;\n });\n return tempdict;\n };\n\n getSeriesCategoryNameList = () => {\n var tempdict = { '[]': 'All' };\n fetch(process.env.REACT_APP_API_ENDPOINT + '/api/series/?page_size=1000')\n .then((res) => res.json())\n .then((results) => {\n for (let i = 0; i < Object.keys(results.results).length; i++) {\n tempdict[results.results[i].series_category_name] =\n results.results[i].series_category_name;\n }\n })\n .catch((err) => {\n throw err;\n });\n return tempdict;\n };\n\n render() {\n const RemotePagination = ({\n data,\n page,\n sizePerPage,\n onTableChange,\n totalSize,\n sizePerPageList,\n }) => (\n \n \n
\n \n
\n );\n return (\n \n \n
\n );\n }\n}\n\nexport default Leagues;\n","import React, { Component } from 'react'\nimport $ from \"jquery\";\nimport {getLeagueResultSummary} from '../../api/stats.api';\n\nasync function fetchPages(url, page_num, max_pages, acc) {\n let page = await fetch(url+''+page_num).then(response => response.json());\n if(page.next == null || page_num >= max_pages) {\n return acc.concat(page.results);\n }\n else {\n return await fetchPages(url, page_num+1, max_pages, page.results);\n }\n}\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nexport default class leagueresult extends Component {\n constructor(props) {\n super(props);\n this.state = {\n\n imageUrl: [],\n teamcolour: null,\n results: [],\n runs1: [],\n runs2: [],\n runs1sec: [],\n runs2sec: [],\n wicket1: [],\n wicket2: [],\n wicket1sec: [],\n wicket2sec: [],\n series: null,\n }\n }\n\nasync componentDidMount() {\n\n var colourtemp = [];\n var tempresults = [];\n var tempruns1 = [];\n var tempruns1sec = [];\n var tempruns2 = [];\n var tempruns2sec = [];\n var tempwickets1 = [];\n var tempwickets1sec = [];\n var tempwickets2 = [];\n var tempwickets2sec = [];\n var temp1 = [];\n let tempseries = null;\n var temp=[];\n\n var url = document.URL.split(\"/\");\n let series_id = '';\n if (!this.props.series_id) {\n series_id = url[url.length-1];\n }else {\n series_id = this.props.series_id;\n }\n\n var allResults = (await getLeagueResultSummary(series_id)).data;\n\n for (let i = 0; i < Object.keys(allResults).length; i++) {\n temp1.push(allResults[i]);\n tempseries = temp1[0].series_name;\n }\n\n let counter=null;\n let tempid1=null;\n let tempid2=null;\n let runs1=null;\n let runs1sec=0;\n let runs2=null;\n let runs2sec=0;\n let wickets1=null;\n let wickets1sec=0;\n let wickets2=null;\n let wickets2sec=0;\n let runs1counter=null;\n let runs2counter=null;\n let wickets1counter=null;\n let wickets2counter=null;\n\n for (let i = 0; i < Object.keys(temp1).length; i++) {\n if (i == 0){\n tempid1=temp1[i].team1_id;\n tempid2=temp1[i].team2_id;\n tempresults.push(temp1[i]);\n counter = i;\n if (temp1[i].batting_team_id === tempid1){\n runs1 = runs1+temp1[i].runs;\n runs1counter = runs1counter +1;\n wickets1 = wickets1+temp1[i].wickets;\n wickets1counter = wickets1counter+1;\n }\n else if (temp1[i].batting_team_id === tempid2){\n runs2 = runs2+temp1[i].runs;\n runs2counter = runs2counter +1;\n wickets2 = wickets2+temp1[i].wickets;\n wickets2counter = wickets2counter+1;\n }\n }\n else if (i >0){\n if (tempresults[counter].match_id !== temp1[i].match_id){\n tempresults.push(temp1[i]);\n tempruns1.push(runs1);\n tempruns1sec.push(runs1sec);\n tempruns2.push(runs2);\n tempruns2sec.push(runs2sec);\n tempwickets1.push(wickets1);\n tempwickets2.push(wickets2);\n tempwickets1sec.push(wickets1sec);\n tempwickets2sec.push(wickets2sec);\n tempid1=temp1[i].team1_id;\n tempid2=temp1[i].team2_id;\n runs1 = 0;\n runs1sec = 0;\n runs1counter = 0;\n runs2 = 0;\n runs2sec = 0;\n runs2counter = 0;\n wickets1 = 0;\n wickets2 = 0;\n wickets1sec = 0;\n wickets2sec = 0;\n wickets1counter = 0;\n wickets2counter = 0;\n counter = counter +1;\n\n if (temp1[i].batting_team_id === tempid1){\n if(runs1counter == 1){\n runs1sec = runs1sec+temp1[i].runs;\n }\n else{\n runs1 = runs1+ temp1[i].runs;\n runs1counter = runs1counter +1;\n }\n if(wickets1counter == 1){\n wickets1sec = wickets1sec+temp1[i].wickets;\n }\n else{\n wickets1 = wickets1+temp1[i].wickets;\n wickets1counter = wickets1counter+1;\n }\n\n }\n else if (temp1[i].batting_team_id === tempid2){\n if(runs2counter == 1){\n runs2sec = runs2sec+temp1[i].runs;\n }\n else{\n runs2 = runs2+temp1[i].runs;\n runs2counter = runs2counter +1;\n }\n if(wickets2counter == 1){\n wickets2sec = wickets2sec+temp1[i].wickets;\n }\n else{\n wickets2 = wickets2+temp1[i].wickets;\n wickets2counter = wickets2counter+1;\n }\n }\n }\n else{\n if (temp1[i].batting_team_id === tempid1){\n if(runs1counter == 1){\n runs1sec = runs1sec+temp1[i].runs;\n }\n else{\n runs1 = runs1+ temp1[i].runs;\n runs1counter = runs1counter +1;\n }\n if(wickets1counter == 1){\n wickets1sec = wickets1sec+temp1[i].wickets;\n }\n else{\n wickets1 = wickets1+temp1[i].wickets;\n wickets1counter = wickets1counter+1;\n }\n }\n else if (temp1[i].batting_team_id === tempid2){\n if(runs2counter == 1){\n runs2sec = runs2sec+temp1[i].runs;\n }\n else{\n runs2 = runs2+temp1[i].runs;\n runs2counter = runs2counter +1;\n }\n if(wickets2counter == 1){\n wickets2sec = wickets2sec+temp1[i].wickets;\n }\n else{\n wickets2 = wickets2+temp1[i].wickets;\n wickets2counter = wickets2counter+1;\n }\n }\n }\n if (i == Object.keys(temp1).length - 1){\n tempruns1.push(runs1);\n tempruns1sec.push(runs1sec);\n tempruns2.push(runs2);\n tempruns2sec.push(runs2sec);\n tempwickets1.push(wickets1);\n tempwickets2.push(wickets2);\n tempwickets1sec.push(wickets1sec);\n tempwickets2sec.push(wickets2sec);\n }\n }\n\n }\n\n\n this.setState({\n results: tempresults,\n runs1: tempruns1,\n runs2: tempruns2,\n runs1sec: tempruns1sec,\n runs2sec: tempruns2sec,\n wickets1: tempwickets1,\n wickets2: tempwickets2,\n wicket1sec: tempwickets1sec,\n wicket2sec: tempwickets2sec,\n series: tempseries,\n\n })\n // Promise.all([\n // fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/league/league-results-summary/?series_id=\"+param3),\n // fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/league/league-results-summary/?page=2&series_id=\"+param3),\n // fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/league/league-results-summary/?page=3&series_id=\"+param3),\n // fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/league/league-results-summary/?page=4&series_id=\"+param3),\n // fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/league/league-results-summary/?page=5&series_id=\"+param3),\n // fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/league/league-results-summary/?page=6&series_id=\"+param3),\n // fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/league/league-results-summary/?page=7&series_id=\"+param3),\n // fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/league/league-results-summary/?page=8&series_id=\"+param3),\n // fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/league/league-results-summary/?page=9&series_id=\"+param3),\n // fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/league/league-results-summary/?page=10&series_id=\"+param3)\n // ])\n // .then(([res1, res2, res3,res4,res5,res6, res7, res8,res9,res10]) => Promise.all([res1.json(), res2.json(), res3.json(), res4.json(), res5.json(),\n // res6.json(), res7.json(), res8.json(), res9.json(), res10.json()]))\n // .then(([data1, data2, data3,data4,data5,data6, data7, data8,data9,data10]) => {\n // if(data1.hasOwnProperty('results')){\n // for (let i = 0; i < Object.keys(data1.results).length; i++) {\n // temp1.push(data1.results[i]);\n // tempseries = temp1[0].series_name;\n // }\n // }\n // if(data2.hasOwnProperty('results')){\n // for (let i = 0; i < Object.keys(data2.results).length; i++) {\n // temp1.push(data2.results[i]);\n // }\n // }\n // if(data3.hasOwnProperty('results')){\n // for (let i = 0; i < Object.keys(data3.results).length; i++) {\n // temp1.push(data3.results[i]);\n // }\n // }\n // if(data4.hasOwnProperty('results')){\n // for (let i = 0; i < Object.keys(data4.results).length; i++) {\n // temp1.push(data4.results[i]);\n // }\n // }\n // if(data5.hasOwnProperty('results')){\n // for (let i = 0; i < Object.keys(data5.results).length; i++) {\n // temp1.push(data5.results[i]);\n // }\n // }\n // if(data6.hasOwnProperty('results')){\n // for (let i = 0; i < Object.keys(data6.results).length; i++) {\n // temp1.push(data6.results[i]);\n // }\n // }\n // if(data7.hasOwnProperty('results')){\n // for (let i = 0; i < Object.keys(data7.results).length; i++) {\n // temp1.push(data7.results[i]);\n // }\n // }\n // if(data8.hasOwnProperty('results')){\n // for (let i = 0; i < Object.keys(data8.results).length; i++) {\n // temp1.push(data8.results[i]);\n // }\n // }\n // if(data9.hasOwnProperty('results')){\n // for (let i = 0; i < Object.keys(data9.results).length; i++) {\n // temp1.push(data9.results[i]);\n // }\n // }\n // if(data10.hasOwnProperty('results')){\n // for (let i = 0; i < Object.keys(data10.results).length; i++) {\n // temp1.push(data10.results[i]);\n // }\n // }\n\n // let counter=null;\n // let tempid1=null;\n // let tempid2=null;\n // let runs1=null;\n // let runs1sec=0;\n // let runs2=null;\n // let runs2sec=0;\n // let wickets1=null;\n // let wickets1sec=0;\n // let wickets2=null;\n // let wickets2sec=0;\n // let runs1counter=null;\n // let runs2counter=null;\n // let wickets1counter=null;\n // let wickets2counter=null;\n\n // for (let i = 0; i < Object.keys(temp1).length; i++) {\n // if (i == 0){\n // tempid1=temp1[i].team1_id;\n // tempid2=temp1[i].team2_id;\n // tempresults.push(temp1[i]);\n // counter = i;\n // if (temp1[i].batting_team_id === tempid1){\n // runs1 = runs1+temp1[i].runs;\n // runs1counter = runs1counter +1;\n // wickets1 = wickets1+temp1[i].wickets;\n // wickets1counter = wickets1counter+1;\n // }\n // else if (temp1[i].batting_team_id === tempid2){\n // runs2 = runs2+temp1[i].runs;\n // runs2counter = runs2counter +1;\n // wickets2 = wickets2+temp1[i].wickets;\n // wickets2counter = wickets2counter+1;\n // }\n // }\n // else if (i >0){\n // if (tempresults[counter].match_id !== temp1[i].match_id){\n // tempresults.push(temp1[i]);\n // tempruns1.push(runs1);\n // tempruns1sec.push(runs1sec);\n // tempruns2.push(runs2);\n // tempruns2sec.push(runs2sec);\n // tempwickets1.push(wickets1);\n // tempwickets2.push(wickets2);\n // tempwickets1sec.push(wickets1sec);\n // tempwickets2sec.push(wickets2sec);\n // tempid1=temp1[i].team1_id;\n // tempid2=temp1[i].team2_id;\n // runs1 = 0;\n // runs1sec = 0;\n // runs1counter = 0;\n // runs2 = 0;\n // runs2sec = 0;\n // runs2counter = 0;\n // wickets1 = 0;\n // wickets2 = 0;\n // wickets1sec = 0;\n // wickets2sec = 0;\n // wickets1counter = 0;\n // wickets2counter = 0;\n // counter = counter +1;\n\n // if (temp1[i].batting_team_id === tempid1){\n // if(runs1counter == 1){\n // runs1sec = runs1sec+temp1[i].runs;\n // }\n // else{\n // runs1 = runs1+ temp1[i].runs;\n // runs1counter = runs1counter +1;\n // }\n // if(wickets1counter == 1){\n // wickets1sec = wickets1sec+temp1[i].wickets;\n // }\n // else{\n // wickets1 = wickets1+temp1[i].wickets;\n // wickets1counter = wickets1counter+1;\n // }\n\n // }\n // else if (temp1[i].batting_team_id === tempid2){\n // if(runs2counter == 1){\n // runs2sec = runs2sec+temp1[i].runs;\n // }\n // else{\n // runs2 = runs2+temp1[i].runs;\n // runs2counter = runs2counter +1;\n // }\n // if(wickets2counter == 1){\n // wickets2sec = wickets2sec+temp1[i].wickets;\n // }\n // else{\n // wickets2 = wickets2+temp1[i].wickets;\n // wickets2counter = wickets2counter+1;\n // }\n // }\n // }\n // else{\n // if (temp1[i].batting_team_id === tempid1){\n // if(runs1counter == 1){\n // runs1sec = runs1sec+temp1[i].runs;\n // }\n // else{\n // runs1 = runs1+ temp1[i].runs;\n // runs1counter = runs1counter +1;\n // }\n // if(wickets1counter == 1){\n // wickets1sec = wickets1sec+temp1[i].wickets;\n // }\n // else{\n // wickets1 = wickets1+temp1[i].wickets;\n // wickets1counter = wickets1counter+1;\n // }\n // }\n // else if (temp1[i].batting_team_id === tempid2){\n // if(runs2counter == 1){\n // runs2sec = runs2sec+temp1[i].runs;\n // }\n // else{\n // runs2 = runs2+temp1[i].runs;\n // runs2counter = runs2counter +1;\n // }\n // if(wickets2counter == 1){\n // wickets2sec = wickets2sec+temp1[i].wickets;\n // }\n // else{\n // wickets2 = wickets2+temp1[i].wickets;\n // wickets2counter = wickets2counter+1;\n // }\n // }\n // }\n // if (i == Object.keys(temp1).length - 1){\n // tempruns1.push(runs1);\n // tempruns1sec.push(runs1sec);\n // tempruns2.push(runs2);\n // tempruns2sec.push(runs2sec);\n // tempwickets1.push(wickets1);\n // tempwickets2.push(wickets2);\n // tempwickets1sec.push(wickets1sec);\n // tempwickets2sec.push(wickets2sec);\n // }\n // }\n\n // }\n\n\n // this.setState({\n // results: tempresults,\n // runs1: tempruns1,\n // runs2: tempruns2,\n // runs1sec: tempruns1sec,\n // runs2sec: tempruns2sec,\n // wickets1: tempwickets1,\n // wickets2: tempwickets2,\n // wicket1sec: tempwickets1sec,\n // wicket2sec: tempwickets2sec,\n // series: tempseries,\n\n // })\n // })\n // .catch(err => {throw err });\n\n}\n\ngetTeam1Logo(teamId, name) {\n\n if (teamId in teamFlag && teamId !== 4 && teamId !== 11){\n var link = '/flags/svg/'+teamFlag[teamId]\n return \n
\n List of Leagues/Series
\n\n
\n )\n }\n}\n","/* eslint-disable jsx-a11y/alt-text */\nimport React, { useState, useEffect } from 'react';\nimport { getPrematchLineup } from '../api/match.api';\nimport '../assets/styles/lineupshuffing.css';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport SubNavigation from './SubNavigationbar';\nimport Menu from './Menu';\nimport MenuBar from './v2/Menubar';\nimport { postPredictionLineup } from '../api/match.api';\nimport httpClient from '../api/httpClient';\nimport { Button } from 'bootstrap';\nimport { Doughnut } from 'react-chartjs-2';\nimport {teamColor, teamFlag} from '../config/constant'\nvar team1;\nvar team2;\n\nfunction PredictionChart(props) {\n return (\n \n
\n\n \n {this.state.series}\n
\n \n\n
\n \n
\n\n\n \n {\n\n this.state.results.map((result, index) => {\n return (\n
\n \n
\n )\n })\n }\n \n Date: {result.start_date}\n
\n \n Venue: {result.ground_name}\n
\n \n
\n \n {this.getTeam1Logo(result.team1_id, result.team1_name)}\n
\n \n {this.state.runs1[index]}/{this.state.wickets1[index]}\n
\n {this.zerocheck(this.state.runs1sec[index], this.state.wicket1sec[index])}\n
\n \n {this.zerocheck(this.state.runs1sec[index], this.state.wicket1sec[index])}\n
\n {this.state.runs2[index]}/{this.state.wickets2[index]}\n
\n {this.zerocheck(this.state.runs2sec[index], this.state.wicket2sec[index])}\n
\n \n {this.zerocheck(this.state.runs2sec[index], this.state.wicket2sec[index])}\n
\n {this.getTeam1Logo(result.team2_id, result.team2_name)}\n
\n \n {result.win_type}\n
\n \n\n
\n \n {getValidateMessage()}\n
\n {/* \n Batting Team:\n onSwitchbatting()}\n >\n {' '}\n Switch{' '}\n {' '}\n Bowling Team:{' '}\n
*/}\n {battlingTeamName()}
\n {bowlingTeamName()}
\n \n
\n {team1Name} Squad
\n \n \n {team1Name} Batting Lineup {`(${battleingTeam1.length})`}\n
\n {team2Name} squad
\n \n {team2Name} Batting Lineup {`(${battleingTeam2.length})`}\n
\n \n
\n \n {lineupTeam1.map((player) => {\n return (\n \n (player.isSelected = !player.isSelected)}\n className={itemClass(player)}\n >\n {player.card_long}\n
\n \n );\n })}\n \n \n onSelectTeam1Player()}\n style={{ width: '25px', position: 'absolute', top: '35%' }}\n src={require('../assets/imgs/right-arrow.png')}\n />\n \n \n onDeletectBattlingTeam1()}\n style={{ width: '25px', position: 'absolute', top: '40%' }}\n src={require('../assets/imgs/left-arrow.png')}\n />\n \n
\n \n {battleingTeam1.map((player) => {\n return (\n \n (player.isSelected = !player.isSelected)}\n className={itemClass(player)}\n >\n {player.card_long}\n
\n \n );\n })}\n \n {lineupTeam2.map((player) => {\n return (\n \n (player.isSelected = !player.isSelected)}\n className={itemClass(player)}\n >\n {player.card_long}\n
\n \n );\n })}\n \n \n \n onSelectTeam2Player()}\n style={{ width: '25px', position: 'absolute', top: '35%' }}\n src={require('../assets/imgs/right-arrow.png')}\n />\n \n \n onDeletectBattlingTeam2()}\n style={{ width: '25px', position: 'absolute', top: '40%' }}\n src={require('../assets/imgs/left-arrow.png')}\n />\n \n
\n \n {battleingTeam2.map((player) => {\n return (\n \n (player.isSelected = !player.isSelected)}\n className={itemClass(player)}\n >\n {player.card_long}\n
\n \n );\n })}\n \n \n\n \n {waitingmsg}\n
}\n\n\n {getPredictionChart()}\n\n \n \n );\n}\nexport default LineupShuffing;\n","import React, { Component } from \"react\";\nimport { Bar } from \"react-chartjs-2\";\nimport $ from \"jquery\";\nimport {getBestPartnershipLeague} from '../../api/stats.api';\n\n\nconst colour = [\n { teamName: \"WestIndies\", teamid: 4, code: \"#6e0237\" },\n { teamName: \"Pakistan\", teamid: 7, code: \"#00563b\" },\n { teamName: \"Afghanistan\", teamid: 40, code: \"#0033ee\" },\n { teamName: \"Bangladesh\", teamid: 25, code: \"#005400\" },\n { teamName: \"India\", teamid: 6, code: \"#007fff\" },\n { teamName: \"SouthAfrica\", teamid: 3, code: \"#006651\" },\n { teamName: \"Australia\", teamid: 2, code: \"#ffdf00\" },\n { teamName: \"England\", teamid: 1, code: \"#011e3d\" },\n { teamName: \"NewZealand\", teamid: 5, code: \"#000000\" },\n { teamName: \"Canada\", teamid: 17, code: \"#ea3c57\" },\n { teamName: \"Netherlands\", teamid: 15, code: \"#ee7c09\" },\n { teamName: \"PapuaNewGuinea\", teamid: 20, code: \"#000000\" },\n { teamName: \"SriLanka\", teamid: 8, code: \"#000080\" },\n { teamName: \"Zimbabwe\", teamid: 9, code: \"#ff0000\" },\n { teamName: \"Kenya\", teamid: 26, code: \"#006629\" },\n { teamName: \"Ireland\", teamid: 29, code: \"#00cc62\" },\n { teamName: \"UAE\", teamid: 27, code: \"#333333\" },\n { teamName: \"Bermuda\", teamid: 12, code: \"#6e8fd4\" },\n { teamName: \"Scotland\", teamid: 30, code: \"#002a5e\" },\n { teamName: \"HongKong\", teamid: 19, code: \"#000000\" },\n { teamName: \"Nepal\", teamid: 32, code: \"#000080\" },\n { teamName: \"Oman\", teamid: 37, code: \"#ff0000\" },\n { teamName: \"Malaysia\", teamid: 16, code: \"#000000\" },\n { teamName: \"Singapore\", teamid: 23, code: \"#ef3340\" },\n { teamName: \"Islamabad United\", teamid: 5795, code: \"#F05705\" },\n { teamName: \"Karachi Kings\", teamid: 5793, code: \"#4287f5\" },\n { teamName: \"Quetta Gladiators\", teamid: 5797, code: \"#64169C\" },\n { teamName: \"Multan Sultans\", teamid: 6413, code: \"#0d8c46\" },\n { teamName: \"Peshawar Zalmi\", teamid: 5791, code: \"#f7db20\" },\n { teamName: \"Lahore Qalandars\", teamid: 5799, code: \"#a2db27\" },\n];\n\nconst options = {\n legend: {\n display: false,\n },\n scales: {\n yAxes: [\n {\n scaleLabel: {\n display: true,\n labelString: \"Runs\",\n },\n },\n ],\n },\n tooltips: {\n callbacks: {\n label: function (tooltipItem, data) {\n return (\n data.datasets[tooltipItem.datasetIndex].label +\n \" | \" +\n \"Runs: \" +\n tooltipItem.yLabel\n );\n },\n },\n },\n};\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nasync function fetchPages(url, page_num, max_pages = 10000, acc) {\n let page = await fetch(url + \"\" + page_num).then((response) =>\n response.json()\n );\n if (page.next == null || page_num >= max_pages) {\n return acc.concat(page.results);\n } else {\n return await fetchPages(\n url,\n page_num + 1,\n max_pages,\n acc.concat(page.results)\n );\n }\n}\n\nexport default class warmgraph extends Component {\n constructor(props) {\n super(props);\n this.state = {\n team1colour: null,\n team2colour: null,\n imageUrl: [],\n team1id: null,\n team1name: null,\n team2id: null,\n team2name: null,\n\n inn1run: [],\n inn2run: [],\n inn3run: [],\n inn4run: [],\n\n inn1p1: [],\n inn2p1: [],\n inn3p1: [],\n inn4p1: [],\n\n inn1p2: [],\n inn2p2: [],\n inn3p2: [],\n inn4p2: [],\n };\n }\n\n async componentDidMount() {\n\n var url = document.URL.split('/');\n let series_id = '';\n if (!this.props.series_id) {\n series_id = url[url.length - 1];\n } else {\n series_id = this.props.series_id;\n }\n this.loadData(series_id);\n\n }\n\n async loadData(series_id) {\n\n var temp = [];\n var temp1 = [];\n var temp2 = [];\n var temp3 = [];\n var temp4 = [];\n var finaltemp1 = [];\n var finaltemp2 = [];\n var finaltemp3 = [];\n var finaltemp4 = [];\n\n var finaltemp1name = [];\n var finaltemp2name = [];\n var finaltemp3name = [];\n var finaltemp4name = [];\n\n var finaltemp1name2 = [];\n var finaltemp2name2 = [];\n var finaltemp3name2 = [];\n var finaltemp4name2 = [];\n\n var temp1id = null;\n var temp1name = null;\n var temp2id = null;\n var temp2name = null;\n let tempColor1 = null;\n let tempColor2 = null;\n\n\n var allResults = (await getBestPartnershipLeague(series_id)).data;\n temp1 = allResults;\n let temp1counter = 0;\n temp1id = 0;\n temp2id = 0;\n\n if (Object.keys(temp1).length > 0) {\n temp1 = temp1.sort(function (a, b) {\n return b.partnership_runs - a.partnership_runs;\n });\n temp1 = temp1.slice(0, 10);\n }\n\n for (let i = 0; i < Object.keys(temp1).length; i++) {\n finaltemp1.push(temp1[i].partnership_runs);\n finaltemp1name.push(temp1[i].player1_card_long);\n finaltemp1name2.push(temp1[i].player2_card_long);\n temp1counter = temp1counter + 1;\n }\n\n this.setState({\n inn1run: finaltemp1,\n inn1p1: finaltemp1name,\n inn1p2: finaltemp1name2,\n\n });\n }\n\n\n onClickTeam1() {\n this.setState({\n // teamLineup: this.state.team1Lineup,\n });\n\n $(\"#team2\").removeClass(\"activate\");\n $(\"#team1\").addClass(\"activate\");\n }\n\n onClickTeam2() {\n this.setState({\n // teamLineup: this.state.team2Lineup,\n });\n\n $(\"#team1\").removeClass(\"activate\");\n $(\"#team2\").addClass(\"activate\");\n }\n\n render() {\n return (\n \n
\n );\n }\n}\n","import React, { Component } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport $ from 'jquery';\nimport { getMostWicketTaker } from '../../api/stats.api';\n\nconst colour = [\n { teamName: 'WestIndies', teamid: 4, code: '#6e0237' },\n { teamName: 'Pakistan', teamid: 7, code: '#00563b' },\n { teamName: 'Afghanistan', teamid: 40, code: '#0033ee' },\n { teamName: 'Bangladesh', teamid: 25, code: '#005400' },\n { teamName: 'India', teamid: 6, code: '#007fff' },\n { teamName: 'SouthAfrica', teamid: 3, code: '#006651' },\n { teamName: 'Australia', teamid: 2, code: '#ffdf00' },\n { teamName: 'England', teamid: 1, code: '#011e3d' },\n { teamName: 'NewZealand', teamid: 5, code: '#000000' },\n { teamName: 'Canada', teamid: 17, code: '#ea3c57' },\n { teamName: 'Netherlands', teamid: 15, code: '#ee7c09' },\n { teamName: 'PapuaNewGuinea', teamid: 20, code: '#000000' },\n { teamName: 'SriLanka', teamid: 8, code: '#000080' },\n { teamName: 'Zimbabwe', teamid: 9, code: '#ff0000' },\n { teamName: 'Kenya', teamid: 26, code: '#006629' },\n { teamName: 'Ireland', teamid: 29, code: '#00cc62' },\n { teamName: 'UAE', teamid: 27, code: '#333333' },\n { teamName: 'Bermuda', teamid: 12, code: '#6e8fd4' },\n { teamName: 'Scotland', teamid: 30, code: '#002a5e' },\n { teamName: 'HongKong', teamid: 19, code: '#000000' },\n { teamName: 'Nepal', teamid: 32, code: '#000080' },\n { teamName: 'Oman', teamid: 37, code: '#ff0000' },\n { teamName: 'Malaysia', teamid: 16, code: '#000000' },\n { teamName: 'Singapore', teamid: 23, code: '#ef3340' },\n { teamName: 'Islamabad United', teamid: 5795, code: '#F05705' },\n { teamName: 'Karachi Kings', teamid: 5793, code: '#4287f5' },\n { teamName: 'Quetta Gladiators', teamid: 5797, code: '#64169C' },\n { teamName: 'Multan Sultans', teamid: 6413, code: '#0d8c46' },\n { teamName: 'Peshawar Zalmi', teamid: 5791, code: '#f7db20' },\n { teamName: 'Lahore Qalandars', teamid: 5799, code: '#a2db27' },\n];\n\nconst options = {\n legend: {\n display: false,\n },\n scales: {\n yAxes: [\n {\n scaleLabel: {\n display: true,\n labelString: 'Runs',\n },\n },\n ],\n },\n tooltips: {\n callbacks: {\n label: function (tooltipItem, data) {\n return (\n data.datasets[tooltipItem.datasetIndex].label +\n ' | ' +\n 'Runs: ' +\n tooltipItem.yLabel\n );\n },\n },\n },\n};\n\nconst teamFlag = {\n 185: 'pt.svg',\n 18: 'gi.svg',\n 3770: 'bb.svg',\n 40: 'af.svg',\n 45: 'mt.svg',\n 42: 'be.svg',\n 126: 'cz.svg',\n 161: 'lu.svg',\n 164: 'mv.svg',\n 207: 'th.svg',\n 108: 'bh.svg',\n 27: 'ae.svg',\n 15: 'nl.svg',\n 20: 'pg.svg',\n 21: 'ar.svg',\n 117: 'br.svg',\n 44: 'cl.svg',\n 139: 'hu.svg',\n 150: 'is.svg',\n 3793: 'gy.svg',\n 3802: 'jm.svg',\n 112: 'bt.svg',\n 28: 'na.svg',\n 5: 'nz.svg',\n 200: 'es.svg',\n 1094: 'gg.svg',\n 175: 'no.svg',\n 9: 'zw.svg',\n 31: 'it.svg',\n 19: 'hk.svg',\n 4083: 'je.svg',\n 16: 'my.svg',\n 26: 'ke.svg',\n 34: 'ug.svg',\n 178: 'pe.svg',\n 12: 'bm.svg',\n 188: 'ro.svg',\n 179: 'ph.svg',\n 17: 'ca.svg',\n 32: 'np.svg',\n 25: 'bd.svg',\n 13: 'dk.svg',\n 209: 'tr.svg',\n 35: 'de.svg',\n 41: 'at.svg',\n 115: 'bz.svg',\n 4082: 'cr.svg',\n 183: 'pa.svg',\n 135: 'gh.svg',\n 173: 'ng.svg',\n 192: 'ws.svg',\n 116: 'bw.svg',\n 191: 'rw.svg',\n 7: 'pk.svg',\n 142: 'id.svg',\n 39: 'ky.svg',\n 216: 'vu.svg',\n 172: 'nc.svg',\n 10: 'fj.svg',\n 36: 'jp.svg',\n 165: 'mx.svg',\n 29: 'ie.svg',\n 30: 'gb-sct.svg',\n 3: 'za.svg',\n 8: 'lk.svg',\n 2: 'au.svg',\n 6: 'in.svg',\n 1: 'gb-eng.svg',\n 23: 'sg.svg',\n 37: 'om.svg',\n 187: 'qa.svg',\n 154: 'sa.svg',\n 38: 'kw.svg',\n};\n\nexport default class warmgraph extends Component {\n constructor(props) {\n super(props);\n this.state = {\n team1colour: null,\n team2colour: null,\n imageUrl: [],\n team1id: null,\n team1name: null,\n team2id: null,\n team2name: null,\n\n inn1run: [],\n\n inn1p1: [],\n\n inn1p2: [],\n\n inn1name: [],\n };\n }\n\n async componentDidMount() {\n var url = document.URL.split('/');\n let series_id = '';\n if (!this.props.series_id) {\n series_id = url[url.length - 1];\n } else {\n series_id = this.props.series_id;\n }\n\n var temp1 = [];\n var temp2 = [];\n var temp3 = [];\n var temp4 = [];\n var finaltemp1 = [];\n\n var finaltemp1name = [];\n\n var finaltemp1teamid = [];\n var finaltemp1teamname = [];\n\n var temp1id = null;\n var temp1name = null;\n var temp2id = null;\n let tempColor1 = null;\n let tempColor2 = null;\n\n const data = (await getMostWicketTaker(series_id)).data;\n for (let i = 0; i < data.length; i++) {\n if (data[i].bowler_card_long !== 'dummy') {\n temp1.push(data[i]);\n }\n }\n let temp1counter = 0;\n temp1id = 0;\n temp2id = 0;\n\n if (Object.keys(temp1).length > 0) {\n temp1 = temp1.sort(function (a, b) {\n return b.total_wickets - a.total_wickets;\n });\n temp1 = temp1.slice(0, 5);\n }\n for (let i = 0; i < Object.keys(temp1).length; i++) {\n finaltemp1.push(temp1[i].total_wickets);\n finaltemp1name.push(temp1[i].bowler_card_long);\n finaltemp1teamid.push(temp1[i].bowling_team_id);\n finaltemp1teamname.push(temp1[i].bowling_team_name);\n temp1counter = temp1counter + 1;\n }\n this.setState({\n inn1run: finaltemp1,\n inn1p1: finaltemp1name,\n inn1p2: finaltemp1teamid,\n inn1name: finaltemp1teamname,\n });\n }\n\n getTeamLogo(teamId, name) {\n if (teamId in teamFlag && teamId !== 4) {\n var link = '/flags/svg/' + teamFlag[teamId];\n return \n
\n \n {this.state.matchName}\n
\n \n
\n \n
\n \n
\n \n \n \n
\n
\n | \n {this.state.inn1p1[index]} and{\" \"}\n {this.state.inn1p2[index]}\n | \n
\n
\n );\n }\n}\n","import React, { Component } from 'react';\nimport axios from 'axios';\nimport { Container, Row, Col } from 'reactstrap';\nimport BootstrapTable from './react-bootstrap-table2';\nimport paginationFactory from './react-bootstrap-table2-paginator';\nimport Iframe from './components/Iframe';\nimport SubNavigationbar from './components/SubNavigationbar';\nimport { getLeague } from './api/leagues.api';\nimport Menu from './components/Menu';\nimport widgetContainer from './components/WidgetContainer';\nimport Leagueresults from './widgets/components/leagueresults';\nimport Partnershipleague from './widgets/components/partnershipleague';\nimport Wickettakers from './widgets/components/wickettakers';\nexport class IndividualLeague extends Component {\n\n state = {\n league_name: '',\n teams: [],\n columns: [\n {\n dataField: 'team_id',\n text: 'team id',\n sort: true,\n formatter: (cell, row) => {cell} ,\n },\n {\n dataField: 'team_name',\n text: 'Team Name',\n sort: true,\n },\n ],\n };\n componentDidMount() {\n\n this.fetchData(this.props.match.params.seriesid);\n axios\n .get(\n process.env.REACT_APP_API_ENDPOINT +\n '/api/stats/players/player-team-batting-indicators/?series_id=' +\n this.props.match.params.seriesid +\n '&page=1&page_size=10'\n )\n .then((response) => {\n this.setState({\n totalSize: response.data.count,\n teams: response.data.results,\n page: 1,\n sizePerPage: 10,\n sizePerPageList: [\n {\n text: '5',\n value: 5,\n },\n {\n text: '10',\n value: 10,\n },\n {\n text: '20',\n value: 20,\n },\n {\n text: '50',\n value: 50,\n },\n ],\n });\n });\n }\n fetchData = async (id) => {\n const response = await getLeague(id);\n this.setState({ league_name: response.data.series_name });\n };\n handleTableChange = (\n type,\n {\n page,\n sizePerPage,\n filters,\n sortField,\n sortOrder,\n cellEdit,\n sizePerPageList,\n }\n ) => {\n console.log(\n type,\n page,\n sizePerPage,\n filters,\n sortField,\n sortOrder,\n cellEdit\n );\n setTimeout(() => {\n axios\n .get(\n process.env.REACT_APP_API_ENDPOINT +\n '/api/stats/players/player-team-batting-indicators/?series_id=' +\n this.props.match.params.seriesid +\n '&page=' +\n page +\n '&page_size=' +\n sizePerPage\n )\n .then((response) => {\n\n this.setState({\n totalSize: response.data.count,\n leaques: response.data.results,\n page: page,\n sizePerPage: sizePerPage,\n sizePerPageList: [\n {\n text: '5',\n value: 5,\n },\n {\n text: '10',\n value: 10,\n },\n {\n text: '20',\n value: 20,\n },\n {\n text: '50',\n value: 50,\n },\n ],\n });\n });\n }, 100);\n };\n\n getTeamID = (team_id) => {\n return '/teamInfo/' + team_id;\n };\n\n render() {\n const options = {\n leagueresults:\n '',\n partnershipleague:\n '',\n wickettakers:\n '',\n };\n\n\n\n const IndividualMatchWidgets = ({\n leagueresults,\n partnershipleague,\n wickettakers,\n }) => {\n\n const WidgetLeagueResult = widgetContainer(Leagueresults, {\n series_id: this.props.match.params.seriesid,\n iframe: leagueresults,\n });\n\n const WidgetPartnershipleague = widgetContainer(Partnershipleague, {\n series_id: this.props.match.params.seriesid,\n iframe: partnershipleague,\n });\n\n const Widgetwickettakers = widgetContainer(Wickettakers, {\n series_id: this.props.match.params.seriesid,\n iframe: wickettakers,\n });\n\n return (\n \n
\n \n {this.state.matchName}\n
\n \n
\n \n
\n \n
\n \n \n \n
\n
\n | Bowler | \nTeam | \n
|---|---|
| {this.state.inn1p1[index]} | \n\n \n {this.getTeamLogo(\n this.state.inn1p2[index],\n this.state.inn1name[index]\n )}\n \n | \n
\n \n League Results Summary\n
\n \n {/* */}\n \n \n Top 10 Best Partnership in the League\n
\n \n {/* */}\n \n \n Top 5 Wicket Takers in the League\n
\n \n {/* */}\n \n
\n );\n\n return (\n \n \n
\n \n );\n }\n}\n\nexport default IndividualLeague;\n","import React, { Component } from 'react';\nimport BootstrapTable from './react-bootstrap-table2';\n\nimport paginationFactory from './react-bootstrap-table2-paginator';\nimport filterFactory, { textFilter } from './react-bootstrap-table2-filter';\n\nimport { getPlayers } from './api/player.api';\nimport { SizePerPageList } from './config/constant';\nimport Menu from './components/Menu'\nexport class Players extends Component {\n constructor(props) {\n super(props);\n this.current_filter = {};\n this.columns = [\n {\n dataField: 'url',\n text: 'Player ID',\n sort: true,\n filter: textFilter(),\n formatter: (cell, row) => (\n {this.urlarg(cell)} \n ),\n },\n {\n dataField: 'full_name',\n text: 'Full Name',\n sort: true,\n filter: textFilter(),\n },\n {\n dataField: 'card_long',\n text: 'Card Long',\n sort: true,\n filter: textFilter(),\n },\n {\n dataField: 'card_short',\n text: 'Card Short',\n sort: true,\n filter: textFilter(),\n },\n ];\n this.state = {\n players: [],\n page: 1,\n sizePerPage: 20,\n sizePerPageList: SizePerPageList,\n };\n }\n async fetchPlayers(\n page = this.state.page,\n perPage = this.state.sizePerPage,\n playerId = null,\n fullName = null,\n cardLong = null,\n cardShort = null\n ) {\n const response = await getPlayers(\n page,\n perPage,\n playerId,\n fullName,\n cardLong,\n cardShort\n );\n this.setState({\n totalSize: response.data.count,\n players: response.data.results,\n page: page,\n sizePerPage: perPage,\n });\n }\n componentDidMount() {\n this.fetchPlayers();\n }\n shouldComponentUpdate(nextProps, nextState, nextContext) {\n const cols = [...this.columns];\n let tempCols = [];\n for (let i = 0; i < cols.length; i++) {\n let col = cols[i];\n if (col.dataField) {\n if (col.dataField in this.current_filter) {\n col.filter.props.defaultValue = this.current_filter[\n col.dataField\n ].filterVal;\n }\n }\n tempCols.push(col);\n }\n this.columns = tempCols;\n return true;\n }\n\n handleTableChange = (\n type,\n {\n page,\n sizePerPage,\n filters,\n sortField,\n sortOrder,\n cellEdit,\n sizePerPageList,\n }\n ) => {\n this.current_filter = filters;\n let playerId = null;\n let fullName = null;\n let cardLong = null;\n let cardShort = null;\n if (filters.url) {\n playerId = filters.url.filterVal;\n } else {\n playerId = this.columns[0].filter.props.defaultValue || null;\n }\n if (filters.full_name) {\n fullName = filters.full_name.filterVal;\n } else {\n fullName = this.columns[1].filter.props.defaultValue || null;\n }\n\n if (filters.card_long) {\n cardLong = filters.card_long.filterVal;\n } else {\n cardLong = this.columns[2].filter.props.defaultValue || null;\n }\n\n if (filters.card_short) {\n cardShort = filters.card_short.filterVal;\n } else {\n cardShort = this.columns[3].filter.props.defaultValue || null;\n }\n this.fetchPlayers(\n page,\n sizePerPage,\n playerId,\n fullName,\n cardLong,\n cardShort\n );\n };\n\n urlarg(id) {\n var url = id.split('/');\n var argcheck = url[url.length - 2];\n\n return argcheck;\n }\n\n getPlayerID = (player_id) => {\n var id = player_id.split('/');\n var len = id.length;\n return '/player/' + id[len - 2];\n };\n\n render() {\n const RemotePagination = ({\n data,\n page,\n sizePerPage,\n onTableChange,\n totalSize,\n sizePerPageList,\n }) => (\n \n
\n \n {this.state.league_name}\n
\n\n\n
\n \n \n List of Teams\n
\n \n
\n \n
\n );\n return (\n \n \n
\n );\n }\n}\n\nexport default Players;\n","import React, { Component } from 'react';\nimport axios from 'axios';\nimport { Container, Row, Col } from 'reactstrap';\nimport Iframe from './components/Iframe';\nimport SubNavigationbar from './components/SubNavigationbar';\nimport Menu from './components/Menu';\nimport { getPlayer } from './api/player.api';\nexport class IndividualPlayer extends Component {\n fetchPlayer = async (id) => {\n const response = await getPlayer(id);\n this.setState({\n player_name: response.data.full_name,\n });\n };\n componentDidMount() {\n this.fetchPlayer(this.props.match.params.playerid);\n }\n state = {\n player_name: '',\n };\n render() {\n const options = {\n playerbatting:\n '',\n playerbowling:\n '',\n };\n\n const IndividualPlayer = ({ playerbatting, playerbowling }) => (\n \n
\n List of Players
\n\n \n Player Batting\n
\n \n \n \n \n \n Player Bowling\n
\n \n \n \n \n \n
\n \n );\n }\n}\n\nexport default IndividualPlayer;\n","import httpClient from './httpClient';\nconst GET_TEAMS = '/api/teams/';\n\nconst getTeams = (page, perPage, teamid, teamAbbreviation, team_name) => {\n return httpClient.get(GET_TEAMS, {\n params: {\n page: page,\n page_size: perPage,\n team_id: teamid,\n team_abbreviation: teamAbbreviation,\n team_name: team_name,\n\n }\n });\n};\n\nexport { getTeams };\n","import React, { Component } from 'react';\nimport BootstrapTable from './react-bootstrap-table2';\n\nimport paginationFactory from './react-bootstrap-table2-paginator';\nimport filterFactory, { textFilter } from './react-bootstrap-table2-filter';\nimport { SizePerPageList } from './config/constant';\nimport { getTeams } from './api/team.api';\nimport Menu from './components/Menu';\nexport class Teams extends Component {\n constructor(props) {\n super(props);\n this.current_filter = {};\n this.columns = [\n {\n dataField: 'url',\n text: 'Team ID',\n sort: true,\n filter: textFilter(),\n formatter: (cell, row) => (\n {this.urlarg(cell)} \n ),\n },\n {\n dataField: 'team_name',\n text: 'Team Name',\n filter: textFilter(),\n sort: true,\n },\n {\n dataField: 'team_abbreviation',\n text: 'Team Abbreviation',\n filter: textFilter(),\n sort: true,\n },\n {\n dataField: 'country_id',\n text: 'County Id',\n sort: true,\n },\n ];\n this.state = {\n teams: [],\n page: 1,\n sizePerPage: 20,\n sizePerPageList: SizePerPageList,\n };\n }\n\n async fetchTeams(\n page = this.state.page,\n perPage = this.state.sizePerPage,\n teamid = null,\n teamAbbreviation = null,\n team_name = null\n ) {\n const response = await getTeams(\n page,\n perPage,\n teamid,\n teamAbbreviation,\n team_name\n );\n this.setState({\n totalSize: response.data.count,\n teams: response.data.results,\n page: page,\n sizePerPage: perPage,\n });\n }\n\n shouldComponentUpdate(nextProps, nextState, nextContext) {\n const cols = [...this.columns];\n let tempCols = [];\n for (let i = 0; i < cols.length; i++) {\n let col = cols[i];\n if (col.dataField) {\n if (col.dataField in this.current_filter) {\n col.filter.props.defaultValue = this.current_filter[\n col.dataField\n ].filterVal;\n }\n }\n tempCols.push(col);\n }\n this.columns = tempCols;\n return true;\n }\n\n componentDidMount() {\n this.fetchTeams();\n }\n\n handleTableChange = (\n type,\n {\n page,\n sizePerPage,\n filters,\n sortField,\n sortOrder,\n cellEdit,\n sizePerPageList,\n }\n ) => {\n this.current_filter = filters;\n let teamId = null;\n let teamAbbreviation = null;\n let team_name = null;\n if (filters.url) {\n teamId = filters.url.filterVal;\n } else {\n teamId = this.columns[0].filter.props.defaultValue || null;\n }\n if (filters.team_abbreviation) {\n teamAbbreviation = filters.team_abbreviation.filterVal;\n } else {\n teamAbbreviation = this.columns[2].filter.props.defaultValue || null;\n }\n\n if (filters.team_name) {\n team_name = filters.team_name.filterVal;\n } else {\n team_name = this.columns[1].filter.props.defaultValue || null;\n }\n this.fetchTeams(page, sizePerPage, teamId, teamAbbreviation, team_name);\n };\n\n urlarg(id) {\n var url = id.split('/');\n var argcheck = url[url.length - 2];\n\n return argcheck;\n }\n\n getTeamID = (team_id) => {\n var id = team_id.split('/');\n var len = id.length;\n return '/teamplayerInfo/' + id[len - 2];\n };\n\n render() {\n const RemotePagination = ({\n data,\n page,\n sizePerPage,\n onTableChange,\n totalSize,\n sizePerPageList,\n }) => (\n \n
\n\n \n {this.state.player_name}\n
\n\n \n Player Details\n
\n \n
\n );\n return (\n \n \n
\n );\n }\n}\n\nexport default Teams;\n","import React, { Component } from 'react';\nimport axios from 'axios';\nimport { Container, Row, Col } from 'reactstrap';\nimport BootstrapTable from './react-bootstrap-table2';\nimport paginationFactory from './react-bootstrap-table2-paginator';\nimport Iframe from './components/Iframe';\nimport SubNavigationbar from './components/SubNavigationbar';\nimport Menu from './components/Menu';\nconst season = [\n { season: '2019/20' },\n { season: '2019' },\n { season: '2018/19' },\n { season: '2018' },\n { season: '2017/18' },\n { season: '2017' },\n { season: '2016/17' },\n { season: '2016' },\n { season: '2015/16' },\n { season: '2015' },\n { season: '2014/15' },\n { season: '2014' },\n { season: '2013/14' },\n { season: '2013' },\n { season: '2012/13' },\n { season: '2012' },\n];\n\nexport class IndividualTeam extends Component {\n constructor(props) {\n super(props);\n this.state = {\n selected_teammilestonerun: null,\n selected_teamwinloss: null,\n selected_teambestworstresult: null,\n leagueseries: [],\n };\n }\n navHeaders = [\n {\n title: 'List of Players',\n path: `/teamplayerInfo/${this.props.match.params.teamid}`,\n },\n {\n isSelected: true,\n title: 'Team Stats',\n path: `/teamInfo/${this.props.match.params.teamid}`,\n },\n ];\n componentDidMount() {\n var url = document.URL.split('/');\n var temp = [];\n var tempPlayers = {};\n var count = 0;\n var Param3 = url[url.length - 1];\n var listofplayers =\n process.env.REACT_APP_API_ENDPOINT +\n '/api/match-teams/?page_size=1000&team_id=' +\n Param3;\n fetch(process.env.REACT_APP_API_ENDPOINT + '/api/series/?page_size=1000')\n .then((res) => res.json())\n .then((results) => {\n for (let i = 0; i < Object.keys(results.results).length; i++) {\n temp.push(results.results[i]);\n }\n this.setState({\n leagueseries: temp,\n });\n })\n .catch((err) => {\n throw err;\n });\n\n axios\n .get(\n process.env.REACT_APP_API_ENDPOINT +\n '/api/match-teams/?team_id=' +\n Param3 +\n '&page=1&page_size=10'\n )\n .then((response) => {\n this.setState({\n team_name: response.data.results[0].team_id.team_name,\n team_abbreviation: response.data.results[0].team_id.team_abbreviation,\n totalSize: response.data.count,\n playerslist: response.data.results,\n Param3: Param3,\n page: 1,\n sizePerPage: 10,\n sizePerPageList: [\n {\n text: '5',\n value: 5,\n },\n {\n text: '10',\n value: 10,\n },\n {\n text: '20',\n value: 20,\n },\n {\n text: '50',\n value: 50,\n },\n ],\n });\n });\n }\n\n urlarg(id) {\n var url = id.split('/');\n var argcheck = url[url.length - 2];\n\n return argcheck;\n }\n\n getPlayerID = (player_id) => {\n var id = player_id.split('/');\n var len = id.length;\n return '/player/' + id[len - 2];\n };\n\n getMatchID = (match_id) => {\n var id = match_id.split('/');\n var len = id.length;\n return '/matchprediction/' + id[len - 2];\n };\n\n changeSeason(event) {\n this.setState({\n selected_teammilestonerun:\n '',\n selected_teamwinloss:\n '',\n selected_teambestworstresult:\n '',\n });\n }\n\n changeSeries(event) {\n this.setState({\n selected_playerteambatting:\n '',\n selected_playerteambowling:\n '',\n });\n }\n\n render() {\n const options = {\n teamtopwickettakers:\n '',\n teamhighscorers:\n '',\n teammatchessummary:\n '',\n teamhighestmarginwinloss:\n '',\n };\n\n // const Iframe = (props) =>{\n // return ();\n // }\n\n const IndividualTeam = ({\n teamtopwickettakers,\n teamhighscorers,\n teammatchessummary,\n teamhighestmarginwinloss,\n }) => (\n \n
\n \n List of Teams\n
\n\n \n Team Maches Summary\n
\n \n \n \n \n \n Team Highest Margin Win and Loss\n
\n \n \n \n \n \n Bowlers Total Wickets\n
\n \n \n \n \n \n Batters Total Runs\n
\n \n \n \n \n \n Team Name: {team_name}\n
\n \n \n \n \n Team Abbreviation: {team_abbreviation}\n
\n \n \n \n \n \n \n \n Team Milestone Run\n
\n \n \n \n \n \n
\n \n \n Team Tracker\n
\n \n
\n \n \n Select a season:\n \n \n \n {season.map((seasons) => {\n return (\n \n );\n })}\n \n
\n \n
\n \n \n Select a Series:\n \n \n \n {this.state.leagueseries.map((series) => {\n return (\n \n );\n })}\n \n
\n \n \n Player Team Batting\n
\n \n \n \n
\n \n \n \n Player Team Bowling\n
\n \n \n \n
\n \n \n
\n );\n\n const TeamDetails = ({ team_name, team_abbreviation }) => (\n \n \n Team Name: {team_name}\n
\n \n \n \n \n Team Abbreviation: {team_abbreviation}\n
\n \n \n \n \n
\n \n );\n }\n}\n\nexport default IndividualTeamPlayers;\n","import React, { Component } from 'react';\nimport axios from 'axios';\nimport { Container, Row, Col } from 'reactstrap';\nimport Iframe from './components/Iframe';\nimport Menu from './components/Menu';\nconst season = [\n { season: '2019/20' },\n { season: '2019' },\n { season: '2018/19' },\n { season: '2018' },\n { season: '2017/18' },\n { season: '2017' },\n { season: '2016/17' },\n { season: '2016' },\n { season: '2015/16' },\n { season: '2015' },\n { season: '2014/15' },\n { season: '2014' },\n { season: '2013/14' },\n { season: '2013' },\n { season: '2012/13' },\n { season: '2012' },\n];\n\nexport class IndividualTeamMatch extends Component {\n constructor(props) {\n super(props);\n this.state = {\n selected_teammilestonerun: null,\n selected_teamwinloss: null,\n selected_teambestworstresult: null,\n leagueseries: [],\n };\n }\n\n componentDidMount() {\n var url = document.URL.split('/');\n var temp = [];\n var tempPlayers = {};\n var count = 0;\n fetch(process.env.REACT_APP_API_ENDPOINT + '/api/series/?page_size=1000')\n .then((res) => res.json())\n .then((results) => {\n for (let i = 0; i < Object.keys(results.results).length; i++) {\n temp.push(results.results[i]);\n }\n this.setState({\n leagueseries: temp,\n });\n })\n .catch((err) => {\n throw err;\n });\n\n axios\n .get(\n process.env.REACT_APP_API_ENDPOINT +\n '/api/match-teams/?match_id=' +\n this.props.match.params.matchid +\n '&team_id=' +\n this.props.match.params.teamid +\n '&page=1&page_size=10'\n )\n .then((response) => {\n this.setState({\n team_name: response.data.results[0].team_id.team_name,\n team_abbreviation: response.data.results[0].team_id.team_abbreviation,\n totalSize: response.data.count,\n page: 1,\n sizePerPage: 10,\n sizePerPageList: [\n {\n text: '5',\n value: 5,\n },\n {\n text: '10',\n value: 10,\n },\n {\n text: '20',\n value: 20,\n },\n {\n text: '50',\n value: 50,\n },\n ],\n });\n });\n }\n\n urlarg(id) {\n var url = id.split('/');\n var argcheck = url[url.length - 2];\n\n return argcheck;\n }\n\n getPlayerID = (player_id) => {\n var id = player_id.split('/');\n var len = id.length;\n return '/player/' + id[len - 2];\n };\n\n getMatchID = (match_id) => {\n var id = match_id.split('/');\n var len = id.length;\n return '/matchprediction/' + id[len - 2];\n };\n\n changeSeason(event) {\n this.setState({\n selected_teammilestonerun:\n '',\n selected_teamwinloss:\n '',\n selected_teambestworstresult:\n '',\n });\n }\n\n changeSeries(event) {\n this.setState({\n selected_playerteambatting:\n '',\n selected_playerteambowling:\n '',\n });\n }\n\n render() {\n const options = {\n teamtopwickettakers:\n '',\n teamhighscorers:\n '',\n teammatchessummary:\n '',\n teamhighestmarginwinloss:\n '',\n };\n\n // const Iframe = (props) =>{\n // return ();\n // }\n\n const IndividualTeam = ({\n teamtopwickettakers,\n teamhighscorers,\n teammatchessummary,\n teamhighestmarginwinloss,\n }) => (\n \n
\n \n
\n \n \n List of Players\n
\n \n
\n \n \n Team Maches Summary\n
\n \n \n \n \n \n Team Highest Margin Win and Loss\n
\n \n \n \n \n \n Bowlers Total Wickets\n
\n \n \n \n \n \n Batters Total Runs\n
\n \n \n \n \n \n Team Name: {team_name}\n
\n \n \n \n \n Team Abbreviation: {team_abbreviation}\n
\n \n \n \n \n \n \n \n Team Milestone Run\n
\n \n \n \n \n \n \n
\n \n \n \n Team Current Stats\n
\n \n
\n \n \n Select a season:\n \n \n \n {season.map((seasons) => {\n return (\n \n );\n })}\n \n
\n \n
\n \n \n Select a Series:\n \n \n \n {this.state.leagueseries.map((series) => {\n return (\n \n );\n })}\n \n
\n \n \n Player Team Batting\n
\n \n \n \n
\n \n \n \n Player Team Bowling\n
\n \n \n \n
\n \n \n
\n );\n\n const TeamDetails = ({ match_id, team_name, team_abbreviation }) => (\n \n \n Match ID: {match_id}\n
\n \n \n \n \n Team Name: {team_name}\n
\n \n \n \n \n Team Abbreviation: {team_abbreviation}\n
\n \n \n {this.urlarg(cell)}
,\n filter: textFilter({\n delay: 1000,\n }),\n },\n {\n dataField: 'object_type_id',\n text: 'Object Type',\n sort: true,\n formatter: cell => this.objectTypeDict[cell],\n filter: selectFilter({\n\n options: this.objectTypeFilterOption(),\n\n }),\n },\n {\n dataField: 'object_id',\n text: 'Object ID',\n filter: textFilter(),\n sort: true,\n },\n {\n dataField: 'started_date',\n formatter: cell => this.fortmatDate(cell),\n text: 'Start Date',\n filter: dateFilter(\n\n ),\n sort: true,\n },\n {\n dataField: 'finished_date',\n formatter: cell => this.fortmatDate(cell),\n text: 'Finished Date',\n filter: dateFilter(),\n sort: true,\n },\n {\n dataField: 'status',\n text: 'Status',\n formatter: (cell) => this.statusDict[cell],\n filter: selectFilter({\n options: this.statusFilterOption(),\n }),\n sort: true,\n },\n {\n dataField: 'error_msg',\n text: 'Error Message',\n filter: textFilter(),\n sort: true,\n },\n {\n dataField: 'context',\n text: 'Context',\n sort: true,\n },\n ];\n return col;\n }\n\n fortmatDate = (date) => {\n const objMoment = moment(date).utc();\n return objMoment.format(\"MMM Do YYYY, h:mm A\"); // \"Sunday, February 14th 2010, 3:25:50 pm\"\n }\n getMatchID = (match_id) => {\n var id = match_id.split('/')\n var len = id.length\n return '/matchprediction/' + id[len - 2]\n }\n statusFilterOption() {\n let searchDict = {};\n for (const key in this.statusDict) {\n searchDict[parseInt(key) + 1] = this.statusDict[key];\n }\n searchDict[0] = 'All';\n return searchDict;\n }\n objectTypeFilterOption() {\n let searchDict = {};\n for (const key in this.objectTypeDict) {\n searchDict[parseInt(key) + 1] = this.objectTypeDict[key];\n }\n searchDict[0] = 'All';\n return searchDict;\n }\n\n shouldComponentUpdate(nextProps, nextState, nextContext) {\n\n const cols = [...this.columns];\n let tempCols = [];\n\n for (let i = 0; i < cols.length; i++) {\n let col = cols[i];\n if (col.dataField) {\n if (col.dataField in this.current_filter) {\n if (this.current_filter[col.dataField].filterType === \"DATE\") {\n col.filter.props.defaultValue = { date: new Date(this.current_filter[col.dataField].filterVal), comparator: Comparator.GT };\n } else {\n col.filter.props.defaultValue = this.current_filter[col.dataField].filterVal\n }\n }\n }\n\n tempCols.push(col);\n }\n\n this.columns = tempCols;\n return true;\n }\n //UNSAFE_componentWillUpdate() {\n //const cols = [...this.columns];\n //let tempCols = [];\n\n //for (let i = 0; i < cols.length; i++) {\n //let col = cols[i];\n //if (col.dataField) {\n //if ( col.dataField in this.current_filter){\n\n //if (this.current_filter[col.dataField].filterType === \"DATE\") {\n //col.filter.props.defaultValue = { date: new Date(2018, 0, 1), comparator: Comparator.GT };\n //}else {\n //col.filter.props.defaultValue = this.current_filter[col.dataField].filterVal\n //}\n //}\n //}\n\n //tempCols.push(col);\n //}\n\n //this.columns = tempCols;\n //}\n\n componentDidMount() {\n this.fetchData(1, 20, null);\n }\n\n fetchData(page, page_size, filters) {\n let requestUrl = `/api/ingestion/crawler-tracking/?page=${page}&page_size=${page_size}`;\n for (var key in this.filters) {\n if (filters != null && !(key in filters)) {\n if (this.filters[key] !== -1) {\n if (key === 'url') {\n requestUrl += `&$id=${this.filters[key]}`;\n } else {\n requestUrl += `&${key}=${this.filters[key]}`;\n }\n }\n }\n }\n if (filters && Object.keys(filters).length > 0) {\n for (const item in filters) {\n let filterValue = '';\n if (filters[item].filterType === 'SELECT') {\n filterValue = filters[item].filterVal - 1;\n } else {\n filterValue = filters[item].filterVal;\n }\n if (item !== 'url') {\n this.filters[item] = filterValue;\n if (filterValue !== -1) {\n requestUrl += `&${item}=${filterValue}`;\n }\n } else {\n this.filters['id'] = filterValue;\n requestUrl += `&id=${filterValue}`;\n }\n\n }\n }\n const token = localStorage.getItem(\"access_token\");\n axios\n .get(process.env.REACT_APP_API_ENDPOINT + requestUrl, { headers: { Authorization: `Token ${token}` } })\n .then((response) => {\n this.setState({\n\n totalSize: response.data.count,\n page: page,\n sizePerPage: page_size,\n crawler_trackings: response.data.results.map((item) => {\n if (item.context) {\n item.context = JSON.stringify(item.context);\n }\n return item;\n }),\n sizePerPageList: [{\n text: '5',\n value: 5,\n },\n {\n text: '10',\n value: 10,\n },\n {\n text: '20',\n value: 20,\n },\n {\n text: '50',\n value: 50,\n },\n {\n text: '100',\n value: 100,\n },\n ],\n });\n });\n }\n\n urlarg(id) {\n var url = id.split('/');\n var argcheck = url[url.length - 2];\n return argcheck;\n }\n handleTableChange = (\n type, {\n page,\n sizePerPage,\n filters,\n sortField,\n sortOrder,\n cellEdit,\n sizePerPageList,\n }\n ) => {\n this.current_filter = filters\n\n setTimeout(() => {\n this.fetchData(page, sizePerPage, filters);\n }, 1000);\n };\n\n render() {\n const RemotePagination = ({\n data,\n page,\n sizePerPage,\n onTableChange,\n totalSize,\n sizePerPageList,\n }) => (\n\n
\n );\n return (\n \n \n
\n );\n }\n}","import React, { Component, useDebugValue } from 'react';\nimport axios from 'axios';\nimport BootstrapTable from './react-bootstrap-table2';\nimport paginationFactory from './react-bootstrap-table2-paginator';\nimport Header from './Header'\nimport filterFactory, {\n textFilter,\n selectFilter,\n} from './react-bootstrap-table2-filter';\nimport Menu from './components/Menu'\nexport default class CrawlerTrackingSummary extends Component {\n constructor(props) {\n super(props);\n this.state = {\n page: 1,\n sizePerPage: 20,\n crawler_trackings: [],\n columns: [\n {\n dataField: 'object_name',\n text: 'Object Name',\n sort: true,\n },\n {\n dataField: 'not_started',\n text: 'Not Started',\n sort: true,\n },\n {\n dataField: 'successful',\n text: 'Started',\n sort: true,\n },\n {\n dataField: 'failed_temp',\n text: 'Successful',\n sort: true,\n },\n {\n dataField: 'failed_temp',\n text: 'Failed Temp',\n sort: true,\n },\n {\n dataField: 'failed_perm',\n text: 'Failed Perm',\n sort: true,\n }\n ],\n };\n }\n urlarg(id) {\n var url = id.split('/');\n var argcheck = url[url.length - 2];\n return argcheck;\n }\n componentDidMount() {\n this.fetchData(1, 20);\n }\n handleTableChange = (\n type,\n {\n page,\n sizePerPage,\n filters,\n\n }\n ) => {\n this.fetchData(page, sizePerPage, filters);\n };\n fetchData(page, page_size) {\n let requestUrl = `/api/ingestion/crawler-tracking-summary/?page=${page}&page_size=${page_size}`;\n axios\n .get(process.env.REACT_APP_API_ENDPOINT + requestUrl)\n .then((response) => {\n this.setState({\n totalSize: response.data.count,\n page: page,\n sizePerPage: page_size,\n crawler_trackings: response.data.results.map((item) => {\n if (item.context) {\n item.context = JSON.stringify(item.context);\n }\n return item;\n }),\n sizePerPageList: [\n {\n text: '5',\n value: 5,\n },\n {\n text: '10',\n value: 10,\n },\n {\n text: '20',\n value: 20,\n },\n {\n text: '50',\n value: 50,\n },\n {\n text: '100',\n value: 100,\n },\n ],\n });\n });\n }\n\n handleTableChange = (\n type,\n {\n page,\n sizePerPage,\n filters\n }\n ) => {\n this.fetchData(page, sizePerPage, filters);\n };\n\n render() {\n const RemotePagination = ({\n data,\n page,\n sizePerPage,\n onTableChange,\n totalSize,\n sizePerPageList,\n }) => (\n \n
\n Data
\n\n
\n );\n return (\n \n \n
\n );\n }\n}\n","import React, { Component } from 'react';\nimport { Scatter } from 'react-chartjs-2';\nimport {getTeamLogo} from '../../config/utils'\nconst colour = [\n { teamid: 4, code: '#6e0237' },\n { teamid: 7, code: '#00563b' },\n { teamid: 40, code: '#0033ee' },\n { teamid: 25, code: '#005400' },\n { teamid: 6, code: '#007fff' },\n { teamid: 3, code: '#006651' },\n { teamid: 2, code: '#ffdf00' },\n { teamid: 1, code: '#011e3d' },\n { teamid: 5, code: '#000000' },\n { teamid: 17, code: '#ea3c57' },\n { teamid: 15, code: '#ee7c09' },\n { teamid: 20, code: '#000000' },\n { teamid: 8, code: '#000080' },\n { teamid: 9, code: '#ff0000' },\n { teamid: 26, code: '#006629' },\n { teamid: 29, code: '#00cc62' },\n { teamid: 27, code: '#333333' },\n { teamid: 12, code: '#6e8fd4' },\n { teamid: 30, code: '#002a5e' },\n { teamid: 19, code: '#000000' },\n { teamid: 32, code: '#000080' },\n { teamid: 37, code: '#ff0000' },\n { teamid: 16, code: '#000000' },\n { teamid: 23, code: '#ef3340' },\n { teamid: 5795, code: '#F05705' },\n { teamid: 5793, code: '#4287f5' },\n { teamid: 5797, code: '#64169C' },\n { teamid: 6413, code: '#0d8c46' },\n { teamid: 5791, code: '#f7db20' },\n { teamid: 5799, code: '#a2db27' },\n];\n\nconst options = {\n responsive: true,\n aspectRatio: 1,\n showLines: true,\n spanGaps: true,\n scales: {\n xAxes: [\n {\n display: true,\n type: 'linear',\n position: 'bottom',\n gridLines: {\n color: 'rgba(0, 0, 0, 0)',\n },\n },\n ],\n yAxes: [\n {\n display: true,\n type: 'linear',\n position: 'bottom',\n gridLines: {\n color: 'rgba(0, 0, 0, 0)',\n },\n },\n ],\n },\n tooltips: {\n callbacks: {\n label: function (tooltipItem, data) {\n if (data.datasets[tooltipItem.datasetIndex].labels)\n return (\n 'Wicket: ' +\n data.datasets[tooltipItem.datasetIndex].labels[tooltipItem.index] +\n ' (' +\n 'Ball: ' +\n tooltipItem.xLabel +\n ')'\n );\n else if (tooltipItem.datasetIndex == 2)\n return (\n 'Ball: ' +\n tooltipItem.xLabel +\n ', Draw prob: ' +\n tooltipItem.yLabel +\n '%'\n );\n else\n return (\n 'Ball: ' +\n tooltipItem.xLabel +\n ', Win prob: ' +\n tooltipItem.yLabel +\n '%'\n );\n },\n },\n },\n legend: {\n labels: {\n filter: function (legendItem, chartData) {\n return (\n legendItem.text != ['Inning 1'] && legendItem.text != ['Inning 2']\n );\n },\n },\n },\n};\n\nconst teamFlag = {\n 185: 'pt.svg',\n 18: 'gi.svg',\n 3770: 'bb.svg',\n 40: 'af.svg',\n 45: 'mt.svg',\n 42: 'be.svg',\n 126: 'cz.svg',\n 161: 'lu.svg',\n 164: 'mv.svg',\n 207: 'th.svg',\n 108: 'bh.svg',\n 27: 'ae.svg',\n 15: 'nl.svg',\n 20: 'pg.svg',\n 21: 'ar.svg',\n 117: 'br.svg',\n 44: 'cl.svg',\n 139: 'hu.svg',\n 150: 'is.svg',\n 3793: 'gy.svg',\n 3802: 'jm.svg',\n 112: 'bt.svg',\n 28: 'na.svg',\n 5: 'nz.svg',\n 200: 'es.svg',\n 1094: 'gg.svg',\n 175: 'no.svg',\n 9: 'zw.svg',\n 31: 'it.svg',\n 19: 'hk.svg',\n 4083: 'je.svg',\n 16: 'my.svg',\n 26: 'ke.svg',\n 34: 'ug.svg',\n 178: 'pe.svg',\n 12: 'bm.svg',\n 188: 'ro.svg',\n 179: 'ph.svg',\n 17: 'ca.svg',\n 32: 'np.svg',\n 25: 'bd.svg',\n 13: 'dk.svg',\n 209: 'tr.svg',\n 35: 'de.svg',\n 41: 'at.svg',\n 115: 'bz.svg',\n 4082: 'cr.svg',\n 183: 'pa.svg',\n 135: 'gh.svg',\n 173: 'ng.svg',\n 192: 'ws.svg',\n 116: 'bw.svg',\n 191: 'rw.svg',\n 7: 'pk.svg',\n 142: 'id.svg',\n 39: 'ky.svg',\n 216: 'vu.svg',\n 172: 'nc.svg',\n 10: 'fj.svg',\n 36: 'jp.svg',\n 165: 'mx.svg',\n 29: 'ie.svg',\n 30: 'gb-sct.svg',\n 3: 'za.svg',\n 8: 'lk.svg',\n 2: 'au.svg',\n 6: 'in.svg',\n 1: 'gb-eng.svg',\n 23: 'sg.svg',\n 37: 'om.svg',\n 187: 'qa.svg',\n 154: 'sa.svg',\n 38: 'kw.svg',\n};\n\nexport default class Winlossplot extends Component {\n constructor(props) {\n super(props);\n this.state = {\n matchName: null,\n battingTeamID: null,\n team1name: null,\n team2name: null,\n team1colour: null,\n team2colour: null,\n team1winprob: [],\n team2winprob: [],\n drawprob: [],\n ballnumber: [],\n innings1: [],\n innings2: [],\n wicketPoints: [],\n wicketLabels: [],\n imageUrl: [],\n };\n }\n\n componentDidMount() {\n var url = document.URL.split('/');\n if (this.props.hasOwnProperty('match_id')) {\n var match_id = this.props.match_id;\n }\n else {\n const search = this.props.location.search;\n const params = new URLSearchParams(search);\n // const page = parseInt(params.get('page')) || 1;\n // const page_size = parseInt(params.get('page_size')) || 20;\n\n\n // let page = 1;\n // let page_size = 20;\n\n var match_id = this.props.match.params['id']\n }\n\n\n this.fetchData();\n\n }\n\n fetchData() {\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n let temp1prob = [];\n let temp2prob = [];\n let tempdrawprob = [];\n let lastInn1Ball = [];\n let lastInn2Ball = [];\n let lastInn3Ball = [];\n let lastInn4Ball = [];\n let tempWicketPts = [];\n let tempWicketLabels = [];\n let tempMatchName = null;\n let tempColor1 = null;\n let tempColor2 = null;\n\n\n fetch(\n process.env.REACT_APP_API_ENDPOINT +\n `/api/preds/predictions/new_plots/result/${matchId}`\n )\n .then((res) => res.json())\n .then((out) => {\n if (out == null || Object.keys(out.predictionsPerInning).length === 0 ){\n return;\n }\n this.setState({\n matchName:`${out.team1Name} - ${out.team2Name}` ,\n battingTeamID: out.battingTeamID,\n team1colour: 'red',\n team2colour:'green',\n });\n for (let i = 0; i < Object.keys(out.predictionsPerInning).length; i++) {\n lastInn1Ball =\n out.predictionsPerInning[0].ballNumber[\n Object.keys(out.predictionsPerInning[0].ballNumber).length - 1\n ];\n lastInn2Ball =\n out.predictionsPerInning[i].ballNumber[\n Object.keys(out.predictionsPerInning[i].ballNumber).length - 1\n ];\n for (\n let j = 0;\n j < Object.keys(out.predictionsPerInning[i].ballNumber).length;\n j++\n ) {\n temp1prob.push({\n x: out.predictionsPerInning[i].ballNumber[j],\n y: out.predictionsPerInning[i].winProbs.team1WinProb[j],\n });\n temp2prob.push({\n x: out.predictionsPerInning[i].ballNumber[j],\n y: out.predictionsPerInning[i].winProbs.team2WinProb[j],\n });\n tempdrawprob.push({\n x: out.predictionsPerInning[i].ballNumber[j],\n y: out.predictionsPerInning[i].winProbs.drawProb[j],\n });\n\n }\n }\n // for (let i = 0; i < Object.keys(out.wickets).length; i++) {\n // tempWicketPts.push({ x: out.wickets[i].ballNumber, y: 50 });\n // tempWicketLabels.push(\n // out.wickets[i].playerOut + ' | ' + out.wickets[i].wicketKind\n // );\n // }\n this.setState({\n team1winprob: this.state.team1winprob.concat(temp1prob),\n team2winprob: this.state.team2winprob.concat(temp2prob),\n drawprob: this.state.drawprob.concat(tempdrawprob),\n team1name: out.team1Name,\n team2name: out.team2Name,\n innings1: [\n { x: lastInn1Ball, y: 0 },\n { x: lastInn1Ball, y: 100 },\n ],\n innings2: [\n { x: lastInn2Ball, y: 0 },\n { x: lastInn2Ball, y: 100 },\n ],\n wicketPoints: tempWicketPts,\n wicketLabels: tempWicketLabels,\n });\n // this.fetchData(page+1, page_size);\n })\n .catch((err) => {\n throw err;\n });\n }\n\n // getTeamLogo(teamId) {\n // return '/flags/svg/' + teamFlag[teamId];\n // // return '/flags/svg/nz.svg';\n // }\n\n render() {\n return (\n \n
\n Data Summary Summary
\n\n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Scatter } from \"react-chartjs-2\";\nimport { getTeamLogo } from \"../../config/utils\";\nconst colour = [\n { teamid: 4, code: \"#6e0237\" },\n { teamid: 7, code: \"#00563b\" },\n { teamid: 40, code: \"#0033ee\" },\n { teamid: 25, code: \"#005400\" },\n { teamid: 6, code: \"#007fff\" },\n { teamid: 3, code: \"#006651\" },\n { teamid: 2, code: \"#ffdf00\" },\n { teamid: 1, code: \"#011e3d\" },\n { teamid: 5, code: \"#000000\" },\n { teamid: 17, code: \"#ea3c57\" },\n { teamid: 15, code: \"#ee7c09\" },\n { teamid: 20, code: \"#000000\" },\n { teamid: 8, code: \"#000080\" },\n { teamid: 9, code: \"#ff0000\" },\n { teamid: 26, code: \"#006629\" },\n { teamid: 29, code: \"#00cc62\" },\n { teamid: 27, code: \"#333333\" },\n { teamid: 12, code: \"#6e8fd4\" },\n { teamid: 30, code: \"#002a5e\" },\n { teamid: 19, code: \"#000000\" },\n { teamid: 32, code: \"#000080\" },\n { teamid: 37, code: \"#ff0000\" },\n { teamid: 16, code: \"#000000\" },\n { teamid: 23, code: \"#ef3340\" },\n { teamid: 5795, code: \"#F05705\" },\n { teamid: 5793, code: \"#4287f5\" },\n { teamid: 5797, code: \"#64169C\" },\n { teamid: 6413, code: \"#0d8c46\" },\n { teamid: 5791, code: \"#f7db20\" },\n { teamid: 5799, code: \"#a2db27\" },\n];\n\nconst options = {\n responsive: true,\n aspectRatio: 1,\n showLines: true,\n spanGaps: true,\n scales: {\n xAxes: [\n {\n display: true,\n type: \"linear\",\n position: \"bottom\",\n gridLines: {\n color: \"rgba(0, 0, 0, 0)\",\n },\n },\n ],\n yAxes: [\n {\n display: true,\n type: \"linear\",\n position: \"bottom\",\n gridLines: {\n color: \"rgba(0, 0, 0, 0)\",\n },\n },\n ],\n },\n tooltips: {\n callbacks: {\n label: function (tooltipItem, data) {\n if (data.datasets[tooltipItem.datasetIndex].labels)\n return (\n \"Wicket: \" +\n data.datasets[tooltipItem.datasetIndex].labels[tooltipItem.index] +\n \" (\" +\n \"Ball: \" +\n tooltipItem.xLabel +\n \")\"\n );\n else\n return (\n \"Ball: \" + tooltipItem.xLabel + \", Score: \" + tooltipItem.yLabel\n );\n },\n },\n },\n legend: {\n labels: {\n filter: function (legendItem, chartData) {\n return (\n legendItem.text != [\"Inning 1\"] &&\n legendItem.text != [\"Inning 2\"] &&\n legendItem.text != [\"Draw\"]\n );\n },\n },\n },\n};\n\nexport default class Teamscoreplot extends Component {\n constructor(props) {\n super(props);\n this.state = {\n matchName: null,\n battingTeamID: null,\n team1name: null,\n team2name: null,\n team1colour: null,\n team2colour: null,\n team1winprob: [],\n team2winprob: [],\n ballnumber: [],\n innings1: [],\n innings2: [],\n wicketPoints: [],\n wicketLabels: [],\n imageUrl: [],\n };\n }\n\n componentDidMount() {\n //\n if (this.props.hasOwnProperty(\"match_id\")) {\n var match_id = this.props.match_id;\n } else {\n const search = this.props.location.search;\n const params = new URLSearchParams(search);\n // const page = parseInt(params.get('page')) || 1;\n // const page_size = parseInt(params.get('page_size')) || 20;\n\n var match_id = this.props.match.params[\"id\"];\n }\n let page = 1;\n let page_size = 20;\n this.fetchData(page, page_size, match_id);\n }\n\n fetchData(page, page_size, matchId) {\n let temp1prob = [];\n let temp2prob = [];\n let lastInn1Ball = [];\n let lastInn2Ball = [];\n let tempWicketPts = [];\n let tempWicketLabels = [];\n let tempMatchName = null;\n let tempColor1 = null;\n let tempColor2 = null;\n\n fetch(\n process.env.REACT_APP_API_ENDPOINT +\n `/api/preds/predictions/scored-plots/result/${matchId}`\n )\n .then((res) => res.json())\n .then((out) => {\n if (out == null || Object.keys(out.predictionsPerInning).length === 0) {\n return;\n }\n this.setState({\n matchName: `${out.team1Name} - ${out.team2Name}`,\n battingTeamID: out.battingTeamID,\n team1colour: \"red\",\n team2colour: \"green\",\n });\n\n for (let i = 0; i < Object.keys(out.predictionsPerInning).length; i++) {\n lastInn1Ball =\n out.predictionsPerInning[0].ballNumber[\n Object.keys(out.predictionsPerInning[0].ballNumber).length - 1\n ];\n lastInn2Ball =\n out.predictionsPerInning[i].ballNumber[\n Object.keys(out.predictionsPerInning[i].ballNumber).length - 1\n ];\n for (\n let j = 0;\n j < Object.keys(out.predictionsPerInning[i].ballNumber).length;\n j++\n ) {\n // if (out.predictionsPerInning[i].scorePreds.team1PredScore[j] ==0) {\n // out.predictionsPerInning[i].scorePreds.team1PredScore[j] == null;\n // }\n // if (out.predictionsPerInning[i].scorePreds.team2PredScore[j] ==0) {\n // out.predictionsPerInning[i].scorePreds.team2PredScore[j] == null;\n // }\n //\n temp1prob.push({\n x: out.predictionsPerInning[i].ballNumber[j],\n y: out.predictionsPerInning[i].scorePreds.team1PredScore[j],\n });\n temp2prob.push({\n x: out.predictionsPerInning[i].ballNumber[j],\n y: out.predictionsPerInning[i].scorePreds.team2PredScore[j],\n });\n }\n }\n // for (let i = 0; i < Object.keys(out.wickets).length; i++) {\n // tempWicketPts.push({x: out.wickets[i].ballNumber, y: 0});\n // tempWicketLabels.push(out.wickets[i].playerOut + ' | ' + out.wickets[i].wicketKind);\n // }\n\n ;\n this.setState({\n team1winprob: temp1prob,\n team2winprob: temp2prob,\n // team1winprob: temp1prob,\n // team2winprob: temp2prob,\n team1name: out.team1Name,\n team2name: out.team2Name,\n innings1: [\n { x: lastInn1Ball, y: 0 },\n { x: lastInn1Ball, y: 200 },\n ],\n innings2: [\n { x: lastInn2Ball, y: 0 },\n { x: lastInn2Ball, y: 200 },\n ],\n wicketPoints: tempWicketPts,\n wicketLabels: tempWicketLabels,\n });\n // this.fetchData(page + 1, page_size, matchId);\n })\n .catch((err) => {\n throw err;\n });\n }\n\n render() {\n return (\n \n
\n \n {this.state.matchName}\n
\n \n \n Current Batting Team: \n \n
\n \n
\n );\n }\n}","import React, { Component } from 'react';\nimport axios from 'axios';\nimport { Container, Row, Col } from 'reactstrap';\n\nimport SubNavigation from './components/SubNavigationbar';\nimport Menu from './components/Menu';\nimport './assets/styles/individualMatch.css';\n\nimport Winlossplot from './widgets/components/crawl_winlossplot';\nimport Teamscorepredplot from './widgets/components/crawl_teamscorepredplot';\nimport Winlossprob from './widgets/components/winlossprob';\nimport PlayerRuns from './widgets/components/playerruns';\nimport PlayerBalls from './widgets/components/playerballs';\nimport Nextwicket from './widgets/components/nextwicket';\n\n\nimport widgetContainer from './components/WidgetContainer';\n// - Match results\n// - match details\n// - balls details\nexport default class CrawlMatchPrediction extends Component {\n navHeaders = [\n {\n\n title: 'Predictions/Results',\n path: `/matchprediction/${this.props.match.params.matchid}`,\n },\n {\n title: 'Match Stats',\n path: `/match/${this.props.match.params.matchid}`,\n },\n {\n title: 'Balls Details',\n path: `/ballsInfo/${this.props.match.params.matchid}`,\n },\n {\n isSelected: true,\n title: 'New Predictions/Results',\n path: `/new_matchprediction/${this.props.match.params.matchid}`,\n },\n {\n title: 'Lineup Shuffing',\n path: `/lineupshuffing/${this.props.match.params.matchid}`,\n },\n {\n title: 'Outliers',\n path: `/Outliers/${this.props.match.params.matchid}`,\n },\n {\n title: 'Player Evaluation',\n path: `/evaluate/${this.props.match.params.matchid}`,\n },\n ];\n state = {\n match: [],\n team1: [],\n team2: [],\n venue: [],\n };\n\n componentDidMount() {\n axios\n .get(\n process.env.REACT_APP_API_ENDPOINT +\n '/api/matches/' +\n this.props.match.params.matchid\n )\n .then((response) => {\n this.setState({\n match: response.data,\n match_id: this.getMatchID(response.data.url),\n team1: response.data.team1_id,\n team1_url: this.getTeamUrl(\n this.props.match.params.matchid,\n this.getMatchID(response.data.team1_id.url)\n ),\n team2: response.data.team2_id,\n team2_url: this.getTeamUrl(\n this.props.match.params.matchid,\n this.getMatchID(response.data.team2_id.url)\n ),\n venue: response.data.venue_id,\n ball_url: this.getBallUrl(this.getMatchID(response.data.url)),\n matchdetail_url: this.getMatchDetailUrl(\n this.getMatchID(response.data.url)\n ),\n });\n });\n }\n\n getMatchID = (url) => {\n var url_array = url.split('/');\n var len = url_array.length;\n var match_id = url_array[len - 2];\n return match_id;\n };\n\n getBallUrl = (match_id) => {\n return '/ballsInfo/' + match_id;\n };\n\n getMatchDetailUrl = (match_id) => {\n return '/match/' + match_id;\n };\n\n getTeamUrl = (match_id, team_id) => {\n return '/teammatchplayerInfo/' + match_id + '/' + team_id;\n };\n\n render() {\n const options = {\n matchid: this.props.match.params.matchid,\n teamscorepreictionplot:\n '',\n winlossplot:\n '',\n\n };\n\n const MatchDetails = ({\n match_id,\n start_date,\n end_date,\n team1_name,\n team1_url,\n team2_name,\n team2_url,\n ground_name,\n country,\n ball_url,\n matchdetail_url,\n }) => (\n \n
\n \n {this.state.matchName}\n
\n \n \n Current Batting Team: \n \n
\n \n \n Match ID: {match_id}\n
\n \n \n \n \n Start Date: {start_date}\n
\n \n \n \n \n End Date: {end_date}\n
\n \n \n \n \n Team 1: {`${team1_name}`} \n
\n \n \n \n \n Team 2: {team2_name} \n
\n \n \n \n \n Ground Name: {ground_name}\n
\n \n \n \n \n Win Loss Plot\n
\n \n {/* */}\n \n \n Team Score Prediction Plot\n
\n \n {/* */}\n \n \n
\n );\n }\n}\n\n// export default CrawlMatchPrediction;\n","import React, { Component } from \"react\";\nimport { getMatchTrackingStatus } from \"./api/match.api\";\nimport SubNavigationbar from './components/SubNavigationbar';\nimport MenuBar from \"./components/v2/Menubar\";\nimport Menu from './components/Menu';\nexport default class MatchStatus extends React.Component {\n\tnavHeaders = [\n {\n title: 'Predictions/Results',\n path: `/matchprediction/${this.props.match.params.matchid}`,\n },\n {\n title: 'Match Stats',\n path: `/match/${this.props.match.params.matchid}`,\n },\n {\n\n title: 'Balls details',\n path: `/ballsInfo/${this.props.match.params.matchid}`,\n },\n {\n title: 'New Predictions/Results',\n path: `/new_matchprediction/${this.props.match.params.matchid}`,\n },\n {\n title: 'Lineup Shuffing',\n path: `/lineupshuffing/${this.props.match.params.matchid}`,\n },\n {\n title: 'Outliers',\n path: `/Outliers/${this.props.match.params.matchid}`,\n },\n {\n title: 'Player Evaluation',\n path: `/evaluate/${this.props.match.params.matchid}`,\n },\n {\n isSelected: true,\n title: \"Match Tracking\",\n path: `/match-status/${this.props.match.params.matchid}`,\n },\n ];\n\tstate = {\n\t\ttrackings: [],\n\t};\n\n\tasync componentDidMount() {\n\n\t\tlet response = (await getMatchTrackingStatus(this.props.match.params.matchid)).data;\n\t\tthis.setState({ trackings: response });\n\t}\n\n\trender() {\n\t\tfunction getTrackingType(typeId) {\n\t\t\tconst data = {\n\t\t\t\t2: \"MATCH\",\n\t\t\t\t3: \"MATCH_BALLS\",\n\t\t\t\t4: \"PLAYER\",\n\t\t\t\t5: \"PLAYER_STATS\",\n\t\t\t\t6: \"MATCH_PREDICTIONS\",\n\t\t\t};\n\t\t\treturn data[typeId];\n\t\t}\n\n\t\tfunction getStatus(typeId) {\n\t\t\tconst data = {\n\t\t\t\t0: \"NOT_STARTED\",\n\t\t\t\t1: \"STARTED\",\n\t\t\t\t2: \"SUCCESSFUL\",\n\t\t\t\t3: \"FAILED_TEMP\",\n\t\t\t\t4: \"FAILED_PERM\",\n\t\t\t};\n\t\t\treturn data[typeId];\n\t\t}\n\n\t\tfunction getErrorMsg(msg) {\n\t\t\tif (msg == null) {\n\t\t\t\treturn \"\";\n\t\t\t}\n\t\t\treturn msg;\n\t\t}\n\n\t\tfunction getContext(json) {\n\t\t\tif (json == null){\n\t\t\t\treturn \"\";\n\t\t\t}\n\t\t\treturn JSON.stringify(json) ;\n\t\t}\n\n\t\treturn (\n\t\t\t\n
\n \n
\n \n Individual Matches Results\n
\n\n\t\t\t\n\t\t\t
\n\t\t);\n\t}\n}","import React, { useState, Component, useEffect } from \"react\";\nimport { Container, Row, Col } from \"reactstrap\";\nimport moment from \"moment\";\nfunction formatToDateTime(datetime) {\n \n return moment(datetime).format('MMMM Do, h:mm a');\n}\nexport default function MatchDetails(\n {\n \n start_date,\n description,\n status_text,\n\n }) {\n return (\n \n \n\t\t\t\n\t\t\t\t{this.state.trackings.map((tracking) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t
\n\t\t\t\n\t\t\t\t\t\t\t
\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t{getTrackingType(tracking.object_type_id)}
\n\t\t\t\t\t\t\t{getStatus(tracking.status)}
\n\t\t\t\t\t\t\t{getErrorMsg(tracking.error_msg)}
\n\t\t\t\t\t\t\t{getContext(tracking.context)}
\n\t\t\t\t\t\t\n
\n )\n};","\nimport React, { useState, Component, useEffect } from \"react\";\nimport { getMatch } from \"../api/match.api\";\nimport httpClient from \"../api/httpClient\";\nimport { Bar } from 'react-chartjs-2';\nimport MatchDetails from \"./MatchDetail\";\nimport GoldIndex from \"../widgets/components/gold_index\";\nimport WicketChange from \"../widgets/components/wicket_change\";\nimport BatterEvaluation from \"../widgets/components/batter_evaluation\";\nimport BowlerEvaluation from \"../widgets/components/bowler_evaluation\";\nimport WinlossChart from \"../widgets/components/winloss_chart\";\nimport widgetContainer from \"./WidgetContainer\";\n\n\nexport default function PredictionWidgets() {\n var url = document.URL.split('/');\n const matchId = url[url.length - 1];\n const [match, setMatch] = useState({});\n\n\n useEffect(() => {\n const fetchData = async () => {\n const dbMatchID = (await httpClient.get(`api/preds/decode/${matchId}`)).data;\n const res = await getMatch(dbMatchID);\n setMatch({ ...res.data });\n }\n fetchData();\n }, []);\n\n\n\n\n const Widgets = ({ match_id }) => {\n\n const goldIndexiframe =\n '';\n\n const winLossiframe =\n '';\n\n const wicketChangeIframe =\n '';\n const batterIframe =\n '';\n const bowlerIframe =\n '';\n\n const WidgetWinloss = widgetContainer(WinlossChart, {\n match_id: match_id,\n iframe: winLossiframe,\n });\n const WidgetGoldIndex = widgetContainer(GoldIndex, {\n match_id: match_id,\n iframe: goldIndexiframe,\n });\n const WidgetWicketChange = widgetContainer(WicketChange, {\n match_id: match_id,\n iframe: wicketChangeIframe,\n });\n const WidgetBatterEvaluation = widgetContainer(BatterEvaluation, {\n match_id: match_id,\n iframe: batterIframe,\n });\n const WidgetBowlerEvaluation = widgetContainer(BowlerEvaluation, {\n match_id: match_id,\n iframe: bowlerIframe,\n });\n\n\n return (\n \n Date & Time\n {formatToDateTime(start_date)}\n
\n \n Match Description\n {description}\n
\n \n \n Status\n {status_text}\n
\n \n \n
\n\n );\n }\n\n\n return (\n \n\n
\n );\n}\n","\n\nimport React, { useState, Component, useEffect } from \"react\";\nimport httpClient from \"../../../api/httpClient\";\n\n\nexport default function TestGoldIndex({ match_id }) {\n var url = document.URL.split('/');\n if (match_id) {\n var matchId = match_id;\n } else {\n var matchId = url[url.length - 1];\n }\n const [teamIndexs, setTeamIndexs] = useState([]);\n\n useEffect(() => {\n const fetch = async () => {\n \n let res = await httpClient.get(`/api/preds/power-index/${matchId}`)\n let data = res.data;\n data.forEach((t) => {\n let bow = t.bowling_impact_indices;\n for (var i = 0; i < t.batting_impact_indices.length; i++) {\n t.batting_impact_indices[i]['bowling_impact_index'] \n = bow.filter(a => a.player_id == t.batting_impact_indices[i].player_id)[0].bowling_impact_index;\n }\n });\n\n data.forEach((t) => {\n t.batting_impact_indices.sort((a, b) => b.batting_impact_index - a.batting_impact_index);\n });\n setTeamIndexs(data);\n };\n fetch();\n }, [match_id]);\n\n return (\n \n
\n );\n}","\nimport React, { useState, useEffect } from \"react\";\nimport httpClient from \"../../../api/httpClient\";\n\n\n\nexport default function TestWicketChange({ match_id }) {\n var url = document.URL.split('/');\n if (match_id) {\n var matchId = match_id;\n } else {\n var matchId = url[url.length - 1];\n }\n\n const [partnerships, setPartnerships] = useState([]);\n\n useEffect(() => {\n const fetchData = async () => {\n let res = await httpClient.get(`api/preds/test-partnership-break-prob/${matchId}`)\n let data = res.data;\n data.forEach(t => {\n let bowlers = []\n for (var key in t.bowler_dismissal_probability) {\n const item = { name: key, value: t.bowler_dismissal_probability[key] }\n bowlers.push(item);\n }\n bowlers.sort((a, b) => b.value - a.value)\n t[\"bowlers\"] = bowlers\n })\n\n setPartnerships(data);\n };\n fetchData();\n }, [match_id]);\n\n return (\n \n
\n\n \n
\n Power Index
\n\n
\n \n Bowling\n Batting\n
\n \n {teamIndexs.map(t => {\n return (\n
\n \n
\n );\n })}\n \n
\n {t.team_name}
\n\n {t.batting_impact_indices.map(b => {\n return (\n
\n \n {b.bowling_impact_index} \n {b.batting_impact_index} \n {b.player_name} \n\n
\n );\n })}\n \n
\n );\n}","import React, { useState, Component, useEffect } from \"react\";\nimport httpClient from \"../../../api/httpClient\";\nimport { Bar } from 'react-chartjs-2';\n\nexport default function TestBowlerEvaluation({ match_id }) {\n var url = document.URL.split('/');\n if (match_id) {\n var matchId = match_id;\n } else {\n var matchId = url[url.length - 1];\n }\n const [team_evaluations, setTeamsEvaluations] = useState([]);\n\n useEffect(() => {\n const fetchData = async () => {\n const res = await httpClient.get(`/api/preds/test-evaluation-index/${matchId}`)\n setTeamsEvaluations(res.data);\n };\n fetchData();\n }, [match_id]);\n return (\n \n
\n\n \n
\n Wicket Taking Chances
\n\n
\n \n {partnerships.map(b => {\n return (\n
\n \n
\n );\n })}\n \n
\n\n Batter: {b.batter_name}
\n\n
\n \n
\n {b.bowlers[1].name}
\n \n
\n 2nd
\n \n
\n {b.bowlers[0].name}
\n \n
\n 1st
\n \n
\n {b.bowlers[2].name}
\n \n
\n 3rd
\n \n
\n );\n\n}","import React, { useState, Component, useEffect } from \"react\";\nimport httpClient from \"../../../api/httpClient\";\nimport { Bar } from 'react-chartjs-2';\n\n\nexport default function TestBatterEvaluation({ match_id }) {\n var url = document.URL.split('/');\n if (match_id) {\n var matchId = match_id;\n } else {\n var matchId = url[url.length - 1];\n }\n const [team_evaluations, setTeamsEvaluations] = useState([]);\n\n useEffect( () => {\n const fetchData = async() => {\n const res = await httpClient.get(`/api/preds/test-evaluation-index/${matchId}`)\n setTeamsEvaluations(res.data);\n };\n fetchData();\n }, [match_id]);\n\n return (\n \n
\n \n
\n Bowler Evaluation
\n \n {team_evaluations.map(t => {\n return (\n
\n \n
\n )\n })}\n {t.team_name}
\n\n {\n return bow.bowler_name;\n }),\n datasets: [\n {\n backgroundColor: '#ff6384',\n label: \"Expected StrikeRate\",\n data: t.bowler_evaluation.map((bow) => {\n return (\n bow.expected_sr\n );\n }),\n },\n {\n // backgroundColor: [],\n label: \"1st Inning Actual StrikeRate\",\n backgroundColor: '#36a2eb',\n data: t.bowler_evaluation.map((bow) => {\n return (\n bow.first_innings.sr\n );\n }),\n },\n {\n // backgroundColor: [],\n label: \"2nd Inning Actual StrikeRate\",\n backgroundColor: '#cc65fe',\n data: t.bowler_evaluation.map((bow) => {\n return (\n bow.second_innings.sr\n );\n }),\n },\n ],\n }}\n />\n
\n \n
\n );\n\n}","import React, { useState, Component, useEffect } from \"react\";\nimport httpClient from \"../../../api/httpClient\";\nimport { Doughnut, HorizontalBar } from 'react-chartjs-2';\n\n\nexport default function TestWinlossChart({ match_id }) {\n var url = document.URL.split('/');\n if (match_id) {\n var matchId = match_id;\n } else {\n var matchId = url[url.length - 1];\n }\n\n const [matchStats, setMatchStats] = useState([]);\n const [predResult, setPreresult] = useState([]);\n\n useEffect(() => {\n\n let fetchData = async () => {\n const dbMatchID = (await httpClient.get(`api/preds/decode/${matchId}`)).data;\n const res = await httpClient.get(`/api/stats/match/match-regular-stats/?match_id=${dbMatchID}`);\n setMatchStats(res.data);\n const pred_res = await httpClient.get(`/api/preds/match/${matchId}`);\n var data = pred_res.data;\n var teams = [];\n var data = pred_res.data;\n data.team.forEach(t => {\n if (t.team_id == data.current.team1_id) {\n t.winprops = data.current.team1_percent;\n } else {\n t.winprops = data.current.team2_percent;\n }\n teams.push(t);\n })\n setPreresult(teams);\n };\n fetchData();\n\n }, []);\n\n return (\n \n\n
\n \n
\n Batter Evaluation
\n\n {team_evaluations.map(t => {\n return (\n
\n\n \n
\n )\n })}\n {t.team_name}
\n\n {\n return bat.batsman_name;\n }),\n datasets: [\n {\n backgroundColor: '#ff6384',\n label: \"Expected Runs\",\n data: t.batsman_evaluation.map((bat) => {\n return (\n bat.expected_runs\n );\n }),\n },\n {\n // backgroundColor: [],\n label: \"1st Inning Actual Runs\",\n backgroundColor: '#36a2eb',\n data: t.batsman_evaluation.map((bat) => {\n return (\n bat.first_innings.runs\n );\n }),\n },\n {\n // backgroundColor: [],\n label: \"2nd Inning Actual Runs\",\n backgroundColor: '#cc65fe',\n data: t.batsman_evaluation.map((bat) => {\n return (\n bat.second_innings.runs\n );\n }),\n },\n ],\n }}\n \n />\n
\n \n\n
\n );\n}","\nimport React, { useState, Component, useEffect } from \"react\";\nimport { getMatch } from \"../api/match.api\";\nimport httpClient from \"../api/httpClient\";\nimport MatchDetails from \"./MatchDetail\";\nimport TestGoldIndex from \"../widgets/components/test_match/test_gold_index\";\nimport TestWicketChange from \"../widgets/components/test_match/test_wicket_change\";\nimport TestBowlerEvaluation from \"../widgets/components/test_match/test_bowler_evaluation\";\nimport TestBatterEvaluation from \"../widgets/components/test_match/test_batter_evaluation\";\nimport TestWinlossChart from \"../widgets/components/test_match/test_winloss\";\nimport widgetContainer from \"./WidgetContainer\";\n\nexport default function TestMatchWidget() {\n var url = document.URL.split('/');\n const matchId = url[url.length - 1];\n const [match, setMatch] = useState({});\n\n\n useEffect(() => {\n const fetchData = async () => {\n const dbMatchID = (await httpClient.get(`api/preds/decode/${matchId}`)).data;\n const res = await getMatch(dbMatchID);\n setMatch({ ...res.data });\n }\n fetchData();\n }, []);\n\n\n\n\n const Widgets = ({ match_id }) => {\n const goldIndexiframe =\n '';\n\n const winLossiframe =\n '';\n\n const wicketChangeIframe =\n '';\n const batterIframe =\n '';\n const bowlerIframe =\n '';\n\n const WidgetWinloss = widgetContainer(TestWinlossChart, {\n match_id: match_id,\n iframe: winLossiframe,\n });\n const WidgetGoldIndex = widgetContainer(TestGoldIndex, {\n match_id: match_id,\n iframe: goldIndexiframe,\n });\n const WidgetWicketChange = widgetContainer(TestWicketChange, {\n match_id: match_id,\n iframe: wicketChangeIframe,\n });\n const WidgetBatterEvaluation = widgetContainer(TestBatterEvaluation, {\n match_id: match_id,\n iframe: batterIframe,\n });\n const WidgetBowlerEvaluation = widgetContainer(TestBowlerEvaluation, {\n match_id: match_id,\n iframe: bowlerIframe,\n });\n\n return (\n\n {predResult.length >= 2 && (\n //
\n \n
);\n }\n\n\n\n return (\n \n\n
\n );\n}\n","import React, { Component } from 'react';\nimport {Pie} from 'react-chartjs-2';\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nexport default class Teamwinloss extends Component {\n constructor(props) {\n super(props);\n this.state = {\n season: null,\n team_id: null,\n team_name: null,\n won: null,\n lost: null,\n tied: null,\n drawn: null,\n no_result: null,\n abandoned: null,\n cancelled: null,\n total_matches: null,\n\n imageUrl: [],\n teamcolour: null,\n labelBest: null,\n labelWorst: null,\n }\n }\n\ncomponentDidMount() {\n var colourtemp = [];\n var tempseason = null;\n var tempteam_id= null;\n var tempteam_name = null;\n var tempwon = null;\n var templost = null;\n var temptied = null;\n var tempdrawn = null;\n var tempno_result = null;\n var tempabandoned = null;\n var tempcancelled = null;\n var tempColor1 = null;\n var temptotal_matches = null;\n\n var url = document.URL.split(\"/\");\n var argcheck = url[url.length-3];\n\n switch (argcheck) {\n case \"teamwinloss\":\n var Param3 = url[url.length-1];\n var Param2 = url[url.length-2];\n break;\n default:\n var Param3 = url[url.length-2]+\"/\"+url[url.length-1];\n var Param2 = url[url.length-3];\n }\n\n fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/teams/wins-losses/?team_id=\"+Param2+\"&season=\"+Param3)\n .then(res => res.json())\n .then((out) => {\n if(out.count != 0){\n tempseason = out.results[0].season;\n tempteam_id = out.results[0].team_id;\n tempteam_name = out.results[0].team_name;\n tempwon = out.results[0].won;\n templost = out.results[0].lost;\n temptied = out.results[0].tied;\n tempdrawn = out.results[0].drawn;\n tempno_result = out.results[0].no_result;\n tempabandoned = out.results[0].abandoned;\n tempcancelled = out.results[0].cancelled;\n temptotal_matches = out.results[0].total_matches;\n }\n this.setState({ \n season: tempseason,\n team_id: tempteam_id,\n team_name: tempteam_name,\n won: tempwon,\n lost: templost,\n tied: temptied,\n drawn: tempdrawn,\n no_result: tempno_result,\n abandoned: tempabandoned,\n cancelled: tempcancelled,\n total_matches: temptotal_matches,\n teamcolour: tempColor1,\n })\n })\n .catch(err => {throw err });\n\n}\n\ngetTeam1Logo(teamId) {\n\n if (teamId in teamFlag && teamId !== 4){\n var link = '/flags/svg/'+teamFlag[teamId]\n return \n {this.state.smth}\n
\n )\n }\n}","import React, { Component } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport $ from 'jquery';\nimport {getTeamsBowling} from '../../api/stats.api';\n\nconst colour = [\n { teamName: 'WestIndies', teamid: 4, code: '#6e0237' },\n { teamName: 'Pakistan', teamid: 7, code: '#00563b' },\n { teamName: 'Afghanistan', teamid: 40, code: '#0033ee' },\n { teamName: 'Bangladesh', teamid: 25, code: '#005400' },\n { teamName: 'India', teamid: 6, code: '#007fff' },\n { teamName: 'SouthAfrica', teamid: 3, code: '#006651' },\n { teamName: 'Australia', teamid: 2, code: '#ffdf00' },\n { teamName: 'England', teamid: 1, code: '#011e3d' },\n { teamName: 'NewZealand', teamid: 5, code: '#000000' },\n { teamName: 'Canada', teamid: 17, code: '#ea3c57' },\n { teamName: 'Netherlands', teamid: 15, code: '#ee7c09' },\n { teamName: 'PapuaNewGuinea', teamid: 20, code: '#000000' },\n { teamName: 'SriLanka', teamid: 8, code: '#000080' },\n { teamName: 'Zimbabwe', teamid: 9, code: '#ff0000' },\n { teamName: 'Kenya', teamid: 26, code: '#006629' },\n { teamName: 'Ireland', teamid: 29, code: '#00cc62' },\n { teamName: 'UAE', teamid: 27, code: '#333333' },\n { teamName: 'Bermuda', teamid: 12, code: '#6e8fd4' },\n { teamName: 'Scotland', teamid: 30, code: '#002a5e' },\n { teamName: 'HongKong', teamid: 19, code: '#000000' },\n { teamName: 'Nepal', teamid: 32, code: '#000080' },\n { teamName: 'Oman', teamid: 37, code: '#ff0000' },\n { teamName: 'Malaysia', teamid: 16, code: '#000000' },\n { teamName: 'Singapore', teamid: 23, code: '#ef3340' },\n { teamName: 'Islamabad United', teamid: 5795, code: '#F05705' },\n { teamName: 'Karachi Kings', teamid: 5793, code: '#4287f5' },\n { teamName: 'Quetta Gladiators', teamid: 5797, code: '#64169C' },\n { teamName: 'Multan Sultans', teamid: 6413, code: '#0d8c46' },\n { teamName: 'Peshawar Zalmi', teamid: 5791, code: '#f7db20' },\n { teamName: 'Lahore Qalandars', teamid: 5799, code: '#a2db27' },\n];\n\nexport default class teamheadtoheadbowling extends Component {\n constructor(props) {\n super(props);\n this.state = {\n team1Lineup: [],\n };\n }\n\n componentDidMount() {\n this.loadData();\n }\n async loadData() {\n var temp1 = [];\n var url = document.URL.split('/');\n let matchId = '';\n if (!this.props.match_id) {\n matchId = url[url.length - 1];\n } else {\n matchId = this.props.match_id;\n }\n\n const response = await getTeamsBowling(matchId);\n\n\n const data = response.data;\n for (let i = 0; i < data.length; i++) {\n const record = data[i];\n temp1.push(record);\n }\n\n temp1 = temp1.sort(function (a, b) {\n return a.innings_number - b.innings_number;\n });\n this.setState({\n team1Lineup: temp1,\n });\n }\n\n render() {\n return (\n \n
\n \n {this.getTeam1Logo(this.state.team_id)}\n
\n \n Season: {this.state.season}\n
\n \n
\n \n Total matches: {this.state.total_matches}\n
\n \n
\n );\n }\n}\n","import React, { Component } from 'react';\nimport {Doughnut, Line} from 'react-chartjs-2';\n//import '../WigetApp.css'\n\nconst colour = [\n{'teamid': 4, 'code': '#6e0237'},\n{'teamid': 7, 'code': '#00563b'},\n{'teamid': 40, 'code': '#0033ee'},\n{'teamid': 25, 'code': '#005400'},\n{'teamid': 6, 'code': '#007fff'},\n{'teamid': 3, 'code': '#006651'},\n{'teamid': 2, 'code': '#ffdf00'},\n{'teamid': 1, 'code': '#011e3d'},\n{'teamid': 5, 'code': '#000000'},\n{'teamid': 17, 'code': '#ea3c57'},\n{'teamid': 15, 'code': '#ee7c09'},\n{'teamid': 20, 'code': '#000000'},\n{'teamid': 8, 'code': '#000080'},\n{'teamid': 9, 'code': '#ff0000'},\n{'teamid': 26, 'code': '#006629'},\n{'teamid': 29, 'code': '#00cc62'},\n{'teamid': 27, 'code': '#333333'},\n{'teamid': 12, 'code': '#6e8fd4'},\n{'teamid': 30, 'code': '#002a5e'},\n{'teamid': 19, 'code': '#000000'},\n{'teamid': 32, 'code': '#000080'},\n{'teamid': 37, 'code': '#ff0000'},\n{'teamid': 16, 'code': '#000000'},\n{'teamid': 23, 'code': '#ef3340'},\n];\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nvar season = 2017;\nvar teamId = 7;\n\nexport default class Teamwinloss extends Component {\n constructor(props) {\n super(props);\n this.state = {\n series_name: null,\n team_id: null,\n team_name: null,\n t20_overs_bowled: null,\n t20_balls_bowled: null,\n t20_runs_conceded: null,\n t20_wickets_taken: null,\n t20_bowling_average: null,\n t20_strike_rate: null,\n t20_economy_rate: null,\n t20i_overs_bowled: null,\n t20i_balls_bowled: null,\n t20i_runs_conceded: null,\n t20i_wickets_taken: null,\n t20i_bowling_average: null,\n t20i_strike_rate: null,\n t20i_economy_rate: null,\n list_a_overs_bowled: null,\n list_a_balls_bowled: null,\n list_a_runs_conceded: null,\n list_a_wickets_taken: null,\n list_a_bowling_average: null,\n list_a_strike_rate: null,\n list_a_economy_rate: null,\n odi_overs_bowled: null,\n odi_balls_bowled: null,\n odi_runs_conceded: null,\n odi_wickets_taken: null,\n odi_bowling_average: null,\n odi_strike_rate: null,\n odi_economy_rate: null,\n imageUrl: [],\n teamcolour: null,\n\n }\n }\n\ncomponentDidMount() {\n var colourtemp = [];\n\n fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/players/player-team-bowling-indicators/?format=json&team_id=15&series_id=10073\")\n .then(res => res.json())\n .then((out) => {\n this.setState({\n series_name: out.results[0].series_name,\n team_id: out.results[0].team_id,\n team_name: out.results[0].team_name,\n t20_overs_bowled: out.results[0].t20_overs_bowled == null ? 0 : out.results[0].t20_overs_bowled,\n t20_balls_bowled: out.results[0].t20_balls_bowled == null ? 0 : out.results[0].t20_balls_bowled,\n t20_runs_conceded: out.results[0].t20_runs_conceded == null ? 0 : out.results[0].t20_runs_conceded,\n t20_wickets_taken: out.results[0].t20_wickets_taken == null ? 0 : out.results[0].t20_wickets_taken,\n t20_bowling_average: out.results[0].t20_bowling_average == null ? 0 : out.results[0].t20_bowling_average,\n t20_strike_rate: out.results[0].t20_strike_rate == null ? 0 : out.results[0].t20_strike_rate,\n t20_economy_rate: out.results[0].t20_economy_rate == null ? 0 : out.results[0].t20_economy_rate,\n t20i_overs_bowled: out.results[0].t20i_overs_bowled == null ? 0 : out.results[0].t20i_overs_bowled,\n t20i_balls_bowled: out.results[0].t20i_balls_bowled == null ? 0 : out.results[0].t20i_balls_bowled,\n t20i_runs_conceded: out.results[0].t20i_runs_conceded == null ? 0 : out.results[0].t20i_runs_conceded,\n t20i_wickets_taken: out.results[0].t20i_wickets_taken == null ? 0 : out.results[0].t20i_wickets_taken,\n t20i_bowling_average: out.results[0].t20i_bowling_average == null ? 0 : out.results[0].t20i_bowling_average,\n t20i_strike_rate: out.results[0].t20i_strike_rate == null ? 0 : out.results[0].t20i_strike_rate,\n t20i_economy_rate: out.results[0].t20i_economy_rate == null ? 0 : out.results[0].t20i_economy_rate,\n list_a_overs_bowled: out.results[0].list_a_overs_bowled == null ? 0 : out.results[0].list_a_overs_bowled,\n list_a_balls_bowled: out.results[0].list_a_balls_bowled == null ? 0 : out.results[0].list_a_balls_bowled,\n list_a_runs_conceded: out.results[0].list_a_runs_conceded == null ? 0 : out.results[0].list_a_runs_conceded,\n list_a_wickets_taken: out.results[0].list_a_wickets_taken == null ? 0 : out.results[0].list_a_wickets_taken,\n list_a_bowling_average: out.results[0].list_a_bowling_average == null ? 0 : out.results[0].list_a_bowling_average,\n list_a_strike_rate: out.results[0].list_a_strike_rate == null ? 0 : out.results[0].list_a_strike_rate,\n list_a_economy_rate: out.results[0].list_a_economy_rate == null ? 0 : out.results[0].list_a_economy_rate,\n odi_overs_bowled: out.results[0].odi_overs_bowled == null ? 0 : out.results[0].odi_overs_bowled,\n odi_balls_bowled: out.results[0].odi_balls_bowled == null ? 0 : out.results[0].odi_balls_bowled,\n odi_runs_conceded: out.results[0].odi_runs_conceded == null ? 0 : out.results[0].odi_runs_conceded,\n odi_wickets_taken: out.results[0].odi_wickets_taken == null ? 0 : out.results[0].odi_wickets_taken,\n odi_bowling_average: out.results[0].odi_bowling_average == null ? 0 : out.results[0].odi_bowling_average,\n odi_strike_rate: out.results[0].odi_strike_rate == null ? 0 : out.results[0].odi_strike_rate,\n odi_economy_rate: out.results[0].odi_economy_rate == null ? 0 : out.results[0].odi_economy_rate,\n })\n })\n .catch(err => {throw err });\n\n}\n\ngetTeamLogo(teamId) {\n\n return '/flags/svg/'+teamFlag[teamId]\n}\n\n\n\nrender() {\n return (\n \n \n
\n
\n | Name | \nTeam | \nInning | \nBowling Average | \nStrike Rate | \nRuns Conceded | \nEconomy Rate | \nWickets | \n
| {lineup.card_long} | \n{lineup.team_name} | \n{lineup.innings_number} | \n{lineup.bowling_avg} | \n{lineup.strike_rate} | \n{lineup.runs_conceded} | \n{lineup.economy_rate} | \n{lineup.wickets} | \n
\n
\n )\n }\n}\n","import React, { Component } from 'react';\n//import '../WigetApp.css'\nconst colour = [\n{'teamid': 4, 'code': '#6e0237'},\n{'teamid': 7, 'code': '#00563b'},\n{'teamid': 40, 'code': '#0033ee'},\n{'teamid': 25, 'code': '#005400'},\n{'teamid': 6, 'code': '#007fff'},\n{'teamid': 3, 'code': '#006651'},\n{'teamid': 2, 'code': '#ffdf00'},\n{'teamid': 1, 'code': '#011e3d'},\n{'teamid': 5, 'code': '#000000'},\n{'teamid': 17, 'code': '#ea3c57'},\n{'teamid': 15, 'code': '#ee7c09'},\n{'teamid': 20, 'code': '#000000'},\n{'teamid': 8, 'code': '#000080'},\n{'teamid': 9, 'code': '#ff0000'},\n{'teamid': 26, 'code': '#006629'},\n{'teamid': 29, 'code': '#00cc62'},\n{'teamid': 27, 'code': '#333333'},\n{'teamid': 12, 'code': '#6e8fd4'},\n{'teamid': 30, 'code': '#002a5e'},\n{'teamid': 19, 'code': '#000000'},\n{'teamid': 32, 'code': '#000080'},\n{'teamid': 37, 'code': '#ff0000'},\n{'teamid': 16, 'code': '#000000'},\n{'teamid': 23, 'code': '#ef3340'},\n];\n\nconst detailNotFound = {\n url: null,\n object_id: null,\n full_name: null,\n short_name: null,\n popular_name: null,\n alpha_name: null,\n known_as: null,\n card_long: null,\n card_qualifier: null,\n card_short: null,\n dob: null,\n height: null,\n weight: null,\n captain: 0,\n keeper: 0,\n player_url: null,\n created_at: null,\n player_role: null,\n batting_hand: {\n url: null,\n batting_hand_name: null\n },\n batting_style: {\n url: null,\n batting_style_long: null\n },\n bowling_hand: {\n url: null,\n bowling_hand_name: null\n },\n bowling_style: {\n url: null,\n bowling_style_long: null\n },\n bowling_pacespin: {\n url: null,\n bowling_pacespin_name: null\n }\n};\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nexport default class Teamwinloss extends Component {\n constructor(props) {\n super(props);\n this.state = {\n details: [],\n bathand: [],\n batstyle: [],\n imageUrl: [],\n stat: [],\n }\n }\n\ncomponentDidMount() {\n var colourtemp = [];\n\n var url = document.URL.split(\"/\");\n var Param3 = url[url.length-1];\n\n\n fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/players/\"+Param3)\n .then(res => res.json())\n .then((out) => {\n let detailCheck = detailNotFound;\n if(out.hasOwnProperty('url')){\n detailCheck = out;\n }\n this.setState({\n details: detailCheck,\n bathand: detailCheck.batting_hand,\n batstyle: detailCheck.batting_style,\n })\n })\n .catch(err => {throw err });\n\n fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/players/player-batting-indicators/?player_id=\"+Param3)\n .then(res => res.json())\n .then((out) => {\n this.setState({\n stat: out.results\n })\n })\n .catch(err => {throw err });\n\n}\n\n\nt20checker(runs,bg,dism,sr,ave){\n if(runs !== 0 && bg !== 0 && dism !== 0 && sr !== null && ave !== null){\n return \n
\n\n \n })
\n
\n\n \n {this.state.team_name}\n
\n\n \n Series: {this.state.series_name}\n
\n\n \n
\n\n \n
\n T20
\n\n
\n T20i
\n\n
\n\n \n
\n\n Overs Bowled
\n\n \n
\n\n \n
\n\n Overs Bowled
\n\n \n
\n \n
\n\n \n
\n\n Balls Bowled
\n\n \n
\n\n \n
\n\n Balls Bowled
\n\n \n
\n \n
\n\n \n
\n\n Runs Conceded
\n\n \n
\n\n \n
\n\n Runs Conceded
\n\n \n
\n \n
\n\n\n \n
\n\n Wickets Taken
\n\n \n
\n\n \n
\n\n Wickets Taken
\n\n \n
\n \n
\n\n \n
\n\n Bowling Average
\n\n \n
\n\n \n
\n\n Bowling Average
\n\n \n
\n \n
\n\n \n
\n\n Strike Rate
\n\n \n
\n\n \n
\n\n Strike Rate
\n\n \n
\n \n
\n\n\n\n\n \n
\n\n Economy Rate
\n\n \n
\n\n \n
\n\n Economy Rate
\n\n \n
\n \n
\n\n \n
\n List A
\n\n
\n ODI
\n\n
\n\n \n
\n\n Overs Bowled
\n\n \n
\n\n \n
\n\n Overs Bowled
\n\n \n
\n \n
\n\n \n
\n\n Balls Bowled
\n\n \n
\n\n \n
\n\n Balls Bowled
\n\n \n
\n \n
\n\n \n
\n\n Runs Conceded
\n\n \n
\n\n \n
\n\n Runs Conceded
\n\n \n
\n \n
\n\n\n \n
\n\n Wickets Taken
\n\n \n
\n\n \n
\n\n Wickets Taken
\n\n \n
\n \n
\n\n \n
\n\n Bowling Average
\n\n \n
\n\n \n
\n\n Bowling Average
\n\n \n
\n \n
\n\n \n
\n\n Strike Rate
\n\n \n
\n\n \n
\n\n Strike Rate
\n\n \n
\n \n
\n\n\n\n\n \n
\n\n Economy Rate
\n\n \n
\n\n \n
\n\n Economy Rate
\n\n \n
\n \n
\n )\n }\n}\n","import React, { Component } from 'react';\n//import '../WigetApp.css'\n\nconst colour = [\n{'teamid': 4, 'code': '#6e0237'},\n{'teamid': 7, 'code': '#00563b'},\n{'teamid': 40, 'code': '#0033ee'},\n{'teamid': 25, 'code': '#005400'},\n{'teamid': 6, 'code': '#007fff'},\n{'teamid': 3, 'code': '#006651'},\n{'teamid': 2, 'code': '#ffdf00'},\n{'teamid': 1, 'code': '#011e3d'},\n{'teamid': 5, 'code': '#000000'},\n{'teamid': 17, 'code': '#ea3c57'},\n{'teamid': 15, 'code': '#ee7c09'},\n{'teamid': 20, 'code': '#000000'},\n{'teamid': 8, 'code': '#000080'},\n{'teamid': 9, 'code': '#ff0000'},\n{'teamid': 26, 'code': '#006629'},\n{'teamid': 29, 'code': '#00cc62'},\n{'teamid': 27, 'code': '#333333'},\n{'teamid': 12, 'code': '#6e8fd4'},\n{'teamid': 30, 'code': '#002a5e'},\n{'teamid': 19, 'code': '#000000'},\n{'teamid': 32, 'code': '#000080'},\n{'teamid': 37, 'code': '#ff0000'},\n{'teamid': 16, 'code': '#000000'},\n{'teamid': 23, 'code': '#ef3340'},\n];\n\nconst detailNotFound = {\n url: null,\n object_id: null,\n full_name: null,\n short_name: null,\n popular_name: null,\n alpha_name: null,\n known_as: null,\n card_long: null,\n card_qualifier: null,\n card_short: null,\n dob: null,\n height: null,\n weight: null,\n captain: 0,\n keeper: 0,\n player_url: null,\n created_at: null,\n player_role: null,\n batting_hand: {\n url: null,\n batting_hand_name: null\n },\n batting_style: {\n url: null,\n batting_style_long: null\n },\n bowling_hand: {\n url: null,\n bowling_hand_name: null\n },\n bowling_style: {\n url: null,\n bowling_style_long: null\n },\n bowling_pacespin: {\n url: null,\n bowling_pacespin_name: null\n }\n};\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nexport default class Teamwinloss extends Component {\n constructor(props) {\n super(props);\n this.state = {\n details: [],\n bathand: [],\n batstyle: [],\n imageUrl: [],\n stat: [],\n }\n }\n\ncomponentDidMount() {\n var colourtemp = [];\n\n var url = document.URL.split(\"/\");\n var Param3 = url[url.length-1];\n\n\n fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/players/\"+Param3)\n .then(res => res.json())\n .then((out) => {\n let detailCheck = detailNotFound;\n if(out.hasOwnProperty('url')){\n detailCheck = out;\n }\n this.setState({\n details: detailCheck,\n bathand: detailCheck.batting_hand,\n batstyle: detailCheck.batting_style,\n })\n })\n .catch(err => {throw err });\n\n fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/batter-stats/?batter=\"+Param3)\n .then(res => res.json())\n .then((out) => {\n this.setState({\n stat: out.results\n })\n })\n .catch(err => {throw err });\n\n}\n\n\nt20checker(runs,bg,dism,sr,ave){\n if(runs !== 0 && bg !== 0 && dism !== 0 && sr !== null && ave !== null){\n return \n
\n\n \n
\n \n
\n\n\n \n
\n \n
\n {this.state.details.card_long}
\n\n
\n\n\n\n \n
\n\n Full Name:
\n\n
\n {this.state.details.full_name}
\n\n
\n\n DOB:
\n\n
\n\n {this.state.details.dob}
\n\n
\n\n Batting hand:
\n\n
\n\n {this.bathandChecker(this.state.bathand)}
\n\n
\n\n Batting style:
\n\n
\n {this.batstyleChecker(this.state.batstyle)}
\n\n \n \n
\n
\n | \n | Runs | \nBF | \nDismissal no. | \nSR | \nAve | \n
|---|
\n
\n )\n }\n}\n","import React, { Component } from 'react';\n//import '../WigetApp.css'\nconst colour = [\n{'teamid': 4, 'code': '#6e0237'},\n{'teamid': 7, 'code': '#00563b'},\n{'teamid': 40, 'code': '#0033ee'},\n{'teamid': 25, 'code': '#005400'},\n{'teamid': 6, 'code': '#007fff'},\n{'teamid': 3, 'code': '#006651'},\n{'teamid': 2, 'code': '#ffdf00'},\n{'teamid': 1, 'code': '#011e3d'},\n{'teamid': 5, 'code': '#000000'},\n{'teamid': 17, 'code': '#ea3c57'},\n{'teamid': 15, 'code': '#ee7c09'},\n{'teamid': 20, 'code': '#000000'},\n{'teamid': 8, 'code': '#000080'},\n{'teamid': 9, 'code': '#ff0000'},\n{'teamid': 26, 'code': '#006629'},\n{'teamid': 29, 'code': '#00cc62'},\n{'teamid': 27, 'code': '#333333'},\n{'teamid': 12, 'code': '#6e8fd4'},\n{'teamid': 30, 'code': '#002a5e'},\n{'teamid': 19, 'code': '#000000'},\n{'teamid': 32, 'code': '#000080'},\n{'teamid': 37, 'code': '#ff0000'},\n{'teamid': 16, 'code': '#000000'},\n{'teamid': 23, 'code': '#ef3340'},\n];\n\nconst detailNotFound = {\n url: null,\n object_id: null,\n full_name: null,\n short_name: null,\n popular_name: null,\n alpha_name: null,\n known_as: null,\n card_long: null,\n card_qualifier: null,\n card_short: null,\n dob: null,\n height: null,\n weight: null,\n captain: 0,\n keeper: 0,\n player_url: null,\n created_at: null,\n player_role: null,\n batting_hand: {\n url: null,\n batting_hand_name: null\n },\n batting_style: {\n url: null,\n batting_style_long: null\n },\n bowling_hand: {\n url: null,\n bowling_hand_name: null\n },\n bowling_style: {\n url: null,\n bowling_style_long: null\n },\n bowling_pacespin: {\n url: null,\n bowling_pacespin_name: null\n }\n};\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nexport default class Teamwinloss extends Component {\n constructor(props) {\n super(props);\n this.state = {\n details: [],\n bowlhand: [],\n bowlstyle: [],\n bowlpace: [],\n imageUrl: [],\n stat: [],\n }\n }\n\ncomponentDidMount() {\n var colourtemp = [];\n\n var url = document.URL.split(\"/\");\n var Param3 = url[url.length-1];\n\n\n fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/players/\"+Param3)\n .then(res => res.json())\n .then((out) => {\n let detailCheck = detailNotFound;\n if(out.hasOwnProperty('url')){\n detailCheck = out;\n }\n this.setState({\n details: detailCheck,\n bowlhand: detailCheck.bowling_hand,\n bowlstyle: detailCheck.bowling_style,\n bowlpace: detailCheck.bowling_pacespin,\n })\n })\n .catch(err => {throw err });\n\n fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/players/player-bowling-indicators/?player_id=\"+Param3)\n .then(res => res.json())\n .then((out) => {\n this.setState({\n stat: out.results\n })\n })\n .catch(err => {throw err });\n\n}\n\ngetTeamLogo(teamId) {\n\n return '/flags/svg/'+teamFlag[teamId]\n}\n\nt20checker(Overs,Balls,Runs,Wkts,Ave,SR,Econ){\n if(Overs !== 0 && Balls !== 0 && Runs !== 0 && Wkts !== 0 && Ave !== null && SR !== null && Econ !== null){\n return \n
\n\n \n
\n \n
\n\n\n \n
\n \n
\n {this.state.details.card_long}
\n\n
\n\n\n\n \n
\n\n Full Name:
\n\n
\n {this.state.details.full_name}
\n\n
\n\n DOB:
\n\n
\n\n {this.state.details.dob}
\n\n
\n\n Batting hand:
\n\n
\n\n {this.bathandChecker(this.state.bathand)}
\n\n
\n\n Batting style:
\n\n
\n {this.batstyleChecker(this.state.batstyle)}
\n\n \n \n
\n
\n | Game Type | \nMat | \nInns | \nNo | \nRuns | \nBF | \nHS | \nSR | \nAve | \n
| {partner.game_type} | \n{partner.mat} | \n{partner.inns} | \n{partner.no} | \n{partner.runs} | \n{partner.bf} | \n{partner.hs} | \n{partner.sr} | \n{partner.ave} | \n
\n
\n )\n }\n}\n","import React, { Component } from 'react';\n//import '../WigetApp.css'\n\nconst colour = [\n{'teamid': 4, 'code': '#6e0237'},\n{'teamid': 7, 'code': '#00563b'},\n{'teamid': 40, 'code': '#0033ee'},\n{'teamid': 25, 'code': '#005400'},\n{'teamid': 6, 'code': '#007fff'},\n{'teamid': 3, 'code': '#006651'},\n{'teamid': 2, 'code': '#ffdf00'},\n{'teamid': 1, 'code': '#011e3d'},\n{'teamid': 5, 'code': '#000000'},\n{'teamid': 17, 'code': '#ea3c57'},\n{'teamid': 15, 'code': '#ee7c09'},\n{'teamid': 20, 'code': '#000000'},\n{'teamid': 8, 'code': '#000080'},\n{'teamid': 9, 'code': '#ff0000'},\n{'teamid': 26, 'code': '#006629'},\n{'teamid': 29, 'code': '#00cc62'},\n{'teamid': 27, 'code': '#333333'},\n{'teamid': 12, 'code': '#6e8fd4'},\n{'teamid': 30, 'code': '#002a5e'},\n{'teamid': 19, 'code': '#000000'},\n{'teamid': 32, 'code': '#000080'},\n{'teamid': 37, 'code': '#ff0000'},\n{'teamid': 16, 'code': '#000000'},\n{'teamid': 23, 'code': '#ef3340'},\n];\n\nconst detailNotFound = {\n url: null,\n object_id: null,\n full_name: null,\n short_name: null,\n popular_name: null,\n alpha_name: null,\n known_as: null,\n card_long: null,\n card_qualifier: null,\n card_short: null,\n dob: null,\n height: null,\n weight: null,\n captain: 0,\n keeper: 0,\n player_url: null,\n created_at: null,\n player_role: null,\n batting_hand: {\n url: null,\n batting_hand_name: null\n },\n batting_style: {\n url: null,\n batting_style_long: null\n },\n bowling_hand: {\n url: null,\n bowling_hand_name: null\n },\n bowling_style: {\n url: null,\n bowling_style_long: null\n },\n bowling_pacespin: {\n url: null,\n bowling_pacespin_name: null\n }\n};\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nexport default class Teamwinloss extends Component {\n constructor(props) {\n super(props);\n this.state = {\n details: [],\n bowlhand: [],\n bowlstyle: [],\n bowlpace: [],\n imageUrl: [],\n stat: [],\n }\n }\n\ncomponentDidMount() {\n var colourtemp = [];\n\n var url = document.URL.split(\"/\");\n var Param3 = url[url.length-1];\n\n\n fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/players/\"+Param3)\n .then(res => res.json())\n .then((out) => {\n let detailCheck = detailNotFound;\n if(out.hasOwnProperty('url')){\n detailCheck = out;\n }\n this.setState({\n details: detailCheck,\n bowlhand: detailCheck.bowling_hand,\n bowlstyle: detailCheck.bowling_style,\n bowlpace: detailCheck.bowling_pacespin,\n })\n })\n .catch(err => {throw err });\n\n fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/bowler-stats/?bowler=\"+Param3)\n .then(res => res.json())\n .then((out) => {\n this.setState({\n stat: out.results\n })\n })\n .catch(err => {throw err });\n\n}\n\ngetTeamLogo(teamId) {\n\n return '/flags/svg/'+teamFlag[teamId]\n}\n\nbowlhandChecker(bowlhand){\n if(bowlhand == null){\n return '';\n }\n else{\n return bowlhand.bowling_hand_name;\n }\n}\n\nbowlstyleChecker(bowlstyle){\n if(bowlstyle == null){\n return '';\n }\n else{\n return bowlstyle.bowling_style_long;\n }\n}\n\nbowlpaceChecker(bowlpace){\n if(bowlpace == null){\n return '';\n }\n else{\n return bowlpace.bowling_pacespin_name;\n }\n}\n\nrender() {\n return (\n \n
\n\n \n
\n \n
\n\n\n \n
\n \n
\n {this.state.details.card_long}
\n\n
\n\n\n\n \n
\n\n Full Name:
\n\n
\n {this.state.details.full_name}
\n\n
\n\n DOB:
\n\n
\n\n {this.state.details.dob}
\n\n
\n\n Bowling hand:
\n\n
\n\n {this.bowlhandChecker(this.state.bowlhand)}
\n\n
\n\n Bowling style:
\n\n
\n\n {this.bowlstyleChecker(this.state.bowlstyle)}
\n\n
\n\n Bowling pacespin:
\n\n
\n {this.bowlpaceChecker(this.state.bowlpace)}
\n\n \n \n
\n
\n | \n | Overs Bowled | \nBalls | \nRuns | \nWkts | \nAve | \nSR | \nEcon | \n
|---|
\n
\n )\n }\n}\n","import React, { Component } from 'react';\n//import '../WigetApp.css'\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nexport default class Teamwinloss extends Component {\n constructor(props) {\n super(props);\n this.state = {\n details: [],\n bathand: [],\n batstyle: [],\n imageUrl: [],\n stat: [],\n }\n }\n\ncomponentDidMount() {\n var colourtemp = [];\n\n var url = document.URL.split(\"/\");\n var Param3 = url[url.length-1];\n\n var Param2 = url[url.length-2];\n\n\n fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/players/player-team-batting-indicators/?series_id=\"+Param2+\"&team_id=\"+Param3)\n .then(res => res.json())\n .then((out) => {\n this.setState({\n stat: out.results\n })\n })\n .catch(err => {throw err });\n\n}\n\ngetTeam1Logo(teamId,name) {\n\n if (teamId in teamFlag && teamId !== 4 && teamId !== 11){\n var link = '/flags/svg/'+teamFlag[teamId]\n return \n
\n\n \n
\n \n
\n\n\n \n
\n \n
\n {this.state.details.card_long}
\n\n
\n\n\n\n \n
\n\n Full Name:
\n\n
\n {this.state.details.full_name}
\n\n
\n\n DOB:
\n\n
\n\n {this.state.details.dob}
\n\n
\n\n Bowling hand:
\n\n
\n\n {this.bowlhandChecker(this.state.bowlhand)}
\n\n
\n\n Bowling style:
\n\n
\n\n {this.bowlstyleChecker(this.state.bowlstyle)}
\n\n
\n\n Bowling pacespin:
\n\n
\n {this.bowlpaceChecker(this.state.bowlpace)}
\n\n \n \n
\n
\n | Game Type | \nMat | \nInns | \nWkts | \nAve | \nSR | \nEcon | \n
| {partner.game_type} | \n{partner.mat} | \n{partner.inns} | \n{partner.wkts} | \n{partner.ave} | \n{partner.sr} | \n{partner.econ} | \n
{name}
;\n}\n\nt20checker(runs,bg,dism,sr,ave){\n if(runs !== 0 && bg !== 0 && dism !== 0 && sr !== null && ave !== null){\n return\n
\n )\n }\n}\n","import React, { Component } from 'react';\n//import '../WigetApp.css'\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nexport default class Teamwinloss extends Component {\n constructor(props) {\n super(props);\n this.state = {\n details: [],\n bowlhand: [],\n bowlstyle: [],\n bowlpace: [],\n imageUrl: [],\n stat: [],\n }\n }\n\ncomponentDidMount() {\n var colourtemp = [];\n\n var url = document.URL.split(\"/\");\n var Param3 = url[url.length-1];\n var Param2 = url[url.length-2];\n\n\n fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/players/player-team-bowling-indicators/?series_id=\"+Param2+\"&team_id=\"+Param3)\n .then(res => res.json())\n .then((out) => {\n this.setState({\n stat: out.results\n })\n })\n .catch(err => {throw err });\n\n}\n\ngetTeam1Logo(teamId,name) {\n\n if (teamId in teamFlag && teamId !== 4 && teamId !== 11){\n var link = '/flags/svg/'+teamFlag[teamId]\n return \n
\n\n \n
\n \n
\n\n\n \n
\n \n {\n this.state.stat.map((partner, index) => {\n return (\n this.getTeam1Logo(partner.team_id,partner.team_name)\n )\n })\n }\n
\n\n \n \n \n
\n
\n | \n | Runs | \nBF | \nDismissal no. | \nSR | \nAve | \n
|---|
{name}
;\n}\n\nt20checker(Overs,Balls,Runs,Wkts,Ave,SR,Econ){\n if(Overs !== 0 && Balls !== 0 && Runs !== 0 && Wkts !== 0 && Ave !== null && SR !== null && Econ !== null){\n return\n
\n )\n }\n}\n","import React, { Component } from 'react';\nimport {Doughnut} from 'react-chartjs-2';\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nexport default class teammilestone extends Component {\n constructor(props) {\n super(props);\n this.state = {\n season: null,\n team_id: null,\n team_name: null,\n quarter_centuries: null,\n half_centuries: null,\n centuries: null,\n total_matches: null,\n\n imageUrl: [],\n teamcolour: null,\n labelBest: null,\n labelWorst: null,\n }\n }\n\ncomponentDidMount() {\n var colourtemp = [];\n var tempseason = null;\n var tempteam_id= null;\n var tempteam_name = null;\n var tempquarter_centuries = null;\n var temphalf_centuries = null;\n var tempcenturies = null;\n var tempColor1 = null;\n var temptotal_matches = null;\n\n var url = document.URL.split(\"/\");\n var argcheck = url[url.length-3];\n\n switch (argcheck) {\n case \"teammilestonerun\":\n var Param3 = url[url.length-1];\n var Param2 = url[url.length-2];\n break;\n default:\n var Param3 = url[url.length-2]+\"/\"+url[url.length-1];\n var Param2 = url[url.length-3];\n }\n\n fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/team/team-milestoneruns/?team_id=\"+Param2+\"&season_name=\"+Param3)\n .then(res => res.json())\n .then((out) => {\n if(out.length !== 0){\n tempseason = out[0].season_name;\n tempteam_id = out[0].team_id;\n tempteam_name = out[0].team_name;\n tempquarter_centuries = out[0].quarter_centuries;\n temphalf_centuries = out[0].half_centuries;\n tempcenturies = out[0].centuries;\n temptotal_matches = out[0].total_matches;\n\n }\n this.setState({\n season: tempseason,\n team_id: tempteam_id,\n team_name: tempteam_name,\n quarter_centuries: tempquarter_centuries,\n half_centuries: temphalf_centuries,\n centuries: tempcenturies,\n total_matches: temptotal_matches,\n teamcolour: tempColor1,\n })\n })\n .catch(err => {throw err });\n\n}\n\ngetTeam1Logo(teamId) {\n\n if (teamId in teamFlag && teamId !== 4){\n var link = '/flags/svg/'+teamFlag[teamId]\n return \n
\n\n \n
\n \n
\n\n\n \n
\n \n {\n this.state.stat.map((partner, index) => {\n return (\n this.getTeam1Logo(partner.team_id,partner.team_name)\n )\n })\n }\n
\n\n \n \n \n
\n
\n | \n | Overs Bowled | \nBalls | \nRuns | \nWkts | \nAve | \nSR | \nEcon | \n
|---|
\n {this.state.smth}\n
\n )\n }\n}\n","import React, { Component } from 'react';\nimport {Bar} from 'react-chartjs-2';\n\nconst colour = [\n{'teamName': 'WestIndies','teamid': 4, 'code': '#6e0237'},\n{'teamName': 'Pakistan','teamid': 7, 'code': '#00563b'},\n{'teamName': 'Afghanistan','teamid': 40, 'code': '#0033ee'},\n{'teamName': 'Bangladesh','teamid': 25, 'code': '#005400'},\n{'teamName': 'India','teamid': 6, 'code': '#007fff'},\n{'teamName': 'SouthAfrica','teamid': 3, 'code': '#006651'},\n{'teamName': 'Australia','teamid': 2, 'code': '#ffdf00'},\n{'teamName': 'England','teamid': 1, 'code': '#011e3d'},\n{'teamName': 'NewZealand','teamid': 5, 'code': '#000000'},\n{'teamName': 'Canada','teamid': 17, 'code': '#ea3c57'},\n{'teamName': 'Netherlands','teamid': 15, 'code': '#ee7c09'},\n{'teamName': 'PapuaNewGuinea','teamid': 20, 'code': '#000000'},\n{'teamName': 'SriLanka','teamid': 8, 'code': '#000080'},\n{'teamName': 'Zimbabwe','teamid': 9, 'code': '#ff0000'},\n{'teamName': 'Kenya','teamid': 26, 'code': '#006629'},\n{'teamName': 'Ireland','teamid': 29, 'code': '#00cc62'},\n{'teamName': 'UAE','teamid': 27, 'code': '#333333'},\n{'teamName': 'Bermuda','teamid': 12, 'code': '#6e8fd4'},\n{'teamName': 'Scotland','teamid': 30, 'code': '#002a5e'},\n{'teamName': 'HongKong','teamid': 19, 'code': '#000000'},\n{'teamName': 'Nepal','teamid': 32, 'code': '#000080'},\n{'teamName': 'Oman','teamid': 37, 'code': '#ff0000'},\n{'teamName': 'Malaysia','teamid': 16, 'code': '#000000'},\n{'teamName': 'Singapore','teamid': 23, 'code': '#ef3340'},\n{'teamName': 'Islamabad United','teamid': 5795, 'code': '#F05705'},\n{'teamName': 'Karachi Kings','teamid': 5793, 'code': '#4287f5'},\n{'teamName': 'Quetta Gladiators','teamid': 5797, 'code': '#64169C'},\n{'teamName': 'Multan Sultans','teamid': 6413, 'code': '#0d8c46'},\n{'teamName': 'Peshawar Zalmi','teamid': 5791, 'code': '#f7db20'},\n{'teamName': 'Lahore Qalandars','teamid': 5799, 'code': '#a2db27'},\n];\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nvar season = 2017;\nvar teamId = 7;\n\nexport default class Teamwinloss extends Component {\n constructor(props) {\n super(props);\n this.state = {\n season: null,\n team_id: null,\n team_name: null,\n best_won_by_run_margin: null,\n worst_won_by_run_margin: null,\n best_lost_by_run_margin: null,\n worst_lost_by_run_margin: null,\n best_won_by_wicket_margin: null,\n worst_won_by_wicket_margin: null,\n best_lost_by_wicket_margin: null,\n worst_lost_by_wicket_margin: null,\n imageUrl: [],\n teamcolour: null,\n labelBest: null,\n labelWorst:null,\n\n }\n }\n\ncomponentDidMount() {\n var colourtemp = [];\n var tempseason = null;\n var tempteam_id= null;\n var tempteam_name = null;\n var tempbest_won_by_run_margin = null;\n var tempworst_won_by_run_margin = null;\n var tempbest_lost_by_run_margin = null;\n var tempworst_lost_by_run_margin = null;\n var tempbest_won_by_wicket_margin = null;\n var tempworst_won_by_wicket_margin = null;\n var tempbest_lost_by_wicket_margin = null;\n var tempworst_lost_by_wicket_margin = null;\n var tempColor1 = null;\n\n var url = document.URL.split(\"/\");\n var argcheck = url[url.length-3];\n\n switch (argcheck) {\n case \"teambestworstresult\":\n var Param3 = url[url.length-1];\n var Param2 = url[url.length-2];\n break;\n default:\n var Param3 = url[url.length-2]+\"/\"+url[url.length-1];\n var Param2 = url[url.length-3];\n }\n\n\n fetch(process.env.REACT_APP_API_ENDPOINT + \"/api/stats/team/team-bestworst-results/?team_id=\"+Param2+\"&season=\"+Param3)\n .then(res => res.json())\n .then((out) => {\n if(out.length !== 0){\n tempseason= out[0].season;\n tempteam_id= out[0].team_id;\n tempteam_name= out[0].team_name;\n tempbest_won_by_run_margin= out[0].best_won_by_run_margin;\n tempworst_won_by_run_margin= out[0].worst_won_by_run_margin;\n tempbest_lost_by_run_margin= out[0].best_lost_by_run_margin;\n tempworst_lost_by_run_margin= out[0].worst_lost_by_run_margin;\n tempbest_won_by_wicket_margin= out[0].best_won_by_wicket_margin;\n tempworst_won_by_wicket_margin= out[0].worst_won_by_wicket_margin;\n tempbest_lost_by_wicket_margin= out[0].best_lost_by_wicket_margin;\n tempworst_lost_by_wicket_margin= out[0].worst_lost_by_wicket_margin;\n\n for (let i = 0; i < Object.keys(colour).length; i++) {\n if(tempteam_id === colour[i].teamid){\n tempColor1 = colour[i].code;\n }\n }\n if(tempColor1 == null){\n tempColor1 ='rgba(179,181,198,0.2)';\n }\n }\n this.setState({\n season: tempseason,\n team_id: tempteam_id,\n team_name: tempteam_name,\n best_won_by_run_margin: tempbest_won_by_run_margin,\n worst_won_by_run_margin: tempworst_won_by_run_margin,\n best_lost_by_run_margin: tempbest_lost_by_run_margin,\n worst_lost_by_run_margin: tempworst_lost_by_run_margin,\n best_won_by_wicket_margin: tempbest_won_by_wicket_margin,\n worst_won_by_wicket_margin: tempworst_won_by_wicket_margin,\n best_lost_by_wicket_margin: tempbest_lost_by_wicket_margin,\n worst_lost_by_wicket_margin: tempworst_lost_by_wicket_margin,\n teamcolour: tempColor1,\n labelBest: \"Best Margin\",\n labelWorst: \"Worst Margin\",\n })\n })\n .catch(err => {throw err });\n\n}\n\ngetTeam1Logo(teamId) {\n\n if (teamId in teamFlag && teamId !== 4){\n var link = '/flags/svg/'+teamFlag[teamId]\n return \n
\n \n {this.getTeam1Logo(this.state.team_id)}\n
\n \n Season: {this.state.season}\n
\n \n
\n \n Total matches: {this.state.total_matches}\n
\n \n {this.state.smth}\n
\n )\n }\n}\n","import React, { Component } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport $ from 'jquery';\nimport {getPLayerBattingIndicator} from '../../api/stats.api';\nasync function fetchPages(url, page_num, max_pages = 10000, acc) {\n let page = await fetch(url + '' + page_num).then((response) =>\n response.json()\n );\n if (page.next == null || page_num >= max_pages) {\n return acc.concat(page.results);\n } else {\n return await fetchPages(\n url,\n page_num + 1,\n max_pages,\n acc.concat(page.results)\n );\n }\n}\n\nvar matchId = '1173064';\nconst colour = [\n { teamName: 'WestIndies', teamid: 4, code: '#6e0237' },\n { teamName: 'Pakistan', teamid: 7, code: '#00563b' },\n { teamName: 'Afghanistan', teamid: 40, code: '#0033ee' },\n { teamName: 'Bangladesh', teamid: 25, code: '#005400' },\n { teamName: 'India', teamid: 6, code: '#007fff' },\n { teamName: 'SouthAfrica', teamid: 3, code: '#006651' },\n { teamName: 'Australia', teamid: 2, code: '#ffdf00' },\n { teamName: 'England', teamid: 1, code: '#011e3d' },\n { teamName: 'NewZealand', teamid: 5, code: '#000000' },\n { teamName: 'Canada', teamid: 17, code: '#ea3c57' },\n { teamName: 'Netherlands', teamid: 15, code: '#ee7c09' },\n { teamName: 'PapuaNewGuinea', teamid: 20, code: '#000000' },\n { teamName: 'SriLanka', teamid: 8, code: '#000080' },\n { teamName: 'Zimbabwe', teamid: 9, code: '#ff0000' },\n { teamName: 'Kenya', teamid: 26, code: '#006629' },\n { teamName: 'Ireland', teamid: 29, code: '#00cc62' },\n { teamName: 'UAE', teamid: 27, code: '#333333' },\n { teamName: 'Bermuda', teamid: 12, code: '#6e8fd4' },\n { teamName: 'Scotland', teamid: 30, code: '#002a5e' },\n { teamName: 'HongKong', teamid: 19, code: '#000000' },\n { teamName: 'Nepal', teamid: 32, code: '#000080' },\n { teamName: 'Oman', teamid: 37, code: '#ff0000' },\n { teamName: 'Malaysia', teamid: 16, code: '#000000' },\n { teamName: 'Singapore', teamid: 23, code: '#ef3340' },\n { teamName: 'Islamabad United', teamid: 5795, code: '#F05705' },\n { teamName: 'Karachi Kings', teamid: 5793, code: '#4287f5' },\n { teamName: 'Quetta Gladiators', teamid: 5797, code: '#64169C' },\n { teamName: 'Multan Sultans', teamid: 6413, code: '#0d8c46' },\n { teamName: 'Peshawar Zalmi', teamid: 5791, code: '#f7db20' },\n { teamName: 'Lahore Qalandars', teamid: 5799, code: '#a2db27' },\n];\n\nconst teamFlag = {\n 185: 'pt.svg',\n 18: 'gi.svg',\n 3770: 'bb.svg',\n 40: 'af.svg',\n 45: 'mt.svg',\n 42: 'be.svg',\n 126: 'cz.svg',\n 161: 'lu.svg',\n 164: 'mv.svg',\n 207: 'th.svg',\n 108: 'bh.svg',\n 27: 'ae.svg',\n 15: 'nl.svg',\n 20: 'pg.svg',\n 21: 'ar.svg',\n 117: 'br.svg',\n 44: 'cl.svg',\n 139: 'hu.svg',\n 150: 'is.svg',\n 3793: 'gy.svg',\n 3802: 'jm.svg',\n 112: 'bt.svg',\n 28: 'na.svg',\n 5: 'nz.svg',\n 200: 'es.svg',\n 1094: 'gg.svg',\n 175: 'no.svg',\n 9: 'zw.svg',\n 31: 'it.svg',\n 19: 'hk.svg',\n 4083: 'je.svg',\n 16: 'my.svg',\n 26: 'ke.svg',\n 34: 'ug.svg',\n 178: 'pe.svg',\n 12: 'bm.svg',\n 188: 'ro.svg',\n 179: 'ph.svg',\n 17: 'ca.svg',\n 32: 'np.svg',\n 25: 'bd.svg',\n 13: 'dk.svg',\n 209: 'tr.svg',\n 35: 'de.svg',\n 41: 'at.svg',\n 115: 'bz.svg',\n 4082: 'cr.svg',\n 183: 'pa.svg',\n 135: 'gh.svg',\n 173: 'ng.svg',\n 192: 'ws.svg',\n 116: 'bw.svg',\n 191: 'rw.svg',\n 7: 'pk.svg',\n 142: 'id.svg',\n 39: 'ky.svg',\n 216: 'vu.svg',\n 172: 'nc.svg',\n 10: 'fj.svg',\n 36: 'jp.svg',\n 165: 'mx.svg',\n 29: 'ie.svg',\n 30: 'gb-sct.svg',\n 3: 'za.svg',\n 8: 'lk.svg',\n 2: 'au.svg',\n 6: 'in.svg',\n 1: 'gb-eng.svg',\n 23: 'sg.svg',\n 37: 'om.svg',\n 187: 'qa.svg',\n 154: 'sa.svg',\n 38: 'kw.svg',\n};\n\nexport default class warmgraph extends Component {\n constructor(props) {\n super(props);\n this.state = {\n imageUrl: [],\n top3: [],\n top3names: [],\n top3runs: [],\n teamColor: null,\n };\n }\n\n async componentDidMount() {\n var url = document.URL.split('/');\n var Param3 = url[url.length - 1];\n var tempColor = null;\n for (let i = 0; i < Object.keys(colour).length; i++) {\n if (Param3 === colour[i].teamid) {\n tempColor = colour[i].code;\n }\n }\n if (tempColor == null) {\n tempColor = 'rgba(255,99,132,0.8)';\n }\n const results = (await getPLayerBattingIndicator(Param3)).data;\n this.setState({\n teamColor: tempColor,\n top3: results,\n });\n // var listofplayers =\n // process.env.REACT_APP_API_ENDPOINT +\n // '/api/match-teams/?page_size=1000&team_id=' +\n // Param3;\n\n // fetch(listofplayers)\n // .then((res) => res.json())\n // .then((res) => res.results)\n // .then((results) => {\n // this.findtop3(results, tempColor);\n // });\n }\n\n urlarg(id) {\n var url = id.split('/');\n var argcheck = url[url.length - 2];\n return argcheck;\n }\n\n findtop3(results, tempColor) {\n var playerIdArr = [];\n for (let i = 0; i < Object.keys(results).length; i++) {\n if (!playerIdArr.includes(results[i].player_id)) {\n playerIdArr.push(this.urlarg(results[i].player_id.url));\n }\n }\n\n var temp = [];\n fetch(\n process.env.REACT_APP_API_ENDPOINT +\n '/api/stats/players/player-batting-indicators/?player_id=[' +\n playerIdArr +\n ']'\n )\n .then((res) => res.json())\n .then((out) => {\n for (let i = 0; i < Object.keys(out.results).length; i++) {\n temp.push(out.results[i]);\n }\n this.setState({\n teamColor: tempColor,\n top3: temp,\n });\n })\n .catch((err) => {\n throw err;\n });\n }\n\n getTeam1Logo(teamId, name) {\n if (teamId in teamFlag && teamId !== 4 && teamId !== 11) {\n var link = '/flags/svg/' + teamFlag[teamId];\n return \n
\n \n {this.getTeam1Logo(this.state.team_id)}\n
\n \n Season: {this.state.season}\n
\n \n\n \n \n
\n\n\n
\n | \n | Wins by run | \nLosts by run | \nWins by wicket | \nLosts by wicket | \n
|---|---|---|---|---|
| Best Results | \n{this.state.best_won_by_run_margin} | \n{this.state.best_lost_by_run_margin} | \n{this.state.best_won_by_wicket_margin} | \n{this.state.best_lost_by_wicket_margin} | \n
| Worst Results | \n{this.state.worst_won_by_run_margin} | \n{this.state.worst_lost_by_run_margin} | \n{this.state.worst_won_by_wicket_margin} | \n{this.state.worst_lost_by_wicket_margin} | \n
{name}
;\n }\n\n render() {\n return (\n\n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Bar } from \"react-chartjs-2\";\nimport $ from \"jquery\";\nimport {getPLayerBowlingIndicator} from '../../api/stats.api';\nasync function fetchPages(url, page_num, max_pages = 10000, acc) {\n let page = await fetch(url + \"\" + page_num).then((response) =>\n response.json()\n );\n if (page.next == null || page_num >= max_pages) {\n return acc.concat(page.results);\n } else {\n return await fetchPages(\n url,\n page_num + 1,\n max_pages,\n acc.concat(page.results)\n );\n }\n}\nvar matchId = \"1173064\";\nconst colour = [\n { teamName: \"WestIndies\", teamid: 4, code: \"#6e0237\" },\n { teamName: \"Pakistan\", teamid: 7, code: \"#00563b\" },\n { teamName: \"Afghanistan\", teamid: 40, code: \"#0033ee\" },\n { teamName: \"Bangladesh\", teamid: 25, code: \"#005400\" },\n { teamName: \"India\", teamid: 6, code: \"#007fff\" },\n { teamName: \"SouthAfrica\", teamid: 3, code: \"#006651\" },\n { teamName: \"Australia\", teamid: 2, code: \"#ffdf00\" },\n { teamName: \"England\", teamid: 1, code: \"#011e3d\" },\n { teamName: \"NewZealand\", teamid: 5, code: \"#000000\" },\n { teamName: \"Canada\", teamid: 17, code: \"#ea3c57\" },\n { teamName: \"Netherlands\", teamid: 15, code: \"#ee7c09\" },\n { teamName: \"PapuaNewGuinea\", teamid: 20, code: \"#000000\" },\n { teamName: \"SriLanka\", teamid: 8, code: \"#000080\" },\n { teamName: \"Zimbabwe\", teamid: 9, code: \"#ff0000\" },\n { teamName: \"Kenya\", teamid: 26, code: \"#006629\" },\n { teamName: \"Ireland\", teamid: 29, code: \"#00cc62\" },\n { teamName: \"UAE\", teamid: 27, code: \"#333333\" },\n { teamName: \"Bermuda\", teamid: 12, code: \"#6e8fd4\" },\n { teamName: \"Scotland\", teamid: 30, code: \"#002a5e\" },\n { teamName: \"HongKong\", teamid: 19, code: \"#000000\" },\n { teamName: \"Nepal\", teamid: 32, code: \"#000080\" },\n { teamName: \"Oman\", teamid: 37, code: \"#ff0000\" },\n { teamName: \"Malaysia\", teamid: 16, code: \"#000000\" },\n { teamName: \"Singapore\", teamid: 23, code: \"#ef3340\" },\n { teamName: \"Islamabad United\", teamid: 5795, code: \"#F05705\" },\n { teamName: \"Karachi Kings\", teamid: 5793, code: \"#4287f5\" },\n { teamName: \"Quetta Gladiators\", teamid: 5797, code: \"#64169C\" },\n { teamName: \"Multan Sultans\", teamid: 6413, code: \"#0d8c46\" },\n { teamName: \"Peshawar Zalmi\", teamid: 5791, code: \"#f7db20\" },\n { teamName: \"Lahore Qalandars\", teamid: 5799, code: \"#a2db27\" },\n];\n\nconst teamFlag = {\n 185: \"pt.svg\",\n 18: \"gi.svg\",\n 3770: \"bb.svg\",\n 40: \"af.svg\",\n 45: \"mt.svg\",\n 42: \"be.svg\",\n 126: \"cz.svg\",\n 161: \"lu.svg\",\n 164: \"mv.svg\",\n 207: \"th.svg\",\n 108: \"bh.svg\",\n 27: \"ae.svg\",\n 15: \"nl.svg\",\n 20: \"pg.svg\",\n 21: \"ar.svg\",\n 117: \"br.svg\",\n 44: \"cl.svg\",\n 139: \"hu.svg\",\n 150: \"is.svg\",\n 3793: \"gy.svg\",\n 3802: \"jm.svg\",\n 112: \"bt.svg\",\n 28: \"na.svg\",\n 5: \"nz.svg\",\n 200: \"es.svg\",\n 1094: \"gg.svg\",\n 175: \"no.svg\",\n 9: \"zw.svg\",\n 31: \"it.svg\",\n 19: \"hk.svg\",\n 4083: \"je.svg\",\n 16: \"my.svg\",\n 26: \"ke.svg\",\n 34: \"ug.svg\",\n 178: \"pe.svg\",\n 12: \"bm.svg\",\n 188: \"ro.svg\",\n 179: \"ph.svg\",\n 17: \"ca.svg\",\n 32: \"np.svg\",\n 25: \"bd.svg\",\n 13: \"dk.svg\",\n 209: \"tr.svg\",\n 35: \"de.svg\",\n 41: \"at.svg\",\n 115: \"bz.svg\",\n 4082: \"cr.svg\",\n 183: \"pa.svg\",\n 135: \"gh.svg\",\n 173: \"ng.svg\",\n 192: \"ws.svg\",\n 116: \"bw.svg\",\n 191: \"rw.svg\",\n 7: \"pk.svg\",\n 142: \"id.svg\",\n 39: \"ky.svg\",\n 216: \"vu.svg\",\n 172: \"nc.svg\",\n 10: \"fj.svg\",\n 36: \"jp.svg\",\n 165: \"mx.svg\",\n 29: \"ie.svg\",\n 30: \"gb-sct.svg\",\n 3: \"za.svg\",\n 8: \"lk.svg\",\n 2: \"au.svg\",\n 6: \"in.svg\",\n 1: \"gb-eng.svg\",\n 23: \"sg.svg\",\n 37: \"om.svg\",\n 187: \"qa.svg\",\n 154: \"sa.svg\",\n 38: \"kw.svg\"\n} ;\n\nexport default class warmgraph extends Component {\n constructor(props) {\n super(props);\n this.state = {\n imageUrl: [],\n top3: [],\n top3names: [],\n top3runs: [],\n teamColor: null,\n };\n }\n\n async componentDidMount() {\n var url = document.URL.split(\"/\");\n var Param3 = url[url.length - 1];\n var tempColor = null;\n var temp = [];\n\n for (let i = 0; i < Object.keys(colour).length; i++) {\n if (Param3 === colour[i].teamid) {\n tempColor = colour[i].code;\n }\n }\n if (tempColor == null) {\n tempColor = \"rgba(255,99,132,0.8)\";\n }\n // var fullurl =\n // process.env.REACT_APP_API_ENDPOINT +\n // \"/api/match-teams/?page=1&team_id=\" +\n // Param3 +\n // \"&page_size=100&page=\";\n // var allResults = await fetchPages(fullurl, 1, 100, temp)\n // .then(res => {\n // this.findtop3(res,tempColor)\n // });\n\n let results = (await getPLayerBowlingIndicator(Param3)).data;\n this.setState({\n top3: results,\n teamColor: tempColor,\n });\n};\n\n urlarg(id) {\n var url = id.split(\"/\");\n var argcheck = url[url.length - 2];\n return argcheck;\n }\n\n findtop3(results,tempColor) {\n var playerIdArr = [];\n for (let i = 0; i < Object.keys(results).length; i++) {\n if(!(playerIdArr.includes(results[i].player_id))) {\n playerIdArr.push(this.urlarg(results[i].player_id.url));\n }\n }\n var idArr = process.env.REACT_APP_API_ENDPOINT +\n \"/api/stats/players/player-bowling-indicators/?player_id=[\"+\n playerIdArr+\n \"]\";\n fetch(idArr)\n .then((res) => res.json())\n .then((res) => res.results)\n .then((results) => {\n this.setState({\n top3: results,\n teamColor: tempColor,\n });\n });\n }\n\n getTeam1Logo(teamId, name) {\n if (teamId in teamFlag && teamId !== 4 && teamId !== 11){\n var link = '/flags/svg/'+teamFlag[teamId]\n return \n
\n \n {\n return top.card_long;\n }),\n datasets: [\n {\n backgroundColor: this.state.teamColor,\n data: this.state.top3.map((top) => {\n return (\n top.t20_runs +\n top.t20i_runs +\n top.list_a_runs +\n top.odi_runs\n );\n }),\n },\n ],\n }}\n options={{\n title: {\n display: true,\n text: 'Total Runs',\n },\n scales: {\n xAxes: [\n {\n display: true,\n ticks: {\n beginAtZero: true,\n min: 0,\n },\n },\n ],\n yAxes: [\n {\n display: true,\n scaleLabel: {\n display: true,\n labelString: 'Total Runs',\n },\n ticks: {\n beginAtZero: true,\n min: 0,\n },\n },\n ],\n },\n }}\n options={{\n legend: {\n display: false,\n },\n }}\n />\n
\n {name}
;\n }\n\n render() {\n return (\n\n
\n )\n }\n}\n","import React, { Component } from 'react';\nimport $ from \"jquery\";\nimport {getTeamMatchNumber} from '../../api/stats.api';\nasync function fetchPages(url, page_num, max_pages = 10000, acc) {\n let page = await fetch(url + \"\" + page_num).then((response) =>\n response.json()\n );\n if (page.next == null || page_num >= max_pages) {\n return acc.concat(page.results);\n } else {\n return await fetchPages(\n url,\n page_num + 1,\n max_pages,\n acc.concat(page.results)\n );\n }\n}\n\nconst colour = [\n{'teamid': 4, 'code': '#6e0237'},\n{'teamid': 7, 'code': '#00563b'},\n{'teamid': 40, 'code': '#0033ee'},\n{'teamid': 25, 'code': '#005400'},\n{'teamid': 6, 'code': '#007fff'},\n{'teamid': 3, 'code': '#006651'},\n{'teamid': 2, 'code': '#ffdf00'},\n{'teamid': 1, 'code': '#011e3d'},\n{'teamid': 5, 'code': '#000000'},\n{'teamid': 17, 'code': '#ea3c57'},\n{'teamid': 15, 'code': '#ee7c09'},\n{'teamid': 20, 'code': '#000000'},\n{'teamid': 8, 'code': '#000080'},\n{'teamid': 9, 'code': '#ff0000'},\n{'teamid': 26, 'code': '#006629'},\n{'teamid': 29, 'code': '#00cc62'},\n{'teamid': 27, 'code': '#333333'},\n{'teamid': 12, 'code': '#6e8fd4'},\n{'teamid': 30, 'code': '#002a5e'},\n{'teamid': 19, 'code': '#000000'},\n{'teamid': 32, 'code': '#000080'},\n{'teamid': 37, 'code': '#ff0000'},\n{'teamid': 16, 'code': '#000000'},\n{'teamid': 23, 'code': '#ef3340'},\n{'teamid': 5795, 'code': '#F05705'},\n{'teamid': 5793, 'code': '#4287f5'},\n{'teamid': 5797, 'code': '#64169C'},\n{'teamid': 6413, 'code': '#0d8c46'},\n{'teamid': 5791, 'code': '#f7db20'},\n{'teamid': 5799, 'code': '#a2db27'},\n];\n\nexport default class teammatchessummary extends Component {\n constructor(props) {\n super(props);\n this.state = {\n teamResult: [],\n }\n }\n\nasync componentDidMount() {\n var temp = [];\n var url = document.URL.split(\"/\");\n var Param3 = url[url.length-1];\n\n // var fullurl =\n // process.env.REACT_APP_API_ENDPOINT +\n // \"/api/stats/team/team-matches-number/?team_id=\" +\n // Param3 +\n // \"&page_size=1000&page=\";\n // var allResults = await fetchPages(fullurl, 1, 100, temp);\n // for (let i = 0; i < Object.keys(allResults).length; i++) {\n // temp.push(allResults[i]);\n // }\n\n const allResults = (await getTeamMatchNumber(Param3)).data;\n this.setState({\n teamResult: allResults,\n });\n}\n\nrender() {\n return (\n \n
\n \n {\n return top.card_long;\n }),\n datasets: [\n {\n backgroundColor: this.state.teamColor,\n data: this.state.top3.map((top) => {\n return (\n top.t20_wickets_taken +\n top.t20i_wickets_taken +\n top.list_a_wickets_taken +\n top.odi_wickets_taken\n );\n }),\n },\n ],\n }}\n options={{\n title: {\n display: true,\n text: \"Total wickets taken\",\n },\n scales: {\n xAxes: [\n {\n display: true,\n ticks: {\n beginAtZero: true,\n min: 0,\n },\n },\n ],\n yAxes: [\n {\n display: true,\n ticks: {\n beginAtZero: true,\n min: 0,\n },\n },\n ],\n },\n }}\n options={{legend: {\n display: false\n },\n scales: {\n yAxes: [{\n ticks: {\n beginAtZero: true\n }\n\n }]\n }}\n }\n />\n
\n \n
\n )\n }\n}\n","import React, { Component } from 'react';\nimport $ from 'jquery';\nimport { getTeamLossWinBySeason } from '../../api/stats.api';\n\nasync function fetchPages(url, page_num, max_pages = 10000, acc) {\n let page = await fetch(url + '' + page_num).then((response) =>\n response.json()\n );\n if (page.next == null || page_num >= max_pages) {\n return acc.concat(page.results);\n } else {\n return await fetchPages(\n url,\n page_num + 1,\n max_pages,\n acc.concat(page.results)\n );\n }\n}\n\nconst colour = [\n { teamid: 4, code: '#6e0237' },\n { teamid: 7, code: '#00563b' },\n { teamid: 40, code: '#0033ee' },\n { teamid: 25, code: '#005400' },\n { teamid: 6, code: '#007fff' },\n { teamid: 3, code: '#006651' },\n { teamid: 2, code: '#ffdf00' },\n { teamid: 1, code: '#011e3d' },\n { teamid: 5, code: '#000000' },\n { teamid: 17, code: '#ea3c57' },\n { teamid: 15, code: '#ee7c09' },\n { teamid: 20, code: '#000000' },\n { teamid: 8, code: '#000080' },\n { teamid: 9, code: '#ff0000' },\n { teamid: 26, code: '#006629' },\n { teamid: 29, code: '#00cc62' },\n { teamid: 27, code: '#333333' },\n { teamid: 12, code: '#6e8fd4' },\n { teamid: 30, code: '#002a5e' },\n { teamid: 19, code: '#000000' },\n { teamid: 32, code: '#000080' },\n { teamid: 37, code: '#ff0000' },\n { teamid: 16, code: '#000000' },\n { teamid: 23, code: '#ef3340' },\n { teamid: 5795, code: '#F05705' },\n { teamid: 5793, code: '#4287f5' },\n { teamid: 5797, code: '#64169C' },\n { teamid: 6413, code: '#0d8c46' },\n { teamid: 5791, code: '#f7db20' },\n { teamid: 5799, code: '#a2db27' },\n];\n\nexport default class teamhighestmarginwinloss extends Component {\n constructor(props) {\n super(props);\n this.state = {\n teamResult: [],\n };\n }\n\n async componentDidMount() {\n var temp = [];\n var url = document.URL.split('/');\n var Param3 = url[url.length - 1];\n\n const allResults = (await getTeamLossWinBySeason(Param3)).data;\n\n this.setState({\n teamResult: allResults,\n });\n }\n\n render() {\n return (\n \n\n \n \n
\n
\n | Season | \nSeries | \nTotal Matches | \nWin | \nLost | \n
| {team.season_name} | \n{team.series_name} | \n{team.total_matches} | \n{team.win} | \n{team.lost} | \n
\n
\n );\n }\n}\n","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.0/8 are considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit https://bit.ly/CRA-PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then(registration => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See https://bit.ly/CRA-PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl, {\n headers: { 'Service-Worker': 'script' },\n })\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready\n .then(registration => {\n registration.unregister();\n })\n .catch(error => {\n console.error(error.message);\n });\n }\n}\n","\nimport httpClient from \"./httpClient\";\n\nconst upCommingSeriesMatches = () => {\n return httpClient.get('/api/schedule/upcoming-matches');\n };\n\n const liveMatches = () => {\n return httpClient.get('/api/schedule/live-matches');\n };\n const resultMatches = () => {\n return httpClient.get('/api/schedule/result-matches');\n };\n\n const getSeriesMatches = (seriesId) => {\n return httpClient.get(`api/schedule/series-matches/${seriesId}`);\n };\n\nexport {upCommingSeriesMatches, liveMatches,resultMatches, getSeriesMatches}","import React, { useState, useEffect } from 'react';\nimport moment from 'moment';\n// import getTeamLogoUrl\nimport { getTeamLogoUrl } from '../../config/utils';\nimport { isDateToday } from '../../config/utils';\nvar team2Logo = '/flags/png/1110_flag_safari.png';\nvar team1Logo = '/flags/png/1110_flag_safari2.png';\n\n\nexport default function UpcomingCard(match,m) {\n\n const displayDate = (date) => {\n const d = new Date(date);\n if (isDateToday(d)) {\n return \"Today\";\n }\n return moment(d).local().format(\"Do MMM\");\n }\n const displayTime = (date) => {\n const d = new Date(date);\n return moment(d).local().format(\"h:mm a\")\n }\n const displayNotice = (date, status_text) => {\n if (status_text == null || status_text == \"\") {\n return moment(date).fromNow();\n }\n return status_text;\n\n }\n const access_token = localStorage.access_token;\n\n return (\n \n\n \n \n
\n
\n | Season | \nSeries | \nHighest Won Margin Runs | \nHighest Won Margin Wickets | \nHighest Lost Margin Runs | \nHighest Lost Margin Wickets | \n
| {team.season_name} | \n{team.series_name} | \n{team.highest_won_margin_runs} | \n{team.highest_won_margin_wickets} | \n{team.highest_lost_margin_runs} | \n{team.highest_lost_margin_wickets} | \n
\n
\n \n\n );\n}","\nimport moment from 'moment';\nimport React, { useState, useEffect } from 'react';\nimport { upCommingSeriesMatches } from './api/schedule.api';\nimport { isDateToday } from './config/utils';\nimport Menu from './components/Menu';\nimport utils from './react-bootstrap-table2/src/utils';\nimport UpcomingCard from './components/schedule/UpcomingCard';\nimport logo from './assets/imgs/tvconal_logo.png'; // with import\nvar team2Logo = '/flags/png/1110_flag_safari.png';\nvar team1Logo = '/flags/png/1110_flag_safari2.png';\n// import tem2Loglo from '/'\n\n\nexport default function ScheduleMatches() {\n\n const [seriesMatches, setSeriesMatches] = useState([]);\n\n useEffect(() => {\n fetchUpComming();\n }, []);\n\n const fetchUpComming = async () => {\n const seriesMatches = await upCommingSeriesMatches();\n const data = seriesMatches.data;\n var result = Object.keys(data).map((key) => data[key]);\n\n setSeriesMatches(result);\n }\n\n const displayDate = (date) => {\n const d = new Date(date);\n if (isDateToday(d)) {\n return \"Today\";\n }\n return moment(d).local().format(\"Do MMM\");\n }\n const displayTime = (date) => {\n const d = new Date(date);\n return moment(d).local().format(\"h:mm a\")\n }\n\n const displayNotice = (date) => {\n return moment(date).fromNow();\n }\n\n\n return (\n \n
\n \n
\n {match.format}
\n {match.venue_name}
\n \n
\n\n \n
\n \n\n
\n \n {getTeamLogoUrl(match.team1_logo) != null && (\n
\n \n {getTeamLogoUrl(match.team2_logo) != null && (\n
\n \n {displayDate(match.start_date)}\n
\n {displayTime(match.start_date)}
\n\n {displayNotice(match.start_date, match.status_text)}
\n \n \n \n
\n );\n}","import React, { useState, useEffect } from 'react';\nimport { getTeamLogoUrl } from '../../config/utils';\nimport moment from 'moment';\nimport { isDateToday } from '../../config/utils';\nvar team2Logo = '/flags/png/1110_flag_safari.png';\nvar team1Logo = '/flags/png/1110_flag_safari2.png';\n\n\n\nexport default function LiveCard(m) {\n\n const displayDate = (date) => {\n const d = new Date(date);\n if (isDateToday(d)) {\n return \"Today\";\n }\n return moment(d).local().format(\"Do MMM\");\n }\n const displayTime = (date) => {\n const d = new Date(date);\n return moment(d).local().format(\"h:mm a\")\n }\n\n const displayNotice = (date, status_text) => {\n if (status_text == null || status_text == \"\") {\n return moment(date).fromNow();\n }\n return status_text;\n\n }\n const access_token = localStorage.access_token;\n return (\n \n \n \n\n\n
\n \n
\n \n {seriesMatches.map(sm => {\n return (\n
\n \n \n
\n )\n })}\n \n
\n \n {sm.series_name}
\n ❯
\n \n {sm.matches.map(m => {\n return (\n
\n \n
\n \n );\n}","\nimport moment from 'moment';\nimport React, { useState, useEffect } from 'react';\nimport { liveMatches } from './api/schedule.api';\nimport Menu from './components/Menu'\nimport { isDateToday } from './config/utils';\nimport LiveCard from './components/schedule/LiveCard';\nimport logo from './assets/imgs/tvconal_logo.png'; // with import\nimport utils from './react-bootstrap-table2/src/utils';\nvar team2Logo = '/flags/png/1110_flag_safari.png';\nvar team1Logo = '/flags/png/1110_flag_safari2.png';\nexport default function LiveMatches() {\n\n const [seriesMatches, setSeriesMatches] = useState([]);\n\n useEffect(() => {\n fetchLiveMatch();\n }, []);\n\n const fetchLiveMatch = async () => {\n const seriesMatches = await liveMatches();\n const data = seriesMatches.data;\n var result = Object.keys(data).map((key) => data[key]);\n setSeriesMatches(result);\n }\n\n const displayDate = (date) => {\n const d = new Date(date);\n if (isDateToday(d)) {\n return \"Today\";\n }\n return moment(d).local().format(\"Do MMM\");\n }\n const displayTime = (date) => {\n const d = new Date(date);\n return moment(d).local().format(\"h:mm a\")\n }\n\n const displayNotice = (date, status_text) => {\n if(status_text == null || status_text == \"\") {\n return moment(date).fromNow();\n }\n return status_text;\n \n }\n\n const mapCurrent_states = (matches) => {\n \n }\n\n return (\n \n
\n \n
\n {m.format}
\n {m.venue_name}
\n \n
\n {m.preds && (\n \n
\n \n\n
\n \n {getTeamLogoUrl(m.team1_logo) != null && (\n
\n \n {getTeamLogoUrl(m.team2_logo) != null && (\n
\n \n {/* {displayDate(m.start_date)}\n
\n {displayTime(m.start_date)}
*/}\n {m.team1 ? {m.team1.total_run}/{m.team1.wicket_lost} ({m.team1.over_ball})
: --
}\n {m.team2 ? {m.team2.total_run}/{m.team2.wicket_lost} ({m.team2.over_ball})
: --
}\n\n {displayNotice(m.start_date, m.status_text)}
\n \n
\n )}\n\n\n \n \n
\n \n
\n \n
\n m.preds.team2_probability ? \"green_10\" : \"red_10\"}>{m.preds.team1_probability}%
\n {m.preds.draw_probability}%
\n m.preds.team2_probability ? \"red_10\" : \"green_10\"}>{m.preds.team2_probability}%
\n \n
\n m.preds.team2_probability ? \"dib br2 br--left bg-green_10\" : \"dib br2 br--left bg-red_10\"} style={{ width: `${m.preds.team1_probability}%`, height: \"4px\" }}>\n
\n \n m.preds.team2_probability ? \"dib bg-red_10 dib br2 br--right\" : \"dib bg-green_10 dib br2 br--right\"} style={{ width: `${m.preds.team2_probability}%`, height: \"4px\" }}>\n
\n \n
\n {m.preds.team1_name}
\n {m.preds.draw_probability ? \"Tie\" : \"\"}
\n {m.preds.team2_name}
\n \n \n
\n );\n}","import React, { useState, useEffect } from 'react';\nimport { getTeamLogoUrl } from '../../config/utils';\nimport moment from 'moment';\n\nimport { isDateToday } from '../../config/utils';\n\nvar team2Logo = '/flags/png/1110_flag_safari.png';\nvar team1Logo = '/flags/png/1110_flag_safari2.png';\n\nexport default function ResultCard(m) {\n const displayDate = (date) => {\n const d = new Date(date);\n if (isDateToday(d)) {\n return \"Today\";\n }\n return moment(d).local().format(\"Do MMM\");\n }\n const displayTime = (date) => {\n const d = new Date(date);\n return moment(d).local().format(\"h:mm a\")\n }\n\n const displayNotice = (date, status_text) => {\n if (status_text == null || status_text == \"\") {\n return moment(date).fromNow();\n }\n return status_text;\n\n }\n const access_token = localStorage.access_token;\n return (\n \n \n \n\n\n
\n \n
\n \n {seriesMatches.map(sm => {\n return (\n
\n \n \n
\n )\n })}\n \n
\n \n {sm.series_name}
\n ❯
\n \n {sm.matches.map(m => {\n return (\n
\n\n \n
\n \n );\n}","\nimport moment from 'moment';\nimport React, { useState, useEffect } from 'react';\nimport { resultMatches } from './api/schedule.api';\nimport { isDateToday } from './config/utils';\nimport ResultCard from './components/schedule/ResultCard';\nimport Menu from './components/Menu';\nimport utils from './react-bootstrap-table2/src/utils';\nimport logo from './assets/imgs/tvconal_logo.png'; // with import\nvar team2Logo = '/flags/png/1110_flag_safari.png';\nvar team1Logo = '/flags/png/1110_flag_safari2.png';\n\nexport default function ResultMatches() {\n\n const [seriesMatches, setSeriesMatches] = useState([]);\n\n useEffect(() => {\n fetchMatches();\n }, []);\n\n const fetchMatches = async () => {\n const seriesMatches = await resultMatches();\n const data = seriesMatches.data;\n var result = Object.keys(data).map((key) => data[key]);\n setSeriesMatches(result);\n }\n\n const displayDate = (date) => {\n const d = new Date(date);\n if (isDateToday(d)) {\n return \"Today\";\n }\n return moment(d).local().format(\"Do MMM\");\n }\n const displayTime = (date) => {\n const d = new Date(date);\n return moment(d).local().format(\"h:mm a\")\n }\n\n const displayNotice = (date, status_text) => {\n if (status_text == null || status_text == \"\") {\n return moment(date).fromNow();\n }\n return status_text;\n\n }\n\n const mapCurrent_states = (matches) => {\n\n }\n\n return (\n \n
\n \n
\n {m.format}
\n {m.venue_name}
\n {displayDate(m.start_date) }
\n \n
\n \n
\n \n\n
\n \n {getTeamLogoUrl(m.team1_logo) != null && (\n
\n \n {getTeamLogoUrl(m.team2_logo) != null && (\n
\n \n {/* {displayDate(m.start_date)}\n
\n {displayTime(m.start_date)}
*/}\n {m.team1 ? {m.team1.total_run}/{m.team1.wicket_lost} ({m.team1.over_ball})
: --
}\n {m.team2 ? {m.team2.total_run}/{m.team2.wicket_lost} ({m.team2.over_ball})
: --
}\n\n {displayNotice(m.start_date, m.status_text)}
\n \n \n
\n );\n}","\nimport moment from 'moment';\nimport React, { useState, useEffect } from 'react';\nimport { getSeriesMatches } from './api/schedule.api';\nimport { isDateToday } from './config/utils';\nimport { useParams } from 'react-router-dom';\nimport ResultCard from './components/schedule/ResultCard';\nimport LiveCard from './components/schedule/LiveCard';\nimport UpcomingCard from './components/schedule/UpcomingCard';\nimport Menu from './components/Menu';\nimport httpClient from './api/httpClient';\n\n\nvar team2Logo = '/flags/png/1110_flag_safari.png';\nvar team1Logo = '/flags/png/1110_flag_safari2.png';\n\n\n\nexport default function SchdeuleSeriesMatches() {\n const [seriesName, setSeriesName] = useState(\"\");\n const [seriesMatches, setSeriesMatches] = useState([]);\n let { series_id } = useParams();\n\n useEffect(() => {\n fetchMatches(series_id);\n }, []);\n\n const fetchMatches = async (seriesId) => {\n\n const series_name = (await httpClient.get(`/api/series/${seriesId}/`)).data.series_name;\n setSeriesName(series_name);\n const res = await getSeriesMatches(seriesId);\n setSeriesMatches(res.data);\n }\n\n const displayDate = (date) => {\n const d = new Date(date);\n if (isDateToday(d)) {\n return \"Today\";\n }\n return moment(d).local().format(\"Do MMM\");\n }\n const displayTime = (date) => {\n const d = new Date(date);\n return moment(d).local().format(\"h:mm a\")\n }\n\n const displayNotice = (date, status_text) => {\n if (status_text == null || status_text == \"\") {\n return moment(date).fromNow();\n }\n return status_text;\n\n }\n\n const mapCurrent_states = (matches) => {\n\n }\n\n const matchCardComponent = (match) => {\n if (match.state == \"PRE\" && match.stage == \"SCHEDULED\") {\n return UpcomingCard(match);\n }\n if (match.state == \"LIVE\") {\n\n return LiveCard(match);\n }\n if (match.state == \"POST\" && match.stage == \"FINISHED\") {\n\n return ResultCard(match);\n }\n }\n\n return (\n \n \n\n\n
\n \n
\n \n {seriesMatches.map(sm => {\n return (\n
\n \n \n
\n )\n })}\n \n
\n \n {sm.series_name}
\n ❯
\n \n {sm.matches.map(m => {\n return (\n
\n\n \n \n
\n );\n}","\nimport React, { useEffect, useState } from \"react\";\nimport httpClient from \"../../api/httpClient\";\nimport { useParams } from \"react-router-dom/cjs/react-router-dom.min\";\nexport default function MatchSummary({ match_id }) {\n const [summary, setSummary] = useState();\n const [prematch, setPrematch] = useState();\n const [analyticReport, setAnalyticReport] = useState();\n const [match, setMatch] = useState();\n let { m_id } = useParams();\n\n useEffect(() => {\n if (m_id) {\n fetchData(m_id)\n } else {\n fetchData(match_id)\n }\n\n }, [])\n\n async function fetchData(matchId) {\n let matchRes = await httpClient.get(`/api/matches/${matchId}`)\n setMatch(matchRes.data);\n \n\n if (matchRes.data.result_id?.result_type == \"tied\" || matchRes.data.result_id?.result_type == \"won by runs\" || matchRes.data.result_id?.result_type == \"won by wickets\") {\n let res = await httpClient.get(`/api/match-summary/${matchId}`)\n setSummary(res.data)\n\n }\n try{\n let preMatchres = await httpClient.get(`/api/pre-match/${matchId}`)\n setPrematch(preMatchres.data)\n }catch{\n\n }\n \n try{\n let analyticMatch = await httpClient.get(`/api/analyst-report/${matchId}`)\n setAnalyticReport(analyticMatch.data)\n }catch{\n\n }\n \n\n }\n\n return \n
\n {seriesName}
\n \n {seriesMatches.map(m => {\n return matchCardComponent(m);\n })}\n
\n \n {prematch && (\n
\n\n}","import React, { useState, useEffect } from 'react';\n\nimport { getMatch } from '../../api/match.api';\nimport { useParams } from 'react-router-dom';\n\nimport httpClient from '../../api/httpClient';\nimport Chart from 'chart.js';\nimport logo from '../../assets/imgs/tvconal_logo.png'; // with import\nimport MenuBar from '../v2/Menubar';\nimport { getTeamLogoUrl } from '../../config/utils';\nimport { Pie } from 'react-chartjs-2';\nimport { chartColors } from '../../config/constant';\nimport { tap } from 'underscore';\n\n\nexport default function WagonWheel({ match_id }) {\n const [teamWagonWheels, setTeamWagonWheels] = useState([]);\n const [batterTeamWagonWheels, setBatterTeamWagonWheels] = useState([]);\n const [venueMatchId, setVenueMatchId] = useState(null);\n // let { match_id } = useParams();\n\n useEffect(() => {\n\n fetchMatch(match_id);\n }, []);\n\n async function fetchMatch(matchId) {\n // const encoded_match_id = (await httpClient.get(`/api/preds/encode/${matchId}`)).data;\n const res = await httpClient.get(`/api/preds/wagon-wheel-bowlers/${matchId}`)\n setTeamWagonWheels(res.data);\n const batres = await httpClient.get(`/api/preds/wagon-wheel-batsmen/${matchId}`)\n setBatterTeamWagonWheels(batres.data);\n\n }\n\n return (\n \n
\n )}\n\n {analyticReport && (\n Match Preview
\n {prematch?.summary}\n \n \n
\n )}\n Analytic Report
\n {analyticReport?.analyst_report}\n \n \n {summary &&
\n \n Match Summary
}\n {summary?.summary}\n {summary && (\n \n \n
\n )}\n\n\n \n\n
\n )\n}\n\n// ","import React, {useState, useEffect} from \"react\";\nimport { Bar } from 'react-chartjs-2';\nimport httpClient from \"../../api/httpClient\";\n\nexport default function PrematchRuns({match_id}) {\n const [teamNames, setTeamNames] = useState([]); \n const [teamColor, setTeamColors] = useState([]); \n const [teamScored, setTeamScored] = useState([]); \n useEffect(() => {\n fetchData(match_id);\n \n \n }, []);\n const fetchData = async(matchId) => {\n const res = await httpClient.get(`/api/predictions/plots/score/${matchId}`);\n const data = res.data;\n setTeamNames([data.team1Name,data.team2Name]);\n try{\n setTeamScored([data.predictionsPerInning[0].scorePreds.team1PredScore[0],data.predictionsPerInning[0].scorePreds.team2PredScore[0]]);\n setTeamColors([data.team1Color,data.team2Color]);\n }catch(e) {\n\n }\n \n }\n return (\n \n \n
\n\n BOWLERS
\n {teamWagonWheels.map(t => {\n return (\n\n\n
\n );\n })}\n\n\n\n {t.team_name}
\n \n {t.players.map(p => {\n return (\n
\n \n
\n );\n }\n\n )}\n\n {p.card_long.toUpperCase()}
\n \n\n \n\n
\n {/* \n \n
*/}\n \n
\n\n BATTERS
\n {batterTeamWagonWheels.map(t => {\n return (\n\n\n
\n );\n })}\n\n\n\n {t.team_name}
\n \n {t.players.map(p => {\n return (\n
\n \n
\n );\n }\n\n )}\n\n {p.card_long.toUpperCase()}
\n \n\n \n\n
\n \n
\n );\n}","import React, {useState, useEffect} from \"react\";\nimport { Bar } from 'react-chartjs-2';\nimport httpClient from \"../../api/httpClient\";\n\nexport default function PrematchMostRuns({match_id}) {\n const [mostRuns, setMostRuns] = useState([]); \n // const [teamColor, setTeamColors] = useState([]); \n // const [teamScored, setTeamScored] = useState([]); \n \n useEffect(() => {\n fetchData(match_id);\n \n \n \n }, []);\n\n const fetchData = async(matchId) => {\n const res = await httpClient.get(`/api/predictions/runs/${matchId}`);\n const data = res.data;\n \n const bestRunInning1 = data.currentInning.sort((a, b) => b.predictedRuns - a.predictedRuns);\n const bestRunInning2 = data.nextInning.sort((a, b) => b.predictedRuns - a.predictedRuns);\n bestRunInning1[0]['team'] = data.gameState.teams[0];\n bestRunInning2[0]['team'] = data.gameState.teams[1];\n \n setMostRuns([bestRunInning1[0],bestRunInning2[0]]);\n \n }\n return (\n \n Team Run Scored
\n\n p.playerName),\n datasets: [{\n label: 'Player Most Runs',\n data: mostRuns.map(p => p.predictedRuns),\n backgroundColor: mostRuns.map(p => p.team.team_color),\n borderWidth: 1\n }]\n }}\n /> \n
\n );\n}","import React, {useState, useEffect} from \"react\";\nimport { Bar } from 'react-chartjs-2';\nimport httpClient from \"../../api/httpClient\";\n\nexport default function PrematchMostWicket({match_id}) {\n const [teamNames, setTeamNames] = useState([]); \n const [teamColor, setTeamColors] = useState([]); \n const [teamScored, setTeamScored] = useState([]); \n useEffect(() => {\n fetchData(match_id);\n \n \n }, []);\n const fetchData = async(matchId) => {\n var res = await httpClient.get(`/api/predictions/fow/${matchId}`);\n const data = res.data;\n \n // const bestRunInning1 = data.predictedWicketTakers.currentInning.sort((a, b) => b.predictedRuns - a.predictedRuns);\n // const bestRunInning2 = data.nextInning.sort((a, b) => b.predictedRuns - a.predictedRuns);\n // bestRunInning1[0]['team'] = data.gameState.teams[0];\n // bestRunInning2[0]['team'] = data.gameState.teams[1];\n \n // setMostRuns([bestRunInning1[0],bestRunInning2[0]]);\n \n }\n return (\n \n Player Most Runs
\n\n
\n );\n}","import React, { useEffect, useState } from 'react'\nimport { useParams } from 'react-router-dom'\nimport httpClient from '../../api/httpClient'\nexport default function TitansPredictionRuns () {\n const { match_id } = useParams()\n const [matchData, setMatchData] = useState({})\n useEffect(() => {\n fetchMatchPres(match_id)\n const intervalId = setInterval(() => {\n fetchMatchPres(match_id)\n }, 30000)\n return () => clearInterval(intervalId);\n\n }, [])\n\n async function fetchMatchPres (match_id) {\n try {\n let res = await httpClient.get(`/api/preds/match/${match_id}`)\n setMatchData(res.data)\n } catch {}\n }\n const getTeamName = () => {\n const teamId = matchData?.current?.prediction_team_id\n if (!teamId) {\n return ''\n }\n const team = matchData.team.filter(t => t.team_id == teamId)[0]\n return team.name\n }\n return (\n Run Scored
\n\n {matchData?.current?.prediction_runs && (\n
\n )\n}\n","import React, { useState, useEffect } from 'react'\nimport ReactEcharts from 'echarts-for-react'\n\nimport { useParams } from 'react-router-dom'\n\nimport httpClient from '../../api/httpClient'\n\nconst players = ['lizaad', 'NEIL BRAND', 'JUNIOR DALA']\nlet _option = {\n tooltip: {\n trigger: 'item'\n },\n legend: {\n top: '5%',\n left: 'center',\n // doesn't perfectly work with our tricks, disable it\n selectedMode: false\n },\n series: [\n {\n name: 'Access From',\n type: 'pie',\n radius: ['40%', '70%'],\n center: ['50%', '70%'],\n // adjust the start angle\n startAngle: 180,\n label: {\n show: true,\n formatter (param) {\n // correct the percentage\n return param.name + ' (' + param.percent * 2 + '%)'\n }\n },\n data: [\n { value: 1048, name: 'Andrea Agathangelou' },\n { value: 735, name: 'Tony de Zorzi' },\n { value: 580, name: 'Victor Mahlangu' },\n\n {\n // make an record to fill the bottom 50%\n value: 1048 + 735 + 580,\n itemStyle: {\n // stop the chart from rendering this piece\n color: 'none',\n decal: {\n symbol: 'none'\n }\n },\n label: {\n show: false\n }\n }\n ]\n }\n ]\n}\n\nexport default function BowlerDismissChange ({team_idx}) {\n let { match_id, team_index } = useParams()\n const [matchData, setMatchData] = useState([])\n const [team, setTeam] = useState({})\n const [option, setOption] = useState([])\n if (!team_index ){\n team_index = team_idx\n }\n\n useEffect(() => {\n fetchData(match_id)\n const intervalId = setInterval(() => {\n fetchData(match_id)\n }, 30000)\n return () => clearInterval(intervalId);\n\n }, [])\n\n async function fetchData (match_id) {\n const res = await httpClient.get(\n `/api/preds/partnership-breaking-prob/${match_id}`\n )\n let datas = res.data\n\n setMatchData(res.data)\n if(res.data.length < 2 && team_index == 1) {\n team_index = 0\n }\n\n setTeam(res.data[team_index])\n let tmpOption = []\n datas.forEach(data => {\n // const m_option = {..._option}\n const m_option = JSON.parse(JSON.stringify(_option));\n\n\n m_option.series[0].name = data.batter_name;\n m_option.series[0].data = Object.keys(\n data.bowler_dismissal_probability\n ).map(k => {\n return { value: data.bowler_dismissal_probability[k], name: k }\n })\n m_option.series[0].data = m_option.series[0].data.sort(function(a, b){return b.value - a.value}).slice(0,3);\n const sum = m_option.series[0].data.reduce(\n (partialSum, a) => partialSum + a.value,\n 0\n )\n\n\n m_option.series[0].data.sort()\n\n m_option.series[0].data.push({\n // make an record to fill the bottom 50%\n value: sum,\n itemStyle: {\n // stop the chart from rendering this piece\n color: 'none',\n decal: {\n symbol: 'none'\n }\n },\n label: {\n show: false\n }\n })\n\n tmpOption.push(m_option)\n console.log(tmpOption);\n\n })\n if (team_index ) {\n tmpOption = [tmpOption[team_index]]\n }\n setOption(tmpOption)\n\n }\n\n return (\n\n \n {' '}\n
\n )}\n\n \n
\n \n
\n \n {' '}\n Score Prediction\n
\n \n {[...`${matchData?.current?.prediction_runs}`].map(s => {\n return (\n
\n \n
\n )\n })}\n \n {s}\n
\n \n {option.map(o => {\n\n return(\n
\n )\n}\n","import React, { useEffect, useState } from 'react'\nimport { useParams } from 'react-router-dom';\nimport httpClient from '../../api/httpClient';\nimport ReactEcharts from 'echarts-for-react'\nlet player1 = ['','','']\nlet player2 = ['','','']\n\nexport default function HightestScore () {\n const {match_id} = useParams();\n const [matchData, setMatchData] = useState([]);\n const [option , setOption] = useState(null);\n\n let _option = {\n color:['#0097eb','#e5780b','#26c238', '#9876aa', '#fb8649',\n '#57904b','#d35b5c'],\n\n tooltip: {\n trigger: 'item',\n formatter: function (d) {\n return '' + Math.abs(d.data)\n }\n },\n legend: {\n top: '5%',\n left: 'center',\n\n // doesn't perfectly work with our tricks, disable it\n data: ['a','a'],\n selectedMode: false\n },\n grid: {\n // left: '60%',\n // right: '20%',\n\n // bottom: '3%',\n // containLabel: true,\n // show: false\n },\n xAxis: [\n {\n axisLabel: {\n formatter: function (value) {\n return Math.abs(value)\n }\n },\n show: false,\n type: 'value'\n }\n ],\n yAxis: [\n { show: false,\n type: 'category',\n axisTick: {\n show: false\n },\n\n }\n ],\n series: [\n {\n name: 'Titans',\n type: 'bar',\n stack: 'Total',\n barWidth :20,\n barHeight: 40,\n label: {\n show: true,\n formatter: function (d) {\n return player1[d.dataIndex]\n },\n position: 'left',\n\n\n },\n emphasis: {\n focus: 'series'\n },\n data: [320, 302, 341]\n },\n {\n name: 'Warrior',\n type: 'bar',\n stack: 'Total',\n label: {\n show: true,\n position: 'right',\n formatter: function (d) {\n return player2[d.dataIndex]\n }\n\n },\n emphasis: {\n focus: 'series'\n },\n data: [-120, -132, -101]\n }\n ]\n }\n useEffect(()=> {\n fetchMatchData(match_id)\n const intervalId = setInterval(() => {\n fetchMatchData(match_id)\n }, 30000)\n return () => clearInterval(intervalId);\n\n },[])\n\n async function fetchMatchData(match_id) {\n try {\n let res = await httpClient.get(`api/preds/highest-scorers/${match_id}`);\n setMatchData(res.data)\n\n _option.series[0].data = res.data[0].players.map(p => (-1)*p.score);\n _option.series[0].name = res.data[0].team_name\n _option.series[1].name = res.data[1].team_name\n _option.series[1].data = res.data[1].players.map(p => p.score)\n _option.xAxis.data = res.data[1].players.map(p => p.player_short_name )\n _option.legend.data = res.data.map(t => t.team_name)\n player1 = res.data[0].players.map(p => p.player_short_name + ` (${p.score}) `)\n player2 = res.data[1].players.map(p => p.player_short_name + ` (${p.score}) `)\n\n setOption({..._option})\n } catch {\n }\n }\n\n return \n
\n )\n\n })}\n Batter: {o.series[0].name}
\n \n
\n}\n","import { color } from 'echarts'\nimport React, { useEffect, useState, useRef } from 'react'\nimport { useParams } from 'react-router-dom'\nimport httpClient from '../../api/httpClient'\n\nexport default function OTTPredictionRuns () {\n let params = new URL(document.location).searchParams\n\n\n const titleRef = useRef()\n const scoreLabelRef = useRef()\n const { match_id } = useParams()\n const [matchData, setMatchData] = useState({})\n const [style, setStyle] = useState({ scoreLabel: {}, score: {}, scoreBg:{},\n bgColor: {\n backgroundColor: \"transparent\"\n } , fontName: \"\"\n})\n useEffect(() => {\n fetchMatchPres(match_id)\n let tn_color = params.get('team_color')\n let tn_size = params.get('team_size')\n let score_label_color = params.get('score_label_color')\n let score_label_size = params.get('score_label_size')\n\n let score_color = params.get('score_color')\n let score_size = params.get('score_size')\n let score_bg_color = params.get('score_bg_color')\n\n let widget_bg_color = params.get('widget_bg_color')\n let fontName = params.get('font_name')\n\n let _style = {...style};\n if (widget_bg_color) {\n _style = {\n ...style,\n bgColor: {\n backgroundColor: `#${widget_bg_color}`\n }\n }\n }\n if (fontName) {\n _style.fontName = fontName\n\n }\n // debugger\n if (score_label_color || score_label_size) {\n // setStyle({\n // ...style,\n // scoreLabel: {\n // color: `#${score_label_color}`,\n // fontSize: score_label_size\n // }\n // })\n _style = {\n ..._style,\n scoreLabel: {\n color: `#${score_label_color}`,\n fontSize: score_label_size,\n\n\n }\n }\n }\n if (score_bg_color) {\n _style = {\n ..._style,\n scoreBg: {\n backgroundColor: `#${score_bg_color}`,\n }\n }\n setStyle()\n }\n\n if (score_color || score_size) {\n _style ={\n ..._style,\n score: {\n color: `#${score_color}`,\n fontSize: score_size\n }\n }\n }\n setStyle(_style)\n if (tn_color) {\n titleRef.current.style.color = `#${tn_color}`\n }\n\n if (tn_size) {\n titleRef.current.style.fontSize = tn_size\n }\n }, [])\n\n async function fetchMatchPres (match_id) {\n try {\n let res = await httpClient.get(`/api/preds/match/${match_id}`)\n setMatchData(res.data)\n } catch {}\n }\n const getTeamName = () => {\n // {matchData['teams'][0]['name']}\n const teamId = matchData?.current?.prediction_team_id\n if (!teamId) {\n return ''\n }\n const team = matchData.team.filter(t => t.team_id == teamId)[0]\n return team.name\n }\n return (\n \n {/* {matchData.map(m => {\n return (\n
\n {option && (\n \n 
\n {m.team_name}\n
\n )\n })} */}\n\n \n
\n \n \n )\n}\n","import React, { useEffect, useState } from 'react'\nimport { useParams } from 'react-router-dom';\nimport httpClient from '../../api/httpClient';\nimport ReactEcharts from 'echarts-for-react'\n\nconst option = {\n\n series: [\n {\n name: 'Access From',\n type: 'pie',\n radius: '70%',\n label: {\n show: true,\n position: 'inside',\n formatter: function (d) {\n return d.value\n }\n\n },\n data: [\n\n { value: 70, name: 'South Africa', itemStyle: {color: '#0069B6'},\n },\n\n { value: 30, name: 'West Indies',itemStyle: {color: '#EDC669' }},\n\n ],\n emphasis: {\n focus: 'series',\n\n itemStyle: {\n shadowBlur: 10,\n shadowOffsetX: 0,\n shadowColor: 'rgba(0, 0, 0, 0.5)'\n }\n }\n }\n ]\n };\n\nexport default function OTTWinLoss () {\n\n\n\n return \n {' '}\n
\n \n \n {getTeamName()}\n \n
\n \n \n {' '}\n Prediction Score\n
\n \n {[...`${matchData?.current?.prediction_runs}`].map(s => {\n return (\n
\n )\n })}\n \n \n {s}\n
\n \n
\n}\n","import React, { useState, useEffect } from 'react'\nimport { useParams } from 'react-router-dom'\nimport top1_batter from '../../assets/imgs/top1_batter.png'\nimport top2_batter from '../../assets/imgs/top2_batter.png'\nimport top3_batter from '../../assets/imgs/top3_batter.png'\nimport httpClient from '../../api/httpClient'\n\n\nexport default function OTTTopScore ({team_idx}) {\n let { match_id, team_index } = useParams()\n\n const [matchData, setMatchData] = useState([])\n const [selecTeam, setSelectedTeam] = useState({})\n if (!team_index) {\n team_index = team_idx\n }\n useEffect(() => {\n fetchMatchData(match_id)\n const intervalId = setInterval(() => {\n fetchMatchData(match_id)\n }, 30000)\n return () => clearInterval(intervalId);\n\n }, [])\n\n async function fetchMatchData (match_id) {\n try {\n let res = await httpClient.get(`api/preds/highest-scorers/${match_id}`)\n setMatchData(res.data)\n if(res.data.length < 2 && team_index == 1) {\n team_index = 0\n }\n setSelectedTeam(res.data[team_index]);\n\n\n } catch {}\n }\n\n return (\n \n South Africa x West Indies\n\n
\n \n {matchData.map(m => {\n // debugger\n if( m.team_id != selecTeam?.team_id) {\n return \"\"\n }\n return (\n \n
\n \n )\n })}\n \n )\n}\n","import React, {useState, useEffect} from 'react'\nimport batsman_index from '../../assets/imgs/batsman_index.png'\nimport { useParams } from 'react-router-dom'\nimport httpClient from '../../api/httpClient'\n\nimport {FaEye, FaEyeSlash} from 'react-icons/fa';\nimport { Button } from 'bootstrap';\n\nexport default function GuessBastman () {\n const {match_id} = useParams()\n const [battingData, setBattingData] = useState([])\n const [series_name, setSeriesName] = useState(\"\")\n const [show, setShowed] = useState(false)\n useEffect(() => {\n fetchData(match_id)\n\n const intervalId = setInterval(() => {\n fetchData(match_id)\n }, 30000)\n return () => clearInterval(intervalId);\n\n\n }, [])\n async function fetchData(match_id) {\n\n const res = await httpClient.get(`/api/preds/guess-the-player/${match_id}`)\n setBattingData(res.data.batting)\n setSeriesName(res.data.series_name)\n\n }\n function disPlayerPlayer(p) {\n if(p?.find == true) {\n return (\n \n \n Top Scores\n
\n {/* \n
*/}\n\n \n \n {m.players[0].player_popular_name}\n \n
\n \n
\n \n \n {m.players[0].score}\n \n
\n \n
\n \n \n {m.players[0].player_popular_name}\n \n
\n \n
\n \n \n {m.players[1].player_popular_name}\n \n
\n \n
\n \n \n {m.players[2].player_popular_name}\n \n
\n \n
\n )\n }\n return {p.player_name}
\n \n {p.player_name}
\n }\n\n return (\n \n
\n )\n}\n","import React, {useState, useEffect} from 'react'\nimport bowler_index from '../../assets/imgs/bowler_index.png'\nimport { useParams } from 'react-router-dom'\nimport httpClient from '../../api/httpClient'\n// '../../assets/imgs/batsman_index.png'\n// import {AiFillEye} from 'react-icons/fa';\n\nimport {FaEye, FaEyeSlash} from 'react-icons/fa';\nexport default function GuessBowler () {\n const {match_id} = useParams()\n const [bowlingData, setBowlingData] = useState([])\n const [series_name, setSeriesName] = useState(\"\")\n const [show, setShowed] = useState(false)\n useEffect(() => {\n fetchData(match_id)\n\n const intervalId = setInterval(() => {\n fetchData(match_id)\n }, 30000)\n return () => clearInterval(intervalId);\n\n\n }, [])\n async function fetchData(match_id) {\n\n const res = await httpClient.get(`/api/preds/guess-the-player/${match_id}`)\n setSeriesName(res.data.series_name)\n setBowlingData(res.data.bowling)\n\n }\n function disPlayerPlayer(p) {\n if(p?.find == true) {\n return (\n \n {`Guess the BATSMAN IN ${series_name} 2023`}\n
\n \n Player with performance close to\n
\n \n 
\n
\n \n
\n \n {battingData.map(p => {\n return
\n \n {disPlayerPlayer(p)}\n
\n })}\n {p.batting_impact_index}
\n \n
\n )\n }\n return {p.player_name}
\n \n {p.player_name}
\n }\n return (\n \n
\n )\n}\n","import React, { useEffect, useState } from 'react'\nimport { useParams } from 'react-router-dom/cjs/react-router-dom.min'\nimport httpClient from '../../api/httpClient'\nimport ReCAPTCHA from \"react-google-recaptcha\";\n\nimport moment from 'moment'\nimport { validateEmail } from '../../config/utils'\nimport { Alert } from 'bootstrap-4-react/lib/components'\nimport { param } from 'jquery';\nconst initvalidParams = {\n batter: true,\n bowler: true,\n winteam: true,\n name: true,\n email: true,\n postalcode: true,\n phone: true\n}\nexport default function SuperFans () {\n const recaptchaRef = React.useRef();\n\n const [matches, setMatches] = useState([])\n const [match, setMatch] = useState(null)\n const [selectedSeries, setSelectedSeries] = useState(null)\n const [series, setSeries] = useState([\n { series_id: 2327462412, name: 'South Africa A tour of Sri Lanka 2023' },\n { series_id: 2222524112, name: 'Vitality Blast 2023' }\n ])\n const [params, setParams] = useState({\n batter: null,\n bowler: null,\n winteam: null,\n name: null,\n email: null,\n postalcode: null,\n phone: null,\n capcha: null\n })\n const [validparams, setValidParams] = useState(initvalidParams)\n\n useEffect(() => {\n fetchData()\n }, [])\n\n useEffect(() => {\n if(selectedSeries){\n fetchData(selectedSeries.series_id)\n }\n\n }, [selectedSeries])\n\n async function fetchData (series_id) {\n const res = await httpClient.get(\n `/api/schedule/series-matches/${series_id}`\n )\n setMatches(res.data)\n }\n\n async function handleSubmit () {\n\n const recaptchaValue = recaptchaRef.current.getValue();\n\n if(!recaptchaValue) {\n alert('Please stick to robot verify')\n return;\n }\n\n var is_valid = true\n const validate = { ...initvalidParams }\n if (!params.batter) {\n is_valid = false\n validate.batter = false\n }\n if (!params.bowler) {\n is_valid = false\n validate.bowler = false\n }\n if (!params.winteam) {\n is_valid = false\n validate.winteam = false\n }\n if (!params.name) {\n is_valid = false\n validate.name = false\n }\n if (!params.email) {\n is_valid = false\n validate.email = false\n } else {\n if (!validateEmail(params.email)) {\n is_valid = false\n validate.email = false\n }\n }\n\n if (!params.phone) {\n is_valid = false\n validate.phone = false\n }\n setValidParams(validate)\n if (!is_valid) {\n recaptchaRef.current.reset()\n return\n }\n params.recaptcha_value = recaptchaValue\n // https://forecast.tvconal.com/api/preds/titan-prediction-form/2327462412\n try{\n const res = await httpClient.post(`/api/preds/titan-prediction-form/${selectedSeries.series_id}`, params)\n alert(\"Your guesstimate sent to Titan successfully\")\n }catch{\n alert(\"Server Error\")\n }\n\n\n recaptchaRef.current.reset()\n }\n return (\n \n {`Guess the bowler in ${series_name} 2023`}\n
\n \n Player with performance close to\n
\n \n 
\n
\n \n
\n \n {bowlingData.map(p => {\n return
\n \n {disPlayerPlayer(p)}\n
\n })}\n {p.bowling_impact_index}
\n \n {/*
\n \n )\n}\n","import React from \"react\";\nimport \"../../assets/styles/articles.css\";\nconst TextWithLineBreaks = ({ text }) => {\n const textWithBreaks = text.split('\\n').map((line, index) => (\n \n Predictions by SuperFans\n
*/}\n\n {/*\n
*/}\n\n \n
\n \n Now you can ask about live prediction from Alexa device and ap.\n Simply say \"Alex ask Cricket Predictor who will win today?\"\n
\n\n
\n )}\n \n If you are a super fan, give us your best guess to stand a\n chance to win a surprise prize from the Titans\n
\n Select the tournaments to predict
\n\n {series.map(s => {\n return (\n\n setSelectedSeries(s)}\n class='btn btn-link link-opacity-50'\n >\n {s.name}\n \n
\n )\n })}\n\n {selectedSeries && (\n \n
\n \n
\n \n \n \n \n {matches.map(m => {\n return (\n
\n
\n \n {selectedSeries.name}\n
\n | \n \n \n \n \n | \n \n {moment(m.start_date).format(\n 'dddd, MMMM Do YYYY, h:mm a'\n )}\n | \n{m.status_text} | \n
\n \n {\n handleSubmit()\n }}\n >\n Submit\n \n
\n Guesstimate form for {selectedSeries.name}
\n\n \n \n setParams({ ...params, batter: e.target.value })\n }\n value={params.batter}\n class={\n validparams.batter\n ? 'form-control'\n : 'form-control invalid-input'\n }\n />\n {!validparams.batter && (\n
\n Please provide a valid batter
\n )}\n \n \n \n setParams({ ...params, bowler: e.target.value })\n }\n value={params.bowler}\n />\n {!validparams.bowler && (\n
\n Please provide a valid bowler
\n )}\n \n \n \n setParams({ ...params, winteam: e.target.value })\n }\n value={params.winteam}\n class={\n validparams.winteam\n ? 'form-control'\n : 'form-control invalid-input'\n }\n />\n {!validparams.winteam && (\n
\n Please provide win team
\n )}\n \n \n \n setParams({ ...params, name: e.target.value })\n }\n value={params.name}\n class={\n validparams.name\n ? 'form-control'\n : 'form-control invalid-input'\n }\n />\n {!validparams.name && (\n
\n Please provide your name
\n )}\n \n \n \n setParams({ ...params, email: e.target.value })\n }\n value={params.email}\n class={\n validparams.email\n ? 'form-control'\n : 'form-control invalid-input'\n }\n />\n {!validparams.email && (\n
\n\n\n Please provide your valid email
\n )}\n \n \n \n setParams({ ...params, phone: e.target.value })\n }\n value={params.phone}\n class={\n validparams.phone\n ? 'form-control'\n : 'form-control invalid-input'\n }\n />\n {!validparams.phone && (\n
\n Please provide your phone
\n )}\n \n
{textWithBreaks}
;\n};\n\nexport default TextWithLineBreaks;","import { useEffect, useState } from \"react\"\nimport React from \"react\"\nimport httpClient from \"../../api/httpClient\"\nimport TextWithLineBreaks from '../../components/articles/TextBreakLine'\nimport { forEach } from \"underscore\"\n\n\nexport default function ArticleContent({ url }) {\n const [articles, setArticles] = useState([])\n useEffect(() => {\n if (typeof url == 'string') {\n getContent(url)\n } else if (Array.isArray(url)) {\n getListContent(url)\n }\n\n }, [])\n\n async function getListContent(urls) {\n let contents = []\n for(var i = 0; i < urls.length; i++) {\n const res = await httpClient.get(urls[i])\n contents.push(res.data)\n }\n setArticles(contents)\n }\n async function getContent(url) {\n const res = await httpClient.get(url)\n setArticles([res.data])\n }\n return \n {articles.length > 0 && articles.map(article => {\n return (\n
\n}","import React, { useEffect, useState } from \"react\";\nimport Menu from \"../Menu\";\nimport httpClient from \"../../api/httpClient\";\nimport \"../../assets/styles/articles.css\";\nimport Datetime from 'react-datetime';\nimport 'react-datetime/css/react-datetime.css';\nimport { data } from \"jquery\";\nimport moment from \"moment\";\nimport ArticleContent from '../../components/articles/ArticleContent'\nfunction formatDate(date) {\n const year = date.getFullYear();\n const month = String(date.getMonth() + 1).padStart(2, '0'); // Months are zero-based\n const day = String(date.getDate()).padStart(2, '0');\n \n return `${year}-${month}-${day}`;\n }\n\nexport default function Articles() {\n const [listseries, setListSeries] = useState([]);\n const [matches, setMatches] = useState([]);\n const [selectedMatch, SetSelectedMatch] = useState(null);\n const [startDate, selectStartDate] = useState(new Date());\n const [endDate, selectEndDate] = useState(new Date());\n\n // Handler function to update selected date\n const handleDateChange = async (date) => {\n selectStartDate(date.toDate());\n };\n useEffect(() => {\n fetchData()\n }, [startDate, endDate])\n async function fetchData() {\n const res = await httpClient.get(`/api/preds/cricketworld/matches?date_range=${formatDate(startDate)}_${formatDate(endDate)}`)\n let series = res.data;\n series = series.filter(s => s.matches.length > 0)\n setListSeries(series)\n }\n\n async function handleSelectMatch(match) {\n SetSelectedMatch(match)\n }\n\n return \n
\n
\n )\n })}\n \n
\n )}\n {article.meta_description && (\n Meta Title
\n {article.meta_title}\n\n \n
*/}\n
\n )}\n Meta Description
\n {article.meta_description}\n {/* */}\n
\n
\n \n
\n}","import React from \"react\";\nimport { BrowserRouter, Route, Switch } from \"react-router-dom\";\nimport MatchInfo from \"../schedule/MatchInfo\";\nimport MatchStats from \"./MatchStats\";\nimport WagonWheel from \"./wagon-wheel\";\nimport PreMatches from \"./PreMatch\";\nimport PitchMap from \"../PitchMap\";\nimport TitanChart from \"./TitansChart\";\nimport OTTPredictionRuns from \"../ott/OTTPredictionRuns\";\nimport OTTWinLoss from \"../ott/OTTWinloss\";\nimport OTTTopScore from \"../ott/OTTTopScore\";\nimport TitansPredictionRuns from \"../titans/TitanPredictionRuns\";\n// Winlossprob\nimport Winlossprob from \"../../widgets/components/winlossprob\";\nimport OTTDashboard from \"../ott/OTTDashboard\";\nimport HightestScore from \"../titans/HighestScore\";\nimport SuperFan from \"../titans/SuperFan\";\nimport BowlerDismissChange from \"../titans/BowlerDismissChange\";\nimport BatsmanIndex from \"../titans/BatsmanIndex\";\nimport BowlerIndex from \"../titans/BowlerIndex\";\nimport AllWidget from \"./AllWidget\";\nimport GuesIPLBatsman from \"../cricketworld/GuesIPLBasman\";\nimport GuessIPLBowler from \"../cricketworld/GuessIPLBowler\";\nimport GuessBastman from \"../cricketworld/GuessBatsman\";\nimport GuessBowler from \"../cricketworld/GuessBowler\";\nimport SuperFans from \"../titans/SuperFans\";\nimport MatchSummary from \"./Summary\";\nimport Articles from \"../articles/Articles\";\n\nexport default [\n \n
\n \n
\n \n {\n selectEndDate(date.toDate())\n // SetSelectedMatch(null)\n // setMatches([])\n // await fetchData()\n }}\n input={true}\n timeFormat={false}\n dateFormat=\"YYYY-MM-DD\"\n inputProps={{ placeholder: 'End Date' }}\n />\n {/* */}\n
\n {listseries.map(series => {\n return To
\n\n {\n setMatches(series.matches)\n SetSelectedMatch(null)\n }}>{series.series_name}\n
\n })}\n {series.start_date}
\n \n {matches.map(m => {\n return (\n
\n\n \n
\n )\n })}\n {selectedMatch && (\n {\n handleSelectMatch(m)\n }} >\n \n {m.team1_name} vs {m.team2_name} \n
\n\n\n \n
\n \n ({m.format})
\n {/*{new Date(m.start_date).toLocaleDateString()}
*/}\n{moment(m.start_date).format(\"YYYY-MM-DD HH:mm\")}
\n {/* dateTime1 = ; */}\n\n\n
\n\n {Object.keys(selectedMatch.article_api).map(api => {\n return
\n )}\n {selectedMatch.entity_id} {selectedMatch.team1_name} vs {selectedMatch.team2_name} - {new Date(selectedMatch.start_date).toLocaleString()}
\n \n\n {Object.keys(selectedMatch.article_api).map(api => {\n return
\n \n
\n })}\n {api.replaceAll('-', ' ')}
\n \n \n
\n\n\n\n )\n}\n","import React, { useState, useEffect } from 'react';\nimport { getMatch } from '../../api/match.api';\nimport { useParams } from 'react-router-dom';\n\nimport httpClient from '../../api/httpClient';\nimport Menu from '../Menu';\nimport logo from '../../assets/imgs/tvconal_logo.png'; // with import\nimport MenuBar from '../v2/Menubar';\nimport MatchDetails from '../MatchDetail';\nimport Warmgraph from \"../../widgets/components/warmgraph\";\nimport Runrategraph from \"../../widgets/components/runrategraph\";\nimport Matchtracker from \"../../widgets/components/matchtracker\";\nimport Playerrundistribution from \"../../widgets/components/playerrundistribution\";\nimport Runscontribution from \"../../widgets/components/runscontribution\";\nimport Manhattangraph from \"../../widgets/components/manhattangraph\";\nimport Partnershipmatch from \"../../widgets/components/partnershipmatch\";\n\nimport WagonWheel from './wagon-wheel';\nimport Teamheadtohead_batting from \"../../widgets/components/teamheadtohead_batting\";\nimport Teamheadtohead_bowling from \"../../widgets/components/teamheadtohead_bowling\";\n// import Teamheadtohead_batting from \"./widgets/components/teamheadtohead_batting\";\n// import Teamheadtohead_bowling from \"./widgets/components/teamheadtohead_bowling\";\n\nimport InningsHeadToHead_DotBalls from \"../../widgets/components/inningsHeadToHead_DotBalls\";\nimport InningsHeadToHead_Boundaries from \"../../widgets/components/inningsHeadToHead_Boundaries\";\nimport LineupsHeadToHeadSummary from \"../../widgets/components/lineupsHeadToHeadSummary\";\nimport Lineupsheadtohead from \"../../widgets/components/lineupsheadtohead\";\n\nimport Teamheadtohead_batting_all from \"../../widgets/components/teamheadtohead_batting_all\";\nimport Teamheadtohead_bowling_all from \"../../widgets/components/teamheadtohead_bowling_all\";\n\nimport InningsHeadToHead_Wickets from \"../../widgets/components/inningsHeadToHead_Wickets\";\nimport Topmatchcontribution from \"../../widgets/components/topmatchcontribution\";\n// import Teambestworstresult from \"../../widgets/components/teambestworstresult\";\nimport InningsHeadToHead_EconRate from \"../../widgets/components/inningsHeadToHead_EconRate\";\nimport InningsHeadToHead_RunRate from \"../../widgets/components/inningsHeadToHead_RunRate\";\n// import InningsHeadToHead_Wickets from \"../../widgets/components/inningsHeadToHead_Wickets\";\n\nexport default function MatchStats() {\n const [match, setMatch] = useState({});\n const [venueMatchId, setVenueMatchId] = useState(null);\n let { match_id } = useParams();\n\n useEffect(() => {\n\n fetchMatch(match_id);\n }, []);\n\n async function fetchMatch(matchId) {\n const encoded_match_id = (await httpClient.get(`/api/preds/encode/${matchId}`)).data;\n setVenueMatchId(encoded_match_id);\n const res = await getMatch(matchId);\n setMatch({ ...res.data });\n\n }\n return (\n \n\n
\n \n
\n \n \n
\n \n\n
\n \n
\n \n
\n Win Loss Plot
\n\n \n
\n\n Team Score Plot
\n \n
\n \n \n
\n \n
\n Player Runs
\n \n
\n\n Player Balls
\n \n
\n \n
\n\n Next Wicket
\n \n
\n Batsman/Bowler Index
\n \n
\n \n
\n Batter Evaluation
\n \n
\n\n Bowler Evaluation
\n \n
\n\n\n Wicket Taker Probability
\n \n \n\n
\n\n\n\n )\n}\n","\nimport React, { useState, useEffect } from \"react\";\nimport { useParams } from \"react-router-dom\";\nimport httpClient from \"../../api/httpClient\";\nimport { getMatch } from \"../../api/match.api\";\nimport MatchDetails from \"../MatchDetail\";\nimport Winlossprob from \"../../widgets/components/winlossprob\";\nimport PrematchRuns from \"./PrematchRuns\";\nimport PrematchMostRuns from \"./PrematchMostrun\";\nimport PrematchMostWicket from \"./PreMostWicket\";\nimport Menu from \"../Menu\";\nimport MenuBar from \"./Menubar\";\n\nexport default function PreMatches() {\n const [match, setMatch] = useState({});\n const [fakeMatch, setFakeMatch] = useState(null);\n let { match_id } = useParams();\n\n useEffect(() => {\n fetchMatch(match_id);\n }, []);\n\n async function fetchMatch(matchId) {\n await httpClient.get(`/api/predictions/prematch/fake-match/${matchId}`);\n const fakeMatch = (await httpClient.get(`/api/fake-match/${matchId}`)).data;\n setFakeMatch(fakeMatch);\n const res = await getMatch(matchId);\n setMatch({ ...res.data });\n\n }\n return (\n \n
\n \n
\n\n \n\n \n
\n \n
\n \n
\n\n \n\n \n
\n Warm Graph
\n \n \n
\n Run Rate Graph
\n \n
\n\n \n\n \n \n
\n Run Distribution
\n \n
\n Runs Contribution
\n \n
\n\n \n\n \n
\n Best Partnership Match
\n \n \n
\n Manhattan Graph
\n \n
\n\n \n\n \n \n
\n Team Head To Head Batting
\n \n
\n Team Head To Head Bowling
\n \n
\n\n \n\n \n \n
\n Innings Head To Head Boundaries
\n \n \n
\n Innings Head To Head Dot Balls
\n \n
\n\n \n\n \n
\n Lineup Head To Head
\n \n
\n Lineup Head To Head Summary
\n \n
\n\n \n\n \n \n
\n Team Head To Head Batting All
\n \n
\n Team Head To Head Bowling All
\n \n
\n\n \n\n \n
\n Top Match Stats
\n \n
\n Innings Head To Head Wickets
\n \n
\n\n \n
\n Innings Head To Head Run Rate
\n \n
\n Innings Head To Head Economy Rate
\n \n
\n \n \n
\n );\n}","import React, { useEffect, useState } from 'react'\nimport { useParams } from 'react-router-dom'\n\nimport TitansPredictionRuns from '../titans/TitanPredictionRuns'\nimport Winlossprob from '../../widgets/components/winlossprob'\nimport BowlerDismissChange from '../titans/BowlerDismissChange'\nimport HightestScore from '../titans/HighestScore'\nimport { BarChart } from 'recharts'\nimport OTTDashboard from '../ott/OTTDashboard'\nimport BatsmanIndex from '../titans/BatsmanIndex'\nimport GuessBastman from '../cricketworld/GuessBatsman'\nimport GuessBowler from '../cricketworld/GuessBowler'\nimport BowlerIndex from '../titans/BowlerIndex'\nimport MatchSummary from './Summary'\n\nimport httpClient from '../../api/httpClient'\n\nexport default function TitanChart() {\n const { match_id } = useParams()\n const [isshow, setShow] = useState(false)\n useEffect(() => {\n fetchBall(match_id)\n }, [])\n async function fetchBall(match_id) {\n const res = await httpClient.get(`/api/balls/?match_id=${match_id}`)\n setShow(res.data.count > 0)\n }\n return (\n \n\n
\n\n\n \n
\n \n {fakeMatch != null && (\n \n
\n \n {fakeMatch != null && (\n
\n \n\n
\n )}\n {fakeMatch != null && (\n \n\n
\n \n\n
\n \n\n
\n )}\n\n\n \n\n
\n \n
\n \n
\n )\n}\n","import React, {useState, useEffect} from \"react\";\nimport { useParams } from \"react-router-dom\";\nimport OTTPredictionRuns from \"./OTTPredictionRuns\";\nimport OTTWinLoss from \"./OTTWinloss\";\nimport Winlossprob from \"../../widgets/components/winlossprob\";\nimport HightestScore from \"../titans/HighestScore\";\nimport OTTTopScore from \"./OTTTopScore\";\nimport BowlerDismissChange from '../titans/BowlerDismissChange'\nimport '../../assets/styles/ott.css'\n\nexport default function OTTDashboard() {\n const {match_id} = useParams()\n const [currentComponent, setCurrentComponent] = useState(null);\n const components = [\n\n \n
\n \n {isshow && (\n
\n {isshow && (\n \n {' '}\n {/* PREDICTION SCORE: */}\n \n
\n )}\n\n \n \n {' '}\n WIN PREDICTION:\n \n
\n \n \n {' '}\n RUN SCORES PREDICTION:\n \n
)}\n\n {isshow && (\n \n {' '}\n Wicket Predictions:\n \n
)}\n\n\n \n
\n \n \n {' '}\n {/* PREDICTION SCORE: */}\n \n
\n \n \n {' '}\n \n
\n\n \n {currentComponent && currentComponent}\n
\n}","import React, {useState, useEffect} from 'react'\nimport batsman_index from '../../assets/imgs/batsman_index.png'\nimport { useParams } from 'react-router-dom'\nimport httpClient from '../../api/httpClient'\n// '../../assets/imgs/batsman_index.png'\n// import {AiFillEye} from 'react-icons/fa';\nimport {FaEye, FaEyeSlash} from 'react-icons/fa';\nimport { Button } from 'bootstrap';\n\nexport default function BatsmanIndex () {\n const {match_id} = useParams()\n const [battingData, setBattingData] = useState([])\n const [show, setShowed] = useState(false)\n useEffect(() => {\n fetchData(match_id)\n\n const intervalId = setInterval(() => {\n fetchData(match_id)\n }, 30000)\n return () => clearInterval(intervalId);\n\n\n }, [])\n async function fetchData(match_id) {\n\n const res = await httpClient.get(`/api/preds/sa-power-index/${match_id}`)\n\n setBattingData(res.data.batting)\n\n }\n function disPlayerPlayer(p) {\n if(p?.find == true) {\n return (\n \n
\n )\n }\n return {p.player_name}
\n \n {p.player_name}
\n }\n\n return (\n \n
\n )\n}\n","import React, {useState, useEffect} from 'react'\nimport bowler_index from '../../assets/imgs/bowler_index.png'\nimport { useParams } from 'react-router-dom'\nimport httpClient from '../../api/httpClient'\n// '../../assets/imgs/batsman_index.png'\n// import {AiFillEye} from 'react-icons/fa';\n\nimport {FaEye, FaEyeSlash} from 'react-icons/fa';\nexport default function BowlerIndex () {\n const {match_id} = useParams()\n const [bowlingData, setBowlingData] = useState([])\n const [show, setShowed] = useState(false)\n useEffect(() => {\n fetchData(match_id)\n\n const intervalId = setInterval(() => {\n fetchData(match_id)\n }, 30000)\n return () => clearInterval(intervalId);\n\n\n }, [])\n async function fetchData(match_id) {\n\n const res = await httpClient.get(`/api/preds/sa-power-index/${match_id}`)\n setBowlingData(res.data.bowling)\n\n }\n function disPlayerPlayer(p) {\n if(p?.find == true) {\n return (\n \n Guess the BATSMAN IN IPL 2023\n
\n \n Titans player with performance close to\n
\n \n \n
\n \n
\n \n {battingData.map(p => {\n return
\n \n {disPlayerPlayer(p)}\n
\n })}\n {p.batting_impact_index}
\n \n
\n )\n }\n return {p.player_name}
\n \n {p.player_name}
\n }\n return (\n \n
\n )\n}\n","import React, {useState, useEffect} from 'react'\nimport batsman_index from '../../assets/imgs/batsman_index.png'\nimport { useParams } from 'react-router-dom'\nimport httpClient from '../../api/httpClient'\n\nimport {FaEye, FaEyeSlash} from 'react-icons/fa';\nimport { Button } from 'bootstrap';\n\nexport default function GuesIPLBatsman () {\n const {match_id} = useParams()\n const [battingData, setBattingData] = useState([])\n const [show, setShowed] = useState(false)\n useEffect(() => {\n fetchData(match_id)\n\n const intervalId = setInterval(() => {\n fetchData(match_id)\n }, 30000)\n return () => clearInterval(intervalId);\n\n\n }, [])\n async function fetchData(match_id) {\n\n const res = await httpClient.get(`/api/preds/guess-ipl-player/${match_id}`)\n setBattingData(res.data.batting)\n\n }\n function disPlayerPlayer(p) {\n if(p?.find == true) {\n return (\n \n Guess the bowler in IPL 2023\n
\n \n Titans player with performance close to\n
\n \n \n
\n \n
\n \n {bowlingData.map(p => {\n return
\n \n {disPlayerPlayer(p)}\n
\n })}\n {p.bowling_impact_index}
\n \n
\n )\n }\n return {p.player_name}
\n \n {p.player_name}
\n }\n\n return (\n \n
\n )\n}\n","import React, {useState, useEffect} from 'react'\nimport bowler_index from '../../assets/imgs/bowler_index.png'\nimport { useParams } from 'react-router-dom'\nimport httpClient from '../../api/httpClient'\n// '../../assets/imgs/batsman_index.png'\n// import {AiFillEye} from 'react-icons/fa';\n\nimport {FaEye, FaEyeSlash} from 'react-icons/fa';\nexport default function GuessIPLBowler () {\n const {match_id} = useParams()\n const [bowlingData, setBowlingData] = useState([])\n const [show, setShowed] = useState(false)\n useEffect(() => {\n fetchData(match_id)\n\n const intervalId = setInterval(() => {\n fetchData(match_id)\n }, 30000)\n return () => clearInterval(intervalId);\n\n\n }, [])\n async function fetchData(match_id) {\n\n const res = await httpClient.get(`/api/preds/guess-the-player/${match_id}`)\n setBowlingData(res.data.bowling)\n\n }\n function disPlayerPlayer(p) {\n if(p?.find == true) {\n return (\n \n Guess the BATSMAN IN IPL 2023\n
\n \n Player with performance close to\n
\n \n \n
\n \n
\n \n {battingData.map(p => {\n return
\n \n {disPlayerPlayer(p)}\n
\n })}\n {p.batting_impact_index}
\n \n
\n )\n }\n return {p.player_name}
\n \n {p.player_name}
\n }\n return (\n \n
\n )\n}\n","import React, { useEffect, useState } from 'react'\nimport { useParams } from 'react-router-dom'\n\nimport TitansPredictionRuns from '../titans/TitanPredictionRuns'\nimport Winlossprob from '../../widgets/components/winlossprob'\nimport BowlerDismissChange from '../titans/BowlerDismissChange'\nimport HightestScore from '../titans/HighestScore'\nimport { BarChart } from 'recharts'\nimport OTTDashboard from '../ott/OTTDashboard'\n// import BatsmanIndex from '../titans/BatsmanIndex'\n// import Gues\n// import GuessIPLBowler from '../cricketworld/GuessIPLBowler'\n// import GuesIPLBatsman from '../cricketworld/GuesIPLBasman'\n// import GuessBastman from '../cricketworld/GuessBatsman'\nimport GuessBowler from '../cricketworld/GuessBowler'\n\n\nimport BowlerIndex from '../titans/BowlerIndex'\nimport GoldIndex from '../../widgets/components/gold_index'\nimport OTTTopScore from '../ott/OTTTopScore'\nimport httpClient from '../../api/httpClient'\nimport GuessBastman from '../cricketworld/GuessBatsman'\n\nfunction Iframe ({ src }) {\n return (\n \n Guess the bowler in IPL 2023\n
\n \n Player with performance close to\n
\n \n \n
\n \n
\n \n {bowlingData.map(p => {\n return
\n \n {disPlayerPlayer(p)}\n
\n })}\n {p.bowling_impact_index}
\n \n
\n )\n}\n\nexport default function AllWidget () {\n const { match_id } = useParams()\n\n const scoreIframe = (\n \n )\n\n useEffect(() => {\n // fetchBall(match_id)\n }, [])\n\n // async function fetchBall (match_id) {\n // const res = await httpClient.get(`/api/balls/?match_id=${match_id}`)\n\n // }\n return (\n \n \n
\n \n
\n {``}\n \n \n \n
\n
\n )\n}\n","import React, { useEffect, useState } from 'react'\nimport { useParams } from 'react-router-dom/cjs/react-router-dom.min'\nimport httpClient from '../../api/httpClient'\nimport { data } from 'jquery'\nimport moment from 'moment'\nexport default function SuperFan () {\n const [matches, setMatches] = useState([])\n const [match, setMatch] = useState(null)\n const [params, setParams] = useState({\n batter: null,\n bowler: null,\n winteam: null,\n name: null,\n email: null,\n postalcode: null,\n phone: null\n })\n let { match_id } = useParams()\n useEffect(() => {\n fetchData(match_id)\n }, [])\n async function fetchData (match_id) {\n const res = await httpClient.get('/api/schedule/series-matches/2327462412')\n setMatches(res.data)\n\n const ress = await httpClient.get(`/api/matches/${match_id}`)\n setMatch(ress.data)\n }\n\n function handleSubmit () {\n if (!params.batter) {\n alert('Please input your guess which batter have most runs')\n return\n }\n if (!params.bowler) {\n alert('Please input your guess which bowler have most wickets')\n return\n }\n if (!params.winteam) {\n alert('Please input your guess which team will Win')\n return\n }\n if (!params.name) {\n alert('Please input your name')\n return\n }\n if (!params.email) {\n alert('Please input your email address')\n return\n }\n if (!params.postalcode) {\n alert('Please input your Postal Address')\n return\n }\n\n if (!params.phone) {\n alert('Please input your phone')\n return\n }\n alert('Your prediction sent successfully to Titan')\n }\n return (\n | Sample | \nIframe Code | \n
|---|---|
| \n | \n \n {``}\n | \n
| \n | \n \n {``}\n | \n
| \n | \n \n {``}\n | \n
| \n | \n \n {``}\n | \n
| \n | \n \n {``}\n | \n
| \n | \n \n {``}\n | \n
| \n | \n \n {``}\n | \n
\n
\n \n )\n}\n","import React, { useState, useEffect } from 'react'\n\nimport httpClient from '../api/httpClient'\nimport \"../assets/styles/mithra.css\";\n\nexport default function Mithra () {\n const [mithraData, setMithraData] = useState({ query: '', response: [] })\n const [question, setQuestion] = useState('')\n useEffect(() => {\n fetchData('most runs by batsman')\n }, [])\n\n const fetchData = async (question) => {\n const res = await httpClient.get(`/mithra/ask-mithra/${encodeURIComponent(question)}`)\n const json = res.data;\n setMithraData(json);\n console.log(json)\n }\n return (\n \n Predictions by SuperFans\n
\n\n\n
\n\n {/* {match && \n
\n \n Now you can ask about live prediction from Alexa device and ap.\n Simply say \"Alex ask Cricket Predictor who will win today?, ...\n
\n{match.description}
} */}\n\n
\n \n
\n \n \n \n \n {matches.map(m => {\n return (\n
\n
\n \n South Africa A tour of Sri Lanka 2023, Vitality Blast 2023\n
\n\n | \n \n \n \n \n | \n \n {moment(m.start_date).format(\n 'dddd, MMMM Do YYYY, h:mm a'\n )}\n | \n{m.status_text} | \n
\n \n {\n handleSubmit()\n }}\n >\n Submit\n \n
\n \n If you are a super fan, give us your best guestimate to stand a\n chance to win a surprise prize from the Titans\n
\n\n \n \n setParams({ ...params, batter: e.target.value })\n }\n value={params.batter}\n class='form-control'\n />\n
\n \n Please provide a valid city.\n
\n\n \n \n \n setParams({ ...params, bowler: e.target.value })\n }\n value={params.bowler}\n />\n
\n \n \n \n setParams({ ...params, winteam: e.target.value })\n }\n value={params.winteam}\n class='form-control'\n />\n
\n \n \n setParams({ ...params, name: e.target.value })}\n value={params.name}\n class='form-control'\n />\n
\n \n \n \n setParams({ ...params, email: e.target.value })\n }\n value={params.email}\n class='form-control'\n />\n
\n \n \n \n setParams({ ...params, postalcode: e.target.value })\n }\n value={params.postalcode}\n class='form-control'\n />\n
\n\n \n \n \n setParams({ ...params, phone: e.target.value })\n }\n value={params.phone}\n class='form-control'\n />\n
\n \n \n {mithraData.response.length > 0 && \n (\n
\n
\n )\n \n}\n","import React, { useState, useEffect } from 'react'\n\nimport ReactDOM from 'react-dom'\nimport './index.css'\n\nimport App from './App'\nimport Home from './Home'\nimport Matches from './Matches'\n\nimport VideoEventMapping from './validate/VideoEventMapping'\nimport NationalT20Series from './validate/national_t20'\n\nimport MCAMatches from './coach/MCAMatches'\nimport CoachMatch from './coach/CoachMatch'\nimport CoachMatchTeams from './coach/CoachMatchTeams'\nimport BowlerStats from './coach/BowlerStats'\nimport BatterStats from './coach/BatterStats'\n\n// import Outliers from './Outliers';\nimport Outliers from './Outliers'\nimport Evaluate from './evaluate'\n\nimport IndividualMatchPrediction from './IndividualMatchPrediction'\nimport IndividualMatch from './IndividualMatch'\nimport BallsInfo from './BallsInfo'\nimport Leagues from './Leagues'\nimport IndividualLeague from './IndividualLeague'\nimport Players from './Players'\nimport IndividualPlayer from './IndividualPlayer'\nimport Teams from './Teams'\nimport IndividualTeam from './IndividualTeam'\nimport IndividualTeamPlayers from './IndividualTeamPlayers'\nimport IndividualTeamMatch from './IndividualTeamMatch'\nimport IndividualTeamMatchPlayers from './IndividualTeamMatchPlayers'\n\nimport CrawlerTracking from './CrawlerTracking'\nimport CrawlerTrackingSummary from './CrawlerTrackingSummary'\nimport LineupShuffing from './components/LineupShuffling'\nimport CrawlMatchPrediction from './CrawlMatchPrediction'\nimport MatchStatus from './MatchStatus'\n\n// --------------------------widgets------------------------------//\nimport Playerruns from './widgets/components/playerruns'\nimport WicketPreds from './widgets/components/wicket_preds'\n\nimport ActualExpectedPredictedRuns from './widgets/components/actual_expected_predicted_runs'\nimport ActualExpectedPredictedBalls from './widgets/components/actual_expected_predicted_balls'\n\nimport Playerballs from './widgets/components/playerballs'\nimport InningsHeadToHead_DotBalls from './widgets/components/inningsHeadToHead_DotBalls'\nimport InningsHeadToHead_Boundaries from './widgets/components/inningsHeadToHead_Boundaries'\nimport InningsHeadToHead_EconRate from './widgets/components/inningsHeadToHead_EconRate'\nimport InningsHeadToHead_RunRate from './widgets/components/inningsHeadToHead_RunRate'\nimport InningsHeadToHead_Wickets from './widgets/components/inningsHeadToHead_Wickets'\nimport Nextwicket from './widgets/components/nextwicket'\nimport LineupsHeadToHeadSummary from './widgets/components/lineupsHeadToHeadSummary'\nimport Lineupsheadtohead from './widgets/components/lineupsheadtohead'\n// import Home from './components/home';\nimport Teamscorepredplot from './widgets/components/teamscorepredplot'\nimport CrawlTeamscorepredplot from './widgets/components/crawl_teamscorepredplot'\nimport GoldIndex from './widgets/components/gold_index'\nimport WicketChange from './widgets/components/wicket_change'\nimport PredictionWidgets from './components/prediction_widget'\nimport TestMatchWidget from './components/TestMatchWigets'\n// import BowerEvaluation from './widgets/components/bowler_evaluation';\n\nimport CrawlWinlossplot from './widgets/components/crawl_winlossplot'\nimport BatterEvaluation from './widgets/components/batter_evaluation'\nimport Winlossplot from './widgets/components/winlossplot'\nimport Winlossprob from './widgets/components/winlossprob'\nimport Matchtracker from './widgets/components/matchtracker'\nimport Teamwinloss from './widgets/components/teamwinloss'\nimport Teamheadtohead_batting from './widgets/components/teamheadtohead_batting'\nimport Teamheadtohead_bowling from './widgets/components/teamheadtohead_bowling'\nimport Teamheadtohead_batting_all from './widgets/components/teamheadtohead_batting_all'\nimport Teamheadtohead_bowling_all from './widgets/components/teamheadtohead_bowling_all'\nimport Rundistribution from './widgets/components/rundistribution'\nimport Partnershipleague from './widgets/components/partnershipleague'\nimport Partnershipmatch from './widgets/components/partnershipmatch'\nimport Playerbatting from './widgets/components/playerbatting'\nimport Playerbattingstats from './widgets/components/playerbattingstats'\nimport Playerbowling from './widgets/components/playerbowling'\nimport Playerbowlingstats from './widgets/components/playerbowlingstats'\nimport Playerteambatting from './widgets/components/playerteambatting'\nimport Playerteambowling from './widgets/components/playerteambowling'\nimport Teammilestonerun from './widgets/components/teammilestonerun'\nimport Leagueresults from './widgets/components/leagueresults'\nimport Topmatchcontribution from './widgets/components/topmatchcontribution'\nimport Teambestworstresult from './widgets/components/teambestworstresult'\nimport Wickettakers from './widgets/components/wickettakers'\nimport Manhattangraph from './widgets/components/manhattangraph'\nimport Warmgraph from './widgets/components/warmgraph'\nimport Runrategraph from './widgets/components/runrategraph'\nimport Teamhighscorers from './widgets/components/teamhighscorers'\nimport Teamtopwickettakers from './widgets/components/teamtopwickettakers'\nimport Playerrundistribution from './widgets/components/playerrundistribution'\nimport Runscontribution from './widgets/components/runscontribution'\nimport Teammatchessummary from './widgets/components/teammatchessummary'\nimport Teamhighestmarginwinloss from './widgets/components/teamhighestmarginwinloss'\nimport WinlossChart from './widgets/components/winloss_chart'\n// --------------------------------------------------------//\nimport * as serviceWorker from './serviceWorker'\nimport 'bootstrap/dist/css/bootstrap.min.css'\nimport { BrowserRouter, Route, Switch } from 'react-router-dom'\nimport Menu from './components/Menu'\nimport Login from './Login'\nimport BowlerEvaluation from './widgets/components/bowler_evaluation'\nimport TestWinlossChart from './widgets/components/test_match/test_winloss'\nimport TestGoldIndex from './widgets/components/test_match/test_gold_index'\nimport TestWicketChange from './widgets/components/test_match/test_wicket_change'\nimport TestBatterEvaluation from './widgets/components/test_match/test_batter_evaluation'\nimport TestBowlerEvaluation from './widgets/components/test_match/test_bowler_evaluation'\n\nimport ScheduleMatches from './ScheduleMatches'\nimport LiveMatches from './LiveMatches'\nimport ResultMatches from './ResultMatches'\nimport SchdeuleSeriesMatches from './SeriesMatches'\n// import MatchInfo from './components/schedule/MatchInfo';\nimport V2Route from './components/v2/Route'\nimport Mithra from './components/Mithra'\n// import Routes from './components/v2/Route';\nimport Articles from \"./components/articles/Articles\";\n\nconst rootElement = document.getElementById('root')\n\nfunction getToken () {\n return localStorage.getItem('access_token')\n}\n\nfunction LoginControl () {\n const [token, setToken] = useState(getToken())\n const [bybass, setbybass] = useState(false)\n const saveToken = token => {\n localStorage.setItem('access_token', token)\n setToken(token)\n }\n\n useEffect(() => {\n const bybass = bypassLogin()\n setbybass(bybass)\n }, [])\n\n function bypassLogin () {\n const url = window.location.href\n if (\n url.includes('all-widgets') ||\n url.includes('analytics-visualizations') ||\n url.includes('power-index') ||\n url.includes('wicket-change') ||\n url.includes('winloss-chart') ||\n url.includes('batter-evaluation') ||\n url.includes('bowler-evaluation') ||\n url.includes('match-visualization') ||\n url.includes('runrategraph') ||\n url.includes('winlossplot') ||\n url.includes('ott') ||\n url.includes('titan') ||\n url.includes('titan-dashboard') ||\n url.includes('topscore') ||\n url.includes('winloss-prob') ||\n url.includes('run-score-predictions') ||\n url.includes('wicket-prediction') ||\n url.includes('prediction-score') ||\n url.includes('sa-batsman-index') ||\n url.includes('sa-bowler-index') ||\n url.includes('guess-ipl') ||\n url.includes('guess')\n ) {\n return true\n }\n return false\n }\n\n let content = (\n \n
\n \n Question\n setQuestion(e.target.value)}\n value={question}\n >\n \n
\n \n
\n\n \n
\n\n\n \n Filtered Actions:\n {mithraData?.query_interpreter?.stat}\n
\n \n
\n \n Sort\n {mithraData?.query_interpreter?.sort}\n
\n | {key} | \n })}\n
|---|
| {d[key]} | \n })}\n
\n {/* {token == '416505d2-3d3f-4923-8bf4-b813daa70048' }\n {token != null || bybass ? content :
\n )\n}\n// {/*