About Cadenza™

Micronautics Cadenza is an authoring and publishing platform for online training that powers sites such as ScalaCourses.com.

Several roles are defined, and each role has a different view of various portions of the curriculum content in the site. Publishers assign authors to work that is done offline or online. Offline work can be published on demand or according to a schedule. Authors can also be given privilege to edit live content online. Other roles include Superusers and Visitors.

Cadenza is designed for complete transcripts to be provided for all videos. This allows Cadenza lecture content to be searchable and cross-referenced. Content is broken down into highly focused topics, in a hierarchy.

This document shows publishers and instructors how to work with Micronautics Cadenza™.

Sites and Publishers
Publishers are responsible for the business aspects of their online site, powered by Micronautics Cadenza. A publisher's site is defined by its publisher configuration. The Superuser creates the site's publisher configuration, and the publisher sets it up. Instructors never have to think about the business aspects because the publisher configures many of them in the site's publisher configuration. The front page of the site is defined by its publisher configuration as well. The publisher lecture in this course describes this topic in more detail.
Course Groups
A group is a collection of courses that together address a broad topic in a comprehensive manner. Groups can have a free publicly visible course-level video that provides an overview of the content, and the optional group-level video has an HTML transcript that is publicly searchable. Publishers define the business aspects of the courses within each group. All the other roles can only view the publicly visible information associated with the group. If a group has only one course that passes the preflight check, then the group is not made evident to the user, because there would be no benefit to exposing the extra node in the hierarchy.
Courses
A course normally has from one to five hours of video lectures, focused on a specific topic. Courses often have prerequisites, which you can specify in the online course editor. Prerequisite courses can also have prerequisites, and so on. This means instructors should state the knowledge that each course assumes the user to know. Courses have a free publicly visible video that provides an overview of the content, and the video has an HTML transcript that is publicly searchable.
Sections
Sections are collections of lectures, normally grouped according to a logical sequence. For example, sections might be called Setting Up, First Steps, Advanced Concepts and Integration. Sections have a free publicly visible video that provides an overview of the content, and the video has an HTML transcript that is publicly searchable. Instructors define sections and can reorder them.
Lectures
Lectures have a video that delivers the content, and an HTML transcript which is privately searchable. Publishers can designate individual lectures as being free. Although publishers can change the status of lectures from free to paid at any time, be aware that free lectures are crawled by public search engines such as Google, and their contents will be stored in search engine caches. Thus publishers should not change a lecture from free to paid unless the content has been significantly updated, and make it clear in the course overview that the lecture has been updated. Instructors create content for lectures and can reorder them.

Each node in the hierarchy can be designated as active, which means that its content will be included into the visible content. Individual nodes can also be made visible at any time; this means you can enable selected subtrees of the training material when desired.

Roles

The currently visible roles are:

  • Publishers decide business issues, such as pricing, when courses are released and the hiring of instructors.
  • Instructors write courses and make videos. As a publisher, ScalaCourses.com provides instructors with video production personnel so they can concentrate on content.
  • TAs provide support to students in order to help them learn the course material. This role will be significantly expanded in an upcoming Cadenza release.
  • Students can view course content that they are enrolled for.
  • Visitors can view free course content.

Views Filtered by Role

A checkmark means that the role can view the information. Roles with more checkmarks can either see more information or can modify it, or can modify it to a greater extent.

  Superuser Publisher Instructor Student Visitor
Publisher Configuration ✓✓✓ ✓✓
Group ✓✓ ✓✓
Course ✓✓✓ ✓✓✓ ✓✓
Section    
Lecture ✓✓✓ ✓✓✓ ✓✓ ?

Instructor Pages

Instructors write and record course content.

Obtaining Instructor Privilege

When a publisher grants someone instructor privileges an email is sent to the new instructor containing the following information:

  • User id and password for the publisher's Cadenza instance.
  • URL for the publisher's public Cadenza instance.
  • URL for the publisher's administrative Cadenza instance.
  • Name of the publisher's AWS S3 bucket to receive uploaded assets such as images and raw video footage (no longer required; may be removed in a future version.)
  • AWS credentials (no longer required; may be removed in a future version.)
  • Instructions on how to upload assets  (no longer required; may be removed in a future version.)

Logging in

Instructors log in using credentials provided by the publisher. They are brought to the instructor home page (shown in the image below), which shows all of the courses that they teach. Courses that are not visible to students or the general public, but are visible to authors/instructors are highlighted in yellow. There are three links for each course: to the course group page, to the details display page and to the editing page. Let's start by clicking on the link to the course group.

Viewing a Course Group

The course group is set up by the publisher. Instructors can view but not edit this information. If a group only contains a single course that passes preflight check, the group is not made visible to students and is highlighted in yellow. The information is organized into four tabs:

  • Details tab
    • The group ID is useful when working with Cadenza Client™.
    • The title of the group of courses is displayed, and is also shown at the top of the page.
    • Publishers store raw assets in an S3 bucket, and product-ready assets are stored in another bucket; the details of how that is set up are not shown to instructors. Instructors only see the bucket name for uploading assets such as images and raw video footage for production.
    • Next you see the paths within the upload bucket where the assets for each course in the group such as videos and images are to be stored. This information used to be required for manually uploading assets, but since then an automatic uploading mechanism has been implemented. We may remove this information in a future version. The complete path to where instructors upload images videos are provided as clickable links, however clicking on it does not take you to a web page where you can do anything.
    • An indication of whether the group has been set active by the publisher (checked if so), and whether all courses have passed the preflight check (yellow background means preflight check failed). You can drill down into the Courses tab to determine the reason(s) for preflight issues.
    • The course group has an image, which is displayed on every course's page when viewed by a student. This image serves to indicate to students that the courses in the group are all related.
  • Overview Video tab

    • If the video has been produced and associated with the group by the publisher then it will show.
  • Video Transcript tab

    • If the publisher has written the transcript for the group this it will show.
  • All transcripts On One Page tab

    • As an instructor you will see the all sections and lectures for your courses, and the student view of the others course in the group. You can print this page.
  • Courses

    • All the courses in this group are listed, along with summary information:
      • Database record id, for debugging.
      • Active and preflight indication
      • Course SKU – click to view the course
      • Course Title – click to edit the course
      • Instructor – click to view the instructor's home page
      • Sections – number of sections in the course
      • Lectures – number of lectures and the suggested total price
      • Free – number of free lectures
      • Ready – number of lectures that are active and pass preflight, along with their suggested total price

Viewing a Course

Instructors see up to five tabs of information, but can only edit two tabs. The publisher is responsible for the other tabs.

  • Details – Content is set by the publisher
    • Id – for debugging
    • Abstract – 50 word description of the course
    • Price – automatically computed, can be overridden by the publisher. If the course does not pass preflight, the price has a strikethrough
    • Project home – URL of project page, if specified
    • Repository – URI of repository
    • Instructors – clickable link to Instructor home page
    • Video directory – Bucket directory that instructors upload raw videos to – this field may be hidden in a future version of Cadenza.
    • Images directory – Bucket directory that instructors upload images to – this field may be hidden in a future version of Cadenza.
    • Active – A checkmark appears if the publisher enabled the content to be viewed when ready. A yellow background appears if the course fails the preflight check.
  • Video – if the overview video has been completed and associated with the course it is shown in this tab.
  • Transcript
  • Sections – The instructor can reorder the sections by dragging them, then pressing the Save button.
  • Printable Transcripts – The stylesheet has been optimized for printing as well as display in a browser. All of the sections and lectures are printed. Lectures that fail preflight are flagged in the printout.

Creating a Course

While viewing a course group, use the Training Admin / Create Course menu item, or Ctrl-Alt-C to create a new course. The new course will displayed in the course editor.

Editing a Course

Use the Training Admin / Edit Course menu item, or Ctrl-Alt-E to edit the displayed course. Each of the tabs that are displayed contain an instance of the online HTML editor. The next section explores the editor in detail.

  • Upload drop target bar – This bar is hidden when the editor is maximized. You can upload images and the course video by dragging the asset to this bar, or by clicking on it. Multiple uploads can be performed at once, and you can switch tabs while uploading continues. Don't leave the page until all uploads have completed, or they will be canceled. Assets are uploaded to the appropriate directories, and if you upload an .MP4, it will be named after the course sku.
  • Abstract tab – 50 word description promoting the course. The course will not save unless you enter something in this area.
  • Transcript tab – Transcription of the course video. It need not be word-for-word, in fact, it should be edited for better reading, and may contain extra information. The course will not save unless you enter something in this area.

Viewing A Course Section

  1. You can re-order lectures by clicking and dragging them into place. As you do this, a red Save button will appear. You must press that button in order to save the new ordering.
  2. Create a new lecture by using the Training Admin / Create lecture menu item.
  3. You can transcode all the videos withing the section by using the Training Admin / Transcode all videos in section menu item.

Creating a Section

While viewing a course, use the Training Admin / Create Section menu item, or Ctrl-Alt-C to create a new section. The new section will displayed in the section editor.

Editing a Section

Edit the section you are viewing by using the Training Admin / Edit Section menu item, or Ctrl-Alt-E. When editing, you can change the name, which must not contain spaces, the title and whether the section is active or not. Active sections and their active lectures will appear in the table of contents.

Viewing a Section Lecture

You can see the public / student view of the lecture by selecting the similarly named Training Admin menu item.

You can delete the course by using the Danger zone / Delete course from database menu item.

  • Details tab
    • Id – for debugging.
    • Sku – short and long versions are displayed.
    • Title – Lecture title should be descriptive.
    • Price – Set by publisher.
    • Active – Causes the lecture to be shown in the course outline even if it does not pass preflight check.
    • Promotional – Set by publisher.
    • Optional – Indicates the lecture is not essential to completing the course.
    • Abstract – 50 word brief description of the course. Displays as tooltip in table of contents
  • Video tab – If a video has been recorded, produced and uploaded then it can be assigned to the lecture here. Assigned videos can be viewed once they are transcoded. Transcoding might take only a moment, or if the video is 20 minutes long transcoding might take up to 10 minutes. The other assigned videos for the other lectures in the group are shown below for your convenience.
  • Transcript tab – Transcription of the lecture video. It need not be word-for-word, in fact, it should be edited for better reading, and may contain extra information.

Creating a Lecture

While viewing a section, use the Training Admin / Create Lecture menu item, or Ctrl-Alt-C to create a new lecture. The new lecture will be displayed in the lecture editor.

Duplicating a Lecture

While viewing (not editing) a lecture, use the Training Admin / Duplicate Course menu item, or Ctrl-Alt-V to duplicate the currently viewed lecture. The new lecture will be displayed in the lecture editor in a new tab, and will have the word Copy appended to the lecture sku and title, and Copy will appear in dark red as a heading at the top of the abstract and the transcript. The original lecture will be visible in the previous tab; press Ctrl-Alt-E to edit it simultaneously, so you remove duplicate content from each lecture.

Editing a Lecture

Use the Training Admin / Edit Course menu item, or Ctrl-Alt-E to edit the displayed lecture. Each of the tabs that are displayed contain an instance of the online HTML editor. The next lecture explores the editor in detail.

You can delete the lecture by using the Danger zone / Delete lecture from database menu item.

Upload drop target bar – You can upload images and the lecture video by dragging the asset to this bar, or by clicking on it. Multiple uploads can be performed at once, and you can switch tabs while uploading continues. Don't leave the page until all uploads have completed, or they will be canceled. Assets are uploaded to the appropriate directories, and if you upload an .MP4, it will be named after the lecture sku.

  • Details tab
    • Sku – must be globally unique, as with all SKUs. The lecture_ prefix is automatically added.
    • Title – A short and descriptive title is best
    • Active – Enable this when you want the lecture to show up in a course outline. If the lecture does not pass the preflight check, its contents will not display.
    • Optional – If this course can be meaningfully completed without taking the lecture then enable this checkbox.
  • Abstract tab – 50-word description promoting the lecture. The lecture will not save unless you enter something in this area.
  • Transcript tab – Transcription of the lecture video. The lecture will not save unless you enter something in this area.

Editor Buttons

The transcript will be updated more frequently than the video, and has more information.

Each web page that you have permission to edit can be edited by pressing Ctrl-Alt-E. Similarly, you can create a course, section or lecture by pressing Ctrl-Alt-C. Both of these actions open a web page with at least one tab; many tabs display an HTML editor. The editor buttons are arranged like this:

Top Row

  • is the maximize button, located at the upper left of the toolbar. If you are doing any extensive editing, it is best to maximize the editor, however when the editor is maximized, the upload area is hidden. Clicking this button again restores the editor to its normal size.
  • The blocks button, , provides a nice visual representation of the structure of your document.
  • The help button, , displays help information such as key bindings.
  • The source button, , toggles the display between rendered HTML output and HTML source code.
  • The save button, , does the same thing as pressing the Save button, which is helpful because when the editor is maximized the Save button cannot be seen.
  • is the new page button, which erases everything in the editor.
  • The print button, , prints the document using the @media print stylesheet defined for this site.
  • is the templates button, which can either insert the selected template at the cursor location, or it will replace everything in the editor with the template. Exercises and quizzes can be defined from a template; more on that in the Exercises and Quizzes section.
  • If you select some text the Cut button, , will become active. You can move the selected text to the copy/paste buffer by clicking the button.
  • If you select some text the copy button, , will become active. You can copy the selected text to the copy/paste buffer by clicking the button.
  • There are three flavors of paste buttons: paste 'as is', paste as plain text, and paste from Word.
  • The undo button, , works just the same as Ctrl-Z.
  • There are three flavors of insert buttons. If you have an HTML document that you have prepared offline, for example by using Adobe DreamWeaver, you should not paste rendered HTML into the rendered HTML view using Ctrl-V. Instead, use one of these buttons, or copy the HTML source from DreamWeaver into the HTML source view of the editor.
  • Images can be inserted and modified with the image button, , and with Ctrl-Shift-I. There is a lot to say about images, so that is covered separately below.
  • The button inserts a table, but this should not normally be used. Instead, use the Twitter Bootstrap Table template.
  • The button inserts a horizontal rule.
  • A variety of smiley characters can be inserted with the Smileys button ().
  • Special characters such as accented characters, arrows and common HTML entities such as – (–) can be inserted using the button.
  • You can insert a page break for printing using the button, however this is not normally required because the publishing system does this automatically at logical boundaries.
  • IFrames can be inserted with the button, and the dialog that appears offers a lot of options.
  • The macros button, , has an entire section dedicated to it.

Second Row

  • Apply <kbd> markup to selected text with Ctrl+Shift+K; press Ctrl+Space to remove the formatting.
  • Apply <code> markup to selected text with Ctrl+Shift+L; press Ctrl+Space to remove the formatting.
  • Toggle selected characters between bold and normal weight by pressing Ctrl-B or by clicking on the B button.
  • You can toggle selected characters between italic and normal style by pressing Ctrl-I or by clicking on the I button
  • You can toggle selected characters between underline and normal style by pressing Ctrl-U or by clicking on the U button
  • Toggle selected characters between strikethrough and normal style by pressing Ctrl-S or by clicking on the S button
  • Toggle selected characters between subscript and normal style by clicking on the X2 button
  • Toggle selected characters between superscript and normal style by clicking on the X2 button
  • Remove all formatting from selected characters by pressing Ctrl-Space or clicking on the Tx button.
  • Change the foreground and background colors of selected text with the next two buttons.
  • The Styles pull-down contains many useful block and inline styles, many of which are defined as classes. The classes are described in the Editor CSS section.
    • Block Styles
      • H2 Clear Both; wrap selected text in <h2 style="clear: both"></h2>, if nothing selected then replace block that the cursor is on.
      • H3 Clear Both; wrap selected text in <h3 style="clear: both"></h2>, if nothing selected then replace block that the cursor is on.
      • p Clear Both; wrap selected text in <p style="clear: both"></h2>, if nothing selected then replace block that the cursor is on.
      • pre Clear Both; wrap selected text in <pre style="clear: both"></h2>, if nothing selected then replace block that the cursor is on.
      • Well; (Twitter Bootstrap Well); wrap selected text in <div class="well"></div>, if nothing selected then replace block that the cursor is on.
      • Pull Quote; wrap selected text in <div class="pullQuote"></div>, if nothing selected then replace block that the cursor is on.
      • Wider Pull Quote; wrap selected text in <div class="pullQuoteWider"></div>, if nothing selected then replace block that the cursor is on.
      • Widest Pull Quote; wrap selected text in <div class="pullQuoteWidest"></div>, if nothing selected then replace block that the cursor is on.
      • Exercise; Use the Exercise template to insert an empty template, then fill it in.
      • method Signature; wrap selected text in <div class="methodSignature"></div>, if nothing selected then replace block that the cursor is on.
    • Inline Styles
      • .code wraps selected text in <span class="code"></span>. The hot key is Alt-Shift-L.
      • code;  wrap selected text in <code></code>. The hot key is Ctrl-Shift-L.
      • kbd;  wrap selected text in <kbd></kbd>. The hot key is Ctrl-Shift-K.
      • Sample Text; wrap selected text in <samp></samp>.
      • Variable; wrap selected text in <var></var>.
      • Deleted Text; wrap selected text in <del></del>.
      • Sample Text; wrap selected text in <ins></ins>.
      • Cited work; wrap selected text in <cite></cite>.
      • Inline Quotation; wrap selected text in <q></q>.
      • Highlight (yellow, red, green, blue, orange, grey or black backgrounds)
  • The Format pulldown menu contains block styles, including:
    • Normal style (removes formatting for a paragraph)
    • Heading 1 (do not use)

    • Heading 2

    • Heading 3

    • Heading 4

    • Heading 5
    • Heading 6
    • preformatted text; the hot key is Ctrl-Shift-M
    • Normal <div> container
  • You should not normally use Font or Size controls; let the stylesheet do the work for you. Contact your publisher if your stylesheet needs to be modified.

Third Row

  • Bulleted and numbered lists work in concert with the indent/outdent buttons ( and ), and the hotkeys Ctrl-M and Ctrl-Shift-M. Sublists are started and ended by indenting and outdenting items in a list.
  • The block quotes button, , applies a vertical bar on the left of the page to the block that the cursor is on.
  • The create div button, , creates an HTML div at the cursor. The dialog which appears offers many options.
  • The text in the currently selected block can be left-aligned, centered, right-aligned and justified by using the appropriate justification buttons.
  • You can make a link by selecting text and pressing the link button, . The dialog box which appears is very powerful, and can be used to make all types of links, including mailto: links. The unlink button next to it, , becomes active when the cursor is on a link.
  • The button can create an anchor in a page so you can link to that portion of a page with the Anchor button.
  • Find, , and replace, , only work in rendered HTML view, however there are equivalent hotkeys for Source mode (Ctrl-F and Ctrl-Shift-F).
  • You can press Ctrl-A to select everything in the editor, or press the button.
  • Spell check, , is described in the this document.

Online HTML5 Source Code Editor

The online HTML5 editor can work in rendered mode, as we have already seen, and in HTML source mode.

Hot keys for Source Edit Mode

  • Ctrl-Shift-K to make the currently selected text appear as keyboard text
  • Ctrl-Q to expand/collapse a code block
  • Ctrl-F to perform a search
  • Ctrl-G to find next
  • Ctrl-Shift-G to find previous
  • Ctrl-Shift-F to find and replace
  • Ctrl-Shift-R to find and replace all
  • Ctrl-Shift-space to open the Macros dialog

Editor Images

Images should be stored in one of two directories in your publishers' S3 bucket: the course group's assets directory, or the site-wide directory. We talked about the publisher's S3 bucket and the assets directories in the Instructor Pages Overview section. To upload new images for the lecture, course, group or site configuration that you are working on:

  1. Drag images to the drop bar above the editor, or click on the drop bar and upload. If the name of the file you are uploading is exactly the same as the name of an existing file, the previously uploaded file will be replaced. You can also use an S3 file transfer mechanism such as the Amazon S3 Console browser client, aws-cli, or CloudBerry Explorer for S3 as described in the Setting Up a New Author section.
  2. Once uploaded, you can include images into the current document at the location of the cursor in one of two ways:
    1. By clicking on the image button.
      1. Then click on the Browse server button.
      2. A new window will open, showing you the images that have already been uploaded. You may see buttons on the top row of that page; these are the image directories. Empty image directories are not shown. There may be directories for the site and the group of courses. The image on the right shows two directories: one for the course group called How to Create Courses, and the other for the site called ScalaCourses.com.
      3. If you hover over an image it will be shown larger.
      4. Clicking on the image closes the image selector window and returns you to the Image Properties modal dialog.
    2. By pasting in the URL of the image. CloudBerry Explorer for S3 has a feature which allows you to obtain the URL of an uploaded file by:
      1. Right-clicking on the file.
      2. Selecting the Web URL menu item:
      3. Clicking the Copy to Clipboard button:
  3. The Advanced tab allows you to specify a class other classes will likely be defined as time goes by, and this documentation will be updated to include them all. You can specify as many classes as you like, separated by spaces. Common classes are: right, left, rounded, shadow and liImg.  Available classes are described in the Editor CSS section.
  4. Click OK to place the image in your document.
  5. Right-click on an image in order to open Image Properties, where you can adjust the appearance of the image.

Exercises & Quizzes

Cadenza supports two types of self-study exercises as well as gradable exercises. Please let Micronautics Research know if you would like additional templates.

Self-Study Exercises

Exercise with Answer

This type of exercise presents a challenge, and the solution is hidden until the user mouses over it. The user can pin the answer open by clicking on the red pushpin at the top right of the solution box. Create this type of exercise by clicking on the template button and selecting Exercise / Exercise with hidden solution. Do not enable Replace actual contents unless you wish to delete the any existing content of the lecture prior to inserting the template.

The blank template looks and acts like the following, between horizonal rules:


Exercise

   

Solution


Multiple-Choice Quiz

The Multiple-Choice Quiz template automatically creates a quiz for you to modify. Use the templates button to display the list of templates, and select Multiple-Choice Quiz. The HTML generated by the template is shown below, and the rendered HTML is shown below that. It is easy to modify the text using the HTML editor.

Curious about how quizzes are constructed? There are two top-level divs; the first is tagged with the quiz class, and the second is tagged with the solution class. Within the solution div, there is another div tagged with the solutionHidden class. This innermost div will be hidden until the user mouses over the answer. The enclosing web page provides the JavaScript that runs the quiz. Note that the quiz answer is always visible when viewed in the online HTML editor   you must save the document before the quiz will operate.

<div class="quiz">    <h3>Quiz: Javap Classpath</h3>    <p>What needs to be in the classpath for <code>javap</code>?</p>    <ol>      <li>A classpath is never required</li>      <li>A classpath is not required if the <code>.class</code> file to be decompiled is in the current directory</li>      <li>The classpath must have all dependencies (.jar files, .class files and source files), just like the classpath for <code>javac</code></li>      <li>The classpath may point to the <code>.class</code> file being decompiled</li>    </ol>  </div>  <div class="solution">    <h3>Solution: Javap Classpath</h3>    <div class="solutionHidden">      <p>#2 is correct for Java 6&#39;s <code>javap</code> command, and #4 is correct for all versions of Java.</p>    </div>  </div>

Here is what the above quiz looks like.

Quiz: Javap Classpath

What needs to be in the classpath for javap?

  1. A classpath is never required
  2. A classpath is not required if the .class file to be decompiled is in the current directory
  3. The classpath must have all dependencies (.jar files, .class files and source files), just like the classpath for javac
  4. The classpath may point to the .class file being decompiled

Solution: Javap Classpath

Exercise Without Answer

When the exercise class is applied to a div, Exercise will appear on the top left corner as shown below. This type of exercise cannot be graded. Use the Styles / Exercise menu to apply this style to an existing paragraph (p) or div. The contents of the div can be anything. Here is an example:

<div class="exercise">    <h2>Challenge #42</h2>    <p>Create a program that outputs the meaning of life, the universe, and everything.</p>  </div>

Here is how a self-study exercise is rendered:

Challenge #42

Create a program that outputs the meaning of life, the universe, and everything.

Gradable Exercises

If the exercise div has the following attributes in the precise order shown, then it will display as a form. This type of exercise can be graded by a remote server. The server URL is configured by the publisher, and the design and implementation of remote server is the responsibility of the publisher's staff. When the student fills in the answer and presses Submit, their answer is transmitted to the Cadenza server in order to record the student's response, then it is passed to the remote server for evaluation.

Here is a example gradable exercise:

<div class="exercise" data-id="Challenge #42" data-language="Scala">    <p>Create a program that outputs the meaning of life, the universe, and everything.</p>  </div><!-- /exercise -→

Note that the HTML comment at the end of the gradable exercise is vital for proper parsing.

Here is how a gradable exercise is rendered (note that the embedded textarea is not shown when you are editing the lecture):

Challenge #42

Create a program that outputs the meaning of life, the universe, and everything.


Cadenza renders the <div> above as a form as shown below. The form's action parameter will be set from configuration data provided by the publisher. As you can see, the lectureId and userId form fields are automatically set. A course author need only briefly switch into HTML source mode in order to change the value of the language field to suit the language used in the example. This contents of this field only has meaning to the evaluation program running on the remote server.

<form name="exercise_1378061937688" method="post" action="/exercise" class="exercise">
  <h2>Challenge #42</h2>
  <p>Create a program that outputs the meaning of life, the universe, and everything.</p>
  <br/>
  <input type="hidden" name="exerciseId" value="Challenge #42" />
  <input type="hidden" name="language"   value="Scala" />
  <input type="hidden" name="lectureId"  id="lectureId_1378061937688" />
  <input type="hidden" name="userId"     id="userId_1378061937688" />
  <textarea name="answer" rows="10" style="width: 100%" placeholder="Type your answer here"></textarea>
  <input type="submit" value="Submit" class="btn btn-primary" />
</form>
<script>
  $(function() {
    $("#lectureId_1378061937688").val(lectureId);
    $("#userId_1378061937688").val(userId);
  });
</script>

Graded Results

The remote server must POST the form encoded results of the evaluation back to the same Cadenza server, at the /result path. The following fields are expected:

compilerOutput
A string containing the output of compiling or interpreting any source code provided by the student. This field must not be omitted even if empty.
exerciseId
Merely returns the same string value that was passed.
grade
An integer between 0 and 100, inclusive.
lectureId
Merely returns the same long integer value that was passed.
output
A string containing the output of running any source code provided by the student. This field must not be omitted even if empty.
passed
A boolean indicating if the student's assignment received a passing grade.
sharedSecret
String value up to 2048 bytes long established by the publisher that identifies this evaluation server as being authorized to respond.
timeCompleted
A long integer (Unix time, GMT) indicating when the evaluation server completed the completed grading assignment results.
timeElapsed
A long integer indicating the number of milliseconds the evaluation server took to grade the assignment (timeCompleted - timeStarted).
timeStarted
A long integer (Unix time, GMT) indicating when the evaluation server began the grading of the assignment.
timeReceived
A long integer (Unix time, GMT) indicating when the evaluation server received the completed assignment results for grading.
userId
Merely return the same string value that was passed.

Results are stored in the Cadenza database and are also forwarded to the URL configured at the time the Cadenza server was set up.

Online HTML5 Editor Spellcheck

Spell checking is not enabled by default, because it requires a solid and reasonably fast Internet connection. To turn it on, click on the button on the lowest toolbar and enable SCAYT (Spell Check As You Type). This setting will remain enabled from editing session to editing session until you disable it. We recommend that you enable it.

You can also control options for how spellcheck works, such as ignoring words in all caps, domain names, mixed case and words with numbers. The default is to check for American English, but you can set it to many other languages. You can also set up your own private dictionary.

Online HTML5 Editor CSS

Many CSS classes are available for you to use when editing a document. Inline classes are applied to tags like span and img. Block-level classes are applied to tags like div.

All of the Twitter Bootstrap classes are available (actually, all of Bootstrap is available in the rendered document, including JQuery and components). JavaScript is not functional when editing the document.

Most of the classes and styles described below can be applied via the Styles pull-down, others via templates.

Inline Classes

  • Classes for colored text and background: yellow, green, red, blue, orange, grey, black
  • Superscript does what you expect to text.
  • The code class resembles the code tag, except that it only applies a font-family property and does not affect the font-size property. This makes it good for usage within Hn tags and pull quotes. The hot key is Alt-Shift-L.

Block-Level Classes

  • The noshadow class removes a drop shadow from an inline or block component.
  • Show an info, warning or error message: info, text-warning, error.
  • CSS style clear: both clears left and right margins, and can be applied via Styles menu selections H2 Clear Both, H3 Clear Both, p Clear Both and pre Clear Both. You can apply the clear:both style from the p Clear Both style pulldown menu so subsequent text so images won't wrap inside the pullQuote box.

Images

  • The right and left classes are useful for right-aligning and left-aligning images. Unlike Bootstrap's pull-right and pull-left classes, these classes also provide some space between the image and the rest of the document.
  • The shadow class shows a drop shadow around an image or other block component, such as a div.
  • The rounded class is useful for applying to images. It is common to apply these styles to an image: rounded right shadow.
  • The liImg (list image) class adds 1em margin to the top and bottom of an HTML element. This is useful for images embedded in lists.
  • The zoomer class shows the image constrained within a 250 pixel square bounding box. Hovering over the image shows it full-size. However, zoomer only works if you remove the image size that Image Properties applies by default. You can also add an inline css style, such as margin-bottom: 12pt;.

Quizzes and Exercises

  • The quiz class should be applied to divs containing the quiz challenge. Quizzes are discussed in the Exercises and Quizzes section.
  • The exercise class should be applied to divs containing the exercise challenge. Exercises are also discussed in the Exercises and Quizzes section.
  • The solution class should be applied to a div containing the quiz answer.
  • The solutionHidden class should be applied to a div containing the quiz answer.

Pull Quotes

pullQuote, pullQuoteWider and pullQuoteWidest can optionally have an embedded div with class author. Here is an example:

Use the Styles / Pull quote menu to apply these style to an existing paragraph or div.
<div class="pullQuote">
  Use the <b>Styles</b> / <b>Pull quote</b>
  menu to apply these style to an existing paragraph or div.
</div>
Use the Styles / Pull quote menu to apply these style to an existing paragraph or div.
 — Author Unknown

Here is the same pullQuote as before, but with an embedded author div. Pull quotes with embedded author divs must be inserted as a template, not by applying a style.

<div class="pullQuote">
  Use the <b>Styles</b> / <b>Pull quote</b>
  menu to apply these style to an existing paragraph or div.
  <div class="author">&nbsp;&mdash; Author Unknown</div>
</div>
This is a wider pull quote with an embedded author tag. Notice how pullquotes dominate the text. Pull quotes should be short. Do not use pullQuoteWider unless you know what you are doing.
 — Author Unknown

Here is an example of pullQuoteWider with an embedded author tag. Notice the embedded span with class code.

<div class="pullQuoteWider">
  This is a wider pullquote with an embedded author tag.
  Notice how pullquotes dominate the text.
  Pull quotes should be short.
  Do not use <span class="code">pullQuoteWider</span>
  unless you know what you are doing.
  <div class="author">&nbsp;&mdash; Author Unknown</div>
</div>
This is a widest pull quote with an embedded author tag.
Notice how pullquotes dominate the text. Do not use pullQuoteWidest unless you know what you are doing. Pull quotes should be short.
 — Author Unknown

Here is an example of pullQuoteWidest. Notice the embedded span with class code.

<div class="pullQuoteWidest">
  This is the widest pullquote with an embedded author tag.
  Notice how pullquotes dominate the text.
  Pull quotes should be short.
  Do not use <span class="code">pullQuoteWidest</span>
  unless you know what you are doing.
  <div class="author">&nbsp;&mdash; Author Unknown</div>
</div>

Embedding CSS Rules Into Transcripts

Transcripts are combined into the automatically course notes and are made available from the course page. That means any CSS you might have embedded in a lecture transcript using <style> tags will be incorporated into the course page. If you redefine the CSS for tags such as <ol>, <li> or <ul> then the CSS for that page will break. If you need to define CSS in a lecture or course, be sure to use classes or ids to restrict the effect of the CSS rule you have defined.

Macros

Cadenza macros provide a way to insert a value that is computed each time the page is displayed. Macros can be used to insert content from other web pages, reference other lectures and courses, and much more. Cadenza v1.2 added a new flavor of the include macro, for situations where the older version does not produce the desired result; this document reflects the latest version.

Cadenza macros use a custom HTML5 data elements embedded in arbitrary HTML tags, such as p, pre, span, div, td, th, etc.

Macro Toolbar Button

Although you can insert macro text when editing HTML code, this is error-prone. It is better to use the macro toolbar button to insert cross-references to other lectures and courses. This button displays a dialog that you can use to navigate between groups, courses, sections and lectures. Future versions will make it possible to insert other types of Cadenza macros easily.

The Insert Macro toolbar button looks like this: . When you click the button a dialog opens that makes it easy for you to create the necessary HTML for the most commonly used Cadenza macros. The dialog looks like this:

The buttons insert macros with values filled in according to the selections that you have made. By default the current group, course, section and lecture is selected.

  • Clicking on the Insert Linked Group button results in HTML like this being inserted into your document, with a link to the student view of the selected course group: Micronautics Cadenza.
  • Clicking on the Insert Linked Course button results in HTML like this being inserted into your document, with a link to the student view of the selected course: Micronautics Cadenza 101.
  • Clicking on the Insert Linked Lecture button results in HTML like this being inserted into your document, with a link to the student view of the selected lecture: Cadenza Macros.
  • Clicking on the Insert Linked Lecture in Course button results in HTML like this being inserted into your document, with a link to the student views of the selected lecture and course: Cadenza Macros lecture of the Micronautics Cadenza 101 course.

Release Notes

  • When editing a lecture, clicking on the New Revision History Item menu item results in HTML like the following being inserted in the Release Notes section of both the lecture and course overview documents.
    2014-08-28 SBT Global Setup Added information about sbt-updates plugin

Complete List of Macros

if-then

Given source code that looks like this:

<span data-control="if" data-symbol="whatever" data-type="cadenza">Conditional ipsum lorem</span>  

If the value of the whatever symbol is true or non-empty, output is

Conditional ipsum lorem

The included text may not be a macro.

if-then-else

Given source code that looks like this:

<div data-control="if" data-symbol="whatever" data-type="cadenza"> <b>Then clause</b> <cad-enza data-control="else" /> <i>else clause</i> </div>  

If the value of the whatever symbol is true or non-empty, output is

<b>Then clause</b>

Otherwise, output is:

<i>else clause</i>

The included text may not be a macro.

include

Contents of web pages can be included. Encoding defaults to UTF-8 but can be overridden with the data-encoding attribute. Contents default to being included verbatim, but HTML tags can be escaped by specifying the optional data-html attribute with the value escape.

Web pages are specified via a URL that complies with java.net.URL constructor. Relative URLs are supported and cause the contents of the Cadenza Play Framework application's public/ folder to be included; this means that CDNs are not used for relative URLs.

The test file (test.inc.html) contains the following:

This is <code>test.inc.html</code>.

Given source code that looks like this, UTF-8 encoding is used:

<span data-include="https://courseassets.scalacourses.com/1/html/ScalaCore/includes/test.inc.html" data-type="cadenza">
    If you put something here it will not be rendered,
    however it will display when viewing the document from CKEditor;
    if you put HTML in here you may experience problems
</span>

Output is:

This is <code>test.inc.html</code>.

Given source code that looks like this, UTF-8 encoding is used:

<div data-encoding="utf-8" data-type="cadenza"
  data-include="https://courseassets.scalacourses.com/1/html/ScalaCore/includes/test.inc.html">
</div>

Output is:

This is <code>test.inc.html</code>.

HTML code can be escaped by providing the data-html attribute with the value encoded:

<span data-html="encoded" data-type="cadenza"
  data-include="https://courseassets.scalacourses.com/1/html/ScalaCore/includes/test.inc.html">
</span>

Output is:

This is test.inc.html.

If the URL is a bad link, output will look like this:

Include error for http://www.badbad.com/bad.html

Here is an example of an HTML table built by including several files:

<table class="table table-bordered table-hover table-condensed" width="100%" data-type="cadenza">
  <thead data-include="https://courseassets.scalacourses.com/1/html/ScalaCore/includes/collectionHead.inc.html"></thead>
  <tbody data-include="https://courseassets.scalacourses.com/1/html/ScalaCore/includes/collectionImmutable.inc.html"
    data-type="cadenza"></tbody>    
  <tbody data-include="https://courseassets.scalacourses.com/1/html/ScalaCore/includes/collectionMutable.inc.html"
  data-type="cadenza"></tbody>
</table>

Output is:

    Collection Traits and Subclasses
  Special Foundation Set Sequence Random Access Sequence Map Stack & Queue
Immutable

Option
ParRange
Range
Stream

Iterable
ParIterable
Traversable

BitSet
HashSet
ListSet
ParHashSet
ParSet
Set
SortedSet

TreeSet

List
LinearSeq
PagedSeq
ParSeq
Seq

IndexedSeq
Vector
ParVector

HashMap
ListMap
Map
ParMap
ParHashMap
SortedMap
TreeMap

Queue
Mutable Array
ArrayBuffer
ParArray

Iterable
ParIterable
Traversable

BitSet
HashSet
ListSet
ParHashSet
ParSet
Set
SortedSet

TreeSet

ArraySeq
Buffer
LinearSeq

ParSeq
Seq

IndexedSeq
IndexedSeqView

ListBuffer

HashMap
ListMap
OpenHashMap
ParHashMap
ParMap
WeakHashMap

ArrayStack
PriorityQueue
Stack
Queue

Include GitHub Gist

Contents of a GitHub gist can be included, as a formatted block of HTML. Simply specify the URL of the gist as the value of the data-gist attribute. If the gist contains multiple files they will all be properly displayed.

<div data-gist="https://gist.github.com/mslinn/65a5ede7f13f3c2ae0ca" data-type="cadenza"><i>A gist will display here</i></div>

Output is:

Cross-References

Cross-references are automatically presented in the About tab for each lecture and course. The Insert Macro button () discussed above is the recommended way of inserting cross-references.

Lecture

<span data-entity="lecture" data-id="94" data-info="title" data-type="cadenza">Lecture notes will appear here</span>  

Output is:

Cadenza Macros

Course

<span data-entity="course" data-id="45" data-info="linkedTitle" data-type="cadenza"><a href="">Course notes</a> will appear here</span>  

Output is:

Micronautics Cadenza 101

The results of expanding the Cadenza macros are as shown below. The text inside the outermost tags is replaced with the macro expansion when the page is saved.

Lecture in Course

The Insert Macro button provides a convenience button labeled Insert Linked Lecture in Course, which generates HTML that looks like this:

Cadenza Macros lecture of the Micronautics Cadenza 101 course

Symbol

Cadenza predefines a number of symbols. You can embed their value in a document with this macro. Symbol names are case-insensitive. Predefined symbols are:

Symbol Name Current Value for this Cadenza Instance
cadenzaBuildTimestamp Sun Apr 3 21:00:19 PDT 2016
cadenzaBuildNumber 1461
cadenzaVersion 2.1.6
debugLogEnabled false
gitStudentUserId not shown
gitStudentPassword not shown
siteName ScalaCourses.com
supportEmail support@scalacourses.com
supportEmailHtml support@scalacourses.com

Example 1

Given HTML that looks like this:

<span data-type="cadenza" data-symbol="cadenzaVersion">Current value of symbol cadenzaVersion or error message if undefined</span>

Output might be:

1.1.11

Example 2

Given HTML that looks like this:

<span data-symbol="siteName" data-type="cadenza">What.com</span>

Output is:

ScalaCourses.com

Revision History

Only changes that are visible to users are shown.

Publisher Pages

Publishers are focused on the business aspects of online courses. This section shows the various Cadenza™ pages that they use in order to do that.

Publishers grant privileges to instructors (course authors), videographers and copy editors.

Instructors log in using credentials provided by the publisher. They are brought to the instructor home page, which shows all of the courses that they teach. There are three links for each course: to the course group page, to the details display page and to the editing page. Let's start by clicking on the link to the course group.

Granting Privilege

Publishers can grant privilege to an existing user, or they can create a new user by sending a promotional course enrollment.

Granting Privilege to an Existing User

To grant privilege to an existing user, use the Site & User Admin / User Management menu item to show a list of users, then click on their name under the Full name / edit column. Click on the Add role button on the right side of the page, and grant the privileges one at a time. Privileges are granted immediately; there is no need to press the Submit button on the Modify User page.

When a publisher grants privileges to someone an email is sent to them that contains the following information:

  • User id and password for the publisher's CourseCreator instance.
  • URL for the publisher's public CourseCreator instance.
  • URL for the publisher's administrative CourseCreator instance.
  • Name of the publisher's AWS S3 bucket to receive uploaded assets such as images and raw video footage (no longer required; may be removed in a future version.)
  • AWS credentials (no longer required; may be removed in a future version.)
  • Instructions on how to upload assets  (no longer required; may be removed in a future version.)

Creating a New User With Privilege

TODO write me ...

Viewing a Course Group

The course group is set up by the publisher. Instructors can view but not edit this information. If a group only contains a single course that passes preflight check, the group is not made visible to students, with the exception that the group's image is applied to the course as usual. The information is organized into four tabs:

  • Details tab
    • The group ID is only there for debugging purposes.
    • The title of the group of courses is displayed, and is also shown at the top of the page.
    • Publishers store raw assets in an Amazon Web Services S3 bucket, and product-ready assets are stored in another bucket; the details of how that is set up are not shown to instructors. Instructors only see the bucket name for uploading assets such as images and raw video footage for production.
    • Next you see the paths within the upload bucket where the assets for each course in the group such as videos and images are to be stored. This information used to be required for manually uploading assets, but since then an automatic uploading mechanism has been implemented. We may remove this information in a future version. The complete path to where instructors upload images videos are provided as clickable links, however clicking on it does not take you to a web page where you can do anything.
    • An indication of whether the group has been set active by the publisher (checked if so), and whether all courses have passed the preflight check (yellow background means preflight check failed). You can drill down into the Courses tab to determine the reason(s) for preflight issues.
    • The course group has an image, which is displayed on every course's page when viewed by a student. This image serves to indicate to students that the courses in the group are all related.
  • Overview Video tab
    • If the video has been produced and associated with the group by the publisher then it will show.
  • Video Transcript tab
    • If the publisher has written the transcript for the group this it will show.
  • All transcripts On One Page tab
    • As an instructor you will see the all sections and lectures for your courses, and the student view of the others course in the group. You can print this page.
  • Courses

    • All the courses in this group are listed, along with summary information:

      • Database record id, for debugging.
      • Active and preflight indication
      • Course SKU – click to view the course
      • Course Title – click to edit the course
      • Instructor – click to view the instructor's home page
      • Sections – number of sections in the course
      • Lectures – number of lectures and the suggested total price
      • Free – number of free lectures
      • Ready – number of lectures that are active and pass preflight, along with their suggested total price

Creating a Course Group

While viewing a publisher configuration, use the Training Admin / Create Group menu item, or Ctrl-Alt-C to create a new course group.

Viewing a Course

Instructors see up to five tabs of information, but can only edit two tabs. The publisher is responsible for the other tabs:

  • Details – Content is set by the publisher
    • Id – for debugging
    • Abstract – 50 word description of the course
    • Price – automatically computed, can be overridden by the publisher. If the course does not pass preflight, the price has a strikethrough.
    • Project home – URL of project page, if specified
    • Repository – URI of repository
    • Instructors – clickable link to Instructor home page
    • Video directory – Bucket directory that instructors upload raw videos to. This field may be hidden in a future version of CourseCreator.
    • Images directory – Bucket directory that instructors upload images to. This field may be hidden in a future version of CourseCreator.
    • Active – A checkmark appears if the publisher enabled the content to be viewed when ready. A yellow background appears if the course fails the preflight check.
  • Video – if the overview video has been completed and associated with the course it is shown in this tab.
  • Transcript
  • Sections – The instructor can reorder the sections by dragging them, then pressing the Save button.
  • Printable Transcripts – The stylesheet has been optimized for printing as well as display in a browser. All of the sections and lectures are printed. Lectures that fail preflight are flagged in the printout.

Editing a Course

Use the Training Admin / Edit Course menu item, or Ctrl-Alt-E to edit the displayed course. Each of the tabs that are displayed contain an instance of the online HTML editor. The next section explores the editor in detail.

  • Upload drop target bar – You can upload images and the course video by dragging the asset to this bar, or by clicking on it. Multiple uploads can be performed at once, and you can switch tabs while uploading continues. Don't leave the page until all uploads have completed, or they will be canceled. Assets are uploaded to the appropriate directories, and if you upload an .MP4, it will be named after the course sku.
  • Abstract tab – 50 word description promoting the course. The course will not save unless you enter something in this area.
  • Transcript tab – Transcription of the course video. It need not be word-for-word, in fact, it should be edited for better reading, and may contain extra information. The course will not save unless you enter something in this area.

Viewing A Section

  1. You can reorder lectures by clicking and dragging them into place. As you do this, a red Save button will appear. You must press that button in order to save the new ordering.
  2. Create a new lecture by using the Training Admin / Create lecture menu item.
  3. You can transcode all the videos withing the section by using the Training Admin / Transcode all videos in section menu item.

Editing a Section

Edit the section you are viewing by using the Training Admin / Edit Section menu item, or Ctrl-Alt-E. When editing, you can change the name, which must not contain spaces, the title and whether the section is active or not. Active sections and their active lectures will appear in the table of contents.

Viewing a Lecture

You can see the public / student view of the lecture by selecting the similarly named Training Admin menu item.

You can delete the course by using the Danger zone / Delete course from database menu item.

  • Details tab
    • Id – for debugging.
    • Sku – short and long versions are displayed.
    • Title – Lecture title should be descriptive.
    • Price – Set by publisher.
    • Active – Causes the lecture to be shown in the course outline even if it does not pass preflight check.
    • Promotional – Set by publisher.
    • Optional – Indicates the lecture is not essential to completing the course.
    • Abstract – 50 word brief description of the course. Displays as tooltip in table of contents
  • Video tab – If a video has been recorded, produced and uploaded then it can be assigned to the lecture here. Assigned videos can be viewed once they are transcoded. Transcoding might take only a moment, or if the video is 20 minutes long transcoding might take up to 10 minutes. The other assigned videos for the other lectures in the group are shown below for your convenience.
  • Transcript tab – Transcription of the lecture video. It need not be word-for-word, in fact, it should be edited for better reading, and may contain extra information.

Editing a Lecture

Use the Training Admin / Edit Course menu item, or Ctrl-Alt-E to edit the displayed lecture. Each of the tabs that are displayed contain an instance of the online HTML editor. The next lecture explores the editor in detail.

You can delete the lecture by using the Danger zone / Delete lecture from database menu item.

Upload drop target bar – You can upload images and the lecture video by dragging the asset to this bar, or by clicking on it. Multiple uploads can be performed at once, and you can switch tabs while uploading continues. Don't leave the page until all uploads have completed, or they will be canceled. Assets are uploaded to the appropriate directories, and if you upload an MP4, it will be named after the lecture sku.

  • Details tab
    • Sku – must be globally unique, as with all SKUs. The lecture_ prefix is automatically added.
    • Title – A short and descriptive title is best
    • Active – Enable this when you want the lecture to show up in a course outline. If the lecture does not pass the preflight check, its contents will not display.
    • Optional – If this course can be meaningfully completed without taking the lecture then enable this checkbox.
  • Abstract tab – 50 word description promoting the lecture. The lecture will not save unless you enter something in this area.
  • Transcript tab – Transcription of the lecture video. The lecture will not save unless you enter something in this area.

Workflow

A course is a carefully structured sequence of lectures designed to provide a certain level of competence in a field of study. Students learn by doing. 'Passive learning' is an oxymoron. A typical best practice for planning a lecture with two related concepts is:

  1. Present one new concept
  2. Show how it might be used
  3. Let students play with it in a meaningful context. Let students 'get stuck' and help them become unstuck – this is a requirement for real learning.
  4. Show how the concept could be applied in a more complex or advanced context
  5. Present a second concept, following the steps listed above
  6. Integrate the two concepts and show how they work together
  7. Let students play with the integrated concepts, get stuck and unstuck

This means that videos should be structured such that students can type along with the instructor by pausing the video frequently, and a remote instructor should be available to answer questions.

Micronautics Research defines and develops course material according to the workflow described in this lecture. This workflow is not required or enforced by Cadenza. We typically experience a ratio of 180:1 for the time spent preparing a course to the length of the finished product; this means that we spend 3 hours for every minute of finished video. Of this, about 55% is typically required in order to produce the final script as read by the voice talent, complete with working code examples, and the remainder is post-production. The two Coursera courses on Scala by Odersky and friends have similar ratios of development time to finished product.

Another process could require less time, but the production value (quality) would be not be as good. At the low end of the spectrum is an expert talking freely to some key points, which is then lightly edited, and no transcript is provided. This type of low-budget production generally only requires a 2:1 or 3:1 ratio, however the signal-to-noise ratio is very low and the instructional value is also very low. Most of the other Scala videos we have seen fit this description, no doubt because costs are low and turnaround is quick. As is often true in life, you pay for what you get.

Feel free to adapt the workflow described below to your needs, and to use your own rule of thumb for time budgeting according to your resources. It is worth noting that a quality 'talking head' is one of the most expensive types of video footage, equivalent in cost to that of developing some types of animation.

ScalaCourses.com Course Development Workflow

  1. When kicking off the development of a new course, the publisher/managing editor (referred to as 'publisher') provides the high level definition of the target market, the general scope of the new course and any prerequisite and follow-on or related courses. Most courses are part of a group, and the editor defines the boundary of what material belongs to a given course, and what belongs to other courses. This boundary is subject to revision during course development, and often requires ongoing input from several course authors.
  2. Course authors propose an outline of lectures, quizzes and description of sample projects. Lectures and quizzes are grouped into sections. Sample projects are proposed which would demonstrate concepts that introduced in the lectures. If there is a larger example that is referred to in several lectures then the main points taught by the example should be described. All of the material in this stage is described in general terms.
  3. The publisher reviews the proposed outline with the authors and finds agreement on the content with the authors. A key deliverable from this step is the identification of the points that are referenced in later lectures and courses. These points need to have special attention paid to them in terms of buildup, exercises, code examples and integration with other concepts.
  4. The publisher uses the information from the authors to determine the target number of minutes/hours for the finished product for budget approval; iterate as necessary.
  5. The publisher creates the blank course in the Cadenza system, which creates AWS S3 buckets to hold assets if they have not previously been created, and creates a standard directory structure for each course group. Here is a generic directory tree of the AWS S3 bucket that authors upload to; the # represents the publisher id, which is an integer.
    #
      └── html
            └── groupName
                  └── assets
                        ├── images
                        └── videos
    All of the assets (images and videos) for every course in a group are stored together. We do this because it is not uncommon for a lecture to migrate from one course to another course within the same group. Of course, the name of the course group that you are working on will be substituted for groupName. Note that directory name are case sensitive.
  6. The publisher assigns the authors, videographers and editors to the new course in the Cadenza system, which automatically causes emails containing their login credentials to be generated. As well, the Cadenza system modifies the permissions of the course directories so the instructors, copy editors and videographers can upload their videos and images. The instructors are given the URL for a site dedicated to authoring courses, which might be separate from the site that delivers courses to students. Both the private authoring site and the public delivery site share the same database so changes made to live content will be publicly visible the next time that the delivery site is synchronized with the database.
  7. Authors compose the course text using the online HTML editors. This will become the video transcript. For best results, use the Firefox browser when editing transcripts. It is possible to use an offline editor, such as DreamWeaver, and paste in the finished web page using Firefox. Cadenza Client™ was developed for this purpose. Also see the section entitled Lecture Development Workflow for Instructors, below.
  8. The publisher reviews the material and suggests any necessary reorganization. It is best to work collaboratively so the author's time is not wasted doing unnecessary rewrites.
  9. Audio records are made of the transcript. The author might provide the voiceover, or another person with a good voice might be recorded as they read the material. Recommended specs are: WAV or AIFF format, 32-bit floating point, 24-bit depth. Hardware compression should be used if possible.
  10. The producer might ask the original author to capture the screen for certain portions of the transcript (without sound). We suggest MP4 format video at 1920x1080 (HD), 30 fps. Specs are:{Codec: H.264, CodecOptions: {MaxReferenceFrames=3, Profile=main, Level=3.1}, KeyframesMaxDist: 90, FixedGOP: false, BitRate: 2200, FrameRate: 30}.
    1. For ScalaCourses.com instructors that use Mac and Windows we provide a license for SnagIt which can do the necessary video capture and light editing of live coding sessions.
    2. For capturing with Linux, here is a script that should work – you might need to tune some settings for your machine, or you might get lucky. You can also try this. Assuming there is a symlink for your webcam, the following will capture the video. You might need to use some of the command-fu in the gist to capture the audio from your webcam, if you don't get any:
      sudo ffmpeg -f video4linux2 -i /dev/video0 myvid.mp4
      Here is another incantation to try:
      ffmpeg -f x11grab -s wxga -r 25 -i :0.0 -sameq myvid.mpg
  11. Authors upload the raw videos to the course directory in the publishers' upload S3 bucket. Authors can use the Amazon S3 Console browser client, aws-cli or third party products such as the free CloudBerry S3 Explorer or Dragon Disk to upload.
  12. Authors update the transcription from the recording and include images into the transcript from the AWS S3 bucket.
  13. The publisher reviews the raw audio and video recordings as they are generated. Authors might re-record some/all of the recordings at the publisher's request. The publisher should give early warning if this is required, so the authors can adjust before they create many flawed recordings. Audio quality is the most important aspect of a recording.
  14. The publisher assigns a copy editor to clean up the grammar and spelling and the HTML.
  15. The publisher assigns a videographer to do post-production.
  16. We release the course for early access when the transcripts are 30% complete; at this stage there are usually no videos available. Students who sign up for early access are quite forgiving, and we listen to their feedback very closely. Early access students provides us early revenue and early feedback on the course, both of which are invaluable.

Detailed Lecture Development Workflow

This section describes the above workflow as it applies to a single lecture, which might be proposed, defined, created, reviewed and released:

  1. An instructor creates a new lecture (proposal) in Cadenza.
    1. Don't make it public.
    2. Write the abstract so the goals are clear.
    3. Write an outline in the transcript area.
    4. Decide where the code will live in the course's git repo and create a file to hold it. It's fine to have files that have no public references in the git repo.
    5. Check in any source files that might exist at this point.
  2. The instructor meets with the publisher to review the lecture's goals, rationalize against other lectures, the course goals, and goals of other courses.
  3. Assuming the lecture proposal makes it past the previous checkpoint, the instructor gathers code examples, image assets and written passages, block out exercises, and drops them into the lecture outline.
  4. The instructor meets with the publisher to review material for proposed lecture, estimate length of completed video, decide if proposal is go/no-go.
    1. If go: the instructor refactors as required, including possibly splitting the lecture into several lectures.
    2. If no-go:
      1. If material worth keeping:
        1. Instructor move transcript material and code into other lectures, or just keep the hidden lecture as is.
        2. If other lectures are public, the instructor tweets ("Transcript augmented").
      2. If material not worth keeping, the instructor deletes the lecture and code from the git repo.
  5. The instructor writes the draft transcript and fills out sample code and exercises. Note that the transcript might show code in the REPL, while the code is actually delivered as a .scala file or separate SBT project.
  6. The instructor ensures the code compiles and runs (for example, REPL scripts and .scala files).
  7. The publisher reviews the draft abstract, transcript and code.
  8. Code review by other instructors and invited outside reviewers.
    1. Refactor, style check.
    2. Sync code with transcript.
    3. Renumber REPL temporary variables so the sequence is monotonically increasing.
  9. The instructor uploads any remaining image assets and places lower resolution versions in the lecture transcript.
  10. The copy editor edits grammar and corrects spelling in the abstract and the transcript.
  11. The instructor updates the transcript with links to other lectures and external web pages.
  12. The publisher reviews the abstract, transcript and code of the proposed lecture, which is now a release candidate.
  13. The copy editor and instructor edit the abstract, transcript and code as required.
  14. If external technical reviewers are available:
    1. Provide them access to the release candidate lecture (transcript and code) and define their goals.
    2. Interact and gather feedback and solicit changes to code and transcript.
    3. Review feedback.
    4. Fold in feedback as appropriate.
    5. Review of abstract, transcript and code.
    6. Edit abstract, transcript and code as required.
  15. Make lecture visible to students.
    1. Write release note ("transcript is ready").
    2. Tweet release note.
  16. If multiple lectures are being developed, pause the process until all other lectures reach this point. This means that no production or post-production happens until all the scripts are finalized.
  17. Create Adobe Premiere Pro project for lecture.
    1. Decide on visual theme for lecture.
    2. Upload additional assets to support theme.
      1. Insert low resolution version into transcript.
    3. Define Adobe Premiere Pro segments.
      1. Lay out high-resolution version of assets.
  18. Record audio of talent reading the script.
  19. Edit audio recordings.
    1. Remove pauses, "um", "ah" and any redundancies.
    2. Retake erroneous passages.
    3. Patch in missing passages.
    4. Update transcript as required.
    5. Do not normalize audio levels yet.
  20. Insert audio files into Adobe Premiere Pro segments.
  21. Record any live video segments and insert into Premiere Pro project segments.
  22. Create animation layer(s) in Premiere Pro project for each segment.
  23. Review Adobe Premiere Pro project.
  24. Normalize audio levels for each segment in Premiere Pro project.
  25. Render completed video, upload and transcode.
  26. Final review.
    1. Ensure the abstract sells the lecture.
    2. Add references to this lecture into the transcript of referenced lectures.
    3. Edit grammar and correct spelling of the abstract and transcript.
  27. Write release note ("Video published").
  28. Tweet release note.
  29. Publicly thank reviewers and send out money, as appropriate.

New Authors

  1. Create a new set of AWS credentials using IAM. No special policy is required. Remember their keys!
  2. Use the S3 Manager to modify the policy for the upload bucket so a line like the following is added to the 2nd and 3rd paragraphs:
    "arn:aws:iam::031372724784:user/userId",
  3. Send the instructors an email that looks like this:

Dear Generic Author:

Thank you for agreeing to write for GenericPublisherName. Your userId for the online course creator (Micronautics Cadenza) is xxxx and your password is yyyy. Please sign on at http://genericAuthoringUrl.com. Note that this is a separate site from the publicly visible site at http://genericCourseDelivery.com, however both sites share the same database so changes you make will be publicly visible as soon as you save changes, provided the content is live.

Please review the Cadenza documentation that shows you how to work with Micronautics Cadenza.

You can upload raw video footage to the genericAwsS3Bucket AWS S3 bucket. Our videographers will download, edit and produce the footage, and will then upload the finished videos such that they are associated with the HTML transcripts.

Your credentials for the AWS S3 bucket that you will upload your videos and images to are:
User id: zzzz
Access key: SJLDFLJFDLJSDLF
Secret key: LSKDFUOESJFLEIFD

You can use the Amazon S3 Console browser client, or third party products such as the free CloudBerry S3 Explorer to upload.

Here is the directory tree of the AWS S3 bucket that you will work with when uploading. Of course, the name of the course group that you are working on will be substituted for groupName:

1
  └── html
        └── groupName
              └── assets
                    ├── images
  	                 └── videos

Please contact me if you have any questions.

Yours truly,

Generic Publisher

Partners

Buttons can be generated by various HTML tags, including <button>, <input> and <a href>. CSS stylesheets can be used to apply styles to the buttons. JavaScript, including JQuery, can be used to generate and/or operate the buttons, or they can merely consist of 100% HTML. In any case, a GET request to the Cadenza instance's /cart/add/course/ action must be performed, passing the course ID to be added to the shopping cart as the last token. In addition, the query string must include the partner's name as the value of the partnerCode field. Please contact sales@micronauticsresearch.com for more information about Cadenza business partners.

For example, ScalaCourses.com's  Introduction to Scala course has ID 40. In this example, bigcorp is the partner code for a business partner who has a revenue sharing agreement with ScalaCourses.com. The URL to add the course to a shopping cart is:

https://scalacourses.com/cart/add/course/40?partnerCode=bigcorp

If the business partner provides a logo, that logo will appear in any user shopping carts that receive items from the business partner's site. The logo should be wide and not very tall. Here is the default CSS that controls the display of the logo:

.distributorLogo { height: 75px; }

The shopping cart will look something like the image below when the logo is displayed.

Following are some examples of how to create Enroll buttons.

Without Javascript

Use the URL shown above in a link, like this:

<a href="https://scalacourses.com/cart/add/course/40?partnerCode=bigcorp" title="Introduction to Scala">Enroll</a>

Here is an example of an Enroll button using Bootstrap's btn and btn-warning classes for formatting and an an a href tag to issue the GET request:

<a href="https://scalacourses.com/cart/add/course/40?partnerCode=bigcorp"
                  class="btn btn-warning" title="Introduction to Scala">Enroll</a>

Here is a live link that uses the above HTML: Enroll

Using JQuery

This example uses <button> tags. The buttons must have class="scalacoursesBuyNow", and an attribute called data-course-id that specifies the course ID. The exact version of JQuery is not important, so long as it is relatively recent.

Sample Page

This example uses Bootstrap's btn and btn-warning classes for formatting. The GET request is issued when the assignment is made to window.location.

<head>
  <script src='https://cdn.jsdelivr.net/webjars/jquery/1.11.1/jquery.min.js'></script>
  <script>
    var urlPrefixSC = "https://www.scalacourses.com";
    var partnerCodeSC = "bigcorp";
    $(function () {
        $(".scalacoursesBuyNow").click(function() {
        window.location = urlPrefixSC + "/cart/add/course/" + $(this).data("courseId") + "?partnerCode=" + partnerCodeSC;
      });
    });
  </script>
</head>
<body>
  <button class="scalacoursesBuyNow btn btn-warning" data-course-id="40" title="Introduction to Scala">Enroll</button>
  <button class="scalacoursesBuyNow btn btn-warning" data-course-id="45" title="Intermediate Scala">Enroll</button>
  <button class="scalacoursesBuyNow btn btn-warning" data-course-id="39" title="Introduction to Play for Scala">Enroll</button>
  <button class="scalacoursesBuyNow btn btn-warning" data-course-id="56" title="Wildcard SSL Certificates for Federated Services">Enroll</button>
</body>