this PR close #2

The idea is to use paste event and then grab the files object from event.clipboardData

[praesentia.js]
....
const target = document.querySelector('body');

target.addEventListener('paste', (event) => {
    let paste = event.clipboardData || window.clipboardData;

    if(paste.files.length > 0) {
        html5QrcodeScanner.html5Qrcode.scanFile(paste.files[0], true)
        .then(decodedText => {
            processingDecodedText(decodedText)
        })
        .catch(err => {
            swal.fire('Error', 'Cannot read QR Code, Please make sure paste only the QR Code', 'error');
        });
    }
});
....

When the file object exist, call method scanFile from class html5Qrcode. it will return decodedText if successful and when fail will call swal.fire

CAUTION

html5Qrcode instance is private field from html5QrcodeScanner see this file on line (87). the problem can be solved by creating html5Qrcode directly (use Pro Mode as it says on the documentation)

For demo visit this link

In this PR, I tried to tidy things up especially the UI. As a follow-up of #9, in sum, this PR have done the following things:

• UI adjustment: added a select box for selecting a QR source and moved the auto submit checkbox to the bottom of the page
• Auto submit checkbox state is now persistent by utilizing localStorage
• Refactored praesentia.js
• I also re-organized the static files for nimiq/qr-scanner as it looks quite messy (this should be in another PR, but I guess that's okay)

Using package called stream-display to getDisplayMedia that sends screen video feed as ImageData then changed to ImageBitmap so can be decoded with nimiq/qr-scanner

For this PR, I add 2 features

• Share Screen as mentioned in #1
• Auto Submit (using share screen)

I am not really a fan of web designing, but I believe that the front-end side of Praesentia is getting a bit more overwhelming as the features increase.

Implementing a front-end framework will make the code cleaner and easier to maintain. If someone could wire up a PR for it, I would really appreciate that!

html5-qrcode seems unable to detect or locate QR code on some screenshot (including one from Google Meet) that actually do contain a single QR code. Cropping the image seems to fix the problem, but that isn't a solution.

I have recently faced a problem where I have to share my username and password when trying to "ensure" my presence.

This PR has mainly changed the logging in logic. This PR contains changes that made it possible to log in with a session token instead of a username and a password. This way, if in some scenario, a user won't have to share their credentials.

A "session token" is actually just a string comprised of a logged in SimasterQRPresence instance's session_id and group_id. Some new methods (a way to serialize and deserialize a session token) have also been added to simaster.py file.

From the front perspective, the home.html has also been changed. After logging in, there will be a small text displayed on the alert box that contains the last session token.

This PR fixes #17. It turns out that the bug is caused by a bad logic in the processQrImage() function. The function will always execute $('#btnStopScreenSharing').click(); which also triggers stopCapture(). If capture is not already initialized (by starting to share screen), the processQrImage() will always end up in an error.

Summary

1. processQrImage() function won't call $('#btnStopScreenSharing').click(); by itself
2. processQrImage() function now returns a Promise that indicate the status of the QR scan
3. To compensate point (1), small necessary adjustment is done to the scanVideoStream() function.

The QR scanning via image file is not working if a screen sharing has not started yet. This happens after the merging of #11.

How to reproduce

1. Open the main page
2. Select a file that contains a QR code
3. It should show an error box.
4. Select screen sharing as a QR source, then start sharing and stop sharing right after it started.
5. Change the QR code back to image file, then select the same file as in step 2.
6. The QR data should be detected (no errors)

This PR added some files needed to deploy Praesentia on Heroku platform. The README file is also updated to contain the new Heroku deployed version of Praesentia.

Fixes: #15

I am thinking about moving the demo site to a much more reliable place. Platforms like Heroku or something else that's free may be a good idea. This is important because I myself relies on my unreliable Raspberry Pi home server. I think other users are also using the demo. Improving server reliability will definitely improve user experience.

Summary

As a follow-up of #5, this PR removes the implementation of mebjas/html5-qrcode due to its unreliability in scanning QR codes especially when the QR code is in a Google Meet screenshot. As its replacement, this PR implements nimiq/qr-scanner as advised in #5.

Some tests have been performed on this implementation. Those tests have proved an increased reliablity when scanning QR code. All QR code that can't be scanned by mebjas/html5-qrcode can be scanned by `nimiq/qr-scanner

As a consequence of this library switch, a significant portion of the UI have also been adjusted. The in-place camera scan (provided by default by the previous library) has also been removed and replaced by a classical file input (scanning by camera is still possible, just not directly in the browser).

Fixes: #4 #5 Signed-off-by: Faiz Jazadi [email protected]

To compensate for #23, it would be nicer if one could easily scan QR through screen sharing lazily. The lazy feature is required because sometimes Praesentia mistakenly scans for the lecturer's QR code.

To-do: only invoke stopCapture() when a QR is successfully scanned

For the last few days, I noticed that I can't scan (using Praesentia) a QR code. It seems that the age of a QR code has been decreased, it lasts for appoximately 30 seconds before then becomes invalid (or shows a "galat" message).

Temporary workaround

The temporary warkaround to this problem is to scan the QR code faster. The use of the screen sharing method combined with auto-submit will improve the overall scanning speed.

When developing Praesentia, this question often arise: "Is it legal?"

This project is initially meant to help UGM students, but its legality is still a concern. This project will be considered legal if it does not violate the UGM's regulations. If it is not legal, then there is no point of developing the project.

If anyone could confirm the legality of this project or just wants to ask a question about the project, please don't hesitate to discuss it in this issue.

Currently, Praesentia was only able to process a given QR code. I would like to propose a feature where one could share their QR code. The QR code is shared in the form of a URL, for example: https://lcat.dev/praesentia#thisIstheQRData Or, the QR data can just simply be copied to the clipboard (or maybe even an image of the QR code).

This proposed feature will make it easier for someone to share a QR code.

I have this little idea currently sparking in my head. Just wanted to share it here just in case someone might want to contribute or add their ideas.

What if Praesentia was built as a browser extension that doesn't even need a server?

I also wanted it to have some kind of integration with Google Meet (maybe Zoom too?). Integration that I meant is by automatically looking for a QR code (and scanning it if there is any) throughout the whole meeting session. If possible, I also want the extension to be cross-platform on at least Firefox and Chromium-based browsers.