←back to thread

662 points klimeryk | 4 comments | | HN request time: 0.001s | source

Hi, all! Author here. What started as a small tool I built for a job interview, became "The Most Over-engineered Deal With It Emoji Generator":

- All operations done fully client-side - no backend, no private data leaves your browser. - Uses machine learning models (MediaPipe Face Detector task) to automatically scale and position glasses on the detected faces. - Extensive customization options for glasses: - Placement of glasses anywhere on the input image (including slightly going outside it). - Change the size of glasses. - No limit on the number of glasses. - Flip the glasses vertically or horizontally. - Customize the direction from which the glasses appear on the image. - Different types of glasses. - GIF output options: - Looping mode. - Number of frames. - Frame delay. - Separate delay setting for last frame. - Output size. - Celebration confetti - Easter eggs.

I've been working remotely for the last >9 years. When using non-verbal communication, it's important that your tone and intent comes across accurately.. Custom emojis became for me part of expressing yourself, creating bonds and camaraderie. I've originally created an MVP of this tool while applying for a exciting new job opportunity. As a showcase of my passion for programming, building teams and creating delightful user experiences. Unfortunately, they were not impressed and ultimately did not offer me the job :( But I wanted to polish it and release it for everyone to use for free, so that you can too "Deal With It"!

I have more ideas for even more features (check GitHub[1]), but wanted to launch it and see what's the feedback and ideas from the community! And if you're looking for a Fullstack Developer with >14 years of experience, with passion for great customer experience (remote work or locally in Iceland), let's chat!

[1] - https://github.com/klimeryk/dealwithit

Show context
ryandrake ◴[] No.41849814[source]
Infinite spinner for me: Stuck at "Loading AI models for face detection..." forever. I'd want to fix that before sharing it with recruiters as an example project.

Desktop Safari 18.0.1 (18619.1.26.111.11, 18619)

replies(3): >>41849941 #>>41849966 #>>41854472 #
1. klimeryk ◴[] No.41849966[source]
Any console errors?
replies(1): >>41849994 #
2. ryandrake ◴[] No.41849994[source]
Yep, a bunch of warnings and then:

    Unhandled Promise Rejection: Error: StartGraph failed: $Service "kGpuService", required by node mediapipe_tasks_vision_face_detector_facedetectorgraph__mediapipe_tasks_components_processors_imagepreprocessinggraph__ImageCloneCalc...
Warnings prior to the error:

    [Warning] I0000 00:00:1729008143.963000       1 gl_context_webgl.cc:81] Couldn't create webGL 2 context. (vision_wasm_internal.js, line 1087)
    [Warning] W0000 00:00:1729008143.966000       1 gl_context_webgl.cc:106] Creating a context with WebGL 2 failed: UNKNOWN: emscripten_webgl_create_context() returned error 0 (vision_wasm_internal.js, line 1087)
    [Warning] === Source Location Trace: ===  (vision_wasm_internal.js, line 1087)
    [Warning] third_party/mediapipe/gpu/gl_context_webgl.cc:82 (vision_wasm_internal.js, line 1087)
    [Warning] W0000 00:00:1729008143.967000       1 gl_context_webgl.cc:107] Fall back on WebGL 1. (vision_wasm_internal.js, line 1087)
    [Warning] I0000 00:00:1729008143.968000       1 gl_context_webgl.cc:81] Couldn't create webGL 1 context. (vision_wasm_internal.js, line 1087)
    [Warning] W0000 00:00:1729008143.968000       1 gl_context.cc:1000] OpenGL error checking is disabled (vision_wasm_internal.js, line 1087)
    [Warning] E0000 00:00:1729008143.968000       1 gl_graph_runner_internal.cc:252] StartGraph failed: INTERNAL: Service "kGpuService", required by node mediapipe_tasks_vision_face_detector_facedetectorgraph__mediapipe_tasks_components_processors_imagepreprocessinggraph__ImageCloneCalculator, was not provided and cannot be created: emscripten_webgl_create_context() returned error 0; StartRun failed (vision_wasm_internal.js, line 1087)
    [Warning] === Source Location Trace: ===  (vision_wasm_internal.js, line 1087)
    [Warning] third_party/mediapipe/framework/calculator_graph.cc:651 (vision_wasm_internal.js, line 1087)
    [Warning] third_party/mediapipe/framework/calculator_graph.cc:682 (vision_wasm_internal.js, line 1087)
    [Warning] third_party/mediapipe/framework/calculator_graph.cc:551 (vision_wasm_internal.js, line 1087)
    [Warning] research/drishti/app/pursuit/wasm/graph_utils.cc:87 (vision_wasm_internal.js, line 1087)
Hope that helps!
replies(1): >>41850132 #
3. klimeryk ◴[] No.41850132[source]
Thank you! Yeah, that looks like the pipeline from mediapipe (used for ML face detection) has troubles initializing the WebGL context. I don't see immediately any settings for disabling WebGL in Safari, but I'm sure there's some feature flags for that. Do you remember touching any settings related to this? I'm wondering if it's related to some browser settings, an extension (?) or something else.

Edit: tested on M2 and Safari 18.0 and I cannot reproduce it. Updating now to 15.0.1 to see if that makes a difference.

replies(1): >>41850451 #
4. ryandrake ◴[] No.41850451{3}[source]
I went into Safari Settings and, under Feature Flags, turned on "Allow WebGL in Web Workers" and the site now works. I don't recall ever turning that off or messing with any other feature flags, so I'm guessing that this necessary feature is off by default in at least some versions of Safari. Web development must be so fun, I feel for you.