@monkvision/inspection-capture-web 5.1.0 → 5.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +52 -45
- package/lib/PhotoCapture/PhotoCaptureHUD/PhotoCaptureHUDSightTutorial/PhotoCaptureHUDSightTutorial.js +9 -1
- package/lib/PhotoCapture/PhotoCaptureHUD/PhotoCaptureHUDSightTutorial/PhotoCaptureHUDSightTutorial.styles.js +4 -6
- package/lib/translations/de.json +2 -1
- package/lib/translations/en.json +2 -1
- package/lib/translations/fr.json +2 -1
- package/lib/translations/nl.json +2 -1
- package/package.json +15 -15
package/README.md
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
# @monkvision/inspection-capture-web
|
|
2
|
+
|
|
2
3
|
This package provides utils, tools and ready-to-use components used to capture pictures needed to run Monk inspections.
|
|
3
4
|
There are two main workflows for capturing pictures of a vehicle for a Monk inspection :
|
|
4
|
-
|
|
5
|
+
|
|
6
|
+
- The **PhotoCapture** workflow : the user is shown a certain set of car wireframes, called _Sights_, and they are asked
|
|
5
7
|
to take pictures of the vehicle by aligning the vehicle with the Sight overlays.
|
|
6
8
|
- The **VideoCapture** workflow : the user is asked to record a quick video of their vehicle by filming it and rotating
|
|
7
9
|
in a full circle around it.
|
|
@@ -10,6 +12,7 @@ There are two main workflows for capturing pictures of a vehicle for a Monk insp
|
|
|
10
12
|
- Two-shot: The user is asked to take, first a wide picture of the vehicle, then a close-up picture of the damage.
|
|
11
13
|
|
|
12
14
|
# Installing
|
|
15
|
+
|
|
13
16
|
To install the package, you can run the following command :
|
|
14
17
|
|
|
15
18
|
```shell
|
|
@@ -20,8 +23,9 @@ If you are using TypeScript, this package comes with its type definitions integr
|
|
|
20
23
|
anything else!
|
|
21
24
|
|
|
22
25
|
# PhotoCapture
|
|
26
|
+
|
|
23
27
|
The PhotoCapture workflow is aimed at guiding users in taking pictures of their vehicle in order to add them to a Monk
|
|
24
|
-
inspection. The user is shown a set of car wireframes, which we call
|
|
28
|
+
inspection. The user is shown a set of car wireframes, which we call _Sights_ and that are available in the
|
|
25
29
|
`@monkvision/sights` package. These Sights act as guides, and the user is asked to take pictures of their vehicle by
|
|
26
30
|
aligning it with the Sights.
|
|
27
31
|
|
|
@@ -29,6 +33,7 @@ Please refer to the [official MonkJs documentation](https://monkvision.github.io
|
|
|
29
33
|
have a detailed overview of the Photo Capture workflow.
|
|
30
34
|
|
|
31
35
|
## PhotoCapture component
|
|
36
|
+
|
|
32
37
|
This package exports a ready-to-use single-page component called `PhotoCapture` that implements the PhotoCapture
|
|
33
38
|
workflow. In order to use it, simply create a new page in your application containing just this component. You will then
|
|
34
39
|
need to generate a Monk authentication token (using Auth0), and create a new inspection, in which all tasks statuses are
|
|
@@ -70,7 +75,7 @@ export function MonkPhotoCapturePage({ authToken }) {
|
|
|
70
75
|
| resolution | `CameraResolution` | Indicates the resolution of the pictures taken by the Camera. | | `CameraResolution.UHD_4K` |
|
|
71
76
|
| allowImageUpscaling | `boolean` | Allow images to be scaled up if the device does not support the specified resolution in the `resolution` prop. | | `false` |
|
|
72
77
|
| additionalTasks | `TaskName[]` | An optional list of additional tasks to run on every image of the inspection. | | |
|
|
73
|
-
| startTasksOnComplete |
|
|
78
|
+
| startTasksOnComplete | `boolean` | Value indicating if tasks should be started at the end of the inspection. See the `inspection-capture-web` package doc for more info. | | `true` |
|
|
74
79
|
| enforceOrientation | `DeviceOrientation` | Use this prop to enforce a specific device orientation for the Camera screen. | | |
|
|
75
80
|
| inspectionId | string | The ID of the inspection to add images to. Make sure that the user that created the inspection if the same one as the one described in the auth token in the `apiConfig` prop. | ✔️ | |
|
|
76
81
|
| apiConfig | ApiConfig | The api config used to communicate with the API. Make sure that the user described in the auth token is the same one as the one that created the inspection provided in the `inspectionId` prop. | ✔️ | |
|
|
@@ -85,8 +90,8 @@ export function MonkPhotoCapturePage({ authToken }) {
|
|
|
85
90
|
| enableSightGuideline | `boolean` | Boolean indicating whether the sight guideline feature is enabled. If disabled, the guideline text will be hidden. | | `true` |
|
|
86
91
|
| enableTutorial | `PhotoCaptureTutorialOption` | Options for displaying the photo capture tutorial. | | `PhotoCaptureTutorialOption.FIRST_TIME_ONLY` |
|
|
87
92
|
| allowSkipTutorial | `boolean` | Boolean indicating if the user can skip the PhotoCapture tutorial. | | `true` |
|
|
88
|
-
|
|
|
89
|
-
|
|
|
93
|
+
| enableSightTutorial | `PhotoCaptureSightTutorialOption` | Options for displaying the photo capture sight tutorial. | | `PhotoCaptureSightTutorialOption.DISABLED` |
|
|
94
|
+
| sightTutorial | `SightTutorial[]` | A collection of sight tutorial in different language with a list of sightIds associate to it. | | |
|
|
90
95
|
| enableCompliance | `boolean` | Indicates if compliance checks should be enabled or not. | | `true` |
|
|
91
96
|
| enableCompliancePerSight | `string[]` | Array of Sight IDs that indicates for which sight IDs the compliance should be enabled. | | |
|
|
92
97
|
| complianceIssues | `ComplianceIssue[]` | If compliance checks are enabled, this property can be used to select a list of compliance issues to check. | | `DEFAULT_COMPLIANCE_ISSUES` |
|
|
@@ -102,6 +107,7 @@ export function MonkPhotoCapturePage({ authToken }) {
|
|
|
102
107
|
| vehicleType | `VehicleType` | The vehicle type of the inspection. | | `VehicleType.SEDAN` |
|
|
103
108
|
|
|
104
109
|
# VideoCapture
|
|
110
|
+
|
|
105
111
|
The VideoCapture workflow is aimed at asking users to record a walkaround video of their vehicle (around ~1min per
|
|
106
112
|
video) to send vehicle inspection pictures to the Monk API. In reality, no video is being recorded. Instead, screenshots
|
|
107
113
|
of the camera stream a repeatidly taken while the users walks around their vehicle. An algorithm is run to select the
|
|
@@ -111,6 +117,7 @@ Please refer to the [official MonkJs documentation](https://monkvision.github.io
|
|
|
111
117
|
have a detailed overview of the Video Capture workflow.
|
|
112
118
|
|
|
113
119
|
## VideoCapture component
|
|
120
|
+
|
|
114
121
|
This package exports a ready-to-use single-page component called `VideoCapture` that implements the VideoCapture
|
|
115
122
|
workflow. The implementation for it is extremely similar to the `PhotoCapture` component described above. The only
|
|
116
123
|
difference being the configuration options that differ, as well as the fact that you need to pass certain parameters
|
|
@@ -137,25 +144,25 @@ export function MonkVideoCapturePage({ authToken }) {
|
|
|
137
144
|
|
|
138
145
|
Props
|
|
139
146
|
|
|
140
|
-
| Prop
|
|
141
|
-
|
|
142
|
-
| format
|
|
143
|
-
| quality
|
|
144
|
-
| resolution
|
|
145
|
-
| allowImageUpscaling
|
|
146
|
-
| additionalTasks
|
|
147
|
-
| startTasksOnComplete
|
|
148
|
-
| enforceOrientation
|
|
149
|
-
| inspectionId
|
|
150
|
-
| apiConfig
|
|
151
|
-
| onComplete
|
|
152
|
-
| lang
|
|
153
|
-
| minRecordingDuration
|
|
154
|
-
| maxRetryCount
|
|
155
|
-
| enableFastWalkingWarning
|
|
156
|
-
| enablePhoneShakingWarning
|
|
157
|
-
| fastWalkingWarningCooldown
|
|
158
|
-
| phoneShakingWarningCooldown
|
|
147
|
+
| Prop | Type | Description | Required | Default Value |
|
|
148
|
+
|-----------------------------|---------------------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------|---------------------------|
|
|
149
|
+
| format | `CompressionFormat` | The output format of the compression. | | `CompressionFormat.JPEG` |
|
|
150
|
+
| quality | `number` | Value indicating image quality for the compression output. | | `0.6` |
|
|
151
|
+
| resolution | `CameraResolution` | Indicates the resolution of the pictures taken by the Camera. | | `CameraResolution.UHD_4K` |
|
|
152
|
+
| allowImageUpscaling | `boolean` | Allow images to be scaled up if the device does not support the specified resolution in the `resolution` prop. | | `false` |
|
|
153
|
+
| additionalTasks | `TaskName[]` | An optional list of additional tasks to run on every image of the inspection. | | |
|
|
154
|
+
| startTasksOnComplete | `TaskName[]` | Value indicating if tasks should be started at the end of the inspection. See the `inspection-capture-web` package doc for more info. | | `true` |
|
|
155
|
+
| enforceOrientation | `DeviceOrientation` | Use this prop to enforce a specific device orientation for the Camera screen. | | |
|
|
156
|
+
| inspectionId | string | The ID of the inspection to add images to. Make sure that the user that created the inspection if the same one as the one described in the auth token in the `apiConfig` prop. | ✔️ | |
|
|
157
|
+
| apiConfig | ApiConfig | The api config used to communicate with the API. Make sure that the user described in the auth token is the same one as the one that created the inspection provided in the `inspectionId` prop. | ✔️ | |
|
|
158
|
+
| onComplete | `() => void` | Callback called when inspection capture is complete. | | |
|
|
159
|
+
| lang | <code>string | null</code> | The language to be used by this component. | | `'en'` |
|
|
160
|
+
| minRecordingDuration | `number` | The minimum duration of a recording in milliseconds. | | `15000` |
|
|
161
|
+
| maxRetryCount | `number` | The maximum number of retries for failed image uploads. | | `3` |
|
|
162
|
+
| enableFastWalkingWarning | `boolean` | Boolean indicating if a warning should be shown to the user when they are walking too fast around the vehicle. | | `true` |
|
|
163
|
+
| enablePhoneShakingWarning | `boolean` | Boolean indicating if a warning should be shown to the user when they are shaking their phone too much. | | `true` |
|
|
164
|
+
| fastWalkingWarningCooldown | `number` | The duration (in milliseconds) to wait between fast walking warnings. | | `4000` |
|
|
165
|
+
| phoneShakingWarningCooldown | `number` | The duration (in milliseconds) to wait between phone shaking warnings. | | `4000` |
|
|
159
166
|
|
|
160
167
|
# DamageDisclosure
|
|
161
168
|
|
|
@@ -191,24 +198,24 @@ export function MonkDamageDisclosurePage({ authToken }) {
|
|
|
191
198
|
|
|
192
199
|
Props
|
|
193
200
|
|
|
194
|
-
| Prop | Type
|
|
195
|
-
|
|
196
|
-
| inspectionId | string
|
|
197
|
-
| apiConfig | ApiConfig
|
|
198
|
-
| onClose | `() => void`
|
|
199
|
-
| onComplete | `() => void`
|
|
200
|
-
| onPictureTaken | `(picture: MonkPicture) => void`
|
|
201
|
-
| lang | <code>string | null</code>
|
|
202
|
-
| enforceOrientation | `DeviceOrientation`
|
|
203
|
-
| maxUploadDurationWarning | `number`
|
|
204
|
-
| useAdaptiveImageQuality | `boolean`
|
|
205
|
-
| showCloseButton | `boolean`
|
|
206
|
-
| format | `CompressionFormat`
|
|
207
|
-
| quality | `number`
|
|
208
|
-
| resolution | `CameraResolution`
|
|
209
|
-
| allowImageUpscaling | `boolean`
|
|
210
|
-
| useLiveCompliance | `boolean`
|
|
211
|
-
| validateButtonLabel | `string`
|
|
212
|
-
| thumbnailDomain | `string`
|
|
213
|
-
| vehicleType | `VehicleType`
|
|
214
|
-
| addDamage | `AddDamage`
|
|
201
|
+
| Prop | Type | Description | Required | Default Value |
|
|
202
|
+
|--------------------------|----------------------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------|---------------------------|
|
|
203
|
+
| inspectionId | string | The ID of the inspection to add images to. Make sure that the user that created the inspection if the same one as the one described in the auth token in the `apiConfig` prop. | ✔️ | |
|
|
204
|
+
| apiConfig | ApiConfig | The api config used to communicate with the API. Make sure that the user described in the auth token is the same one as the one that created the inspection provided in the `inspectionId` prop. | ✔️ | |
|
|
205
|
+
| onClose | `() => void` | Callback called when the user clicks on the Close button. If this callback is not provided, the button will not be displayed on the screen. | | |
|
|
206
|
+
| onComplete | `() => void` | Callback called when inspection capture is complete. | | |
|
|
207
|
+
| onPictureTaken | `(picture: MonkPicture) => void` | Callback called when the user has taken a picture in the Capture process. | | |
|
|
208
|
+
| lang | <code>string | null</code> | The language to be used by this component. | | `'en'` |
|
|
209
|
+
| enforceOrientation | `DeviceOrientation` | Use this prop to enforce a specific device orientation for the Camera screen. | | |
|
|
210
|
+
| maxUploadDurationWarning | `number` | Max upload duration in milliseconds before showing a bad connection warning to the user. Use `-1` to never display the warning. | | `15000` |
|
|
211
|
+
| useAdaptiveImageQuality | `boolean` | Boolean indicating if the image quality should be downgraded automatically in case of low connection. | | `true` |
|
|
212
|
+
| showCloseButton | `boolean` | Indicates if the close button should be displayed in the HUD on top of the Camera preview. | | `false` |
|
|
213
|
+
| format | `CompressionFormat` | The output format of the compression. | | `CompressionFormat.JPEG` |
|
|
214
|
+
| quality | `number` | Value indicating image quality for the compression output. | | `0.6` |
|
|
215
|
+
| resolution | `CameraResolution` | Indicates the resolution of the pictures taken by the Camera. | | `CameraResolution.UHD_4K` |
|
|
216
|
+
| allowImageUpscaling | `boolean` | Allow images to be scaled up if the device does not support the specified resolution in the `resolution` prop. | | `false` |
|
|
217
|
+
| useLiveCompliance | `boolean` | Indicates if live compliance should be enabled or not. | | `false` |
|
|
218
|
+
| validateButtonLabel | `string` | Custom label for validate button in gallery view. | | |
|
|
219
|
+
| thumbnailDomain | `string` | The API domain used to communicate with the resize micro service. | ✔️ | |
|
|
220
|
+
| vehicleType | `VehicleType` | The vehicle type of the inspection. | | `VehicleType.SEDAN` |
|
|
221
|
+
| addDamage | `AddDamage` | Options for Add Damage. If disabled, the `Add Damage` button will be hidden. | | `AddDamage.PART_SELECT` |
|
|
@@ -60,6 +60,14 @@ function PhotoCaptureHUDSightTutorial(_a) {
|
|
|
60
60
|
if (enableSightTutorial === types_1.PhotoCaptureSightTutorialOption.DISABLED) {
|
|
61
61
|
return null;
|
|
62
62
|
}
|
|
63
|
-
return ((0, jsx_runtime_1.jsxs)("div", __assign({ style: style.container }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ style: PhotoCaptureHUDSightTutorial_styles_1.styles['iconsContainer'] }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ style: PhotoCaptureHUDSightTutorial_styles_1.styles['icon'] }, { children: (0, jsx_runtime_1.jsx)(common_ui_web_1.IconAroundVehicle, { size: 80, orientationAngle: (_b = selectedSight.positioning) === null || _b === void 0 ? void 0 : _b.orientation, positionAroundVehicle: (_c = selectedSight.positioning) === null || _c === void 0 ? void 0 : _c.position, distance: (_d = selectedSight.positioning) === null || _d === void 0 ? void 0 : _d.distance }) })), (0, jsx_runtime_1.jsx)("div", __assign({ style: PhotoCaptureHUDSightTutorial_styles_1.styles['icon'] }, { children: (0, jsx_runtime_1.jsx)(common_ui_web_1.IconVerticalPosition, { size: 67, position: (_e = selectedSight.positioning) === null || _e === void 0 ? void 0 : _e.height, variant: IconVerticalPosition_types_1.IconVerticalPositionVariant.SECONDARY }) })), (0, jsx_runtime_1.jsx)("div", __assign({ style: PhotoCaptureHUDSightTutorial_styles_1.styles['icon'] }, { children: (0, jsx_runtime_1.jsx)(common_ui_web_1.SightOverlay, { style: PhotoCaptureHUDSightTutorial_styles_1.styles['sightIcon'], sight: selectedSight, getAttributes: style.sightIcon.getAttributes }) }))] })), enableSightTutorial === types_1.PhotoCaptureSightTutorialOption.CLASSIC && ((0, jsx_runtime_1.jsxs)("div", __assign({ style: style.classicTutorialContainer }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ style: style.classicTitleContainer }, { children: [(0, jsx_runtime_1.jsx)(common_ui_web_1.Button, { style: PhotoCaptureHUDSightTutorial_styles_1.styles['closeButtonFiller'], icon: 'close', variant: 'text' }), (0, jsx_runtime_1.jsx)("span", __assign({ style: PhotoCaptureHUDSightTutorial_styles_1.styles['classicTitle'] }, { children: t('photo.hud.sightTutorial.tip').toUpperCase() })), (0, jsx_runtime_1.jsx)(common_ui_web_1.Button, { style: style.closeButton, primaryColor: 'text-black', icon: 'close', variant: 'text', onClick: onClose })] })), (0, jsx_runtime_1.jsx)("div", __assign({ style: style.classicGuidelineContainer }, { children: (0, jsx_runtime_1.jsx)("span", __assign({ style: style.classicGuideline }, { children: tutorialGuideline
|
|
63
|
+
return ((0, jsx_runtime_1.jsxs)("div", __assign({ style: style.container }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ style: PhotoCaptureHUDSightTutorial_styles_1.styles['iconsContainer'] }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ style: PhotoCaptureHUDSightTutorial_styles_1.styles['icon'] }, { children: (0, jsx_runtime_1.jsx)(common_ui_web_1.IconAroundVehicle, { size: 80, orientationAngle: (_b = selectedSight.positioning) === null || _b === void 0 ? void 0 : _b.orientation, positionAroundVehicle: (_c = selectedSight.positioning) === null || _c === void 0 ? void 0 : _c.position, distance: (_d = selectedSight.positioning) === null || _d === void 0 ? void 0 : _d.distance }) })), (0, jsx_runtime_1.jsx)("div", __assign({ style: PhotoCaptureHUDSightTutorial_styles_1.styles['icon'] }, { children: (0, jsx_runtime_1.jsx)(common_ui_web_1.IconVerticalPosition, { size: 67, position: (_e = selectedSight.positioning) === null || _e === void 0 ? void 0 : _e.height, variant: IconVerticalPosition_types_1.IconVerticalPositionVariant.SECONDARY }) })), (0, jsx_runtime_1.jsx)("div", __assign({ style: PhotoCaptureHUDSightTutorial_styles_1.styles['icon'] }, { children: (0, jsx_runtime_1.jsx)(common_ui_web_1.SightOverlay, { style: PhotoCaptureHUDSightTutorial_styles_1.styles['sightIcon'], sight: selectedSight, getAttributes: style.sightIcon.getAttributes }) }))] })), enableSightTutorial === types_1.PhotoCaptureSightTutorialOption.CLASSIC && ((0, jsx_runtime_1.jsxs)("div", __assign({ style: style.classicTutorialContainer }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ style: style.classicTitleContainer }, { children: [(0, jsx_runtime_1.jsx)(common_ui_web_1.Button, { style: PhotoCaptureHUDSightTutorial_styles_1.styles['closeButtonFiller'], icon: 'close', variant: 'text' }), (0, jsx_runtime_1.jsx)("span", __assign({ style: PhotoCaptureHUDSightTutorial_styles_1.styles['classicTitle'] }, { children: t('photo.hud.sightTutorial.tip').toUpperCase() })), (0, jsx_runtime_1.jsx)(common_ui_web_1.Button, { style: style.closeButton, primaryColor: 'text-black', icon: 'close', variant: 'text', onClick: onClose })] })), (0, jsx_runtime_1.jsx)("div", __assign({ style: style.classicGuidelineContainer }, { children: (0, jsx_runtime_1.jsx)("span", __assign({ style: style.classicGuideline }, { children: (tutorialGuideline === null || tutorialGuideline === void 0 ? void 0 : tutorialGuideline.length)
|
|
64
|
+
? tutorialGuideline
|
|
65
|
+
: t(tutorialImage
|
|
66
|
+
? 'photo.hud.sightTutorial.defaultTutorialWithImage'
|
|
67
|
+
: 'photo.hud.sightTutorial.defaultTutorialWithoutImage') })) })), tutorialImage && ((0, jsx_runtime_1.jsx)("div", __assign({ style: PhotoCaptureHUDSightTutorial_styles_1.styles['classicImageContainer'] }, { children: (0, jsx_runtime_1.jsx)("img", { style: PhotoCaptureHUDSightTutorial_styles_1.styles['image'], src: tutorialImage, alt: selectedSight.id }) })))] }))), enableSightTutorial === types_1.PhotoCaptureSightTutorialOption.MODERN && ((0, jsx_runtime_1.jsxs)("div", __assign({ style: style.tutorialContainer }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ style: PhotoCaptureHUDSightTutorial_styles_1.styles['titleContainer'] }, { children: [(0, jsx_runtime_1.jsx)(common_ui_web_1.Button, { style: PhotoCaptureHUDSightTutorial_styles_1.styles['closeButtonFiller'], icon: 'close', variant: 'text' }), (0, jsx_runtime_1.jsx)("span", { children: t('photo.hud.sightTutorial.tip').toUpperCase() }), (0, jsx_runtime_1.jsx)(common_ui_web_1.Button, { style: style.closeButton, primaryColor: 'text-white', icon: 'close', variant: 'text', onClick: onClose })] })), (0, jsx_runtime_1.jsx)("div", __assign({ style: style.classicGuidelineContainer }, { children: (0, jsx_runtime_1.jsx)("span", __assign({ style: style.guideline }, { children: (tutorialGuideline === null || tutorialGuideline === void 0 ? void 0 : tutorialGuideline.length)
|
|
68
|
+
? tutorialGuideline
|
|
69
|
+
: t(tutorialImage
|
|
70
|
+
? 'photo.hud.sightTutorial.defaultTutorialWithImage'
|
|
71
|
+
: 'photo.hud.sightTutorial.defaultTutorialWithoutImage') })) })), tutorialImage && ((0, jsx_runtime_1.jsx)("div", __assign({ style: PhotoCaptureHUDSightTutorial_styles_1.styles['imageContainer'] }, { children: (0, jsx_runtime_1.jsx)("img", { style: PhotoCaptureHUDSightTutorial_styles_1.styles['image'], src: tutorialImage, alt: selectedSight.id }) })))] })))] })));
|
|
64
72
|
}
|
|
65
73
|
exports.PhotoCaptureHUDSightTutorial = PhotoCaptureHUDSightTutorial;
|
|
@@ -94,8 +94,6 @@ exports.styles = {
|
|
|
94
94
|
fontWeight: 700,
|
|
95
95
|
},
|
|
96
96
|
guidelineContainer: {
|
|
97
|
-
height: '40%',
|
|
98
|
-
overflow: 'auto',
|
|
99
97
|
display: 'flex',
|
|
100
98
|
flexDirection: 'column',
|
|
101
99
|
padding: '0 30px',
|
|
@@ -107,8 +105,6 @@ exports.styles = {
|
|
|
107
105
|
lineHeight: '24px',
|
|
108
106
|
},
|
|
109
107
|
classicGuidelineContainer: {
|
|
110
|
-
height: '40%',
|
|
111
|
-
overflow: 'auto',
|
|
112
108
|
display: 'flex',
|
|
113
109
|
flexDirection: 'column',
|
|
114
110
|
padding: '0 30px',
|
|
@@ -127,14 +123,16 @@ exports.styles = {
|
|
|
127
123
|
},
|
|
128
124
|
closeButtonFiller: { visibility: 'hidden', padding: '0px 20px', height: '100%', borderRadius: 0 },
|
|
129
125
|
imageContainer: {
|
|
130
|
-
|
|
126
|
+
flexGrow: 1,
|
|
127
|
+
overflow: 'hidden',
|
|
131
128
|
width: '100%',
|
|
132
129
|
display: 'flex',
|
|
133
130
|
justifyContent: 'center',
|
|
134
131
|
alignItems: 'center',
|
|
135
132
|
},
|
|
136
133
|
classicImageContainer: {
|
|
137
|
-
|
|
134
|
+
flexGrow: 1,
|
|
135
|
+
overflow: 'hidden',
|
|
138
136
|
width: '100%',
|
|
139
137
|
display: 'flex',
|
|
140
138
|
justifyContent: 'center',
|
package/lib/translations/de.json
CHANGED
|
@@ -45,7 +45,8 @@
|
|
|
45
45
|
},
|
|
46
46
|
"sightTutorial": {
|
|
47
47
|
"tip": "Tipp",
|
|
48
|
-
"
|
|
48
|
+
"defaultTutorialWithImage": "Hier sehen Sie ein Referenzbild.\nBitte versuchen Sie, den Bildausschnitt möglichst genau nachzustellen.",
|
|
49
|
+
"defaultTutorialWithoutImage": "Bitte positionieren Sie sich wie in der Abbildung links gezeigt\nund achten Sie darauf, dass sich die Kamera in der richtigen Höhe befindet."
|
|
49
50
|
}
|
|
50
51
|
},
|
|
51
52
|
"gallery": {
|
package/lib/translations/en.json
CHANGED
|
@@ -45,7 +45,8 @@
|
|
|
45
45
|
},
|
|
46
46
|
"sightTutorial": {
|
|
47
47
|
"tip": "Tip",
|
|
48
|
-
"
|
|
48
|
+
"defaultTutorialWithImage": "Here’s a reference image\nTry to match your framing as closely as possible.",
|
|
49
|
+
"defaultTutorialWithoutImage": "Position yourself as shown in the left diagram\nEnsuring the camera is at the correct height."
|
|
49
50
|
}
|
|
50
51
|
},
|
|
51
52
|
"gallery": {
|
package/lib/translations/fr.json
CHANGED
|
@@ -45,7 +45,8 @@
|
|
|
45
45
|
},
|
|
46
46
|
"sightTutorial": {
|
|
47
47
|
"tip": "Conseil",
|
|
48
|
-
"
|
|
48
|
+
"defaultTutorialWithImage": "Voici une image de référence.\nVeuillez essayer de reproduire le cadrage le plus fidèlement possible.",
|
|
49
|
+
"defaultTutorialWithoutImage": "Veuillez vous positionner comme indiqué sur le schéma de gauche,\nen vous assurant que la caméra est à la bonne hauteur."
|
|
49
50
|
}
|
|
50
51
|
},
|
|
51
52
|
"gallery": {
|
package/lib/translations/nl.json
CHANGED
|
@@ -45,7 +45,8 @@
|
|
|
45
45
|
},
|
|
46
46
|
"sightTutorial": {
|
|
47
47
|
"tip": "Tip",
|
|
48
|
-
"
|
|
48
|
+
"defaultTutorialWithImage": "Hier ziet u een referentieafbeelding.\nProbeer uw kadrering hier zo goed mogelijk op af te stemmen.",
|
|
49
|
+
"defaultTutorialWithoutImage": "Positioneer uzelf zoals aangegeven in het diagram aan de linkerkant\nen zorg ervoor dat de camera zich op de juiste hoogte bevindt."
|
|
49
50
|
}
|
|
50
51
|
},
|
|
51
52
|
"gallery": {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@monkvision/inspection-capture-web",
|
|
3
|
-
"version": "5.1.
|
|
3
|
+
"version": "5.1.2",
|
|
4
4
|
"license": "BSD-3-Clause-Clear",
|
|
5
5
|
"packageManager": "yarn@3.2.4",
|
|
6
6
|
"description": "MonkJs inspection capture package for React (web) used to implement the Monk inspection capture workflow",
|
|
@@ -28,12 +28,12 @@
|
|
|
28
28
|
"lint:fix": "yarn run prettier:fix && yarn run eslint:fix"
|
|
29
29
|
},
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@monkvision/analytics": "5.1.
|
|
32
|
-
"@monkvision/camera-web": "5.1.
|
|
33
|
-
"@monkvision/common": "5.1.
|
|
34
|
-
"@monkvision/common-ui-web": "5.1.
|
|
35
|
-
"@monkvision/network": "5.1.
|
|
36
|
-
"@monkvision/sights": "5.1.
|
|
31
|
+
"@monkvision/analytics": "5.1.2",
|
|
32
|
+
"@monkvision/camera-web": "5.1.2",
|
|
33
|
+
"@monkvision/common": "5.1.2",
|
|
34
|
+
"@monkvision/common-ui-web": "5.1.2",
|
|
35
|
+
"@monkvision/network": "5.1.2",
|
|
36
|
+
"@monkvision/sights": "5.1.2",
|
|
37
37
|
"i18next": "^23.4.5",
|
|
38
38
|
"react-i18next": "^13.2.0"
|
|
39
39
|
},
|
|
@@ -44,13 +44,13 @@
|
|
|
44
44
|
"react-router-dom": "^6.22.3"
|
|
45
45
|
},
|
|
46
46
|
"devDependencies": {
|
|
47
|
-
"@monkvision/eslint-config-base": "5.1.
|
|
48
|
-
"@monkvision/eslint-config-typescript": "5.1.
|
|
49
|
-
"@monkvision/eslint-config-typescript-react": "5.1.
|
|
50
|
-
"@monkvision/jest-config": "5.1.
|
|
51
|
-
"@monkvision/prettier-config": "5.1.
|
|
52
|
-
"@monkvision/test-utils": "5.1.
|
|
53
|
-
"@monkvision/typescript-config": "5.1.
|
|
47
|
+
"@monkvision/eslint-config-base": "5.1.2",
|
|
48
|
+
"@monkvision/eslint-config-typescript": "5.1.2",
|
|
49
|
+
"@monkvision/eslint-config-typescript-react": "5.1.2",
|
|
50
|
+
"@monkvision/jest-config": "5.1.2",
|
|
51
|
+
"@monkvision/prettier-config": "5.1.2",
|
|
52
|
+
"@monkvision/test-utils": "5.1.2",
|
|
53
|
+
"@monkvision/typescript-config": "5.1.2",
|
|
54
54
|
"@testing-library/react": "^12.1.5",
|
|
55
55
|
"@testing-library/react-hooks": "^8.0.1",
|
|
56
56
|
"@types/copyfiles": "^2",
|
|
@@ -93,5 +93,5 @@
|
|
|
93
93
|
"url": "https://github.com/monkvision/monkjs/issues"
|
|
94
94
|
},
|
|
95
95
|
"homepage": "https://github.com/monkvision/monkjs",
|
|
96
|
-
"gitHead": "
|
|
96
|
+
"gitHead": "1ac73a2cae564f8e42b207b01dc909f1ee04f878"
|
|
97
97
|
}
|