Learning Journal In Rise

Dec 05, 2018

UPDATE JUNE 2020:

Firstly, Articulate recently implemented a small update to Rise. As a result, all new exports from Rise will need to include the most recent version of LearningJournal.js which is found at the usual link.

Secondly, at any time Articulate could update their code and bring a breaking change to the Learning Journal. Over a year ago, I shared this functionality freely with the community and the code comes with no warranty or support either implied or expressed. If at any time you want or need to remove the Learning Journal from your modules, simple remove any STATEMENT-NOTE entries that refer to the Learning Journal.

* * * *

 

I built a cool Learning Journal feature for Rise that has been very well-received. I thought I'd share it in case anyone wanted to a. use it or b. improve on it.

 

The Learning Journal allows the learner to enter text responses to journal prompts throughout a Rise course. At the end of the course, the learner can print their learning journal of all their responses. The responses are saved to the browser so that they persist on future visits to the Rise course.

 

EDIT May 2019: At the request of a member of the forum, I created a HOW-TO video below that shows each step of the HOW-TO document in action.

 

Example Rise Course
http://amelangrise.s3.amazonaws.com/learningjournal/index.html

HOW-TO Document
https://github.com/mikeamelang/learning-journal/raw/master/Learning%20Journal%20HOW-TO.docx

HOW-TO Video

https://360.articulate.com/review/content/33873893-2ea1-46d9-9415-3efca951d74c/review

Learningjournal.js file (right-click and save)

http://raw.githubusercontent.com/mikeamelang/learning-journal/master/Learningjournal.js

Learningjournal.css file (right-click and save)
http://raw.githubusercontent.com/mikeamelang/learning-journal/master/Learningjournal.css

Project github site
https://github.com/mikeamelang/learning-journal


I would love any feedback and help to improve the functionality and code.

Mike Amelang

279 Replies
Drew K

Interesting, my journal is working but looks like Shakira's just above.  Noticed my .css file was actually saved as a .txt.  

(renaming as .css didn't work) So I saved-as .css using notepad++.   replaced the files, rezipped the packaged an loaded to LMS.  Now the nornal is not working and I see the Note containers with my journal code as entered in Rise.

 

Nicola Fern

Hi Mike

Love your solution here, it's excellent and absolutely the sort of thing Rise should be including by default by now...

Quick question - I found it very easy to set up the journal and customise it as needed, I just want to know - is it expected behaviour for the script to remove ALL notes statements whether they contain the specific text labels identified or not?

In other words, if I use the journal, I can't use notes statements elsewhere in the course?  

Thanks

Nic

Michelle Galeazzi

Hi Mike

We have a lot of reflection checklists in the Rise 360 course... There's no right or wrong answer to them as everyone completing will have a different opinion (hence why they're reflection checklists). I would love to be able to collate the responses from within the module (similar to your journal entries) and then have a print button at the end. Given your experience, do you think that this would be possible with the right know how?

Nicola Fern


Hi Michelle

Thanks for the info. I just set this up today and I had a number of the note statements in my module summary section and none of them were visible with the journal script applied. 

I hadn't made any changes to the code beyond changing fonts and colours, and re-labelling the buttons in the javascript file.

The ones I had in were just text-based and definitely didn't have any of the relevant text labels in them. 

Weird!

Nic

Mike Amelang

Nicola and Michelle,

Thanks for finding this bug regarding all notes being removed! I can't truly test it currently because I no longer live in the learning development world and have no access to Rise. Can you use this test file to test whether non-Learning Journal notes appear as expected?

(link removed)

Mike

Mike Amelang

Michelle,

That is very achievable. In fact, a couple years ago, I extended the functionality of the Learning Journal to include both checkboxes and Madlibs. Here is the version that includes both those features. Simply search for the word "checkbox" to see all the code in the file related to the checkboxes. If the "Part" field is set to 1, the checkbox is clickable. But later in the course if the same ID is used but the "Part" field is set to 2, the checkbox is read-only, allowing you to display all the checkbox results at the end. Warning: this is from a stale, 2-year-old branch of the Learning Journal and therefore simply replacing your LearningJournal.js file with this file will fail. But it's a good start.

Mike

Michelle Galeazzi

Hey Nic

Am trying to get my head around these files and how to manipulate them - I noticed that you have altered the font.... any tips on that? I have tried a few things but it didn't work - keep in mind I have NO idea about these things... seems stupid to have to pay a developer to do just that for me but will if we need to....

Thanks Michelle

Nicola Fern

Hi Michelle,

This is super easy to do with a little CSS.  You need to add some basic css properties to the Learningjournal.css file.  As an example, I changed the journal prompt text to be Open Sans and bold, and to change the color of the prompt box:

.journalentry-prompt {
color:rgb(85, 54, 132);
font-family:'Open Sans';
font-weight: 700;
margin-bottom:15px;
}

Sometimes you might need to add !important to the end of a property, before the semicolon if your change doesn't work. This happens if another style is applied at a different level than your changes are being made at - which can override your change. The !important attribute will usually work to make your change the prime one.

You can make quite a few changes with CSS.  With this code, I changed the print buttons to:

  • Make them purple
  • Give them a rounded appearance with the border-radius property
  • Changed the text to be uppercase, bold and with font 'Lato'

See below:

.journalprintbutton {
padding: 5px 10px;
background-color: #68246d;
display: inline-block;
margin-bottom: 15px;
color: white;
margin-right: 20px;
padding-left: 20px;
padding-right: 20px;
border-radius:30px;
font-size:1.2rem;
text-transform: uppercase;
font-family: 'Lato';
font-weight: 700;
}
Nicola Fern

Hi Louis

I would suggest that the way to do this would be one journal with a new section per module/chapter?  And then have the download link available at the end? There's probably no harm in having the download button in each module as it would also end up slowly concatenating each section as it was completed?

Nic

Michelle Galeazzi

Hi Mike... sorry I should have been more specific. I am looking for the journal to be able to be emailed to the individual learner - eg different email address each time. This looks like it will simply email to a hard coded address (not different ones per learner). Hope that this makes sense....

Adam Osborne

Yes.  Did all those steps correctly I think.  Sorry for not giving much description before. It's hard as I don't know where I went wrong.  Here's a few questions/considerations:

  1. Do the notes have to be case sensitive?
  2. When creating the notes does it matter if you do a soft return or hard return (When I do a hard return, the note shows the PLUS sign.
  3. Probably due to security, my work laptop wouldn't let me strictly download the JS file so I opened it instead and saved it in Notepad with the extension of JS.  Will that be an issue?
  4. The CSS file saved itself as TXT. I figured that wouldn't work so I also opened it in Notepad and saved it as CSS instead. 
  5. Does it matter what scorm type/version I output to (Scorm 2004 / 1.2)?

Let me know if any of those steps would have broken it.  I did add the code to the HTML file exactly as indicated and re-zipped the package exactly as indicated though.