diff --git a/src/App.js b/src/App.js
index 4fe2c54..8d06aa5 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,12 +1,12 @@
import React, { Component } from 'react';
import { getQueryParamByName } from './utils.js';
-import ScoutOverviewCont from './containers/ScoutOverview.js';
+import ScoutOverviewCont from './containers/GetScoutData.js';
import ScoutOverview from './components/ScoutOverview.js';
class App extends Component {
render() {
const scoutID = getQueryParamByName("id", this.props.slug);
- var MainView = ScoutOverviewCont(ScoutOverview);
+ const MainView = ScoutOverviewCont(ScoutOverview);
return (
diff --git a/src/components/Achievement.js b/src/components/Achievement.js
new file mode 100644
index 0000000..7aa9e8a
--- /dev/null
+++ b/src/components/Achievement.js
@@ -0,0 +1,5 @@
+import React from 'react';
+
+export default({id, number, description, additionalText}) => {
+ return
{number}
;
+};
diff --git a/src/components/AchievementList.js b/src/components/AchievementList.js
new file mode 100644
index 0000000..b624cb1
--- /dev/null
+++ b/src/components/AchievementList.js
@@ -0,0 +1,22 @@
+import React from 'react'
+
+import Achievement from "./Achievement.js";
+
+export default ({achievements, id, completed}) => {
+ console.log("completed: ", completed);
+ if(!achievements) {
+ return
Loading...
+ }
+
+ const list = achievements.sort((a, b) => {
+ if (a.number === b.number)
+ return a.letter > b.letter;
+ return a.number > b.number;
+ }).map(achievement => (
+
+ ));
+
+ return
+ {list}
+
+}
diff --git a/src/components/Adventure.js b/src/components/Adventure.js
new file mode 100644
index 0000000..d2f6727
--- /dev/null
+++ b/src/components/Adventure.js
@@ -0,0 +1,15 @@
+import React from 'react'
+
+import GetAchievements from "../containers/GetAchievementsForAdventure.js";
+import AchievementList from "./AchievementList.js";
+
+export default ({id, name, number, isRequired, achievements,
+ completedAdventures, completedAchievements}) => {
+
+ const AchievementListComp = GetAchievements(AchievementList);
+ return
+}
+
diff --git a/src/components/AdventureList.js b/src/components/AdventureList.js
new file mode 100644
index 0000000..6bb626e
--- /dev/null
+++ b/src/components/AdventureList.js
@@ -0,0 +1,39 @@
+import React from "react"
+import { splitFilter } from '../utils.js';
+import Adventure from './Adventure.js';
+
+export default ({
+ allAdventures,
+ completedAdventures
+}) => {
+ if(!allAdventures) {
+ return
Loading...
+ }
+
+ const sortedAdventures = allAdventures.sort((a,b) => (a.number > b.number));
+
+ const [
+ requiredAdventures,
+ optionalAdventures
+ ] = splitFilter(sortedAdventures, a => a.required);
+
+ const requiredAdventureList = requiredAdventures.map(adventure => {
+ return
;
+ });
+
+ const optionalAdventureList = optionalAdventures.map(adventure => {
+ return
;
+ });
+
+ return
+
+ {requiredAdventureList}
+
+
+ {
+ //optionalAdventureList
+ }
+
+
;
+}
+
diff --git a/src/components/ScoutOverview.js b/src/components/ScoutOverview.js
index ffbefc8..d5dddc6 100644
--- a/src/components/ScoutOverview.js
+++ b/src/components/ScoutOverview.js
@@ -1,4 +1,6 @@
import React from "react";
+import AllAdventures from '../containers/GetAllAdventures.js'
+import AdventureList from './AdventureList.js';
export default ({
scoutID,
@@ -7,10 +9,14 @@ export default ({
completedAdventures,
completedAchievements
}) => {
+ const AdventureListComp = AllAdventures(AdventureList);
console.log(displayName)
return (
);
}
diff --git a/src/containers/GetAchievementsForAdventure.js b/src/containers/GetAchievementsForAdventure.js
new file mode 100644
index 0000000..f007ce6
--- /dev/null
+++ b/src/containers/GetAchievementsForAdventure.js
@@ -0,0 +1,35 @@
+import { gql, graphql } from 'react-apollo';
+import { stripEdges } from '../utils.js';
+
+export default graphql(gql`
+ query GetAchievementsForAdventure($adventureID:ID!){
+ getAdventure(id:$adventureID) {
+ achievements {
+ edges {
+ node {
+ id,
+ number,
+ letter,
+ description,
+ additionalText
+ }
+ }
+ }
+ }
+ }
+`,{
+ options: ({adventureID}) => {
+ return {
+ variables: {
+ adventureID
+ }
+ };
+ },
+ props: ({ownProps, data}) => {
+ return data.getAdventure ? {
+ achievements: stripEdges(data.getAdventure.achievements),
+ ...ownProps
+ } : {...ownProps}
+
+ }
+});
diff --git a/src/containers/GetAllAdventures.js b/src/containers/GetAllAdventures.js
new file mode 100644
index 0000000..ce93871
--- /dev/null
+++ b/src/containers/GetAllAdventures.js
@@ -0,0 +1,30 @@
+import { gql, graphql } from 'react-apollo';
+
+import { stripEdges } from '../utils.js';
+
+export default graphql(gql`
+ query GetAllAdventuresForRank{
+ viewer {
+ allAdventures {
+ edges {
+ node {
+ name,
+ number,
+ required,
+ id
+ }
+ }
+ }
+ }
+ }
+`,{
+ props: ({ownProps, data}) => (
+ data.viewer ? {
+ allAdventures: stripEdges(data.viewer.allAdventures),
+ ...ownProps
+ } : {...ownProps})
+});
+
+
+
+
diff --git a/src/containers/ScoutOverview.js b/src/containers/GetScoutData.js
similarity index 94%
rename from src/containers/ScoutOverview.js
rename to src/containers/GetScoutData.js
index 1d1325c..cf4d2ee 100644
--- a/src/containers/ScoutOverview.js
+++ b/src/containers/GetScoutData.js
@@ -1,4 +1,3 @@
-import React from "react";
import { gql, graphql } from 'react-apollo';
export default graphql(gql`
@@ -16,7 +15,8 @@ export default graphql(gql`
achievements {
edges {
node {
- name
+ number,
+ letter
}
}
}
diff --git a/src/index.js b/src/index.js
index 90f88fd..83b871c 100644
--- a/src/index.js
+++ b/src/index.js
@@ -2,7 +2,14 @@ import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
-import registerServiceWorker from './registerServiceWorker';
+//import registerServiceWorker from './registerServiceWorker';
+
+import injectTapEventPlugin from 'react-tap-event-plugin';
+
+// Needed for onTouchTap
+// http://stackoverflow.com/a/34015469/988941
+injectTapEventPlugin();
+
import {
ApolloClient,
createNetworkInterface,
diff --git a/src/utils.js b/src/utils.js
index ba969dd..b19c487 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -1,8 +1,22 @@
export function getQueryParamByName(name, url) {
- name = name.replace(/[\[\]]/g, "\\$&");
+ name = name.replace(/[[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^]*)|&|#|$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "));
}
+
+export function stripEdges({edges}) {
+ return edges.map(stripEdge);
+}
+export function stripEdge({node}) {
+ return node;
+}
+
+export function splitFilter(array, check) {
+ return array.reduce((result, item) => {
+ check(item) ? result[0].push(item) : result[1].push(item);
+ return result;
+ }, [[],[]]);
+}