Difference between revisions of "Widget:CodeExplorer"

Revision as of 12:13, 31 December 2022

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
mode: string: language for 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
|mode=swift
|initialCode=func sayHello() {
    print("Hello, World!")
}
}}

@@ Line 237: / Line 237: @@
          <input id="codeEditorExecuteButton<!--{$exerciseID|validate:int}-->" class="merlin-code-explorer-execute-button" onclick="this.form.submitter = 'execute';" type="submit" value="Run" />
          <input id="codeEditorSubmitButton<!--{$exerciseID|validate:int}-->" class="merlin-code-explorer-submit-button" onclick="this.form.submitter = 'submit';" type="submit" value="Submit"/>
-         <button class="merlin-code-explorer-show-compilation-button" type="button">Show Compilation Output</button>
+         <button class="merlin-code-explorer-show-compilation-button" type="button">Hide Compilation Output</button>
      </div>
      <div id="codeEditorCompilerOutput<!--{$exerciseID|validate:int}-->" class="merlin-code-explorer-combined-output"></div>