Browser-based LaTeX-editor for TUMexam Intermediate talk for the - - PowerPoint PPT Presentation

▶
browser based latex editor for tumexam
SMART_READER_LITE
LIVE PREVIEW

Browser-based LaTeX-editor for TUMexam Intermediate talk for the - - PowerPoint PPT Presentation

Sep 15, 2023 243 likes •402 views

Chair of Network Architectures and Services Department of Informatics Technical University of Munich Browser-based LaTeX-editor for TUMexam Intermediate talk for the Bachelors Thesis by Adrian Pesch advised by Dr.-Ing. Stephan Gnther,

slide-1
SLIDE 1

Chair of Network Architectures and Services Department of Informatics Technical University of Munich

Browser-based LaTeX-editor for TUMexam

Intermediate talk for the Bachelor’s Thesis by

Adrian Pesch

advised by Dr.-Ing. Stephan Günther, Maurice Leclaire, Benedikt Jaeger, Johannes Naab Monday 25th November, 2019 supervised by Prof. Dr.-Ing. Georg Carle Chair of Network Architectures and Services Department of Informatics Technical University of Munich

slide-2
SLIDE 2

Introduction

Create an exam without a LaTeX web editor:

  • 1. (Install texlive-full)
  • 2. (Install Git [2] and familiarize with it)
  • 3. Download the exam template
  • 4. Edit the template locally
  • 5. Upload the modified template
  • A. Pesch — LaTeX-editor for TUMexam

2

slide-3
SLIDE 3

Introduction

Create an exam without a LaTeX web editor:

  • 1. (Install texlive-full)
  • 2. (Install Git [2] and familiarize with it)
  • 3. Download the exam template
  • 4. Edit the template locally
  • 5. Upload the modified template

Motivation & Objectives:

  • Improve workflow
  • Decrease time spent on exchanging the exam
  • Start quickly using pre-defined controls and easy to use features
  • Availability of version control for non-Git-users
  • A. Pesch — LaTeX-editor for TUMexam

2

slide-4
SLIDE 4

Introduction

Create an exam without a LaTeX web editor:

  • 1. (Install texlive-full)
  • 2. (Install Git [2] and familiarize with it)
  • 3. Download the exam template
  • 4. Edit the template locally
  • 5. Upload the modified template

Motivation & Objectives:

  • Improve workflow
  • Decrease time spent on exchanging the exam
  • Start quickly using pre-defined controls and easy to use features
  • Availability of version control for non-Git-users

Create an exam with a LaTeX web editor:

  • 1. Open the web editor
  • 2. Edit the exam online
  • A. Pesch — LaTeX-editor for TUMexam

2

slide-5
SLIDE 5

Demo

Figure 1: TUMexam [1] modified to include a LaTeX-editor

  • A. Pesch — LaTeX-editor for TUMexam

3

slide-6
SLIDE 6

Conclusion

Remarks:

  • PDFs can be rendered server- and client-sided
  • Easy to use:
  • Drag & drop to insert, move or upload files and move folders
  • SyncTeX [6] to jump from PDF to code and vice versa
  • Quick switch between build targets
  • Jump to warnings’ or errors’ sources from the build log
  • Git in use in the background (commits are triggered on specific user interaction)
  • A. Pesch — LaTeX-editor for TUMexam

4

slide-7
SLIDE 7

Conclusion

Remarks:

  • PDFs can be rendered server- and client-sided
  • Easy to use:
  • Drag & drop to insert, move or upload files and move folders
  • SyncTeX [6] to jump from PDF to code and vice versa
  • Quick switch between build targets
  • Jump to warnings’ or errors’ sources from the build log
  • Git in use in the background (commits are triggered on specific user interaction)

Next steps:

  • Enhance user experience, e.g.
  • Icons instead of text controls
  • Feedback in case something goes wrong
  • Improve overall design
  • Configuration dialog
  • Multiple Choice task creation assistant
  • Version history (view Git commits)
  • A. Pesch — LaTeX-editor for TUMexam

4

slide-8
SLIDE 8

Appendix

Further enhancements

  • Real-time collaboration
  • Fully guided exam creation
  • LaTeX compilation in browser (offline mode)
  • WhatYouSeeIsWhatYouGet web editor
  • A. Pesch — LaTeX-editor for TUMexam

5

slide-9
SLIDE 9

Appendix

Controls Files Code PDF

  • A. Pesch — LaTeX-editor for TUMexam

6

slide-10
SLIDE 10

Appendix

Controls

  • Status of build and current file
  • Enter fullscreen
  • Switch build target
  • Add a new problem or a sub-problem
  • Zoom-in/out the PDF
  • A. Pesch — LaTeX-editor for TUMexam

7

slide-11
SLIDE 11

Appendix

Files

  • Upload files by dragging
  • Move files around via drag & drog
  • Context menu on right click to
  • Upload files
  • Add & delete files and folders
  • Rename & move files and folder
  • Show hidden files and folders
  • Drag TeX or image files into Code view
  • A. Pesch — LaTeX-editor for TUMexam

8

slide-12
SLIDE 12

Appendix

Code

  • Using Ace [3] code editor
  • File saved automatically
  • Modification triggers build and rendering of PDF
  • No real-time collaboration but prevents multi user editing
  • A. Pesch — LaTeX-editor for TUMexam

9

slide-13
SLIDE 13

Appendix

PDF

  • PDF view via PDF

.js [4] (client-sided-rendering)

  • PDF view via images (server-sided-rendering) using pdftoppm [5]
  • Jump from PDF to Code and vice versa by double-clicking
  • A. Pesch — LaTeX-editor for TUMexam

10

slide-14
SLIDE 14

Bibliography

TUMexam App on Gitlab https://gitlab.lrz.de/tumexam/app Last cloned on 12/11/2019 Git - Reference https://git-scm.com/docs Last accessed on 22/11/2019 Ace - The High Performance Code Editor for the Web https://ace.c9.io Last accessed on 22/11/2019 PDF .js - Mozilla’s PDF Reader https://github.com/mozilla/pdf.js/ Last accessed on 22/11/2019 Command-line tool pdftoppm https://linux.die.net/man/1/pdftoppm Last accessed on 22/11/2019 SyncTeX Official Website http://itexmac.sourceforge.net/SyncTeX.html Last accessed on 24/11/2019

  • A. Pesch — LaTeX-editor for TUMexam

11