]>
jfr.im git - irc/unrealircd/unrealircd-webpanel.git/blob - js/bs-modal.js
2 * Generate a bootstrap modal
4 * @param {string} title - The modal title
5 * @param {string} body - HTML for the body
6 * @param {string} footer - HTML for the footer
9 * @param {string|null} size - the bootstrap size category for modals (sm, lg, xl). Default is null.
10 * @param {boolean} static - whether or not to make the backdrop static, forcing the user to respond to the dialog. Default is false
11 * @param {boolean} show - whether or not to automatically show the modal. Default is false.
12 * @param {boolean} closebutton - display and allow the close button. Default is true.
13 * @returns {string} returns the ID
16 function bsModal ( title
, body
, footer
, size
= null , static = false , show
= false , closebutton
= true )
18 /* generate a random number between 1000 and 90000 to use as an id */
21 id
= Date
. now (). toString ( 36 ); // base36 unique id
24 ourSize
+= "modal-" + size
;
26 const m1
= document
. createElement ( "div" );
27 const m2
= m1
. cloneNode ();
28 const m3
= m1
. cloneNode ();
29 const mHeader
= m1
. cloneNode ();
30 const mBody
= m1
. cloneNode ();
31 const mFooter
= m1
. cloneNode ();
33 m1
. classList
. add ( "modal" , "fade" );
36 m1
. ariaHidden
= "true" ;
38 m2
. classList
. add ( "modal-dialog" , "modal-dialog-centered" );
40 m2
. classList
. add ( ourSize
);
45 m3
. classList
. add ( "modal-content" );
48 mHeader
. classList
. add ( "modal-header" );
49 mHeader
. id
= id
+ "-header" ;
50 mHeader
. innerHTML
= `<h5 class="modal-title" id="` + id
+ `"-title">` + title
+ `</h5>` ;
53 mHeader
. innerHTML
+= `<button type="button" class="close" data-dismiss="modal" aria-label="Close">
54 <span aria-hidden="true">×</span></button>` ;
56 mBody
. classList
. add ( "modal-body" );
57 mBody
. id
= id
+ "-body" ;
58 mBody
. innerHTML
= body
;
60 mFooter
. classList
. add ( "modal-footer" );
61 mFooter
. id
= id
+ "-footer" ;
62 mFooter
. innerHTML
= footer
;
66 m3
. appendChild ( mHeader
);
67 m3
. appendChild ( mBody
);
68 m3
. appendChild ( mFooter
);
70 document
. body
. append ( m1
);
73 $( '#' + m1
. id
). modal ({ backdrop : "static" });
76 $( '#' + m1
. id
). modal ( 'show' );
82 function create_plugin_info_modal ( modname
)
85 fetch ( BASE_URL
+ 'api/plugin.php' )
86 . then ( response
=> response
. json ()) // Parse the response as JSON
88 for ( let i
= 0 ; data
. list
[ i
]; i
++)
90 if ( data
. list
[ i
]. name
== modname
)
93 const modal
= bsModal (
94 "<i>Information about " + data
. list
[ i
]. title
+ "</i>" , // title
95 "<div class= \" " + data
. list
[ i
]. name
+ "_screenshots \" ><i class= \" fa fa-spinner \" aria-hidden= \" true \" ></i></div><div class= \" " + data
. list
[ i
]. name
+ "_description \" ><i class= \" fa fa-spinner \" aria-hidden= \" true \" ></i></div>" ,
96 "<div id= \" " + modname
+ "closebtn \" class= \" btn btn-danger \" >Close</div>" , null , true , true , true
98 let modalclose
= document
. getElementById ( modal
);
99 modalclose
. addEventListener ( 'click' , ( e
) => {
100 $( "#" + modal
). modal ( 'hide' );
102 boobs
= document
. getElementById ( modal
+ '-body' );
103 boobs
. innerHTML
= "" ;
104 if ( data
. list
[ i
]. screenshot
. length
)
106 boobs
. innerHTML
+= ` <div style="padding-left: 0px; padding-right: 0px;">
107 <img src="` + ( data
. list
[ i
]. screenshot
[ 0 ] ?? "" ) + `" class="screenshot img-fluid" alt="` + data
. list
[ i
]. screenshot
[ 1 ] + ` style="max-width: 100%; height:auto">
110 boobs
. innerHTML
+= "<p class= \" alert alert-primary mt-2 \" ><i><b>Description:</i></b><br>" + atob ( data
. list
[ i
]. readme
. replace ([ " \n " , "" ],[ "<br>" , "<br>" ])) + "</p>" ;
111 boobs
. innerHTML
+= `<div class="alert alert-dark">
112 <table class="table">
114 <th scope="row">Title</th>
115 <td>` + data
. list
[ i
]. title
+ `</td>
118 <th scope="row">Description</th>
119 <td>` + data
. list
[ i
]. description
+ `</td>
122 <th scope="row">Version</th>
123 <td>` + data
. list
[ i
]. version
+ `</td>
126 <th scope="row">Author</th>
127 <td>` + data
. list
[ i
]. author
+ `</td>
130 <th scope="row">Min Version Required</th>
131 <td>` + data
. list
[ i
]. minver
+ `</td>
134 <th scope="row">Max Version</th>
135 <td>` + data
. list
[ i
]. maxver
+ `</td>
144 bsModal ( "Hmmm. Something went wrong." , "It seems we can't find any information about that plugin! Maybe it's built-in? If not, please report this via <a href='https://github.com/unrealircd/unrealircd-webpanel'>GitHub</a> or <a href='mailto:v.a.pond@outlook.com'>email</a>. " , "" , null , null , true , true );
148 // Handle any errors that occur during the request
149 bsModal ( "Hmmm. Something went wrong." , "It seems we can't query our own API! Please report this via <a href='https://github.com/unrealircd/unrealircd-webpanel'>GitHub</a> or <a href='mailto:v.a.pond@outlook.com'>email</a>. " , "" , null , null , true , true );
154 function requestInstall ( name
, uninstall
= false )
156 let inst
= ( uninstall
) ? "uninstall" : "install" ;
157 var xhr
= new XMLHttpRequest ();
159 xhr
. onload = function () {
160 if ( xhr
. status
=== 200 ) {
161 var response
= JSON
. parse ( xhr
. responseText
);
162 console
. log ( response
. success
);
163 let install_button
= document
. getElementById ( name
+ 'install' );
164 if ( response
. success
!== undefined )
168 install_button
. innerHTML
= ( inst
== "uninstall" ) ? "Install" : "Uninstall" ;
169 install_button
. classList
. replace ( 'btn-secondary' , ( inst
== "uninstall" ) ? 'btn-primary' : 'btn-outline-danger' );
170 setTimeout (() => { location
. reload () }, 500 );
177 install_button
. innerHTML
= ( inst
== "uninstall" ) ? "Uninstall" : "Install" ;
178 install_button
. classList
. replace ( 'btn-secondary' , ( inst
== "uninstall" ) ? 'btn-outline-danger' : 'btn-primary' );
179 setTimeout (() => { location
. reload () }, 2000 );
185 xhr
. open ( 'GET' , BASE_URL
+ 'api/plugin.php?' + inst
+ '=' + name
, true );
191 function create_plugin_info_modal ( modname
)
194 fetch ( BASE_URL
+ 'api/plugin.php' )
195 . then ( response
=> response
. json ()) // Parse the response as JSON
197 for ( let i
= 0 ; data
. list
[ i
]; i
++)
199 if ( data
. list
[ i
]. name
== modname
)
202 const modal
= bsModal (
203 "<i>Information about " + data
. list
[ i
]. title
+ "</i>" , // title
204 "<div class= \" " + data
. list
[ i
]. name
+ "_screenshots \" ><i class= \" fa fa-spinner \" aria-hidden= \" true \" ></i></div><div class= \" " + data
. list
[ i
]. name
+ "_description \" ><i class= \" fa fa-spinner \" aria-hidden= \" true \" ></i></div>" ,
205 "<div id= \" " + modname
+ "closebtn \" class= \" btn btn-danger \" >Close</div>" , null , true , true , true
207 let modalclose
= document
. getElementById ( modal
);
208 modalclose
. addEventListener ( 'click' , ( e
) => {
209 $( "#" + modal
). modal ( 'hide' );
211 boobs
= document
. getElementById ( modal
+ '-body' );
212 boobs
. innerHTML
= "" ;
213 if ( data
. list
[ i
]. screenshot
. length
)
215 boobs
. innerHTML
+= ` <div style="padding-left: 0px; padding-right: 0px;">
216 <img src="` + ( data
. list
[ i
]. screenshot
[ 0 ] ?? "" ) + `" class="screenshot img-fluid" alt="` + data
. list
[ i
]. screenshot
[ 1 ] + ` style="max-width: 100%; height:auto">
219 boobs
. innerHTML
+= "<p class= \" alert alert-primary mt-2 \" ><i><b>Description:</i></b><br>" + atob ( data
. list
[ i
]. readme
. replace ([ " \n " , "" ],[ "<br>" , "<br>" ])) + "</p>" ;
220 boobs
. innerHTML
+= `<div class="alert alert-dark">
221 <table class="table">
223 <th scope="row">Title</th>
224 <td>` + data
. list
[ i
]. title
+ `</td>
227 <th scope="row">Description</th>
228 <td>` + data
. list
[ i
]. description
+ `</td>
231 <th scope="row">Version</th>
232 <td>` + data
. list
[ i
]. version
+ `</td>
235 <th scope="row">Author</th>
236 <td>` + data
. list
[ i
]. author
+ `</td>
239 <th scope="row">Min Version Required</th>
240 <td>` + data
. list
[ i
]. minver
+ `</td>
243 <th scope="row">Max Version</th>
244 <td>` + data
. list
[ i
]. maxver
+ `</td>
253 bsModal ( "Hmmm. Something went wrong." , "It seems we can't find any information about that plugin! Maybe it's built-in? If not, please report this via <a href='https://github.com/unrealircd/unrealircd-webpanel'>GitHub</a> or <a href='mailto:v.a.pond@outlook.com'>email</a>. " , "" , null , null , true , true );
257 // Handle any errors that occur during the request
258 bsModal ( "Hmmm. Something went wrong." , "It seems we can't query our own API! Please report this via <a href='https://github.com/unrealircd/unrealircd-webpanel'>GitHub</a> or <a href='mailto:v.a.pond@outlook.com'>email</a>. " , "" , null , null , true , true );