Devlog #8
Today i changed the head title and subtitle from the top into the bottom with input box. And made the both sections for dynamic as well as the user focus in and focus out in the input box.

Now i thought to add copy and edit options for each notes. For that i changed the render()’s html with edit and copy button tags as similar as delete button, then i created each funcion called editMsg() and copyMsg(). To work the editMsg(), when the user selects and click on the note that the user need to edit, the text will appear as well as with the input box got autofocus in and the text to be edited is automaticaly typed in the input box. Added a if-else condition to identify the user is sending new note or it is already existing and editing, if it is exisits and the user is editing then submiting again the note will rechange into new one!

In copyMsg(), i simply used ddefault navigor function with clipboard connection and with the value to copy the user selected text.

I just added the normal ‘alert’ feature at first when the user click on copy and it successfully copied and when successfully edited the note. I got a plan to make the “alert notiications” more attactive and dynamic.

So added another section div inside the bottom area div then animated as popup from bottom and going back to bottom (outside the page), with that time the heading and subhead section become small width and then came back to normal when the alert is disappeared for this animation i used js of its very complicated to re-use whenever it needs (for edit and copy button). So i created a function alertNoti() with two parameters!

Then solved some scrolling bugs i found that the website is automatically scrolling down as well as according to the movement of the background dots. So i disabled all the overflow of the all elements including body and excluding section div, which make the website only scroll and show the scroll bar when the section list is overflow!