In this meeting, the State Changers discuss how to implement a signature pad using the WeWeb framework with an npm package. The participant shares their screen and takes them through the process step by-step.
The participant showed how to import a specific npm package into a WeWeb page, then used unpackage to access a version of the package. They utilized the 'Iffy' syntax to create a function that executed immediately and created classes. They used 'Dev tools' in the WeWeb environment to inspect their application. The conversation explored how to link this feature to a button press, using the WeWeb workflow. They then attached this to the window, to globalize the data for access across the application. Using a live preview in WeWeb, they demonstrated that the signature pad worked. When the "complete review" is pressed, the signature is converted into a base-64 encoded version of the image, which could be unpacked on Xano's side. The State Changers also taught how to use the JavaScript Console and Custom JavaScript action in WeWeb to log and return information. They demonstrated that the image captured from the signature pad can be returned as data and then previewed, showing a base 64 encoded version of an image. Important keywords from the transcript: WeWeb, npm, UnderScore, unpackage, Canvas, JavaScript, Console, Custom JavaScript, Base-64. Overall, this meeting provides a detailed tutorial on creating and implementing a signature pad feature in WeWeb using npm and WeWeb's workflow system.
(Source: Office Hours 10/18/2023 PM )
