This is a repository for Acos server tool called "code annotation tool". With this tool course instructors can easily create annotations that highlights specific parts of a program code.
Please note that the tool is just for previewing the code annotations. It does not actually create any HTML or CSS which you could copypaste somewhere. Instead, the tool generates both RST and spesific JSON object. The RST can be used within A+ Learning Management System with help of spesific rst tools. The JSON is used within Acos and the actual JSON handling is done by spesific code annotation Acos content type.
You can test the deployed version (from master branch) of the tool here
The tool generates following JSON.
<name_of_the_object> = [
{
language: ''
},
{
content: '',
annotatedContent: ''
},
{
annotations: []
}
]
In acos root folder:
git -C node_modules clone https://github.com/sormpe/acos-annotation-tool.git
cd node_modules/acos-annotation-tool/app
npm install
Postinstall script build generates a build version of the app. After that the tool can be found in <acos_server_url>/code-annotation-tool/
The usage of the tool is simple: You can write, paste or edit plain text or program code with the editor which is located to a left side on the tool. In right side there is a preview view. The tool generetes preview in real time, and shows how code annotations will look like in Acos server.
Select or multiselect part(s) of the text/code in the editor and click 'add annotation' button which creates a block for the selected part(s). The you can write your annotation (i.e explanation) which can includes HTML tags, such as those for adding typographical emphasis or URLs to other resources online. In preview view you can see the block below the text/code. The user can hover this block - and while hovering - the selected part of the text/code will be highlighted. You can also remove or change order of the annotations.
Basically you just copy the generated JSON and paste it to a spesific content package. As a reference, please see sample content package and especially its content. There you can see sample JSONs which were generated with this tool.
Edit nesseccary meta information of the package and publish package in Acos.
https://github.com/sormpe/acos-code-annotation
https://github.com/sormpe/acos-code-annotation-sample
The MIT License (MIT). Please see License File for more information.