Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Messages Internationalization (#132) #755

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

Messages Internationalization (#132) #755

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
e62db9e
Messages Internationalization (#132)
alvedder Apr 23, 2023
4ef9b72
Messages Internationalization (#132)
alvedder Apr 23, 2023
fa170f3
Messages Internationalization (#132)
alvedder Apr 23, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 6 additions & 6 deletions src/camera/retriever.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
/**
* @fileoverview
* Libraries associated with retrieving cameras.
*
*
* @author mebjas <[email protected]>
*/

import { CameraDevice } from "./core";
import { Html5QrcodeStrings } from "../strings";
import { t } from "../strings";

/** Class for retrieving cameras on the device. */
export class CameraRetriever {
Expand All @@ -16,7 +16,7 @@ export class CameraRetriever {
if (navigator.mediaDevices) {
return CameraRetriever.getCamerasFromMediaDevices();
}

// Using deprecated api to support really old browsers.
var mst = <any>MediaStreamTrack;
if (MediaStreamTrack && mst.getSources) {
Expand All @@ -28,9 +28,9 @@ export class CameraRetriever {

private static rejectWithError(): Promise<Array<CameraDevice>> {
// This can potentially happen if the page is loaded without SSL.
let errorMessage = Html5QrcodeStrings.unableToQuerySupportedDevices();
let errorMessage = t('common.unableToQuerySupportedDevices');
if (!CameraRetriever.isHttpsOrLocalhost()) {
errorMessage = Html5QrcodeStrings.insecureContextCameraQueryError();
errorMessage = t('common.insecureContextCameraQueryError');
}
return Promise.reject(errorMessage);
}
Expand Down Expand Up @@ -71,7 +71,7 @@ export class CameraRetriever {
}

private static getCamerasFromMediaStreamTrack()
: Promise<Array<CameraDevice>> {
: Promise<Array<CameraDevice>> {
return new Promise((resolve, _) => {
const callback = (sourceInfos: Array<any>) => {
const results: Array<CameraDevice> = [];
Expand Down
95 changes: 46 additions & 49 deletions src/html5-qrcode-scanner.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,9 @@
* @module
* Complete Scanner build on top of {@link Html5Qrcode}.
* - Decode QR Code using web cam or smartphone camera
*
*
* @author mebjas <[email protected]>
*
*
* The word "QR Code" is registered trademark of DENSO WAVE INCORPORATED
* http://www.denso-wave.com/qrcode/faqpatent-e.html
*/
Expand Down Expand Up @@ -33,9 +33,7 @@ import {
Html5QrcodeFullConfig,
} from "./html5-qrcode";

import {
Html5QrcodeScannerStrings,
} from "./strings";
import { t } from "./strings";

import {
ASSET_FILE_SCAN,
Expand Down Expand Up @@ -94,14 +92,14 @@ export interface Html5QrcodeScannerConfig
* were previously granted and what camera was last used. If the permissions
* is already granted for "camera", QR code scanning will automatically
* start for previously used camera.
*
*
* Note: default value is `true`.
*/
rememberLastUsedCamera?: boolean | undefined;

/**
* Sets the desired scan types to be supported in the scanner.
*
*
* - Not setting a value will follow the default order supported by
* library.
* - First value would be used as the default value. Example:
Expand All @@ -119,26 +117,26 @@ export interface Html5QrcodeScannerConfig
/**
* If `true` the rendered UI will have button to turn flash on or off
* based on device + browser support.
*
*
* Note: default value is `false`.
*/
showTorchButtonIfSupported?: boolean | undefined;

/**
* If `true` the rendered UI will have slider to zoom camera based on
* device + browser support.
*
*
* Note: default value is `false`.
*
*
* TODO(minhazav): Document this API, currently hidden.
*/
showZoomSliderIfSupported?: boolean | undefined;

/**
* Default zoom value if supported.
*
*
* Note: default value is 1x.
*
*
* TODO(minhazav): Document this API, currently hidden.
*/
defaultZoomValueIfSupported?: number | undefined;
Expand Down Expand Up @@ -168,10 +166,10 @@ function toHtml5QrcodeFullConfig(

/**
* End to end web based QR and Barcode Scanner.
*
*
* Use this class for setting up QR scanner in your web application with
* few lines of codes.
*
*
* - Supports camera as well as file based scanning.
* - Depending on device supports camera selection, zoom and torch features.
* - Supports different kind of 2D and 1D codes {@link Html5QrcodeSupportedFormats}.
Expand Down Expand Up @@ -203,7 +201,7 @@ export class Html5QrcodeScanner {
*
* @param elementId Id of the HTML element.
* @param config Extra configurations to tune the code scanner.
* @param verbose - If true, all logs would be printed to console.
* @param verbose - If true, all logs would be printed to console.
*/
public constructor(
elementId: string,
Expand Down Expand Up @@ -232,7 +230,7 @@ export class Html5QrcodeScanner {

/**
* Renders the User Interface.
*
*
* @param qrCodeSuccessCallback Callback called when an instance of a QR
* code or any other supported bar code is found.
* @param qrCodeErrorCallback optional, callback called in cases where no
Expand All @@ -255,7 +253,7 @@ export class Html5QrcodeScanner {

this.lastMatchFound = decodedText;
this.setHeaderMessage(
Html5QrcodeScannerStrings.lastMatch(decodedText),
t('scanner.lastMatch', { decodedText }),
Html5QrcodeScannerStatus.STATUS_SUCCESS);
}
};
Expand All @@ -282,13 +280,13 @@ export class Html5QrcodeScanner {
//#region State related public APIs
/**
* Pauses the ongoing scan.
*
*
* Notes:
* - Should only be called if camera scan is ongoing.
*
*
* @param shouldPauseVideo (Optional, default = false) If `true`
* the video will be paused.
*
*
* @throws error if method is called when scanner is not in scanning state.
*/
public pause(shouldPauseVideo?: boolean) {
Expand All @@ -298,19 +296,19 @@ export class Html5QrcodeScanner {

this.getHtml5QrcodeOrFail().pause(shouldPauseVideo);
}

/**
* Resumes the paused scan.
*
*
* If the video was previously paused by setting `shouldPauseVideo`
* to `true` in {@link Html5QrcodeScanner#pause(shouldPauseVideo)},
* calling this method will resume the video.
*
*
* Notes:
* - Should only be called if camera scan is ongoing.
* - With this caller will start getting results in success and error
* callbacks.
*
*
* @throws error if method is called when scanner is not in paused state.
*/
public resume() {
Expand All @@ -328,7 +326,7 @@ export class Html5QrcodeScanner {

/**
* Removes the QR Code scanner UI.
*
*
* @returns Promise which succeeds if the cleanup is complete successfully,
* fails otherwise.
*/
Expand Down Expand Up @@ -380,11 +378,11 @@ export class Html5QrcodeScanner {
//#region Beta APIs to modify running stream state.
/**
* Returns the capabilities of the running video track.
*
*
* Read more: https://developer.mozilla.org/en-US/docs/Web/API/MediaStreamTrack/getConstraints
*
*
* Note: Should only be called if {@link Html5QrcodeScanner#getState()}
* returns {@link Html5QrcodeScannerState#SCANNING} or
* returns {@link Html5QrcodeScannerState#SCANNING} or
* {@link Html5QrcodeScannerState#PAUSED}.
*
* @returns the capabilities of a running video track.
Expand All @@ -397,11 +395,11 @@ export class Html5QrcodeScanner {
/**
* Returns the object containing the current values of each constrainable
* property of the running video track.
*
*
* Read more: https://developer.mozilla.org/en-US/docs/Web/API/MediaStreamTrack/getSettings
*
*
* Note: Should only be called if {@link Html5QrcodeScanner#getState()}
* returns {@link Html5QrcodeScannerState#SCANNING} or
* returns {@link Html5QrcodeScannerState#SCANNING} or
* {@link Html5QrcodeScannerState#PAUSED}.
*
* @returns the supported settings of the running video track.
Expand All @@ -415,7 +413,7 @@ export class Html5QrcodeScanner {
* Apply a video constraints on running video track from camera.
*
* Note: Should only be called if {@link Html5QrcodeScanner#getState()}
* returns {@link Html5QrcodeScannerState#SCANNING} or
* returns {@link Html5QrcodeScannerState#SCANNING} or
* {@link Html5QrcodeScannerState#PAUSED}.
*
* @param {MediaTrackConstraints} specifies a variety of video or camera
Expand Down Expand Up @@ -545,7 +543,7 @@ export class Html5QrcodeScanner {
const $this = this;
$this.showHideScanTypeSwapLink(false);
$this.setHeaderMessage(
Html5QrcodeScannerStrings.cameraPermissionRequesting());
t('scanner.cameraPermissionRequesting'));

const createPermissionButtonIfNotExists = () => {
if (!requestPermissionButton) {
Expand All @@ -565,14 +563,14 @@ export class Html5QrcodeScanner {
$this.renderCameraSelection(cameras);
} else {
$this.setHeaderMessage(
Html5QrcodeScannerStrings.noCameraFound(),
t('scanner.noCameraFound'),
Html5QrcodeScannerStatus.STATUS_WARNING);
createPermissionButtonIfNotExists();
}
}).catch((error) => {
$this.persistedDataManager.setHasPermission(
/* hasPermission */ false);

if (requestPermissionButton) {
requestPermissionButton.disabled = false;
} else {
Expand All @@ -598,7 +596,7 @@ export class Html5QrcodeScanner {
.createElement<HTMLButtonElement>(
"button", this.getCameraPermissionButtonId());
requestPermissionButton.innerText
= Html5QrcodeScannerStrings.cameraPermissionTitle();
= t('scanner.cameraPermissionTitle');

requestPermissionButton.addEventListener("click", function () {
requestPermissionButton.disabled = true;
Expand Down Expand Up @@ -687,7 +685,7 @@ export class Html5QrcodeScanner {
return;
}

$this.setHeaderMessage(Html5QrcodeScannerStrings.loadingImage());
$this.setHeaderMessage(t('scanner.loadingImage'));
$this.html5Qrcode.scanFileV2(file, /* showImage= */ true)
.then((html5qrcodeResult: Html5QrcodeResult) => {
$this.resetHeaderMessage();
Expand Down Expand Up @@ -751,14 +749,14 @@ export class Html5QrcodeScanner {
= BaseUiElementFactory.createElement<HTMLButtonElement>(
"button", PublicUiElementIdAndClasses.CAMERA_START_BUTTON_ID);
cameraActionStartButton.innerText
= Html5QrcodeScannerStrings.scanButtonStartScanningText();
= t('scanner.scanButtonStartScanningText');
cameraActionContainer.appendChild(cameraActionStartButton);

const cameraActionStopButton
= BaseUiElementFactory.createElement<HTMLButtonElement>(
"button", PublicUiElementIdAndClasses.CAMERA_STOP_BUTTON_ID);
cameraActionStopButton.innerText
= Html5QrcodeScannerStrings.scanButtonStopScanningText();
= t('scanner.scanButtonStopScanningText');
cameraActionStopButton.style.display = "none";
cameraActionStopButton.disabled = true;
cameraActionContainer.appendChild(cameraActionStopButton);
Expand Down Expand Up @@ -801,8 +799,7 @@ export class Html5QrcodeScanner {
cameraActionStartButton.style.display = "none";
}
cameraActionStartButton.innerText
= Html5QrcodeScannerStrings
.scanButtonStartScanningText();
= t('scanner.scanButtonStartScanningText');
cameraActionStartButton.style.opacity = "1";
cameraActionStartButton.disabled = false;
if (shouldShow) {
Expand All @@ -813,15 +810,15 @@ export class Html5QrcodeScanner {
cameraActionStartButton.addEventListener("click", (_) => {
// Update the UI.
cameraActionStartButton.innerText
= Html5QrcodeScannerStrings.scanButtonScanningStarting();
= t('scanner.scanButtonScanningStarting');
cameraSelectUi.disable();
cameraActionStartButton.disabled = true;
cameraActionStartButton.style.opacity = "0.5";
// Swap link is available only when both scan types are required.
if (this.scanTypeSelector.hasMoreThanOneScanType()) {
$this.showHideScanTypeSwapLink(false);
}
$this.resetHeaderMessage();
$this.resetHeaderMessage();

// Attempt starting the camera.
const cameraId = cameraSelectUi.getValue();
Expand Down Expand Up @@ -875,7 +872,7 @@ export class Html5QrcodeScanner {
if(this.scanTypeSelector.hasMoreThanOneScanType()) {
$this.showHideScanTypeSwapLink(true);
}

cameraSelectUi.enable();
cameraActionStartButton.disabled = false;
cameraActionStopButton.style.display = "none";
Expand Down Expand Up @@ -909,9 +906,9 @@ export class Html5QrcodeScanner {
private createSectionSwap() {
const $this = this;
const TEXT_IF_CAMERA_SCAN_SELECTED
= Html5QrcodeScannerStrings.textIfCameraScanSelected();
= t('scanner.textIfCameraScanSelected');
const TEXT_IF_FILE_SCAN_SELECTED
= Html5QrcodeScannerStrings.textIfFileScanSelected();
= t('scanner.textIfFileScanSelected');

// TODO(minhaz): Export this as an UI element.
const section = document.getElementById(this.getDashboardSectionId())!;
Expand Down Expand Up @@ -939,7 +936,7 @@ export class Html5QrcodeScanner {
$this.resetHeaderMessage();
$this.fileSelectionUi!.resetValue();
$this.sectionSwapAllowed = false;

if (ScanTypeSelector.isCameraScanType($this.currentScanType)) {
// Swap to file based scanning.
$this.clearScanRegion();
Expand Down Expand Up @@ -1060,7 +1057,7 @@ export class Html5QrcodeScanner {
this.cameraScanImage.width = 64;
this.cameraScanImage.style.opacity = "0.8";
this.cameraScanImage.src = ASSET_CAMERA_SCAN;
this.cameraScanImage.alt = Html5QrcodeScannerStrings.cameraScanAltText();
this.cameraScanImage.alt = t('scanner.cameraScanAltText');
}

private insertFileScanImageToScanRegion() {
Expand All @@ -1082,7 +1079,7 @@ export class Html5QrcodeScanner {
this.fileScanImage.width = 64;
this.fileScanImage.style.opacity = "0.8";
this.fileScanImage.src = ASSET_FILE_SCAN;
this.fileScanImage.alt = Html5QrcodeScannerStrings.fileScanAltText();
this.fileScanImage.alt = t('scanner.fileScanAltText');
}

private clearScanRegion() {
Expand Down
Loading