Skip to content

Commit

Permalink
#554 Fixed variables only being applicable on the module and pages. F…
Browse files Browse the repository at this point in the history
…ixed variables owned by other nodes reading as 'undefined' in the viewer when used. Need to add variables to all node converters, add variable name validation and fix tests.
  • Loading branch information
FrenjaminBanklin committed Oct 11, 2023
1 parent 7837a1c commit b2413a6
Show file tree
Hide file tree
Showing 6 changed files with 20 additions and 16 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -82,3 +82,5 @@ exports[`MoreInfoBox More Info Box with no button bar 1`] = `"<div class=\\"visu
exports[`MoreInfoBox More Info Box with no move buttons 1`] = `"<div class=\\"visual-editor--more-info \\"><button class=\\"more-info-button is-open\\" tabindex=\\"0\\" aria-label=\\"Toggle More Info Box\\"><svg viewBox=\\"0 0 214 214\\" xmlns=\\"http://www.w3.org/2000/svg\\" stroke=\\"#000\\" fill=\\"none\\"><circle cy=\\"107\\" cx=\\"107\\" r=\\"100\\" stroke-width=\\"14\\"></circle><circle cy=\\"107\\" cx=\\"57\\" r=\\"7\\" stroke-width=\\"16\\" fill=\\"#000\\"></circle><circle cy=\\"107\\" cx=\\"107\\" r=\\"7\\" stroke-width=\\"16\\" fill=\\"#000\\"></circle><circle cy=\\"107\\" cx=\\"157\\" r=\\"7\\" stroke-width=\\"16\\" fill=\\"#000\\"></circle></svg></button><div class=\\"more-info-box\\"><div class=\\"container\\"><div class=\\"obojobo-draft--components--modal--tab-trap\\"><input class=\\"first-tab\\" type=\\"text\\"><div class=\\"properties\\"><div></div><div><div class=\\"properties--row\\"><label for=\\"oboeditor--components--more-info-box--id-input\\">Id</label><input readonly=\\"\\" type=\\"text\\" id=\\"oboeditor--components--more-info-box--id-input\\" class=\\"id-input\\" value=\\"mock-id\\"><div><div class=\\"obojobo-draft--components--button is-not-dangerous align-center\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">Copy Id</button></div><div class=\\"obojobo-draft--components--button alt-action is-not-dangerous align-center\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">✎ Edit</button></div></div></div></div><div><span class=\\"objectives\\">Objectives:</span><div class=\\"obojobo-draft--components--button alt-action is-not-dangerous align-center objective-button\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">✎ Edit</button></div></div><div><span class=\\"triggers\\">Triggers:</span><div class=\\"obojobo-draft--components--button alt-action is-not-dangerous align-center trigger-button\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">✎ Edit</button></div></div><div class=\\"button-bar\\"><div class=\\"obojobo-draft--components--button alt-action is-dangerous align-center\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">Delete</button></div><div class=\\"obojobo-draft--components--button alt-action is-not-dangerous align-center\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">Duplicate</button></div></div></div><div class=\\"box-controls\\"><div class=\\"obojobo-draft--components--button is-not-dangerous align-center cancel-button\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">Done</button></div></div><input class=\\"last-tab\\" type=\\"text\\"></div></div></div></div>"`;

exports[`MoreInfoBox More Info Box with triggers 1`] = `"<div class=\\"visual-editor--more-info \\"><button class=\\"more-info-button is-open\\" tabindex=\\"0\\" aria-label=\\"Toggle More Info Box\\"><svg viewBox=\\"0 0 214 214\\" xmlns=\\"http://www.w3.org/2000/svg\\" stroke=\\"#000\\" fill=\\"none\\"><circle cy=\\"107\\" cx=\\"107\\" r=\\"100\\" stroke-width=\\"14\\"></circle><circle cy=\\"107\\" cx=\\"57\\" r=\\"7\\" stroke-width=\\"16\\" fill=\\"#000\\"></circle><circle cy=\\"107\\" cx=\\"107\\" r=\\"7\\" stroke-width=\\"16\\" fill=\\"#000\\"></circle><circle cy=\\"107\\" cx=\\"157\\" r=\\"7\\" stroke-width=\\"16\\" fill=\\"#000\\"></circle></svg></button><div class=\\"more-info-box\\"><div class=\\"container\\"><div class=\\"obojobo-draft--components--modal--tab-trap\\"><input class=\\"first-tab\\" type=\\"text\\"><div class=\\"properties\\"><div></div><div><div class=\\"properties--row\\"><label for=\\"oboeditor--components--more-info-box--id-input\\">Id</label><input readonly=\\"\\" type=\\"text\\" id=\\"oboeditor--components--more-info-box--id-input\\" class=\\"id-input\\" value=\\"mock-id\\"><div><div class=\\"obojobo-draft--components--button is-not-dangerous align-center\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">Copy Id</button></div><div class=\\"obojobo-draft--components--button alt-action is-not-dangerous align-center\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">✎ Edit</button></div></div></div></div><div><span class=\\"objectives\\">Objectives:</span><div class=\\"obojobo-draft--components--button alt-action is-not-dangerous align-center objective-button\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">✎ Edit</button></div></div><div><span class=\\"triggers\\">Triggers:<span>mockTrigger, mockSecondTrigger</span></span><div class=\\"obojobo-draft--components--button alt-action is-not-dangerous align-center trigger-button\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">✎ Edit</button></div></div><div class=\\"button-bar\\"><div class=\\"obojobo-draft--components--button alt-action is-dangerous align-center\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">Delete</button></div><div class=\\"obojobo-draft--components--button alt-action is-not-dangerous align-center\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">Duplicate</button></div></div></div><div class=\\"box-controls\\"><div class=\\"obojobo-draft--components--button is-not-dangerous align-center cancel-button\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">Done</button></div></div><input class=\\"last-tab\\" type=\\"text\\"></div></div></div></div>"`;

exports[`MoreInfoBox More Info Box with variables 1`] = `"<div class=\\"visual-editor--more-info \\"><button class=\\"more-info-button is-open\\" tabindex=\\"0\\" aria-label=\\"Toggle More Info Box\\"><svg viewBox=\\"0 0 214 214\\" xmlns=\\"http://www.w3.org/2000/svg\\" stroke=\\"#000\\" fill=\\"none\\"><circle cy=\\"107\\" cx=\\"107\\" r=\\"100\\" stroke-width=\\"14\\"></circle><circle cy=\\"107\\" cx=\\"57\\" r=\\"7\\" stroke-width=\\"16\\" fill=\\"#000\\"></circle><circle cy=\\"107\\" cx=\\"107\\" r=\\"7\\" stroke-width=\\"16\\" fill=\\"#000\\"></circle><circle cy=\\"107\\" cx=\\"157\\" r=\\"7\\" stroke-width=\\"16\\" fill=\\"#000\\"></circle></svg></button><div class=\\"more-info-box\\"><div class=\\"container\\"><div class=\\"obojobo-draft--components--modal--tab-trap\\"><input class=\\"first-tab\\" type=\\"text\\"><div class=\\"properties\\"><div></div><div><div class=\\"properties--row\\"><label for=\\"oboeditor--components--more-info-box--id-input\\">Id</label><input readonly=\\"\\" type=\\"text\\" id=\\"oboeditor--components--more-info-box--id-input\\" class=\\"id-input\\" value=\\"mock-id\\"><div><div class=\\"obojobo-draft--components--button is-not-dangerous align-center\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">Copy Id</button></div><div class=\\"obojobo-draft--components--button alt-action is-not-dangerous align-center\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">✎ Edit</button></div></div></div></div><div><span class=\\"objectives\\">Objectives:</span><div class=\\"obojobo-draft--components--button alt-action is-not-dangerous align-center objective-button\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">✎ Edit</button></div></div><div><span class=\\"triggers\\">Triggers:</span><div class=\\"obojobo-draft--components--button alt-action is-not-dangerous align-center trigger-button\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">✎ Edit</button></div></div><div class=\\"button-bar\\"><div class=\\"obojobo-draft--components--button alt-action is-dangerous align-center\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">Delete</button></div><div class=\\"obojobo-draft--components--button alt-action is-not-dangerous align-center\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">Duplicate</button></div></div></div><div class=\\"box-controls\\"><div class=\\"obojobo-draft--components--button is-not-dangerous align-center cancel-button\\" contenteditable=\\"false\\"><button type=\\"button\\" class=\\"button\\" contenteditable=\\"false\\">Done</button></div></div><input class=\\"last-tab\\" type=\\"text\\"></div></div></div></div>"`;
Original file line number Diff line number Diff line change
Expand Up @@ -146,24 +146,22 @@ class MoreInfoBox extends React.Component {
this.setState(prevState => ({ content: changeFn(prevState.content, enabled) }))
}

onSave() {
console.log('onSave!', this.props.content, this.state.content)
onSave(close=false) {
// Save the internal content to the editor state
const error =
this.props.saveContent(this.props.content, this.state.content) ||
this.props.saveId(this.props.id, this.state.currentId)
if (!error) {
this.setState({ error })
this.props.markUnsaved()
this.close()
if (close) this.close()
return
}

this.setState({ error })
}

toggleOpen(event) {
console.log('to', this.state.isOpen, this.state.needsUpdate)
stopPropagation(event)

if (this.state.isOpen) {
Expand Down Expand Up @@ -218,6 +216,7 @@ class MoreInfoBox extends React.Component {
// Prevent info box from closing when modal is opened
document.removeEventListener('mousedown', this.handleClick, false)
ModalUtil.show(<VariableListModal content={this.state.content} onClose={this.closeModal} />)
this.setState({ modalOpen: true })
}

// TriggerListModal.onClose is called w/ no arguments when canceled
Expand All @@ -228,13 +227,14 @@ class MoreInfoBox extends React.Component {

if (!modalState) return // do not save changes

console.log('closed', { ...this.state.content, ...modalState })

this.setState(
prevState => ({
content: { ...prevState.content, ...modalState },
needsUpdate: true
}),
prevState => {
return {
content: { ...prevState.content, ...modalState },
needsUpdate: true,
modalOpen: false
}
},
() => {
this.onSave()
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ import VariableProperty from './variable-property/variable-property'
import NewVariable from './new-variable/new-variable'
import VariableBlock from './variable-block'
import { RANDOM_NUMBER, RANDOM_LIST } from './constants'
import withoutUndefined from '../../../common/util/without-undefined'
import { getParsedRange } from '../../../common/util/range-parsing'

const { Button } = Common.components
Expand All @@ -19,7 +18,6 @@ const rangesToIndividualValues = vars => {
}

return vars.map(v => {
console.log('reading ', v)
switch (v.type) {
case 'random-list': {
const size = getParsedRange(v.size)
Expand Down Expand Up @@ -161,7 +159,6 @@ const individualValuesToRanges = vars => {
}

const VariableListModal = props => {
console.log('vlm', props)
const firstRef = useRef() // First element to fucus on when open the modal
const tabRef = useRef() // First element to focus on when open a variable

Expand Down Expand Up @@ -255,13 +252,16 @@ const VariableListModal = props => {
return firstRef.current.focus()
}

console.log('variables', variables)
const handleOnConfirm = () => {
const processedVariables = individualValuesToRanges(variables)
props.onClose({ variables: processedVariables })
}

return (
<SimpleDialog
ok
title="Variables"
onConfirm={() => props.onClose({ variables: individualValuesToRanges(variables) })}
onConfirm={handleOnConfirm}
focusOnFirstElement={focusOnFirstElement}
>
<div className="variable-list-modal">
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -419,7 +419,7 @@ export default class ViewerApp extends React.Component {

let value = null
if (variable.indexOf(':') !== -1) {
const [varName, ownerId] = variable.split(':')
const [ownerId, varName] = variable.split(':')

value = VariableUtil.getValue(
NavUtil.getContext(this.state.navState),
Expand Down
1 change: 1 addition & 0 deletions packages/obonode/obojobo-chunks-break/converter.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ const slateToObo = node => ({
content: withoutUndefined({
triggers: node.content.triggers,
objectives: node.content.objectives,
variables: node.content.variables,
width: node.content.width
})
})
Expand Down
1 change: 1 addition & 0 deletions packages/obonode/obojobo-chunks-text/converter.js
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,7 @@ const slateToObo = node => {
content: withoutUndefined({
triggers: node.content.triggers,
objectives: node.content.objectives,
variables: node.content.variables,
textGroup
})
}
Expand Down

0 comments on commit b2413a6

Please sign in to comment.