====== openedx ======

  * [[https://liberidicomunicare.csgalileo.org/|liberi di comunicare]]
    * user: stefano.scipioni@csgalileo.org
    * pass: e.... 
  * ssh ubuntu@10.45.103.201
====== documentazione ======


https://edx.readthedocs.io/projects/edx-installing-configuring-and-running/en/latest/front_matter/index.html

https://docs.tutor.overhang.io/



==== Installazione ====
Requisiti: docker, libyaml-dev

<code>
$ systemctl start docker
$ pip install tutor[full]
$ tutor local quickstart
</code>

Account amministratore:
<code>
$ tutor local createuser --staff --superuser admin admin@mail.test
</code>

Installare il modulo per mostrare quiz dentro a un video:
<code>
$ tutor local stop
$ tutor config save --set OPENEDX_EXTRA_PIP_REQUIREMENTS="- git+https://github.com/openedx/xblock-in-video-quiz.git"
$ tutor images build openedx
$ tutor local start -d
</code>

Aprire nel browser:
  * local.overhang.io
  * studio.local.overhang.io

Abilitare il modulo in-video-quiz
  * Andare sull'editor del corso (Studio)
  * Aprire il menù Settings > Advanced settings
  * Nel campo Advanced module list scrivere ["invideoquiz"]

=== Aggiungere un quiz dentro a un video ===

  * Nell'editor del corso aggiungi un componente video e dei componenti quiz alla tua unità
  * Clicca Preview
  * Per ogni componente apri Staff Debug Info e copia la stringa ID alfanumerica
  * Torna sull'editor
  * Vai su Add New Component > Advanced > In-Video Quiz XBlock
  * Nel campo Video Location inserisci l'ID del video
  * Nel campo Problem timestamp definisci il JSON che associa il timemap (in secondi) all'ID del componente quiz da mostrare, esempio: {"10":"19faa4d0f8cb42f1a4593bdcb7830650"}


Mostrare lista corsi:
<code>
$ tutor local run cms ./manage.py cms dump_course_ids
</code>
Eliminare un corso:
<code>
$ tutor local run cms ./manage.py cms delete_course [id corso]
</code>

==== Installare xblock-in-video-quiz e xblock-adventure ====
<code>
$ tutor local stop
$ nano $(tutor config printroot)/config.yml
</code>
Aggiungere al file le seguenti righe:
<code>
OPENEDX_EXTRA_PIP_REQUIREMENTS:
- git+https://github.com/openedx/xblock-in-video-quiz.git
- git+https://github.com/openedx-unsupported/xblock-ooyala.git
- git+https://github.com/openedx-unsupported/xblock-mentoring.git
- git+https://github.com/openedx/xblock-adventure.git
</code>
Salvare la configurazione:
<code>
$ tutor config save
$ tutor images build openedx
$ tutor local start -d
</code>

==== Aggiungere immagini a un quiz ====
<code>
( ) <img src="..." width="200px" />
(x) <img src="..." width="200px" />
( ) <img src="..." width="200px" />
</code>

=== Quiz a immagini disposte orizzontalmente ===
Creare un quiz, passare alla modalità Advanced (xml) e aggiungere lo stile css:
<code>

<problem>
<multiplechoiceresponse>
  <p>Question...</p>
<choicegroup type="MultipleChoice">
    <choice correct="false"><img src="..." width="200px" /></choice>
    <choice correct="true"><img src="..." width="200px" /></choice>
    <choice correct="false"><img src="..." width="200px" /></choice>
  </choicegroup>
<style>
.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup .field {
    float: left;
    margin-right: 10px;
}
</style>
</multiplechoiceresponse>
</problem>

</code>

==== In-video quiz con immagini e non scrollabile ====

<code>

<problem>
<multiplechoiceresponse>
  <p>Question...</p>
<choicegroup type="MultipleChoice">
    <choice correct="false"><img src="..." width="200px" /></choice>
    <choice correct="true"><img src="..." width="200px" /></choice>
    <choice correct="false"><img src="..." width="200px" /></choice>
  </choicegroup>
<style>
.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup .field {
    float: left;
    margin-right: 10px;
}
.xmodule_display.xmodule_ProblemBlock h3.hd-3 {
  display: none;
}
.xmodule_display.xmodule_ProblemBlock div.problem-progress {
  display: none;
}
.xmodule_display.xmodule_ProblemBlock div.problem {
  padding-top: 0px;
}
.xmodule_display.xmodule_ProblemBlock div.problem p {
  font-size: 1.35em;
  font-weight: 600;
}
.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .indicator-container {
  display: none;
}
</style>
</multiplechoiceresponse>
</problem>

</code>