-
-
Notifications
You must be signed in to change notification settings - Fork 3.8k
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.
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
[Feature Request]: Extend the functionality of the oppia-image-uploader component and remove oppia-thumbnail-uploader #20303
Labels
enhancement
Label to indicate an issue is a feature/improvement
Work: Medium
The means to find the solution is clear, but it isn't at good-first-issue level yet.
Comments
AFZL210
added
triage needed
enhancement
Label to indicate an issue is a feature/improvement
labels
May 13, 2024
AFZL210
changed the title
[Feature Request]: Extend the functionality of the oppia-thumbnail-uploader component and remove oppia-image-uploader
[Feature Request]: Extend the functionality of the oppia-image-uploadercomponent and remove oppia-thumbnail-uploader
May 19, 2024
AFZL210
added
Work: Medium
The means to find the solution is clear, but it isn't at good-first-issue level yet.
and removed
triage needed
labels
May 19, 2024
AFZL210
changed the title
[Feature Request]: Extend the functionality of the oppia-image-uploadercomponent and remove oppia-thumbnail-uploader
[Feature Request]: Extend the functionality of the oppia-image-uploader component and remove oppia-thumbnail-uploader
May 19, 2024
github-merge-queue bot
pushed a commit
that referenced
this issue
May 29, 2024
…#20370) * Rename image-uploader component to image-receiver * remove unused i18n keys and extra states
github-merge-queue bot
pushed a commit
that referenced
this issue
May 29, 2024
…#20370) * Rename image-uploader component to image-receiver * remove unused i18n keys and extra states
AFZL210
added a commit
to AFZL210/oppia
that referenced
this issue
May 29, 2024
5 tasks
github-merge-queue bot
pushed a commit
that referenced
this issue
Jun 3, 2024
* Fix part of #20303: Add oppia-image-uploader-modal component * refactor code * add function for invalid tags or attributes * refactor code * make svgString global variable * make previewTitle and description optional * remove unnecessary ngIf * place i18n keys in sorted order
AFZL210
added a commit
to AFZL210/oppia
that referenced
this issue
Jun 3, 2024
5 tasks
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Labels
enhancement
Label to indicate an issue is a feature/improvement
Work: Medium
The means to find the solution is clear, but it isn't at good-first-issue level yet.
Is your feature request related to a problem? Please describe.
So we have a lot of components just to handle image uploads which is confusing. It would be good if we can have a single component to which we can pass props as per our need.
Describe the solution (or solutions) you'd like
The two main components we have right now are (1) oppia-thumbnail-uploader and (2) oppia-image-uploader.
So, the idea is to extend the functionality of the oppia-image-uploader component so we can use this single component in all cases by providing it with the required props and remove the usage of oppia-thumbnail-uploader from the codebase.
oppia-image-uploader component has 3 parts:
1. oppia-image-receiver
This is the component which handles taking images from the user and listens for drag events.
Emitted Events:
fileChanged(Blob)
Props:
allowedImageFormats (string[])
maxImageSize(number(kB))
2. oppia-image-uploader-modal
This component shows the uploaded image, handles cropping, and shows the preview card after cropping (in the case of a topic, story, or subtopic).
Data returned when closed:
newImageDataUrl(string)
dimensions({height: number, width: number})
newBgColor(string)
Props:
previewImageUrl (optional(string))
maxImageSize (number)
aspectRatio (string)
imageName (string)
previewDescriptionBgColor (optional(string))
previewTitle (optional(string))
previewDescription (optional(string))
previewFooter (optional(string))
bgColor (string)
allowedImageFormats (string[])
3. oppia-image-uploader
This is the highest level component which takes all the props and shows the preview, and handles all the events.
Emitted Events:
updateFilename(string)
updateBgColor(string)
imageSave(Blob)
Props:
maxImageSize (number)
aspectRatio (string)
imageName (string)
previewDescriptionBgColor (optional(string))
previewTitle (optional(string))
previewDescription (optional(string))
previewFooter (optional(string))
bgColor (string)
allowedImageFormats (string[])
orientation (string) - landscape/portrait
filename (optional(string))
disabled (optional(boolean))
The new
oppia-image-uploader
component should be able to do the following and theoppia-image-uploader-modal
can be used on its own where we want to show custom preview:Steps
Here is the fixed list format in Markdown:
oppia-image-uploader
tooppia-image-reciever
as this is just used to take images and check for filetype (PR: Fix part of #20303: Rename image-uploader component to image-receiver #20370).oppia-image-uploader-modal
component. This will be used to crop images and show a preview (if needed, we only show a preview in the case of topic, subtopic, etc.) (PR: Fix part of #20303: Add oppia-image-uploader-modal component #20375).oppia-image-uploader
component. This is the highest level component which we will use and pass all the props. (PR: Fix part of #20303: Add image-uploader component #20393)Describe alternatives you've considered and rejected
N/A
Additional context
No response
The text was updated successfully, but these errors were encountered: