Skip to content
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.

Sign up for GitHub

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

Already on GitHub? Sign in to your account

Jump to bottom

Revert bubble choice progress tab updates that weren't ready to go out #35180

Merged
merged 2 commits into from Jun 5, 2020
Merged

Revert bubble choice progress tab updates that weren't ready to go out #35180

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
774e6ea
undo bubble choice changes
Erin007 Jun 5, 2020
b1977fc
undo bubble choice changes, i18n file
Erin007 Jun 5, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
1 change: 0 additions & 1 deletion apps/i18n/common/en_us.json
View file
Open in desktop
Expand Up @@ -229,7 +229,6 @@
"changeUserTypeModal_save_teacher": "Update to teacher account",
"changeUserTypeModal_title": "Update account type",
"changeUserTypeModal_unexpectedError": "An unexpected error has occurred. Please wait a moment and try again.",
"choiceLevel": "Choice level",
"choose": "Choose",
"chooseActivity": "Choose from the following activities:",
"chooseColumn": "Choose a column from \"{table}\"",
Expand Down
29 changes: 7 additions & 22 deletions apps/src/code-studio/progressRedux.js
View file
Open in desktop
Expand Up @@ -520,13 +520,13 @@ const isCurrentLevel = (currentLevelId, level) => {
* state.levelProgress
*/
const levelWithStatus = (
{levelProgress, levelPairing = {}, currentLevelId, isSublevel = false},
{levelProgress, levelPairing = {}, currentLevelId},
level
) => {
if (level.kind !== LevelKind.unplugged && !isSublevel) {
if (level.kind !== LevelKind.unplugged) {
if (!level.title || typeof level.title !== 'number') {
throw new Error(
'Expect all non-unplugged, non-bubble choice sublevel, levels to have a numerical title'
'Expect all non-unplugged levels to have a numerical title'
);
}
}
Expand All @@ -549,22 +549,9 @@ export const levelsByLesson = ({
currentLevelId
}) =>
stages.map(stage =>
stage.levels.map(level => {
let statusLevel = levelWithStatus(
{levelProgress, levelPairing, currentLevelId},
level
);

if (statusLevel.sublevels) {
statusLevel.sublevels = level.sublevels.map(sublevel =>
levelWithStatus(
{levelProgress, levelPairing, currentLevelId, isSublevel: true},
sublevel
)
);
}
return statusLevel;
})
stage.levels.map(level =>
levelWithStatus({levelProgress, levelPairing, currentLevelId}, level)
)
);

/**
Expand Down Expand Up @@ -621,11 +608,9 @@ export function statusForLevel(level, levelProgress) {
// for each uid). When locked, they will end up not having a per-uid
// test result, but will have a LOCKED_RESULT for the LevelGroup (which
// is tracked by ids)
// BubbleChoice sublevels will have a level_id
// Worth noting that in the majority of cases, ids will be a single
// id here
const id =
level.uid || level.level_id || bestResultLevelId(level.ids, levelProgress);
const id = level.uid || bestResultLevelId(level.ids, levelProgress);
let status = activityCssClass(levelProgress[id]);
if (
level.uid &&
Expand Down
3 changes: 1 addition & 2 deletions apps/src/templates/progress/ProgressBubble.jsx
View file
Open in desktop
Expand Up @@ -59,8 +59,7 @@ const styles = {
width: SMALL_DOT_SIZE,
height: SMALL_DOT_SIZE,
borderRadius: SMALL_DOT_SIZE,
fontSize: 0,
alignItems: 'none'
fontSize: 0
},
smallDiamond: {
width: SMALL_DIAMOND_SIZE,
Expand Down
90 changes: 33 additions & 57 deletions apps/src/templates/progress/ProgressBubbleSet.jsx
View file
Open in desktop
Expand Up @@ -27,9 +27,6 @@ const styles = {
// dot size, plus borders, plus margin, minus our height of "background"
top: (DOT_SIZE + 4 + 6 - 10) / 2
},
backgroundSublevel: {
top: 4
},
backgroundDiamond: {
top: (DIAMOND_DOT_SIZE + 4 + 12 - 10) / 2
},
Expand Down Expand Up @@ -88,69 +85,48 @@ class ProgressBubbleSet extends React.Component {
return false;
};

renderBubble = (level, index, isSublevel) => {
render() {
const {
levels,
style,
selectedSectionId,
selectedStudentId,
hideAssessmentIcon
} = this.props;

return (
<div style={styles.withBackground} key={index}>
<div
style={[
styles.background,
level.isConceptLevel && styles.backgroundDiamond,
isSublevel && styles.backgroundSublevel,
level.isUnplugged && styles.backgroundPill,
!isSublevel && index === 0 && styles.backgroundFirst,
!level.sublevels &&
index === levels.length - 1 &&
styles.backgroundLast
]}
/>
<div
style={[
styles.container,
level.isUnplugged && styles.pillContainer,
level.isConceptLevel && styles.diamondContainer
]}
>
<ProgressBubble
level={level}
disabled={this.bubbleDisabled(level)}
smallBubble={isSublevel}
selectedSectionId={selectedSectionId}
selectedStudentId={selectedStudentId}
hideToolTips={this.props.hideToolTips}
pairingIconEnabled={this.props.pairingIconEnabled}
hideAssessmentIcon={hideAssessmentIcon}
/>
</div>
</div>
);
};

render() {
const {levels, style} = this.props;
return (
<div style={{...styles.main, ...style}}>
{levels.map((level, index) => {
return (
<span key={index}>
{this.renderBubble(level, index, false)}
{level.sublevels &&
level.sublevels.map((sublevel, index) => {
return (
<span key={index}>
{this.renderBubble(sublevel, index, true)}
</span>
);
})}
</span>
);
})}
{levels.map((level, index) => (
<div style={styles.withBackground} key={index}>
<div
style={[
styles.background,
level.isConceptLevel && styles.backgroundDiamond,
level.isUnplugged && styles.backgroundPill,
index === 0 && styles.backgroundFirst,
index === levels.length - 1 && styles.backgroundLast
]}
/>
<div
style={[
styles.container,
level.isUnplugged && styles.pillContainer,
level.isConceptLevel && styles.diamondContainer
]}
>
<ProgressBubble
level={level}
disabled={this.bubbleDisabled(level)}
smallBubble={false}
selectedSectionId={selectedSectionId}
selectedStudentId={selectedStudentId}
hideToolTips={this.props.hideToolTips}
pairingIconEnabled={this.props.pairingIconEnabled}
hideAssessmentIcon={hideAssessmentIcon}
/>
</div>
</div>
))}
</div>
);
}
Expand Down
6 changes: 3 additions & 3 deletions apps/src/templates/progress/ProgressLegend.jsx
View file
Open in desktop
Expand Up @@ -217,13 +217,13 @@ export default class ProgressLegend extends Component {
</div>
</TD>
<TD style={styles.rightBorder}>
<div style={styles.iconAndTextDivTop}>
<div style={styles.iconAndTextDiv}>
<FontAwesome icon="list-ul" style={styles.icon} />
{i18n.question()}
</div>
{/* Blank space to keep spacing consistent */}
<div style={styles.conAndTextDivBottom}>
<FontAwesome icon="sitemap" style={styles.icon} />
{i18n.choiceLevel()}
<FontAwesome icon="" style={styles.icon} />{' '}
</div>
</TD>
<TD rowSpan={secondRowRowSpan}>
Expand Down
4 changes: 1 addition & 3 deletions apps/src/templates/progress/progressHelpers.js
View file
Open in desktop
Expand Up @@ -178,8 +178,6 @@ export const processedLevel = level => {
isUnplugged: level.display_as_unplugged,
levelNumber: level.kind === LevelKind.unplugged ? undefined : level.title,
isConceptLevel: level.is_concept_level,
bonus: level.bonus,
sublevels: level.sublevels,
bubbleChoiceLetter: level.letter
bonus: level.bonus
};
};
3 changes: 1 addition & 2 deletions apps/src/templates/progress/progressTypes.js
View file
Open in desktop
Expand Up @@ -8,8 +8,7 @@ export const levelType = PropTypes.shape({
isUnplugged: PropTypes.bool,
levelNumber: PropTypes.number,
isCurrentLevel: PropTypes.bool,
isConceptLevel: PropTypes.bool,
sublevels: PropTypes.arrayOf(PropTypes.object)
isConceptLevel: PropTypes.bool
});

/**
Expand Down
41 changes: 11 additions & 30 deletions apps/src/templates/sectionProgress/detail/VirtualizedDetailView.jsx
View file
Open in desktop
Expand Up @@ -169,36 +169,17 @@ class VirtualizedDetailView extends Component {
)}
{rowIndex === 1 && columnIndex >= 1 && (
<span style={styles.bubbleSet}>
{scriptData.stages[stageIdIndex].levels.map((level, i) => {
return (
<span key={i}>
<FontAwesome
icon={getIconForLevel(level, true)}
style={
level.isUnplugged
? progressStyles.unpluggedIcon
: progressStyles.icon
}
/>
{level.sublevels &&
level.sublevels.map((sublevel, i) => {
return (
<span
className="filler"
key={i}
style={{
width: 17,
display: 'inline-block',
color: color.background_gray
}}
>
.
</span>
);
})}
</span>
);
})}
{scriptData.stages[stageIdIndex].levels.map((level, i) => (
<FontAwesome
icon={getIconForLevel(level, true)}
style={
level.isUnplugged
? progressStyles.unpluggedIcon
: progressStyles.icon
}
key={i}
/>
))}
</span>
)}
</div>
Expand Down
5 changes: 0 additions & 5 deletions apps/src/templates/sectionProgress/sectionProgressRedux.js
View file
Open in desktop
Expand Up @@ -334,11 +334,6 @@ export const getColumnWidthsForDetailView = state => {
// Circle bubble
width = width + PROGRESS_BUBBLE_WIDTH;
}
if (levels[levelIndex].sublevels) {
// TODO: import SMALL_DOT_SIZE from progressStyles
// TODO: make consistent with multiGridConstants
width = width + levels[levelIndex].sublevels.length * 18;
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If these items are yet to be done, is this work captured anywhere else? If it's done, we probably don't need the comments :)

}
}
columnLengths.push(width || 0);
}
Expand Down