https://battery.knowledge-graph.eu/w/index.php?action=history&feed=atom&title=MediaWiki%3ACamScanner.js 2026-08-14T07:23:13Z Revision history for this page on the wiki MediaWiki 1.39.5 https://battery.knowledge-graph.eu/w/index.php?title=MediaWiki:CamScanner.js&diff=1853&oldid=prev 2024-06-24T21:08:02Z

<p>Created page with &quot; $(document).ready(function () { if ($(&#039;#cam-scanner&#039;).length === 0) return; //only on pages with a cam-scanner-div mw.loader.using( &#039;oojs-ui-core&#039;).done( function () { $.when( $.getScript(&quot;//rawgit.com/schmich/instascan-builds/master/instascan.min.js&quot;), $.Deferred(function (deferred) { $(deferred.resolve); }) ).done(function () { var textInput = new OO.ui.TextInputWidget( { placeholder: &#039;Enter ID or scan QR code&#039; } ); var scan_button = new OO.ui.B...&quot;</p> <p><b>New page</b></p><div><br /> <br /> $(document).ready(function () {<br /> if ($(&#039;#cam-scanner&#039;).length === 0) return; //only on pages with a cam-scanner-div<br /> mw.loader.using( &#039;oojs-ui-core&#039;).done( function () {<br /> $.when(<br /> $.getScript(&quot;//rawgit.com/schmich/instascan-builds/master/instascan.min.js&quot;),<br /> $.Deferred(function (deferred) {<br /> $(deferred.resolve);<br /> })<br /> ).done(function () {<br /> var textInput = new OO.ui.TextInputWidget( {<br /> placeholder: &#039;Enter ID or scan QR code&#039;<br /> } );<br /> var scan_button = new OO.ui.ButtonWidget( {<br /> label: &#039;Scan&#039;<br /> } );<br /> var search_button = new OO.ui.ButtonWidget( {<br /> label: &#039;Search&#039;<br /> } );<br /> var open_button = new OO.ui.ButtonWidget( {<br /> label: &#039;Open&#039;<br /> } );<br /> var popup = new OO.ui.PopupWidget( {<br /> //style=&quot;width:400px;height:400px;&quot;<br /> $content: $( &#039;&lt;div style=&quot;width:400px;height:400px;&quot;&gt;&lt;video width=&quot;400&quot; height=&quot;400&quot; id=&quot;cam-scanner-preview&quot;&gt;&lt;/video&gt;&lt;/div&gt;&#039; ),<br /> padded: true,<br /> width: 450,<br /> height: 450,<br /> head: true,<br /> label: &#039;CamScanner&#039;<br /> } );<br /> <br /> $(&#039;#cam-scanner&#039;).append(textInput.$element);<br /> $(&#039;#cam-scanner&#039;).append(scan_button.$element);<br /> $(&#039;#cam-scanner&#039;).append(search_button.$element);<br /> $(&#039;#cam-scanner&#039;).append(open_button.$element);<br /> $(&#039;#cam-scanner&#039;).append(popup.$element);<br /> var qr_detected = false;<br /> scan_button.on( &#039;click&#039;, function () {<br /> qr_detected = false;<br /> // To display the popup, toggle the visibility to &#039;true&#039;.<br /> popup.toggle( true );<br /> textInput.setValue(&quot;Scanning...&quot;);<br /> let scanner = new Instascan.Scanner({<br /> video: document.getElementById(&#039;cam-scanner-preview&#039;)<br /> });<br /> scanner.addListener(&#039;scan&#039;, function (content) {<br /> console.log(content);<br /> textInput.setValue(content);<br /> qr_detected = true;<br /> popup.toggle( false );<br /> });<br /> Instascan.Camera.getCameras().then(function (cameras) {<br /> if (cameras.length &gt; 0) {<br /> scanner.start(cameras[0]);<br /> } else {<br /> console.error(&#039;No cameras found.&#039;);<br /> }<br /> }).catch(function (e) {<br /> console.error(e);<br /> });<br /> popup.on( &#039;toggle&#039;, function (visible) {<br /> if (!visible){<br /> console.log(&quot;Stop scanner&quot;);<br /> if (!qr_detected) textInput.setValue(&quot;&quot;);<br /> scanner.stop();<br /> }<br /> });<br /> });<br /> search_button.on( &#039;click&#039;, function () {<br /> window.location = &quot;/w/index.php?title=_Special:Search&amp;search=&quot; + textInput.getValue() + &quot;&amp;go=Page&quot;;<br /> });<br /> open_button.on( &#039;click&#039;, function () {<br /> window.location = textInput.getValue();<br /> });<br /> <br /> });<br /> });<br /> });</div>

Admin