Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Fix/no steps#167

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to ourterms of service andprivacy statement. We’ll occasionally send you account related emails.

Already on GitHub?Sign in to your account

Merged
ShMcK merged 4 commits intomasterfromfix/no-steps
Mar 28, 2020
Merged
Show file tree
Hide file tree
Changes fromall commits
Commits
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletionsrc/channel/index.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -70,7 +70,6 @@ class Channel implements Channel {
this.send({type:'START_NEW_TUTORIAL'})
return
}
console.log('send LOAD_STORED_TUTORIAL')
// communicate to client the tutorial & stepProgress state
this.send({type:'LOAD_STORED_TUTORIAL',payload:{ tutorial, progress, position}})

Expand Down
25 changes: 16 additions & 9 deletionssrc/channel/state/Position.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -3,7 +3,7 @@ import * as G from 'typings/graphql'

const defaultValue: CR.Position = {
levelId: '',
stepId:'',
stepId:null,
}

// position
Expand DownExpand Up@@ -42,18 +42,25 @@ class Position {

// get step
const currentLevel: G.Level = levels[lastLevelIndex]
const { steps } = currentLevel
const lastStepIndex: number | undefined = steps.findIndex((s: G.Step) => !progress.steps[s.id])
if (lastStepIndex >= steps.length) {
throw new Error('Error setting progress step')
let currentStepId: string | null
if (!currentLevel.steps.length) {
// no steps available for level
currentStepId = null
} else {
// find current step id
const { steps } = currentLevel
const lastStepIndex: number | undefined = steps.findIndex((s: G.Step) => !progress.steps[s.id])
if (lastStepIndex >= steps.length) {
throw new Error('Error setting progress step')
}
// handle position when last step is complete but "continue" not yet selected
const adjustedLastStepIndex = lastStepIndex === -1 ? steps.length - 1 : lastStepIndex
currentStepId = steps[adjustedLastStepIndex].id
}
// handle position when last step is complete but "continue" not yet selected
const adjustedLastStepIndex = lastStepIndex === -1 ? steps.length - 1 : lastStepIndex
const currentStep: G.Step = steps[adjustedLastStepIndex]

this.value = {
levelId: currentLevel.id,
stepId:currentStep.id,
stepId:currentStepId,
}

return this.value
Expand Down
2 changes: 1 addition & 1 deletiontypings/index.d.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -19,7 +19,7 @@ export interface StepProgress {
// current tutorial position
exportinterfacePosition{
levelId:string
stepId:string
stepId:string|null
complete?:boolean
}

Expand Down
5 changes: 5 additions & 0 deletionsweb-app/src/components/Router/index.tsx
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -4,6 +4,7 @@ import { createMachine } from '../../services/state/machine'
import{useMachine}from'../../services/xstate-react'
importRoutefrom'./Route'
importonErrorfrom'../../services/sentry/onError'
import{LOG_STATE}from'../../environment'

interfaceOutput{
context:T.MachineContext
Expand All@@ -20,6 +21,10 @@ const editor = acquireVsCodeApi()
constuseRouter=():Output=>{
const[state,send]=useMachine<T.MachineContext,any>(createMachine({editorSend:editor.postMessage}))

if(LOG_STATE){
console.log(JSON.stringify(state.value))
}

// event bus listener
React.useEffect(()=>{
constlistener='message'
Expand Down
126 changes: 64 additions & 62 deletionsweb-app/src/containers/Tutorial/LevelPage/Level.tsx
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -12,12 +12,14 @@ const styles = {
page:{
backgroundColor:'white',
position:'relative'as'relative',
height:'auto',
width:'100%',
},
content:{
display:'flex'as'flex',
flexDirection:'column'as'column',
padding:0,
paddingBottom:'5rem',
height:'auto',
width:'100%',
},
header:{
height:'2rem',
Expand All@@ -26,13 +28,11 @@ const styles = {
lineHeight:'1rem',
padding:'10px 1rem',
},
content:{
text:{
padding:'0rem 1rem',
paddingBottom:'1rem',
},
tasks:{
paddingBottom:'5rem',
},
tasks:{},
steps:{
padding:'1rem 1rem',
},
Expand DownExpand Up@@ -85,8 +85,10 @@ interface Props {
}

constLevel=({ level, onContinue, onLoadSolution, processes, testStatus}:Props)=>{
if(!level.steps){
thrownewError('No Stage steps found')
//@ts-ignore
letcurrentStep=level.steps.findIndex(s=>s.status==='ACTIVE')
if(currentStep===-1){
currentStep=level.steps.length
}

constpageBottomRef=React.useRef(null)
Expand All@@ -95,70 +97,70 @@ const Level = ({ level, onContinue, onLoadSolution, processes, testStatus }: Pro
//@ts-ignore
pageBottomRef.current.scrollIntoView({behavior:'smooth'})
}
//@ts-ignore
letcurrentStep=level.steps.findIndex(s=>s.status==='ACTIVE')
if(currentStep===-1){
currentStep=level.steps.length
}
React.useEffect(scrollToBottom,[currentStep])

return(
<divcss={styles.page}>
<divcss={styles.header}>
<span>Learn</span>
</div>
<divcss={styles.content}>
<h2css={styles.title}>{level.title}</h2>
<Markdown>{level.content||''}</Markdown>
</div>

<divcss={styles.tasks}>
<divcss={styles.header}>Tasks</div>
<divcss={styles.steps}>
{level.steps.map((step:(G.Step&{status:T.ProgressStatus})|null,index:number)=>{
if(!step){
returnnull
}
return(
<Step
key={step.id}
order={index+1}
status={step.status}
content={step.content}
onLoadSolution={onLoadSolution}
/>
)
})}
<divcss={styles.header}>
<span>Learn</span>
</div>
<divcss={styles.text}>
<h2css={styles.title}>{level.title}</h2>
<Markdown>{level.content||''}</Markdown>
</div>

{level.steps.length ?(
<divcss={styles.tasks}>
<divcss={styles.header}>Tasks</div>
<divcss={styles.steps}>
{level.steps.map((step:(G.Step&{status:T.ProgressStatus})|null,index:number)=>{
if(!step){
returnnull
}
return(
<Step
key={step.id}
order={index+1}
status={step.status}
content={step.content}
onLoadSolution={onLoadSolution}
/>
)
})}
</div>
</div>
) :null}

<divref={pageBottomRef}/>
</div>

{(testStatus||processes.length>0)&&(
<divcss={styles.processes}>
<ProcessMessagesprocesses={processes}testStatus={testStatus}/>
</div>
)}
{(testStatus||processes.length>0)&&(
<divcss={styles.processes}>
<ProcessMessagesprocesses={processes}testStatus={testStatus}/>
</div>
)}

<divcss={styles.nux}>
<NuxTutorialonLoadSolution={onLoadSolution}/>
</div>
<divcss={styles.nux}>
<NuxTutorialonLoadSolution={onLoadSolution}/>
</div>

<divcss={styles.footer}>
<span>
{typeoflevel.index==='number' ?`${level.index+1}. ` :''}
{level.title}
</span>
<span>
{level.status==='COMPLETE' ?(
<Buttontype="primary"onClick={onContinue}>
Continue
</Button>
) :(
<spancss={styles.taskCount}>
{currentStep} of{level.steps.length} tasks
</span>
)}
</span>
<divcss={styles.footer}>
<span>
{typeoflevel.index==='number' ?`${level.index+1}. ` :''}
{level.title}
</span>
<span>
{level.status==='COMPLETE'||!level.steps.length ?(
<Buttontype="primary"onClick={onContinue}>
Continue
</Button>
) :(
<spancss={styles.taskCount}>
{currentStep} of{level.steps.length} tasks
</span>
)}
</span>
</div>
</div>
</div>
)
Expand Down
1 change: 1 addition & 0 deletionsweb-app/src/environment.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -12,3 +12,4 @@ export const DEBUG: boolean = (process.env.REACT_APP_DEBUG || '').toLowerCase()
exportconstVERSION:string=process.env.VERSION||'unknown'
exportconstNODE_ENV:string=process.env.NODE_ENV||'production'
exportconstAUTH_TOKEN:string|null=process.env.AUTH_TOKEN||null
exportconstLOG_STATE:boolean=(process.env.LOG_STATE||'').toLowerCase()==='true'
4 changes: 2 additions & 2 deletionsweb-app/src/services/selectors/position.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -5,14 +5,14 @@ import * as tutorial from './tutorial'

exportconstdefaultPosition=()=>({
levelId:'',
stepId:'',
stepId:null,
})

exportconstinitialPosition=createSelector(tutorial.currentVersion,(version:G.TutorialVersion)=>{
constlevel=version.data.levels[0]
constposition:CR.Position={
levelId:level.id,
stepId:level.steps[0].id,
stepId:level.steps.length ?level.steps[0].id :null,
}
returnposition
})
20 changes: 6 additions & 14 deletionsweb-app/src/services/selectors/tutorial.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -41,17 +41,9 @@ export const currentLevel = (context: MachineContext): G.Level =>
},
)(context)

exportconstcurrentStep=(context:MachineContext):G.Step=>
createSelector(
currentLevel,
(level:G.Level):G.Step=>{
conststeps:G.Step[]=level.steps
conststep:G.Step|undefined=steps.find((s:G.Step)=>s.id===context.position.stepId)
if(!step){
consterror=newError(`No Step found for Level${level.id}. Expected step${context.position.stepId}`)
onError(error)
throwerror
}
returnstep
},
)(context)
exportconstcurrentStep=(context:MachineContext):G.Step|null=>
createSelector(currentLevel,(level:G.Level):G.Step|null=>{
conststeps:G.Step[]=level.steps
conststep:G.Step|null=steps.find((s:G.Step)=>s.id===context.position.stepId)||null
returnstep
})(context)
Loading
[8]ページ先頭
©2009-2025 Movatter.jp