1+ // We wait for DOM to be fully loaded before initializing
2+ document . addEventListener ( "DOMContentLoaded" , function ( ) {
3+ setupFormHandler ( ) ;
4+ setupNotificationSystem ( ) ;
5+ } ) ;
6+
7+ // This works by creating an object with methods for different notification types of either error or success
8+ // Calling either of these methods calls the main functionality, show(), which manipulates the notification element in HTML
9+ // The show() method changes the element based on type and displays the message to the user
10+ // The hide() function makes sure that the notification fades away after 5 seconds
11+ const notificationSystem = {
12+ show : function ( message , type = 'error' ) {
13+ const notification = document . getElementById ( 'notification' ) ;
14+ const messageElement = document . getElementById ( 'notification-message' ) ;
15+
16+ messageElement . textContent = message ;
17+
18+ if ( type === 'error' ) {
19+ notification . style . backgroundColor = '#f8d7da' ;
20+ notification . style . color = '#721c24' ;
21+ notification . style . border = '1px solid #f5c6cb' ;
22+ } else {
23+ notification . style . backgroundColor = '#d4edda' ;
24+ notification . style . color = '#155724' ;
25+ notification . style . border = '1px solid #c3e6cb' ;
26+ }
27+
28+ notification . style . display = 'block' ;
29+ setTimeout ( ( ) => {
30+ notification . style . opacity = '1' ;
31+ } , 10 ) ;
32+
33+ clearTimeout ( this . timeout ) ;
34+ this . timeout = setTimeout ( ( ) => this . hide ( ) , 5000 ) ;
35+ } ,
36+
37+ hide : function ( ) {
38+ const notification = document . getElementById ( 'notification' ) ;
39+ notification . style . opacity = '0' ;
40+ setTimeout ( ( ) => {
41+ notification . style . display = 'none' ;
42+ } , 500 ) ;
43+ } ,
44+
45+ error : function ( message ) {
46+ this . show ( message , 'error' ) ;
47+ } ,
48+
49+ success : function ( message ) {
50+ this . show ( message , 'success' ) ;
51+ } ,
52+ } ;
53+
54+ function setupNotificationSystem ( ) {
55+ const notification = document . getElementById ( 'notification' ) ;
56+ if ( notification ) {
57+ notification . style . opacity = '0' ;
58+ notification . style . transition = 'opacity 0.5s ease' ;
59+ }
60+ }
61+
62+ function setupFormHandler ( ) {
63+ const form = document . getElementById ( "github-url-form" ) ;
64+
65+ form . addEventListener ( "submit" , async function ( event ) {
66+ event . preventDefault ( ) ;
67+
68+ const submitButton = document . getElementById ( "repo-url-button" ) ;
69+
70+ submitButton . value = "Loading..." ;
71+ submitButton . disabled = true ;
72+
73+ try {
74+ const repoURL = document . getElementById ( "repo-url" ) . value ;
75+
76+ if ( repoURL . length == 0 ) {
77+ throw new Error ( "Please enter a GitHub repository URL" ) ;
78+ }
79+
80+ const repoInfo = extractGitHubInfo ( repoURL ) ;
81+
82+ if ( ! repoInfo ) {
83+ throw new Error ( "Invalid GitHub URL format. Please enter a valid GitHub repository URL ->(https://github.com/username/repository)" ) ;
84+ }
85+
86+ const repositoryInfo = await getRepoInformation ( repoInfo ) ;
87+ const languages = await getRepoLanguages ( repoInfo )
88+
89+ if ( repositoryInfo ) {
90+ preFillFields ( repositoryInfo , languages ) ;
91+ notificationSystem . success ( "Repository data loaded successfully!" ) ;
92+ } else {
93+ throw new Error ( "Could not fetch repository information. Please check the URL and try again." ) ;
94+ }
95+
96+ } catch ( error ) {
97+ console . error ( error . message ) ;
98+ notificationSystem . error ( error . message ) ;
99+ } finally {
100+ submitButton . value = "Submit" ;
101+ submitButton . disabled = false ;
102+ }
103+ } ) ;
104+ }
105+
106+ function extractGitHubInfo ( url ) {
107+ // Regex pattern to match GitHub URLs and extract org and repo
108+ const regex = / (?: h t t p s ? : \/ \/ ) ? (?: w w w \. ) ? g i t h u b \. c o m \/ ( [ ^ \/ ] + ) \/ ( [ ^ \/ \s ] + ) / ;
109+ const match = url . match ( regex ) ;
110+
111+ if ( match && match . length === 3 ) {
112+ return {
113+ organization : match [ 1 ] ,
114+ repository : match [ 2 ]
115+ } ;
116+ }
117+
118+ return null ;
119+ }
120+
121+ async function getRepoInformation ( repoInfo ) {
122+ const baseURL = "https://api.github.com/repos/" ;
123+ const endpoint = `${ baseURL } ${ repoInfo . organization } ${ repoInfo . repository } ;
124+
125+ try {
126+ const response = await fetch ( endpoint ) ;
127+
128+ if ( ! response . ok ) {
129+ throw new Error ( `GitHub API error (${ response . status } ${ response . statusText } ) ;
130+ }
131+
132+ return await response . json ( ) ;
133+ } catch ( error ) {
134+ console . error ( "Fetch error:" , error . message ) ;
135+ }
136+ }
137+
138+ async function getRepoLanguages ( repoInfo ) {
139+ const endpoint = `https://api.github.com/repos/${ repoInfo . organization } ${ repoInfo . repository }
140+
141+ try {
142+ const response = await fetch ( endpoint ) ;
143+
144+ if ( ! response . ok ) {
145+ throw new Error ( `GitHub API error (${ response . status } ${ response . statusText } ) ;
146+ }
147+
148+ return await response . json ( ) ;
149+ } catch ( error ) {
150+ console . error ( "Fetch error:" , error . message ) ;
151+ }
152+ }
153+
154+ function preFillFields ( repoData , languages ) {
155+ if ( ! window . formIOInstance ) {
156+ notificationSystem . error ( "Form interface not initialized. Please refresh and try again." ) ;
157+ return ;
158+ }
159+
160+ try {
161+ let licenses = [ ] ;
162+ if ( repoData . license && repoData . license . spdx_id ) {
163+ licenses . push ( {
164+ name : repoData . license . spdx_id ,
165+ URL : repoData . html_url + "/blob/main/LICENSE"
166+ } ) ;
167+ }
168+
169+ const submission = {
170+ data : {
171+ name : repoData . name || '' ,
172+ description : repoData . description || '' ,
173+
174+ repositoryURL : repoData . html_url || '' ,
175+ repositoryVisibility : repoData . private ? "private" : "public" ,
176+ vcs : 'git' ,
177+
178+ permissions : {
179+ licenses : licenses
180+ } ,
181+
182+ reuseFrequency : {
183+ forks : repoData . forks_count || 0
184+ } ,
185+
186+ languages : Object . keys ( languages ) || [ ] ,
187+
188+ date : {
189+ created : repoData . created_at || '' ,
190+ lastModified : repoData . updated_at || '' ,
191+ metaDataLastUpdated : new Date ( ) . toISOString ( )
192+ } ,
193+
194+ tags : repoData . topics || [ ] ,
195+
196+ feedbackMechanisms : [ repoData . html_url + "/issues" ]
197+ }
198+ } ;
199+
200+ window . formIOInstance . setSubmission ( submission ) ;
201+
202+ } catch ( error ) {
203+ notificationSystem . error ( "Error filling form fields with repository data. Please refresh and try again" ) ;
204+ console . error ( "Form fill error:" , error ) ;
205+ }
206+ }
207+
208+ // This is global so we could use this throughout the website!
209+ window . showErrorNotification = function ( message ) {
210+ notificationSystem . error ( message ) ;
211+ } ;
212+
213+ window . showSuccessNotification = function ( message ) {
214+ notificationSystem . success ( message ) ;
215+ } ;
0 commit comments