vh/NetAlertX
1
0
Fork 0
mirror of https://github.com/jokob-sk/NetAlertX.git synced 2025-12-07 09:36:05 -08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Modals refactor, autofocus support, ESC/ENTER support⌨

Browse Source
This commit is contained in:
jokob-sk
2024-04-25 12:30:05 +10:00
parent 73732a7d0c
commit 8ab3945871
5 changed files with 273 additions and 216 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
front/php/templates/header.php
View File

@@ -31,6 +31,7 @@ require dirname(__FILE__).'/security.php';
<script src="lib/AdminLTE/bower_components/jquery/dist/jquery.min.js"></script>
<script src="js/common.js"></script>
<script src="js/modal.js"></script>
<!-- Bootstrap 3.3.7 -->
<link rel="stylesheet" href="lib/AdminLTE/bower_components/bootstrap/dist/css/bootstrap.min.css">

43
front/php/templates/notification.php
View File

@@ -12,15 +12,15 @@
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header" >
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 id="modal-ok-title" class="modal-title"> Modal Default Title </h4>
</div>
<div id="modal-ok-message" class="modal-body"> Modal Default message </div>
<div class="modal-footer">
<button id="modal-ok-OK" type="button" class="btn btn-primary" style="min-width: 80px;" data-dismiss="modal"> OK </button>
<div class="modal-footer">
<button id="modal-ok-OK" type="button" class="btn btn-primary btn-modal-submit" style="min-width: 80px;" data-dismiss="modal"> OK </button>
</div>
</div>
<!-- /.modal-content -->
@@ -33,7 +33,7 @@
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header" >
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 id="modal-default-title" class="modal-title"> Modal Default Title </h4>
</div>
@@ -41,8 +41,8 @@
<div id="modal-default-message" class="modal-body"> Modal Default message </div>
<div class="modal-footer">
<button id="modal-default-cancel" type="button" class="btn btn-default pull-left" style="min-width: 80px;" data-dismiss="modal"> Cancel </button>
<button id="modal-default-OK" type="button" class="btn btn-primary" style="min-width: 80px;" onclick="modalDefaultOK()"> OK </button>
<button id="modal-default-cancel" type="button" class="btn btn-default pull-left" style="min-width: 80px;" data-dismiss="modal"> Cancel </button>
<button id="modal-default-OK" type="button" class="btn btn-primary btn-modal-submit" style="min-width: 80px;" onclick="modalDefaultOK()"> OK </button>
</div>
</div>
<!-- /.modal-content -->
@@ -55,7 +55,7 @@
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header" >
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 id="modal-str-title" class="modal-title"> Modal Default Title </h4>
</div>
@@ -63,15 +63,15 @@
<div id="modal-str-message" class="modal-body"> Modal Default message </div>
<div class="modal-footer">
<button id="modal-str-cancel" type="button" class="btn btn-default pull-left" style="min-width: 80px;" data-dismiss="modal"> Cancel </button>
<button id="modal-str-OK" type="button" class="btn btn-primary" style="min-width: 80px;" > OK </button>
<button id="modal-str-cancel" type="button" class="btn btn-default pull-left" style="min-width: 80px;" data-dismiss="modal"> Cancel </button>
<button id="modal-str-OK" type="button" class="btn btn-primary btn-modal-submit" style="min-width: 80px;"> OK </button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- Modal warning -->
<div class="modal modal-warning fade" id="modal-warning" style="display: none;">
@@ -86,8 +86,8 @@
<div id="modal-warning-message" class="modal-body"> Modal message </div>
<div class="modal-footer">
<button id="modal-warning-cancel" type="button" class="btn btn-outline pull-left" style="min-width: 80px;" data-dismiss="modal"> Cancel </button>
<button id="modal-warning-OK" type="button" class="btn btn-outline" style="min-width: 80px;" onclick="modalWarningOK()"> OK </button>
<button id="modal-warning-cancel" type="button" class="btn btn-outline pull-left" style="min-width: 80px;" data-dismiss="modal"> Cancel </button>
<button id="modal-warning-OK" type="button" class="btn btn-outline btn-modal-submit" style="min-width: 80px;" onclick="modalWarningOK()"> OK </button>
</div>
</div>
@@ -106,11 +106,11 @@
<div id="modal-input-message" class="modal-body"> Modal message </div>
<textarea id="modal-input-textarea" class="logs" cols="30" rows="3" wrap='off' ></textarea>
<textarea id="modal-input-textarea" class="logs" cols="30" rows="3" wrap='off' autofocus ></textarea>
<div class="modal-footer">
<button id="modal-input-cancel" type="button" class="btn btn-outline pull-left" style="min-width: 80px;" data-dismiss="modal"> Cancel </button>
<button id="modal-input-OK" type="button" class="btn btn-outline" style="min-width: 80px;" onclick="modalDefaultInput()"> OK </button>
<button id="modal-input-cancel" type="button" class="btn btn-outline pull-left" style="min-width: 80px;" data-dismiss="modal"> Cancel </button>
<button id="modal-input-OK" type="button" class="btn btn-outline btn-modal-submit" style="min-width: 80px;" onclick="modalDefaultInput()"> OK </button>
</div>
</div>
@@ -130,11 +130,15 @@
<div id="modal-field-input-message" class="modal-body"> Modal message </div>
<input id="modal-field-input-field" class="modal-field-input" type="text" ></input>
<input id="modal-field-input-field" class="modal-field-input" type="text" onfocus="this.value = this.value;" autofocus ></input>
<div class="modal-footer">
<button id="modal-field-input-cancel" type="button" class="btn btn-outline pull-left" style="min-width: 80px;" data-dismiss="modal"> Cancel </button>
<button id="modal-field-input-OK" type="button" class="btn btn-outline" style="min-width: 80px;" onclick="modalDefaultFieldInput()"> OK </button>
<button id="modal-field-input-cancel" type="button" class="btn btn-outline pull-left" style="min-width: 80px;" data-dismiss="modal">
Cancel
</button>
<button id="modal-field-input-OK" type="button" class="btn btn-outline btn-modal-submit" style="min-width: 80px;" onclick="modalDefaultFieldInput()">
OK
</button>
</div>
</div>
@@ -152,5 +156,4 @@
<!-- Sticky Announcement -->
<div id="tickerAnnouncement" class="ticker_announcement myhidden">
<div id="ticker-message"> Announcement message </div>
</div>
</div>