Refer tologinsignup.js script file
Used session.Storage() for storing token
Login
SignUp
Save Frame
Get Frames
Delete Frame
Additional Features
Crop (User can crop the image after selecting)
jQuery Form Validation
Manually Enter Filename before Saving
JavaScript functions for ease of usage
Refer to main.js
hideshowcropwindow(val) and openclosecontentinmiddle(open) { }just call the function by passing parameter (id of element) for opening the target element, remaining elements will be collapsed(collapsed)
this contains array all elements to which operation is applied
loader(action){ }
Just call loader('show') to show spinning loader on whole screen and call loader('hide') to hide the spinning loader
alertpopup(text,par){ }Just call this function to show alertpopups like Frames Added Successfully or Frame Deleted SuccessfullyIt has two Parameters 1. text--> Text to be shown 2. par--->'show' or 'hide'
in loginsignup.js script file, created functions for API's with various required checks.
UsedCroppie.jsfor cropping, used local file instead of CDN, and made some changes required for dashboard (i.e. oninput/ onchange output shows by triggering function namedshowcroppedresult(){ })
Other functions required by program are also in main.js script file.
Dark Mode
Used different CSS files for light(default) and dark mode (i.e. styledashboard.css for light mode and darkdashboard.css for dark mode)
Used localStorage() for setting theme --->localStorage.setItem('theme','dark')
UI Updated According to Wireframes
List of API's Implemented
Refer to
loginsignup.js
script file Used session.Storage() for storing tokenAdditional Features
JavaScript functions for ease of usage
Refer to
main.js
hideshowcropwindow(val) and openclosecontentinmiddle(open) { }
just call the function by passing parameter (id of element) for opening the target element, remaining elements will be collapsed(collapsed) this contains array all elements to which operation is appliedloader(action)
{ } Just callloader('show')
to show spinning loader on whole screen and callloader('hide')
to hide the spinning loaderalertpopup(text,par){ }
Just call this function to show alertpopups like Frames Added Successfully or Frame Deleted Successfully It has two Parameters 1. text--> Text to be shown 2. par--->'show' or 'hide'loginsignup.js
script file, created functions for API's with various required checks.showcroppedresult(){ }
)main.js
script file.Dark Mode
styledashboard.css
for light mode anddarkdashboard.css
for dark mode)localStorage()
for setting theme --->localStorage.setItem('theme','dark')