Difference between revisions of "Widget:CodeExplorer"
From Coder Merlin
| Line 11: | Line 11: | ||
;theme: string: name of theme (which must be loaded via css) | ;theme: string: name of theme (which must be loaded via css) | ||
;readOnly: boolean: true if editing should be disabled | ;readOnly: boolean: true if editing should be disabled | ||
; | ;language: string: language for compiling and highlighting (which must be loaded via js) | ||
;initialCode: string: initial code to place in editor | ;initialCode: string: initial code to place in editor | ||
| Line 27: | Line 27: | ||
|theme=vibrant-ink | |theme=vibrant-ink | ||
|readOnly=false | |readOnly=false | ||
| | |language=swift | ||
|initialCode=func sayHello() { | |initialCode=func sayHello() { | ||
print("Hello, World!") | print("Hello, World!") | ||
| Line 59: | Line 59: | ||
function setCurrentLanguage<!--{$exerciseID|validate:int}-->(language) { | function setCurrentLanguage<!--{$exerciseID|validate:int}-->(language) { | ||
let languageData = dataFromLanguage(language); | let languageData = dataFromLanguage(language); | ||
if (typeof languageData != "object") { | |||
alert("Unexpected language: " + language); | |||
} | |||
let mode = languageData[0]; | let mode = languageData[0]; | ||
let sourceLanguage = languageData[1]; | let sourceLanguage = languageData[1]; | ||
| Line 106: | Line 109: | ||
lineNumbers: "<!--{$lineNumbers|validate:boolean}-->", | lineNumbers: "<!--{$lineNumbers|validate:boolean}-->", | ||
theme: "<!--{$theme}-->", | theme: "<!--{$theme}-->", | ||
readOnly: "<!--{$readOnly | readOnly: "<!--{$readOnly}-->" | ||
} | } | ||
); | ); | ||
| Line 113: | Line 115: | ||
codeEditor<!--{$exerciseID|validate:int}-->.setSize("<!--{$width}-->", "<!--{$height}-->"); | codeEditor<!--{$exerciseID|validate:int}-->.setSize("<!--{$width}-->", "<!--{$height}-->"); | ||
// Set language | // Set language | ||
setCurrentLanguage<!--{$exerciseID|validate:int}-->(" | setCurrentLanguage<!--{$exerciseID|validate:int}-->("<!--{$language}-->"); | ||
// Determine if submit button is enabled, if not, disable | // Determine if submit button is enabled, if not, disable | ||
Revision as of 22:01, 23 January 2023
Parameters:
- userName
- string: The current user's username
- sessionID
- string: The ID of the current user's session
- experienceID
- string: The experienceID of the page from which the widget is invoked
- codeExplorerGroupID
- string: The code explorer group. If empty, the submit button will be disabled.
- exerciseID
- integer: exercise id for editor, must be unique per page
- width
- integer|string: percentage (as string, e.g. "100%" or integer size in pixels), null for no change (full width)
- height
- integer|string: percentage (as string, e.g. "100%" or integer size in pixels), null for no change (~10 lines)
- lineNumbers
- boolean: true to display line numbers
- theme
- string: name of theme (which must be loaded via css)
- readOnly
- boolean: true if editing should be disabled
- language
- string: language for compiling and highlighting (which must be loaded via js)
- initialCode
- string: initial code to place in editor
Example:
{{#widget:CodeExplorer
|userName=john-williams
|sessionID=qh0ubrrme911kcg7db0i0ec6lct94h7f
|experienceID=W1020.23
|codeExplorerGroupID=WTRS-8527
|exerciseID=10
|width=null
|height=null
|lineNumbers=true
|theme=vibrant-ink
|readOnly=false
|language=swift
|initialCode=func sayHello() {
print("Hello, World!")
}
}}
