worked on tables and scraper.

src/calendar/components/MatchForm.js

@@ -35,7 +35,7 @@ class MatchForm extends React.Component {
   }
 
   render () {
-    const { fileUpload, file } = this.props.state
+    const { fileUpload, file, allMatches } = this.props.state
 
     return (
       <div>
@@ -50,6 +50,10 @@ class MatchForm extends React.Component {
             disabled={(fileUpload === 'started')}
           />
         </form>
+        <div>{file
+          ? `${fileSize(file.size)} ${date2s(file.lastModified)} ${time2s(file.lastModified)} ${allMatches.length} Matches`
+          : 'Datei noch nicht geladen...'}
+        </div>
       </div>
     )
   }

src/calendar/components/MatchTable.js

@@ -4,7 +4,6 @@ import { date2s, time2s } from '../../helpers'
 class MatchRow extends React.Component {
   render () {
     const match = this.props.match
-    console.log(match)
     return (
       <tr>
         <td>{match.Ort}</td>

src/playerList/components/PlayerForm.js

@@ -8,7 +8,6 @@ function FieldGroup ({ id, label, help, file, ...props }) {
       <ControlLabel>{label}</ControlLabel>
       <FormControl {...props} />
       {help && <HelpBlock>{help}</HelpBlock>}
-      {file && <div>{fileSize(file.size)} {date2s(file.lastModified)} {time2s(file.lastModified)}</div>}
     </FormGroup>
   )
 }
@@ -35,7 +34,7 @@ class PlayerForm extends React.Component {
   }
 
   render () {
-    const { fileUpload, file } = this.props.state
+    const { fileUpload, file, allPlayers } = this.props.state
 
     return (
       <div>
@@ -50,6 +49,10 @@ class PlayerForm extends React.Component {
             disabled={(fileUpload === 'started')}
           />
         </form>
+        <div>{file
+          ? `${fileSize(file.size)} ${date2s(file.lastModified)} ${time2s(file.lastModified)} ${allPlayers.length} Spieler`
+          : 'Datei noch nicht geladen...'}
+        </div>
       </div>
     )
   }

src/playerList/functions.js

@@ -8,13 +8,13 @@ export function generatePlayerList (file) {
       console.log('got worksheets', worksheets)
       const worksheet = worksheets.Players
       if (worksheet[4].length !== 32 & worksheet[3][0] !== 'Konkurrenz' & worksheet[3][31] !== 'bezahlt') {
-        reject(Error('Wrong file structure.'))
+        reject(Error(`Wrong file structure. Length: ${worksheet[4].length} (expected 32), Column A name: ${worksheet[3][0]} (expected Konkurrenz)`))
       }
-      const players = worksheet.slice(4, worksheet.length).map((playerData) => new Player.Player(playerData))
-      console.log('State after generating player list:', players)
-      resolve(players)
+      const headers = worksheet.slice(3, 1)
+      const allPlayers = worksheet.slice(4, worksheet.length).map(playerData => new Player.Player(playerData))
+      resolve({ headers, allPlayers })
     }).catch(error => {
-      reject(Error(error))
+      reject(Error(`Error reading workbook ${error.toString()}`))
     })
   })
 }

src/playerList/state.js

@@ -16,10 +16,10 @@ export const actions = {
       file
     }
   },
-  fileUploadSuccess: allPlayers => {
+  fileUploadSuccess: data => {
     return {
       type: 'PLAYER_FILE_UPLOAD_SUCCESS',
-      allPlayers
+      data
     }
   },
   fileUploadFailure: error => {
@@ -38,6 +38,7 @@ console.log('State actions', actions)
 
 /** state definition */
 export const state = {
+  headers: [],
   allPlayers: [],
   filteredPlayers: [],
   filters: [
@@ -79,7 +80,7 @@ export function reducer (state = [], action) {
     case 'PLAYER_FILE_UPLOAD_START':
       return { ...state, fileUpload: 'started', file: action.file }
     case 'PLAYER_FILE_UPLOAD_SUCCESS':
-      return { ...state, fileUpload: 'finished', allPlayers: action.allPlayers }
+      return { ...state, fileUpload: 'finished', allPlayers: action.data.allPlayers, headers: action.data.headers }
     case 'PLAYER_FILE_UPLOAD_FAILURE':
       return { ...state, fileUpload: 'failure' }
     case 'PLAYER_FILTER_SORT':

src/scraper/components/ScraperInterface.js

@@ -0,0 +1,16 @@
+import React from 'react'
+
+class ScraperInterface extends React.Component {
+  render () {
+    const { state, actions } = this.props
+
+    return (
+      <div>
+        <button onClick={actions.startScraping}>Start</button>
+
+      </div>
+    )
+  }
+}
+
+export default ScraperInterface

src/scraper/components/index.js

@@ -0,0 +1,4 @@
+import ScraperInterface from './ScraperInterface'
+
+export { ScraperInterface }
+export default { ScraperInterface }

src/scraper/index.js

@@ -0,0 +1,8 @@
+import { actions, reducer, state, saga } from './state'
+import components from './components'
+
+const filters = {}
+
+const selectors = {}
+
+export default { actions, components, filters, selectors, reducer, state, saga }

src/scraper/state.js

@@ -0,0 +1,43 @@
+/** @module setting/state */
+
+/**
+ * state.js
+ *
+ * Collection of everything which has to do with state changes.
+ **/
+
+const SCRAPE_FILES = [
+  'https://comp.swisstennis.ch/advantage/servlet/MyTournamentList?Lang=D',
+  'https://comp.swisstennis.ch/advantage/servlet/ProtectedDisplayTournament?Lang=D&tournament=Id104840',
+  'https://comp.swisstennis.ch/advantage/servlet/Calendar?tournament=Id104840&lang=D',
+  'https://comp.swisstennis.ch/advantage/servlet/Calendar.xls?Lang=D&tournament=Id104840&Type=Match&Inp_DateRangeFilter.fromDate=05.07.2017&Inp_DateRangeFilter.toDate=16.07.2017',
+  'https://comp.swisstennis.ch/advantage/servlet/PlayerList?tournament=Id104840&lang=D',
+  'https://comp.swisstennis.ch/advantage/servlet/PlayerList.xls?tournament=Id104840&lang=D',
+  'https://comp.swisstennis.ch/advantage/servlet/DisplayEvent?eventId=425828&lang=D',
+  'https://comp.swisstennis.ch/advantage/servlet/ModifyDraw?eventId=425828&lang=D',
+  'https://comp.swisstennis.ch/advantage/servlet/DisplayDraw.xls?eventId=425828&lang=D'
+]
+
+const DRAW_STATE = /Matches bereit zum spielen/
+
+/** actionTypes define what actions are handeled by the reducer. */
+export const actions = {
+
+}
+console.log('State actions', actions)
+
+/** state definition */
+export const state = {
+}
+console.log('State state', state)
+
+/** reducer is called by the redux dispatcher and handles all component actions */
+export function reducer (state = [], action) {
+  switch (action.type) {
+    default:
+      return state
+  }
+}
+
+/** sagas are asynchronous workers (JS generators) to handle the state. */
+export function * saga () {}

src/tables/components/Table.js

@@ -0,0 +1,56 @@
+import React from 'react'
+import { Pagination, Popover, OverlayTrigger } from 'react-bootstrap'
+
+
+class TableHeader extends React.Component {
+  render () {
+    const { headers, data, actions } = this.props
+    const filters = {}
+    headers.forEach(header => {
+      
+    })
+    return (
+      <thead>
+        <tr>
+          {headers.map(header => 
+            <th>{header} <OverlayTrigger trigger='click' placement='bottom' overlay={}><span class='glyphicon glyphicon-filter'></span></OverlayTrigger></th>
+          )}
+        </tr>
+      </thead>
+    )
+  }
+}
+
+class Table extends React.Component {
+  changePagination (event) {
+    const { actions } = this.props
+    event.preventDefault()
+    actions.changePagination(event)
+  }
+
+  render () {
+    const { options, data, pagination } = this.props
+    if (!data.hasOwnProperty('headers')) {
+      data.headers = data.rows.map()
+    }
+    return (
+      <div>
+        <table class='table table-hover table-bordered table-condensed'>
+          <TableHeader headers={data.headers} />
+          <TableBody rows={data.rows} />
+        </table>
+        <Pagination
+          prev next
+          first last
+          ellipsis
+          items={pagination.items}
+          maxButtons={5}
+          activePage={pagination.activePage}
+          onSelect={this.changePagination}
+        />
+      </div>
+    )
+  }
+}
+
+export default Table

src/tables/index.js

@@ -0,0 +1,8 @@
+import { actions, reducer, state, saga } from './state'
+import components from './components'
+
+const filters = {}
+
+const selectors = {}
+
+export default { actions, components, filters, selectors, reducer, state, saga }

src/tables/state.js

@@ -0,0 +1,55 @@
+/** @module setting/state */
+
+/**
+ * state.js
+ *
+ * Collection of everything which has to do with state changes.
+ **/
+
+/** actionTypes define what actions are handeled by the reducer. */
+export const actions = {
+  changePaginationPage: page => {
+    return {
+      type: 'TABLE_CHANGE_PAGINATION_PAGE',
+      page
+    }
+  },
+  changePaginationItems: items => {
+    return {
+      type: 'TABLE_CHANGE_PAGINATION_ITEMS',
+      items
+    }
+  }
+}
+console.log('State actions', actions)
+
+/** state definition */
+export const state = {
+  filters: {},
+  sorting: {},
+  pagination: {
+    activePage: 0,
+    items: 50
+  }
+}
+console.log('State state', state)
+
+/** reducer is called by the redux dispatcher and handles all component actions */
+export function reducer (state = [], action) {
+  let pagination
+  switch (action.type) {
+    case 'TABLE_CHANGE_PAGINATION_PAGE':
+      pagination = { ...state.pagination }
+      pagination.activePage = action.page
+      return { ...state, pagination }
+    case 'TABLE_CHANGE_PAGINATION_ITEMS':
+      pagination = { ...state.pagination }
+      pagination.items = action.items
+      return { ...state, pagination }
+    default:
+      return state
+  }
+}
+
+/** sagas are asynchronous workers (JS generators) to handle the state. */
+export function * saga () {}