[JAVA] File form status check sheet that can be deleted with thumbnails

I'm always confused, so I'll summarize it.

Premise

<input type=file name=logo_image /> <!-- （１） -->
<figure id=thumb_logo_image><img/></figure> <!-- （２） -->
<input type=hidden name=remove_logo_image value=on /> <!-- （３） -->
<button id=btn_remove_logo_img /> <!-- （４）-->

――Suppose there is such an element --If there is a saved file, the thumbnail will be displayed in (2). --Suppose you set thumbnails in (2) with JS immediately after selecting a file. -* Not sent to the server yet --Suppose that the saved file can be deleted by setting the value to remove_attribute name and sending it. --It is assumed that even if you send a new file with the value in the delete field, it will be properly replaced with the new file. -When the delete button of (4) is pressed, it is assumed that (2) thumbnail, (3) delete field, and (4) delete button disappear from HTML.

Washing out the condition

--Are there any saved files? --Whether a new file is selected or not --Whether you returned with the "Cancel" button after displaying the file selection dialog --Whether the delete button was pressed or not --Whether you selected the file again after the delete button was pressed --If you select a new file with a saved file, but cancel the new file

Identifying state variables

• Object savedValue --Saved file
• String savedValueUrl --URL for thumbnail of saved file
• Object inputValue --Newly selected file -* (1) Value value of file field -* Due to the specifications of the file field, it cannot be reset from JS and only reset (null substitution) is possible.
• String inputValueUrl --URL for thumbnail of newly selected file
• Bool thumbVisible -(2) Whether to display thumbnails
• String thumbSrc -(2) Value to be set in the thumb tag
  • savedValueUrl or inputValueUrl
• Bool readyToRemove -(3) Whether to delete the saved file
• Bool removeBtnVisible -(4) Whether to display the delete button

Status confirmation sheet

--Assuming that operation check is completed by repeating reloading and operation for this number of lines -* The cells null and false are omitted. Because it became hard to see

• (1).. inputValue -(2) .. thumbSrc and thumbVisible
• (3).. readyToRemove
• (4).. removeBtnVisible

If there is no saved file

If you have a saved file

end

Ah confusing