Instead of uploading a file, capture the image directly from a webcam
A sys pref to turn the feature on or off.
Created attachment 22623 [details] how to take Instead of uploading a file, capture the image directly from a webcam
In that state of development is this ? I am searching for some solution to bring Koha a patrons capture image capability. Anybody is using this or anything other way? Thanks.
I don't know if the attached patch is functional in any way--it was attached as a .docx Word document, which doesn't make any kind of sense. The "patch" looks like it was made against an older version of Koha, so even if you could pull out the changes you'd have to re-implement the solution. Anyway, the offered solution relies on a Flash file, and there's no way a Flash dependency is going to get into Koha. Perhaps it would work as a local customization.
Comment on attachment 22623 [details] how to take Instead of uploading a file, capture the image directly from a webcam As said before, the attached file is not a patch or usable. Obsoleted then
Created attachment 29613 [details] Readable, but not useable attachment This will get obsoleted as well.
Comment on attachment 29613 [details] Readable, but not useable attachment I'm pretty sure it won't apply, even if I tried to make it a nice patch. Don't like the proprietary requirement either.
This was likely against 3.10.x or earlier.
(In reply to M. Tompsett from comment #8) > This was likely against 3.10.x or earlier. tcohen has re-assigned this bug to himself because he is working on a new version.
Created attachment 38518 [details] [review] Bug 6815: Capture picture from web cam This enhancement gives the librarian the ability to capture a photo from a webcam attached to the Koha server. It does this by adding a 'Capture' button to the member details page. This button is only visible if there is likely a webcam. This is determined by if /dev/video{something} exists. This also corrects the functionality of the delete button, which is broken, because borrowernumber and cardnumber got mixed up. This requires the package streamer be installed: $ sudo apt-get install streamer Additionally, I had to add www-data to the video group. $ sudo addgroup www-data video TEST PLAN --------- 1) Back up DB. 2) Have a picture file available for uploading. 3) Find a particular patron 4) Upload the picture file on hand. -- should work fine. 5) Delete the patron picture. -- fails. 6) Apply patch. 7) Delete the patron picture. -- success 8) Upload the patron picture again. -- success 9) Check for Capture button. a) plug in it and refresh page -- capture button should be there. b) unplug it and refresh page -- capture button should not be there. c) plug it back in and refresh 10) Make a strange face, hold it, and click 'Capture' -- a few seconds later the page should refresh with your face. 11) Restore DB 12) run koha qa test tools.
Though we probably want something more client-side like: http://jsfiddle.net/attuts/svcf41o6/2/
Sorry, could not test patch (no access to webcam with my server / vm) Tested code on jsfiddle.net with a client - works. I would prefer a client side solution.
The client side capturing does make much more sense to me. I've tested the jsfiddle code and it works like a charm, I think it's the way how it could work.
(In reply to Josef Moravec from comment #13) > The client side capturing does make much more sense to me. I've tested the > jsfiddle code and it works like a charm, I think it's the way how it could > work. Did you test with Internet Explorer? What about Firefox, Opera, Safari, Chrome, and Chromium? jsfiddle code does not work for all of them, last I checked. It failed for IE, if I recall.
I tested it in Opera, Chromium and Firefox. According to this page, it doesn't work in Safari and IE, but it will work in Microsoft's new browser Edge: http://caniuse.com/#search=getUserMedia There are some polyfills available, based on flash: https://github.com/addyosmani/getUserMedia.js https://github.com/jhuckaby/webcamjs There is also an plugin for IE and Safari, which implements WebRTC: https://temasys.atlassian.net/wiki/display/TWPP/WebRTC+Plugins/
(In reply to Josef Moravec from comment #15) [SNIP] > There are some polyfills available, based on flash: You said the word of evil: flash. This is one of the things attempted to be avoided. I'm pretty sure it is license related. [SNIP] > There is also an plugin for IE and Safari, which implements WebRTC: > https://temasys.atlassian.net/wiki/display/TWPP/WebRTC+Plugins/ Nice. So, is there a way to mix this with something using getUserMedia? I think that would be palatable.
(In reply to M. Tompsett from comment #16) > (In reply to Josef Moravec from comment #15) > [SNIP] > > There are some polyfills available, based on flash: > > You said the word of evil: flash. This is one of the things attempted to be > avoided. I'm pretty sure it is license related. I agree that flash s evil, I've just tried to find "something" :) > [SNIP] > > There is also an plugin for IE and Safari, which implements WebRTC: > > https://temasys.atlassian.net/wiki/display/TWPP/WebRTC+Plugins/ > > Nice. So, is there a way to mix this with something using getUserMedia? I > think that would be palatable. I've tried that plugin and edit the jsfiddle and use Adapter.js, which kind of polyfill for webrtc accross browsers and the plugin: http://jsfiddle.net/6azxcg0j/1/ but it can't access to the plugin (in browsers, which has support to getUserMedia it works good), but the demo site for webrtc plugin does work in IE 11 with plugin... so I think there is an error in my code ;) https://plugin.temasys.com.sg/ However, it looks as a viable way I think...
Even if I copy-pasted the code from webrtc plugin demo page, it doesn't work in jsfiddle, so I suppose problem with accessing ActiveX plugins in jsfiddle...
Comment on attachment 38518 [details] [review] Bug 6815: Capture picture from web cam Review of attachment 38518 [details] [review]: ----------------------------------------------------------------- I have to say I am in favour of a client side solution and we are not supporting IE for the staff client officially. I think for a feature that is not a core functionality it would be ok for me if it was limited to Firefox/Chromium. ::: koha-tmpl/intranet-tmpl/prog/en/modules/members/moremember.tt @@ +271,5 @@ > </li> > </ol> > <fieldset class="action"> > + <input type="submit" name="op" id="op" value="Upload" class="submit btn" /> > + [% IF ( webcam ) %]<input type="submit" name="op" id="op" value="Capture" class="submit btn" /> [% END %] Using multiple for styling is no good style - this should be done using CSS.
Just saying: https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/Taking_still_photos
(In reply to Tomás Cohen Arazi from comment #20) > Just saying: > https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/ > Taking_still_photos Just saying: doesn't work for me.
(In reply to M. Tompsett from comment #21) > (In reply to Tomás Cohen Arazi from comment #20) > > Just saying: > > https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/ > > Taking_still_photos > > Just saying: doesn't work for me. -- google chrome, though. Koha should not be browser specific.
https://webrtc.org/ ?
(In reply to Katrin Fischer from comment #23) > https://webrtc.org/ ? I tried clicking through some link off what Tomas posted. There... it does work for Chrome is this example I found clicking through there. However, note the lack of love for IE or Edge. My browser agnosticism point is still valid. Granted, I think I've stumbled onto something that says it may be possible to trick Edge into experimentally working for it. But I don't wish to devote time to researching that.
I think I disagree about this having to work in any and every browser. It's a feature not a lot of libraries will need - and we don't recommend using IE or Edge with Koha.
(In reply to Katrin Fischer from comment #25) > I think I disagree about this having to work in any and every browser. It's > a feature not a lot of libraries will need - and we don't recommend using IE > or Edge with Koha. I think having an implmentation on top of which interested parties could work to support more browsers is better than nothing.
(In reply to Tomás Cohen Arazi from comment #26) > (In reply to Katrin Fischer from comment #25) > > I think I disagree about this having to work in any and every browser. It's > > a feature not a lot of libraries will need - and we don't recommend using IE > > or Edge with Koha. > > I think having an implmentation on top of which interested parties could > work to support more browsers is better than nothing. Also, I found this exmaple to work in both Chrome and Firefox: https://davidwalsh.name/demo/camera.php It can be done!
Created attachment 91302 [details] [review] Bug 6815: Add a 'Take Patron Image' ability This does not just click in place, which would be nice. But it does take the picture, download to a file, and then let's the user use the existing upload functionality to add the photo. If wording or formating is ugly, feel free to tweak. TEST PLAN --------- 1) the 'patronimages' system preference in Patrons system preferences must be set to 'Allow'. 2) apply the patch 3) go to any patron 4) click the 'Take' button. -- it is in the text area on the right, and not the hover over the image area. Adding here would require CSS changes, which are now difficult and ugly to do. -- new tab should open. If you have a working webcam, you should see it playing 'live'. 5) click the "Take the Patron's Picture" button -- this should download a photo SamplePhoto.jpg or some variation of that. 6) close this tab, and click the 'Edit' or 'Add' button for the patron image. 7) click 'Choose File' and choose the file that was created 8) click 'Upload' -- the webcam photo should now be used. 9) run koha qa test tools
Created attachment 91303 [details] [review] Bug 6815: Add a 'Take Patron Image' ability This does not just click in place, which would be nice. But it does take the picture, download to a file, and then let's the user use the existing upload functionality to add the photo. If wording or formating is ugly, feel free to tweak. TEST PLAN --------- 1) the 'patronimages' system preference in Patrons system preferences must be set to 'Allow'. 2) apply the patch 3) go to any patron 4) click the 'Take' button. -- it is in the text area on the right, and not the hover over the image area. Adding here would require CSS changes, which are now difficult and ugly to do. -- new tab should open. If you have a working webcam, you should see it playing 'live'. 5) click the "Take the Patron's Picture" button -- this should download a photo SamplePhoto.jpg or some variation of that. 6) close this tab, and click the 'Edit' or 'Add' button for the patron image. 7) click 'Choose File' and choose the file that was created 8) click 'Upload' -- the webcam photo should now be used. 9) run koha qa test tools
Created attachment 91335 [details] [review] Bug 6815: Detect Webcam to show or not button It's hard to test on a laptop with a webcam built it. So, please attempt with: The system preference patronimage set to allow. And in any given patron detail page, see if the 'Take' button appears/disappears with a refresh while plugging and unplugging a webcam.
(In reply to M. Tompsett from comment #30) > Created attachment 91335 [details] [review] [review] > Bug 6815: Detect Webcam to show or not button > > It's hard to test on a laptop with a webcam built it. sudo apt install v4l-utils sudo modprobe -r uvcvideo # removes sudo v4l2-ctl --list-devices sudo modprobe uvcvideo # re-adds sudo v4l2-ctl --list-devices Tested with: - Chrome Version 75.0.3770.100 (Official Build) (64-bit) - FireFox Quantum 67.0.4 (64-bit) - Chromium Version 75.0.3770.90 (Official Build) Built on Ubuntu , running on Ubuntu 18.04 (64-bit) - Opera Version:62.0.3331.43 They all worked! YAY! I was testing on Ubuntu 18.04.2 LTS with the default desktop manager, which I believe is Gnome.
Tested with Firefox (69.0.1) & Chrome(77.0.3865.90). Taking picture is correct, but when I disable my camera (integrated to my laptop), I still have the "Take" button. It probably comes from my computer (I must have missed something when disabling the camera), but I prefer not sign it and let someone else try to check that point.
Created attachment 99015 [details] [review] Bug 6815: Add a 'Take Patron Image' ability This does not just click in place, which would be nice. But it does take the picture, download to a file, and then let's the user use the existing upload functionality to add the photo. If wording or formating is ugly, feel free to tweak. TEST PLAN --------- 1) the 'patronimages' system preference in Patrons system preferences must be set to 'Allow'. 2) apply the patch 3) go to any patron 4) click the 'Take' button. -- it is in the text area on the right, and not the hover over the image area. Adding here would require CSS changes, which are now difficult and ugly to do. -- new tab should open. If you have a working webcam, you should see it playing 'live'. 5) click the "Take the Patron's Picture" button -- this should download a photo SamplePhoto.jpg or some variation of that. 6) close this tab, and click the 'Edit' or 'Add' button for the patron image. 7) click 'Choose File' and choose the file that was created 8) click 'Upload' -- the webcam photo should now be used. 9) run koha qa test tools Signed-off-by: Lisette Scheer <lisettes@latahlibrary.org>
Created attachment 99016 [details] [review] Bug 6815: Detect Webcam to show or not button It's hard to test on a laptop with a webcam built it. So, please attempt with: The system preference patronimage set to allow. And in any given patron detail page, see if the 'Take' button appears/disappears with a refresh while plugging and unplugging a webcam. Signed-off-by: Lisette Scheer <lisettes@latahlibrary.org>
QA tools pass without problems. Some smaller issues: 1) Capitalization <title>Koha Patron Image Via Webcam</title> <h1>Koha Patron Image Taker</h1> ... that's it so far :)
>4) click the 'Take' button. > -- it is in the text area on the right, and not the > hover over the image area. Adding here would require > CSS changes, which are now difficult and ugly to do. Don't agree about this and don't feel it should be in a commit message and then in git... if you want to raise an issue, there are better ways. In general I think the page to take pictures needs some more work, it's quite a raw HTML page currently and doesn't fit well into Koha as is.
I've done some follow-up work on this and will hopefully be able to get back to it soon.
Created attachment 99757 [details] [review] Move webcam interface into modal
I've attached a new follow-up so that I might get some feedback. This is working pretty well from the patron detail page. Test with a webcam-capable device. I think it's not ideal that the user is required to save the image to the local machine and then upload it. We already have picture-upload.pl so it seems logical that we should be able to submit the data directly. I've found write-ups of accomplishing this in PHP, for instance: https://www.geeksforgeeks.org/how-to-save-an-html-5-canvas-as-an-image-on-the-server/ There is some AJAX in patron-webcam.js which mocks this process but I'm not sure yet how to finish it. If anyone is interested in this feature I'd love to get your opinion. I think it would be really nice to be able to push this feature with the automatic-save built in.
It does not work for me/my webcam: * Firefox: I see "Take", but then the modal displays with "No permission to use camera" in an alert. If I close it, I see the "Take the patron's picture" button in the modal, but it generates a black picture. * Chromium: No "Take" The browsers does not ask me if I want to allow the webcam for this page. The webcam seems to work with cheese and hangout.
(In reply to Jonathan Druart from comment #40) > It does not work for me/my webcam: > * Firefox: > I see "Take", but then the modal displays with "No permission to use camera" > in an alert. If I close it, I see the "Take the patron's picture" button in > the modal, but it generates a black picture. > > * Chromium: No "Take" > > > The browsers does not ask me if I want to allow the webcam for this page. > > The webcam seems to work with cheese and hangout. Greetings. I ran in Chrome (Version 83.0.4103.116 (Official Build) (64-bit) on Ubuntu 20.04 LTS vagrant up'd to stretch and accessed by localhost:8081), and it worked just fine. I then run in Chromium (Version 81.0.4044.138 (Official Build) Built on Ubuntu , running on Ubuntu 20.04 (64-bit) same localhost:8081), without closing the Chrome, and it gave me the error you got in Firefox. Once I closed Chrome, and retried in Chromium, it worked. It worked for me in Opera (69.0.3686.49) too. I even tried firefox (78.0.1 (64-bit)). And while it was much noisier (Are you sure you want permissions for this? Really? What about this?), it worked for me too. Did you have cheese and hangout open when you tested this? I think there may be some "Give me exclusive control!" type issues between the various programs.
I see the attempt to javascript the picture up, but it is failing, because the click() hijacks and returns, never to run the ajaxiness. I have an idea... perhaps I'll play with it a bit this week. It would be nice to solve a 4 digit bugzilla. Sorry I have been distracted with other projects lately. :)
Created attachment 106774 [details] [review] Bug 6815: Actually push the taken picture to the DB Tweak circ-menu, so we can close the modal. Tweak patron-webcam so it does the push. Tweak picture-upload, so it decodes rather than tries to receive the picture.
Created attachment 106775 [details] [review] Bug 6815: Turn off the webcam when done
Created attachment 106776 [details] [review] Bug 6815: Ugly reload, but it works
TEST PLAN ------------ Start up your koha choose a patron entry for yourself (assuming you are adminish) click the take button pose click the take picture button after a short reload, it should be the pose you had and the webcam should be off. You want to retake, click the take button again. The notion of keep, retake is an extra step that is beyond the scope of THIS bug.
Not detecting camera. Even when I force the button to show, nothing is showing when the window comes up. May need more work. I also am not a big fan of how to get to this function. I think it needs to have a button option in the window where you click Add on the photo. So you have the option to upload or take a photo. I would also not bother with the logic to detect the camera with the button. Just have the button, and if the camera is detected, you see an image. Keep it simple.
(In reply to Christopher Brannon from comment #47) > Not detecting camera. Even when I force the button to show, nothing is > showing when the window comes up. May need more work. *sigh* I can confirm that is doesn't work when running from a ByWater's sandbox, but it does work just fine locally. Not sure what to make of it. Open to suggestions.
Created attachment 106777 [details] [review] Bug 6815: Attempt to detect webcam differently
(In reply to M. Tompsett from comment #49) > Created attachment 106777 [details] [review] [review] > Bug 6815: Attempt to detect webcam differently Success in the sandbox. And as far as I can tell navigator is still valid javascript code. Still have to fix the canvas portion of it, but that should be do-able.
Created attachment 106782 [details] [review] Bug 6815: Simplify code, add msGetUserMedia case
Created attachment 106783 [details] [review] Bug 6815: Attempt to get web cam working on sandbox
I can confirm the button is showing now. Now if the actual image would show, we're in business. I would still encourage you to remove the take button from the detail screen and add it the Add window (same window where the browse and upload buttons are. That way it is accessible from details or circulation through the add button, and you centralize it and don't have to worry about were to go to get to it.
Created attachment 106787 [details] [review] Bug 6815: Add a 'Take Patron Image' ability This does not just click in place, which would be nice. But it does take the picture, download to a file, and then let's the user use the existing upload functionality to add the photo. If wording or formating is ugly, feel free to tweak. TEST PLAN --------- 1) the 'patronimages' system preference in Patrons system preferences must be set to 'Allow'. 2) apply the patch 3) go to any patron 4) click the 'Take' button. -- it is in the text area on the right, and not the hover over the image area. Adding here would require CSS changes, which are now difficult and ugly to do. -- new tab should open. If you have a working webcam, you should see it playing 'live'. 5) click the "Take the Patron's Picture" button -- this should download a photo SamplePhoto.jpg or some variation of that. 6) close this tab, and click the 'Edit' or 'Add' button for the patron image. 7) click 'Choose File' and choose the file that was created 8) click 'Upload' -- the webcam photo should now be used. 9) run koha qa test tools Signed-off-by: Lisette Scheer <lisettes@latahlibrary.org>
Created attachment 106788 [details] [review] Bug 6815: Detect Webcam to show or not button It's hard to test on a laptop with a webcam built it. So, please attempt with: The system preference patronimage set to allow. And in any given patron detail page, see if the 'Take' button appears/disappears with a refresh while plugging and unplugging a webcam. Signed-off-by: Lisette Scheer <lisettes@latahlibrary.org>
Created attachment 106789 [details] [review] Move webcam interface into modal
Created attachment 106790 [details] [review] Bug 6815: Actually push the taken picture to the DB Tweak circ-menu, so we can close the modal. Tweak patron-webcam so it does the push. Tweak picture-upload, so it decodes rather than tries to receive the picture.
Created attachment 106791 [details] [review] Bug 6815: Turn off the webcam when done
Created attachment 106792 [details] [review] Bug 6815: Ugly reload, but it works
Created attachment 106793 [details] [review] Bug 6815: Attempt to detect webcam differently
Created attachment 106794 [details] [review] Bug 6815: Simplify code, add msGetUserMedia case
Created attachment 106795 [details] [review] Bug 6815: Attempt to get web cam working on sandbox
Sorry, tried to sign off on this bug, but it's not working. Getting a bunch of HTML and status=200.
Created attachment 106796 [details] [review] Bug 6815: Add a 'Take Patron Image' ability This does not just click in place, which would be nice. But it does take the picture, download to a file, and then let's the user use the existing upload functionality to add the photo. If wording or formating is ugly, feel free to tweak. TEST PLAN --------- 1) the 'patronimages' system preference in Patrons system preferences must be set to 'Allow'. 2) apply the patch 3) go to any patron 4) click the 'Take' button. -- it is in the text area on the right, and not the hover over the image area. Adding here would require CSS changes, which are now difficult and ugly to do. -- new tab should open. If you have a working webcam, you should see it playing 'live'. 5) click the "Take the Patron's Picture" button -- this should download a photo SamplePhoto.jpg or some variation of that. 6) close this tab, and click the 'Edit' or 'Add' button for the patron image. 7) click 'Choose File' and choose the file that was created 8) click 'Upload' -- the webcam photo should now be used. 9) run koha qa test tools Signed-off-by: Lisette Scheer <lisettes@latahlibrary.org> Signed-off-by: Christopher Brannon <cbrannon@cdalibrary.org>
Created attachment 106797 [details] [review] Bug 6815: Detect Webcam to show or not button It's hard to test on a laptop with a webcam built it. So, please attempt with: The system preference patronimage set to allow. And in any given patron detail page, see if the 'Take' button appears/disappears with a refresh while plugging and unplugging a webcam. Signed-off-by: Lisette Scheer <lisettes@latahlibrary.org> Signed-off-by: Christopher Brannon <cbrannon@cdalibrary.org>
Created attachment 106798 [details] [review] Move webcam interface into modal https://bugs.koha-community.org/show_bug.cgi?id=6815 Signed-off-by: Christopher Brannon <cbrannon@cdalibrary.org>
Created attachment 106799 [details] [review] Bug 6815: Actually push the taken picture to the DB Tweak circ-menu, so we can close the modal. Tweak patron-webcam so it does the push. Tweak picture-upload, so it decodes rather than tries to receive the picture. Signed-off-by: Christopher Brannon <cbrannon@cdalibrary.org>
Created attachment 106800 [details] [review] Bug 6815: Turn off the webcam when done Signed-off-by: Christopher Brannon <cbrannon@cdalibrary.org>
Created attachment 106801 [details] [review] Bug 6815: Ugly reload, but it works Signed-off-by: Christopher Brannon <cbrannon@cdalibrary.org>
Created attachment 106802 [details] [review] Bug 6815: Attempt to detect webcam differently Signed-off-by: Christopher Brannon <cbrannon@cdalibrary.org>
Created attachment 106803 [details] [review] Bug 6815: Simplify code, add msGetUserMedia case Signed-off-by: Christopher Brannon <cbrannon@cdalibrary.org>
Created attachment 106804 [details] [review] Bug 6815: Attempt to get web cam working on sandbox Signed-off-by: Christopher Brannon <cbrannon@cdalibrary.org>
Couldn't sign of in devbox, so I signed off on sandbox. Doesn't work in sandbox, but worked in devbox. I am signing off as it works as described, but I would like to encourage that the button be placed in the exiting modal for browsing and uploading. Otherwise, it works!
Okay... here is an alternative patch... I'll temporarily obsolete the other 9.
Created attachment 106938 [details] [review] Bug 6815: Take a patron's picture - Remove Manage Image Patron (everything done via picture clicks) - Break out the modal to its own pl/tt pair - tweak member-menu.js - tweak tools/picture-upload.pl Clicking Add/Edit button on the patron picture should give the user the ability to either upload a file, or take a patron's picture. The camera can be turned on/off. Turn it on, take until the picture on the right looks good. Click keep. Profile picture should be refreshed
Created attachment 106939 [details] [review] Bug 6815: Attempt to get sandbox to work
Created attachment 106940 [details] [review] Bug 6815: Attempt again to make it work in sandbox
I'm sticking with this newer version. Tested on my phone, after fighting the networking. The problem is the sandbox still doesn't work. And perhaps people might want the details tab manage patron image back.
I see errors in the console when using a computer without a webcam. Can there be some feature-detection to prevent this?
No time to take this on again. Whoever wishes to try. Go ahead. Reset to default assignee.
Would love to see someone pick this up and complete it. So close! And it would make using patron pictures so much easier to use with front line staff!
Created attachment 131174 [details] [review] Bug 6815: Capture member photo via webcam This patch builds on a patch by Mark Tompsett, adding the option to take a patron's picture using the computer's webcam. The photo can then be saved to the patron's account. To test, apply the patch and rebuild the staff interface CSS (https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client). - Go to Administration -> System preferences and enable the 'patronimages' preference. - View a patron record. In the sidebar, hover your mouse over the blank patron image. Click the "Edit" button which appears. - A modal window should appear with two sections, "Upload patron photo" and "Take patron photo." - If your computer has a webcam, your browser should ask permission to access it. Grant access. - You should see the view of your webcam shown under the "Take photo" button. - Click the "Take photo" button. The captured photo should be shown in place of the live video from the webcam. - You should now see three buttons: "Retake photo," "Download photo," and "Upload photo." - Clicking "Retake photo" should hide those buttons and return you to a live video view. - Clicking "Download" should make your browser download the image. - Clicking "Upload" should cause the page to redirect back to the patron detail page where you should see the new patron image displayed in the sidebar. - Trigger the modal again and click the "cancel" button. The modal should disappear and camera access should stop. - If your computer has no webcam the modal should appear correctly but there should be a banner at the bottom indicating that a camera is not available. - Try the test again but this time deny your browser access to the webcam. You may need to reset the camera permissions in your browser's settings. When the modal appears you should see a message saying access to the camera is denied. - The patron image edit modal should be available on all pages which show the patron image in the sidebar: Check out, Batch check out, Details, Accounting, Routing lists, Circulation history, Holds history, Modification log, Notices, Statistics, Files, Purchase suggestions, Discharges, Housebound, and ILL requests history. - Test adding an image to a patron record using the "Upload photo" option. It should still work correctly. - If the patron has an image attached, the "Upload photo" section should have a "Delete" button. Test that it works correctly.
Created attachment 131554 [details] [review] Bug 6815: Capture member photo via webcam This patch builds on a patch by Mark Tompsett, adding the option to take a patron's picture using the computer's webcam. The photo can then be saved to the patron's account. To test, apply the patch and rebuild the staff interface CSS (https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client). - Go to Administration -> System preferences and enable the 'patronimages' preference. - View a patron record. In the sidebar, hover your mouse over the blank patron image. Click the "Edit" button which appears. - A modal window should appear with two sections, "Upload patron photo" and "Take patron photo." - If your computer has a webcam, your browser should ask permission to access it. Grant access. - You should see the view of your webcam shown under the "Take photo" button. - Click the "Take photo" button. The captured photo should be shown in place of the live video from the webcam. - You should now see three buttons: "Retake photo," "Download photo," and "Upload photo." - Clicking "Retake photo" should hide those buttons and return you to a live video view. - Clicking "Download" should make your browser download the image. - Clicking "Upload" should cause the page to redirect back to the patron detail page where you should see the new patron image displayed in the sidebar. - Trigger the modal again and click the "cancel" button. The modal should disappear and camera access should stop. - If your computer has no webcam the modal should appear correctly but there should be a banner at the bottom indicating that a camera is not available. - Try the test again but this time deny your browser access to the webcam. You may need to reset the camera permissions in your browser's settings. When the modal appears you should see a message saying access to the camera is denied. - The patron image edit modal should be available on all pages which show the patron image in the sidebar: Check out, Batch check out, Details, Accounting, Routing lists, Circulation history, Holds history, Modification log, Notices, Statistics, Files, Purchase suggestions, Discharges, Housebound, and ILL requests history. - Test adding an image to a patron record using the "Upload photo" option. It should still work correctly. - If the patron has an image attached, the "Upload photo" section should have a "Delete" button. Test that it works correctly. Signed-off-by: Nicolas Legrand <nicolas.legrand@bulac.fr>
Thank you Owen it's great!
Frido, any chance you merge this in 20.11?
(In reply to Nicolas Legrand from comment #85) > Frido, any chance you merge this in 20.11? Oh but it is not yet QA. Then push master, then backport to older versions. Victor Grousset is actual maintainer of 20.11. In my opinion such a big patch is dangerous for an old stable version, we may only propose backport on 21.11. Best regards,
(In reply to Fridolin Somers from comment #86) > (In reply to Nicolas Legrand from comment #85) > > Frido, any chance you merge this in 20.11? > > Oh but it is not yet QA. > Then push master, then backport to older versions. > Victor Grousset is actual maintainer of 20.11. > In my opinion such a big patch is dangerous for an old stable version, we > may only propose backport on 21.11. Oups sorry, I thought you were maintainer of 20.11. Anyhow thank you for your input, I needed to know the feasibility of this and now I can answer my colleagues who deeply want this patch to stop dreaming :D.
It does not work for me, the browser does not ask for permission. I am getting the following error in the console after I clicked on "Add": Uncaught TypeError: navigator.mediaDevices is undefined
(In reply to Jonathan Druart from comment #88) > It does not work for me, the browser does not ask for permission. > > I am getting the following error in the console after I clicked on "Add": > Uncaught TypeError: navigator.mediaDevices is undefined This was the Firefox error. And here is the chromium error: Uncaught TypeError: Cannot read properties of undefined (reading 'getUserMedia')
From https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia """ Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers. """ Ok, makes sense.
Created attachment 131985 [details] [review] Bug 6815: Display an error in if HTTPS not used and webcam unavailable
There is something completely wrong. The new pl and tt are useless, we just want to display a modal, we don't need an AJAX request. I am working on it.
Created attachment 131987 [details] [review] Bug 6815: Don't make an AJAX request to generate the modal moremember-patronimage.pl|tt were not needed.
Created attachment 131988 [details] [review] Bug 6815: Don't make an AJAX request to generate the modal moremember-patronimage.pl|tt were not needed.
Can I get a signoff on those 2 patches please?
(In reply to Jonathan Druart from comment #91) > Created attachment 131985 [details] [review] [review] > Bug 6815: Display an error in if HTTPS not used and webcam unavailable Thank you Jonathan. About HTTPS: I'm with HTTP in docker and not seeing any error while the cam is available. Is it what is expected? When I block the camera, I have an error message saying it's blocked, which is nice. Then I authorize the page to use the camera, but I'm sticked with the same error message, I have to reload the page to be able to use the cam. Which is not very nice. Everything else seems to work nicely.
(In reply to Nicolas Legrand from comment #96) > (In reply to Jonathan Druart from comment #91) > > Created attachment 131985 [details] [review] [review] [review] > > Bug 6815: Display an error in if HTTPS not used and webcam unavailable > > Thank you Jonathan. > > About HTTPS: I'm with HTTP in docker and not seeing any error while the cam > is available. Is it what is expected? It's not supposed to work at all under HTTP. But not all browsers block it apparently. > When I block the camera, I have an error message saying it's blocked, which > is nice. Then I authorize the page to use the camera, but I'm sticked with > the same error message, I have to reload the page to be able to use the cam. > Which is not very nice. Not caused by my follow-ups. Could be improved later if possible and needed. > Everything else seems to work nicely. Thanks!
Created attachment 131999 [details] [review] Bug 6815: Capture member photo via webcam This patch builds on a patch by Mark Tompsett, adding the option to take a patron's picture using the computer's webcam. The photo can then be saved to the patron's account. To test, apply the patch and rebuild the staff interface CSS (https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client). - Go to Administration -> System preferences and enable the 'patronimages' preference. - View a patron record. In the sidebar, hover your mouse over the blank patron image. Click the "Edit" button which appears. - A modal window should appear with two sections, "Upload patron photo" and "Take patron photo." - If your computer has a webcam, your browser should ask permission to access it. Grant access. - You should see the view of your webcam shown under the "Take photo" button. - Click the "Take photo" button. The captured photo should be shown in place of the live video from the webcam. - You should now see three buttons: "Retake photo," "Download photo," and "Upload photo." - Clicking "Retake photo" should hide those buttons and return you to a live video view. - Clicking "Download" should make your browser download the image. - Clicking "Upload" should cause the page to redirect back to the patron detail page where you should see the new patron image displayed in the sidebar. - Trigger the modal again and click the "cancel" button. The modal should disappear and camera access should stop. - If your computer has no webcam the modal should appear correctly but there should be a banner at the bottom indicating that a camera is not available. - Try the test again but this time deny your browser access to the webcam. You may need to reset the camera permissions in your browser's settings. When the modal appears you should see a message saying access to the camera is denied. - The patron image edit modal should be available on all pages which show the patron image in the sidebar: Check out, Batch check out, Details, Accounting, Routing lists, Circulation history, Holds history, Modification log, Notices, Statistics, Files, Purchase suggestions, Discharges, Housebound, and ILL requests history. - Test adding an image to a patron record using the "Upload photo" option. It should still work correctly. - If the patron has an image attached, the "Upload photo" section should have a "Delete" button. Test that it works correctly. Signed-off-by: Nicolas Legrand <nicolas.legrand@bulac.fr> Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Created attachment 132000 [details] [review] Bug 6815: Display an error in if HTTPS not used and webcam unavailable Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Created attachment 132001 [details] [review] Bug 6815: Don't make an AJAX request to generate the modal moremember-patronimage.pl|tt were not needed. Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Pushed to master for 22.05, thanks to everybody involved [U+1F984]
Bit early to be thinking of release notes.. but might make a nice highlight as "new feature"? :)