Skip to content

Version 2.2.7
Compare
Choose a tag to compare
@mebjas mebjas released this 04 Nov 16:13
· 62 commits to master since this release
v2.2.7
6a1f25a
This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
GPG key ID: 4AEE18F83AFDEB23
Expired
Learn about vigilant mode.

Version 2.2.7

Add support for custom CSS

Developer / User Story: As a developer I can write custom CSS for Html5QrcodeScanner.

Feature request: Issue#389

List of CSS class and IDs added.

  1. All key elements will have a common CSS class html5-qrcode-element. This way developers can customise element by element. For example:
button.html5-qrcode-element {
    color: 'red';
    border: '1px solid red';
}

Key elements are:

  • Request camera permission button.
  • "Scan and image file" vs "Scan using camera directly" link.
  • "File selection" input ('file')
  • Start or Stop camera button.
  • Camera selection Select element
  • Torch button
  1. key elements will have specific IDs defined in src/ui/scanner/base.ts. This can be used to customise per elements.
TODOs
  • Document in a blog post
  • Add pointer in qrcode.minhazav.dev
  • Add pointer in Readme

Change file selection UI from input to button

Modified the UI a little to hide the file selection as input and replace with
custom button and javascript based solution.

One motivation here is this will allow more uniform style for the widget.

Graduate useBarCodeDetectorIfSupported to Html5QrcodeConfigs.

useBarCodeDetectorIfSupported was tested as an experimental configuration for
a long time and has proven to be very efficient and well supported. It has been
tested in ScanApp for quiet some time.

Considering this experimental API is not well documented, it makes it hard for
folks to discover it. By graduating this configuration to Html5QrcodeConfigs I
hope to make it more discoverable.

In this version the ExperimentalFeaturesConfig#useBarCodeDetectorIfSupported
has been marked deprecated but not removed due to backwards compatibility
reasons. Users can set either of them but Html5QrcodeConfigs one will take
precedence if set.

Once further support is added to browsers, this can be set as true by default.

Assets 3
Loading