Forum Discussion
Perpetual Notepad for Storyline
Hi, here’s a simple Storyline 360 notepad in JavaScript:
- It is designed to be 720×540 and centred for use on a lightbox slide.
- It provides persistent notes across the course via localStorage.
- Multiple notes are allowed: the learner can create / rename / delete / switch notes.
- It has an advanced editor: font, size, colour, highlight, bold/italic/underline, lists, align, clear formatting and custom Undo/Redo (to 10 levels).
- The learner can export the current notes or a selection of multiple notes into a Word document.
- It has a built in close button that (a) flips a Storyline variable CloseNotepad (which you need to create).
- Optional SL variable can be created to sync content across your course: NoteTitle, NoteBody, NoteId.
The code can be found in the Execute JavaScript trigger on the lightbox master slide. It also requires a trigger to reset the variable CloseNotepad back to false. Everything can be found in the attached file.
If you find this useful, please let me know. I'll also upload a version that can be used in Rise 360.
9 Replies
- ThierryEMMANUELCommunity Member
Hi JoeDey . In my opinion, this is not a “simple” notepad but a huge piece of work. Thank you very much for generously sharing it. I have downloaded it and will study it closely. Not being a coder, I am always interested in how I can (possibly) modify the code “my way.” So, give me a few hours/days to explore it, and I will let you know how useful I found it. Thanks again.
- JoeDeyCommunity Member
Hi Thierry Emmanuel, I'm glad you found it useful. I've added a couple more below that might be of interest. The D3 file is the same notepad but which is designed to be imported into Rise as a Storyline block. The .docx file contains the HTML code for a smaller version of the notepad with fewer features. Both can be used multiple times, and they can for example be used by the student to write and save continuous notes, and or multiple different versions of notes anywhere in the course. Just insert as many notepads as you need.
Just copy and paste the HTML code from the Word document into a Rise Code block. That's it!
I would appreciate any feedback and I hope you find these useful too.
- KendalRasnake-1Community Member
Thank you.
- AshleyWarrenCommunity Member
This is great, thanks for sharing! Can the Rise version be used in a custom block?
- JoeDeyCommunity Member
Glad you find it useful. I don't think a custom block accepts HTML code just yet. So no, I don't think it will work in it.
- ReneYappatARTCommunity Member
As a compulsive note taker myself, I value the ability to take notes and then download them at the ned of the end of the course. This would be very helpful for me to use with the videos I include in th course so that learners could note what was valuable as they watched the video.
- andyholgateCommunity Member
This is brilliant, thanks so much for sharing.
Is there anyway to get the RISE version to save to a word document so that the user can download their notes? Thanks - JoeDeyCommunity Member
Have a look on the master slide. The code allows you to change the size of the note, background colour etc. I think I set the background colour on that version to transparent, which allows the notepad to adopt your Rise background.
Try copying the code to ChatGPT and giving it some suitable instructions and see how you can develop it. Post your new version here for all to see.
Related Content
- 21 days ago
- 22 days ago
- 20 days ago
- 9 months ago
- 10 months ago