Browse Source

fix camera resolution, parameterize image API server

photo-upload
Trent Larson 8 months ago
parent
commit
92b924643e
  1. 3
      project.task.yaml
  2. 5
      src/constants/app.ts
  3. 19
      src/views/GiftedPhoto.vue

3
project.task.yaml

@ -1,6 +1,9 @@
tasks : tasks :
- .1 on feed, don't show "to someone anonymous" if it's to a project
- .1 on ideas, put an "x" to close it
- .2 fix give dialog from "more contacts" off home page to allow giving to this user - .2 fix give dialog from "more contacts" off home page to allow giving to this user
- 01 in the feed, group by project or contact or topic or time/$ (via BC) - 01 in the feed, group by project or contact or topic or time/$ (via BC)
- .2 anchor hash into BTC - .2 anchor hash into BTC

5
src/constants/app.ts

@ -12,10 +12,15 @@ export enum AppString {
TEST1_PUSH_SERVER = "https://test.timesafari.app", TEST1_PUSH_SERVER = "https://test.timesafari.app",
TEST2_PUSH_SERVER = "https://timesafari-pwa.anomalistlabs.com", TEST2_PUSH_SERVER = "https://timesafari-pwa.anomalistlabs.com",
PROD_IMAGE_API_SERVER = "https://image-api.timesafari.app",
TEST_IMAGE_API_SERVER = "https://test-image-api.timesafari.app",
LOCAL_IMAGE_API_SERVER = "http://localhost:3001",
NO_CONTACT_NAME = "(no name)", NO_CONTACT_NAME = "(no name)",
} }
export const DEFAULT_ENDORSER_API_SERVER = AppString.TEST_ENDORSER_API_SERVER; export const DEFAULT_ENDORSER_API_SERVER = AppString.TEST_ENDORSER_API_SERVER;
export const DEFAULT_IMAGE_API_SERVER = AppString.LOCAL_IMAGE_API_SERVER;
export const DEFAULT_PUSH_SERVER = export const DEFAULT_PUSH_SERVER =
window.location.protocol + "//" + window.location.host; window.location.protocol + "//" + window.location.host;

19
src/views/GiftedPhoto.vue

@ -22,12 +22,11 @@
Dude, you got an image! Dude, you got an image! Dude, you got an image! Dude, you got an image!
</div> </div>
<div v-else> <div v-else>
<camera <!--
Camera "resolution" doesn't change how it shows on screen but rather stretches the result, eg the following which just stretches it vertically:
:resolution="{ width: 375, height: 812 }" :resolution="{ width: 375, height: 812 }"
facingMode="user" -->
autoplay <camera facingMode="user" autoplay ref="camera">
ref="camera"
>
<button @click="storeImage">I'm on top of the video</button> <button @click="storeImage">I'm on top of the video</button>
</camera> </camera>
</div> </div>
@ -39,6 +38,8 @@ import axios from "axios";
import Camera from "simple-vue-camera"; import Camera from "simple-vue-camera";
import { Component, Vue } from "vue-facing-decorator"; import { Component, Vue } from "vue-facing-decorator";
import { DEFAULT_IMAGE_API_SERVER } from "@/constants/app";
interface Notification { interface Notification {
group: string; group: string;
type: string; type: string;
@ -68,19 +69,15 @@ export default class GiftedPhoto extends Vue {
return; return;
} }
//this.localImageUrl = URL.createObjectURL(blob);
console.log("Got an image:", blob?.size);
const formData = new FormData(); const formData = new FormData();
formData.append("image", blob, "snapshot.jpg"); formData.append("image", blob, "snapshot.jpg");
try { try {
const response = await axios.post( const response = await axios.post(
"http://localhost:3000/image", DEFAULT_IMAGE_API_SERVER + "/image",
formData, formData,
); );
console.log("Upload successful", response.data); console.log("Sent. Response:", response.data);
} catch (error) { } catch (error) {
console.error("Error uploading the image", error); console.error("Error uploading the image", error);
} }

Loading…
Cancel
Save