forked from code-dot-org/code-dot-org
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathbrowserNavigation.js
More file actions
75 lines (64 loc) · 2.68 KB
/
Copy pathbrowserNavigation.js
File metadata and controls
75 lines (64 loc) · 2.68 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
// browserNavigation
//
// This file contains some functionality related to navigating through
// levels without doing page reloads.
import {getStore} from '../redux';
import {setCurrentLevelId} from '@cdo/apps/code-studio/progressRedux';
// Returns whether we can safely navigate between the two given level apps
// without reloading the whole page. For now, this only works when moving
// from a "music" level to another "music" level.
export function canChangeLevelInPage(currentLevelApp, newLevelApp) {
return currentLevelApp === 'music' && newLevelApp === 'music';
}
// Called once on page load for a script-level only, this sets up a
// handler, for user-initiated browser back & forward button
// presses, which is fired when arriving on a page that we pushed onto the
// browser session history stack.
export function setupNavigationHandler(lessonData) {
window.addEventListener('popstate', function (event) {
// A path looks like this: /s/allthethings/lessons/46/levels/2
// The level number will be at index 6 of a string split on '/'.
const levelNumberStringIndex = 6;
const path = new URL(document.location).pathname;
if (!path) {
return;
}
const values = path.split('/', levelNumberStringIndex + 1);
if (values.length < levelNumberStringIndex + 1) {
return;
}
const levelNumber = Number(values[6]);
if (!Number.isInteger(levelNumber) || levelNumber <= 0) {
return;
}
const levelIndex = levelNumber - 1;
const levelId = lessonData.levels[levelIndex].activeId;
// Update the progress redux store.
getStore().dispatch(setCurrentLevelId(levelId));
});
}
// Handles a user navigation to a new level, by pushing this new level's URL
// onto the browser session history stack, and updating the window title.
export function updateBrowserForLevelNavigation(
progressStoreState,
levelUrl,
levelId
) {
window.history.pushState({}, '', levelUrl + window.location.search);
setWindowTitle(progressStoreState, levelId);
}
// If we are on a new level without doing a page reload, then we should set the title
// to match what levels_helper.rb's level_title function would have done.
export function setWindowTitle(progressStoreState, newLevelId) {
const numLessons = progressStoreState.lessons[0].num_script_lessons;
const lessonName = progressStoreState.lessons[0].name;
const lessonIndex =
progressStoreState.lessons[0].levels.findIndex(
level => level.activeId === newLevelId
) + 1;
const scriptDisplayName = progressStoreState.scriptDisplayName;
document.title =
numLessons > 1
? `${lessonName} #${lessonIndex} | ${scriptDisplayName} - Code.org`
: `${lessonName} #${lessonIndex} - Code.org`;
}