Now when clicking on "search" on search-2 page, the message's position is center aligned. Need to change the layout to align with the search input box.

We should have search rate limiting to prevent people from spamming or costing us too much money. For example, 1 search every N seconds.

see the WeAudit-Stable-Diffusion repo

• add highlight checkbox and border
• click the image to highlight(now need to click the checkbox)
• able to multi-select tag
• refine layout format
• show search terms in the thread title
• thread content validation
• show preview according to the previous input
• post content to WeAudit forum

Add the function to flag an image, e.g. inappropriateness

UX Design Update

• update main page design version 1: https://lan-lyu.github.io/TAIGA/index.html
• update main page design version 2: https://lan-lyu.github.io/TAIGA/index-2.html
• add dropbox selection function
• add interaction logic on main page
• update design changes to search pages
• shows create button only when done with search
• shows example prompts on search page

• transfer main components
• add header
• make the header responsive
• make search work
• add create thread process (may use <div class="modal-dialog modal-dialog-scrollable"> and https://getbootstrap.com/docs/5.1/components/modal/#toggle-between-modals)
• make select image rather than select checkbox to highlight work
• finish step 3/3 of the thread creation
• put thread creation in responsive.html
• add title, tag, content in the thread preview
• add gallery validation for thread creation

High Priority

• add loading box
• update loading box to placeholder https://getbootstrap.com/docs/5.3/components/placeholders/
• make tags multi-selectable
• google search only return 10 result images

Thread creation

• the search results should remain when modal pops out
• should remember what images are selected in thread 1 even though user exit some time
• add thread content validation for thread creation (needed to be done after the upper one)
  content input
• fix the bug of thread content text editor (https://www.tiny.cloud/docs/tinymce/6/cloud-troubleshooting/#were-unable-to-check-your-domain-because-the-referer-header-is-missing-please-read-the-guide-on-how-to-ensure-your-referer-header-is-present-so-we-can-then-customize-your-editor-experience) -- now use normal textarea instead
• make tags multi-selectable

Style

• make the next button in thread creating modals has a green background
• make the create thread modal scrollable
• make the image size in the gallery responsive to smaller window size
• change the title and tag input shadow color to green when selected
• make the workflow header dynamically changes with users' actions
• add toast when switch between google search and stable diffusion search≈
• when refreshing the page, the toggle switches should keep the same as they are, rather than back to the initial states
• add abnormal status alert when the window size is too small (e.g. width < 290px)
• change the google/compare switch button's color in selected status to green
• replace the back icon besides search bar with a higher resolution one

Flow Design Optimization Ideas

• save unposted threads as drafts, now when we close the window, all the info is gone
• Users can edit their in the preview modal