Modal confirm dialogs for dangerous actions.
Squashed commit of the following: commit80513dd206Author: Oliver Gorwits <oliver@cpan.org> Date: Sat Aug 31 08:26:39 2013 +0100 use blockquote to make dialog more readable commitbab8e4d00cAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sat Aug 31 08:16:49 2013 +0100 add confirm dialog to user delete commit46c7d54973Author: Oliver Gorwits <oliver@cpan.org> Date: Sat Aug 31 07:46:52 2013 +0100 add confirm dialog to pseudo device delete commit00f26b92a9Author: Oliver Gorwits <oliver@cpan.org> Date: Sat Aug 31 07:41:41 2013 +0100 restore aria header ref commit1c04d32cd2Author: Oliver Gorwits <oliver@cpan.org> Date: Sat Aug 31 07:38:39 2013 +0100 add confirm dialog to topo link delete commit914a03a19cAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sat Aug 31 07:12:59 2013 +0100 tidy dialogs commite4c3978ba8Author: Oliver Gorwits <oliver@cpan.org> Date: Fri Aug 30 23:37:55 2013 +0100 remove attr("data- commit626c8c3fddAuthor: Oliver Gorwits <oliver@cpan.org> Date: Fri Aug 30 23:36:47 2013 +0100 log message for port controls commitb614669c0cAuthor: Oliver Gorwits <oliver@cpan.org> Date: Fri Aug 30 21:23:22 2013 +0100 swap attr for data commit79ce5ec47dAuthor: Oliver Gorwits <oliver@cpan.org> Date: Fri Aug 30 21:09:41 2013 +0100 improve delete modal and add log message commit601671b383Author: Oliver Gorwits <oliver@cpan.org> Date: Tue Aug 27 22:46:43 2013 +0100 modal dialog which calls ajax
This commit is contained in:
@@ -16,7 +16,9 @@
|
||||
<button class="btn btn-small nd_adminbutton" name="add" type="submit"><i class="icon-plus-sign"></i> Add</button>
|
||||
</td>
|
||||
</tr>
|
||||
[% SET count = 0 %]
|
||||
[% WHILE (row = results.next) %]
|
||||
[% SET count = count + 1 %]
|
||||
<tr>
|
||||
<td class="nd_center-cell"><a class="nd_linkcell"
|
||||
href="[% uri_for('/device') %]?q=[% row.dns | uri %]">[% row.dns | html_entity %]</a></td>
|
||||
@@ -28,10 +30,30 @@
|
||||
<input data-form="update" name="dns" type="hidden" value="[% row.dns | html_entity %]">
|
||||
<input data-form="update" name="ip" type="hidden" value="[% row.ip | html_entity %]">
|
||||
<button class="btn nd_adminbutton" name="update" type="submit"><i class="icon-save text-warning"></i></button>
|
||||
<input data-form="del" name="dns" type="hidden" value="[% row.dns | html_entity %]">
|
||||
<input data-form="del" name="ip" type="hidden" value="[% row.ip | html_entity %]">
|
||||
<input data-form="del" name="ports" type="hidden" value="[% row.port_count | html_entity %]">
|
||||
<button class="btn nd_adminbutton" name="del" type="submit"><i class="icon-trash text-error"></i></button>
|
||||
|
||||
<button class="btn" data-toggle="modal"
|
||||
data-target="#nd_devdel-[% count %]" type="button"><i class="icon-trash text-error"></i></button>
|
||||
|
||||
<div id="nd_devdel-[% count %]" class="nd_modal modal hide fade" tabindex="-1"
|
||||
role="dialog" aria-labelledby="nd_devdel_label-[% count %]" aria-hidden="true">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
|
||||
<h3 id="nd_devdel_label-[% count %]">Are you sure?</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<blockquote>
|
||||
<p class="text-info">
|
||||
Pseudo-device "[% row.dns | html_entity %] / [% row.ip | html_entity %]" will be deleted.</p>
|
||||
</blockquote>
|
||||
<input data-form="del" name="dns" type="hidden" value="[% row.dns | html_entity %]">
|
||||
<input data-form="del" name="ip" type="hidden" value="[% row.ip | html_entity %]">
|
||||
<input data-form="del" name="ports" type="hidden" value="[% row.port_count | html_entity %]">
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button class="btn btn-success" data-dismiss="modal" aria-hidden="true">Cancel</button>
|
||||
<button class="btn btn-danger nd_adminbutton" name="del" data-dismiss="modal">Confirm</button>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
[% END %]
|
||||
|
||||
@@ -38,7 +38,9 @@
|
||||
<button class="btn btn-small nd_adminbutton" name="add" type="submit"><i class="icon-plus-sign"></i> Add</button>
|
||||
</td>
|
||||
</tr>
|
||||
[% SET count = 0 %]
|
||||
[% WHILE (row = results.next) %]
|
||||
[% SET count = count + 1 %]
|
||||
<tr>
|
||||
<td class="nd_center-cell"><a class="nd_linkcell" href="[% uri_for('/device') %]?q=[% row.dev1 | uri %]">
|
||||
[% (row.device1.dns || row.device1.name || row.device1.ip) | html_entity %]</a>
|
||||
@@ -48,11 +50,36 @@
|
||||
[% (row.device2.dns || row.device2.name || row.device2.ip) | html_entity %]</a></td>
|
||||
<td class="nd_center-cell">[% row.port2 | html_entity %]</td>
|
||||
<td class="nd_center-cell">
|
||||
<input data-form="del" name="dev1" type="hidden" value="[% row.dev1 | html_entity %]">
|
||||
<input data-form="del" name="port1" type="hidden" value="[% row.port1 | html_entity %]">
|
||||
<input data-form="del" name="dev2" type="hidden" value="[% row.dev2 | html_entity %]">
|
||||
<input data-form="del" name="port2" type="hidden" value="[% row.port2 | html_entity %]">
|
||||
<button class="btn nd_adminbutton" name="del" type="submit"><i class="icon-trash text-error"></i></button>
|
||||
<button class="btn" data-toggle="modal"
|
||||
data-target="#nd_devdel-[% count %]" type="button"><i class="icon-trash text-error"></i></button>
|
||||
|
||||
<div id="nd_devdel-[% count %]" class="nd_modal modal hide fade" tabindex="-1"
|
||||
role="dialog" aria-labelledby="nd_devdel_label-[% count %]" aria-hidden="true">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
|
||||
<h3 id="nd_devdel_label-[% count %]">Are you sure?</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<blockquote>
|
||||
<p class="text-info">The link between these two ports will be removed:</p>
|
||||
<p> </p>
|
||||
<ul>
|
||||
<li><p class="text-info">[% (row.device1.dns || row.device1.name || row.device1.ip) | html_entity %],
|
||||
[% row.port1 | html_entity %]</p></li>
|
||||
<li><p class="text-info">[% (row.device2.dns || row.device2.name || row.device2.ip) | html_entity %],
|
||||
[% row.port2 | html_entity %]</p></li>
|
||||
</ul>
|
||||
</blockquote>
|
||||
<input data-form="del" name="dev1" type="hidden" value="[% row.dev1 | html_entity %]">
|
||||
<input data-form="del" name="port1" type="hidden" value="[% row.port1 | html_entity %]">
|
||||
<input data-form="del" name="dev2" type="hidden" value="[% row.dev2 | html_entity %]">
|
||||
<input data-form="del" name="port2" type="hidden" value="[% row.port2 | html_entity %]">
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button class="btn btn-success" data-dismiss="modal" aria-hidden="true">Cancel</button>
|
||||
<button class="btn btn-danger nd_adminbutton" name="del" data-dismiss="modal">Confirm</button>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
[% END %]
|
||||
|
||||
@@ -23,7 +23,9 @@
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
[% SET count = 0 %]
|
||||
[% WHILE (row = results.next) %]
|
||||
[% SET count = count + 1 %]
|
||||
<tr>
|
||||
<td class="nd_center-cell">
|
||||
<input data-form="update" name="fullname" type="text" value="[% row.fullname | html_entity %]">
|
||||
@@ -46,8 +48,27 @@
|
||||
|
||||
<td class="nd_center-cell">
|
||||
<button class="btn nd_adminbutton" name="update" type="submit"><i class="icon-save text-warning"></i></button>
|
||||
<input data-form="del" name="username" type="hidden" value="[% row.username | html_entity %]">
|
||||
<button class="btn nd_adminbutton" name="del" type="submit"><i class="icon-trash text-error"></i></button>
|
||||
|
||||
<button class="btn" data-toggle="modal"
|
||||
data-target="#nd_devdel-[% count %]" type="button"><i class="icon-trash text-error"></i></button>
|
||||
|
||||
<div id="nd_devdel-[% count %]" class="nd_modal modal hide fade" tabindex="-1"
|
||||
role="dialog" aria-labelledby="nd_devdel_label-[% count %]" aria-hidden="true">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
|
||||
<h3 id="nd_devdel_label-[% count %]">Are you sure?</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<blockquote>
|
||||
<p class="text-info">User "[% row.username | html_entity %]" will be deleted.</p>
|
||||
</blockquote>
|
||||
<input data-form="del" name="username" type="hidden" value="[% row.username | html_entity %]">
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button class="btn btn-success" data-dismiss="modal" aria-hidden="true">Cancel</button>
|
||||
<button class="btn btn-danger nd_adminbutton" name="del" data-dismiss="modal">Confirm</button>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
[% END %]
|
||||
|
||||
@@ -98,12 +98,38 @@
|
||||
<tr data-for-device="[% d.dns || d.ip %]">
|
||||
<td>Admin Tasks</td>
|
||||
<td>
|
||||
<input type="hidden" data-form="discover" value="[% d.ip %]" name="device" type="text"/>
|
||||
<button class="btn btn-info btn-small nd_adminbutton" name="discover" type="submit">Discover</button>
|
||||
<input type="hidden" data-form="arpnip" value="[% d.ip %]" name="device" type="text"/>
|
||||
<button class="btn btn-info btn-small nd_adminbutton" name="arpnip" type="submit">Arpnip</button>
|
||||
<input type="hidden" data-form="macsuck" value="[% d.ip %]" name="device" type="text"/>
|
||||
<button class="btn btn-info btn-small nd_adminbutton" name="macsuck" type="submit">Macsuck</button>
|
||||
<input type="hidden" data-form="discover" value="[% d.ip %]" name="device"/>
|
||||
<button class="btn btn-info btn-small nd_adminbutton" name="discover">Discover</button>
|
||||
<input type="hidden" data-form="arpnip" value="[% d.ip %]" name="device"/>
|
||||
<button class="btn btn-info btn-small nd_adminbutton" name="arpnip">Arpnip</button>
|
||||
<input type="hidden" data-form="macsuck" value="[% d.ip %]" name="device"/>
|
||||
<button class="btn btn-info btn-small nd_adminbutton" name="macsuck">Macsuck</button>
|
||||
|
||||
<button class="btn btn-danger btn-small pull-right"
|
||||
data-toggle="modal" data-target="#nd_devdel" type="button">Delete</button>
|
||||
|
||||
<div id="nd_devdel" class="nd_modal modal hide fade" tabindex="-1"
|
||||
role="dialog" aria-labelledby="nd_devdel_label" aria-hidden="true">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
|
||||
<h3 id="nd_devdel_label">Confirm Delete: [% d.dns || d.ip | html_entity %]</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<blockquote>
|
||||
<ul>
|
||||
<li><p>This action is immediate and not reversible</p></li>
|
||||
<li><p>All associated Nodes will be removed from the database</p></li>
|
||||
</ul>
|
||||
</blockquote>
|
||||
<textarea class="input-block-level" rows="2" data-form="delete"
|
||||
placeholder="Enter a log message" name="log"></textarea>
|
||||
<input type="hidden" data-form="delete" value="[% d.ip %]" name="device"/>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button class="btn btn-success" data-dismiss="modal" aria-hidden="true">No !</button>
|
||||
<button class="btn btn-danger nd_adminbutton" name="delete" data-dismiss="modal">Really Delete</button>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
[% END %]
|
||||
|
||||
@@ -125,7 +125,7 @@
|
||||
|
||||
[% IF params.c_vlan %]
|
||||
[% IF user_can_port_control AND params.c_admin %]
|
||||
<td class="nd_editable-cell" contenteditable="true"
|
||||
<td class="nd_editable-cell" contenteditable="true" data-default="[% row.vlan | html_entity %]"
|
||||
data-field="c_vlan" data-for-device="[% device.ip | html_entity %]" data-for-port="[% row.port | html_entity %]">
|
||||
<i class="icon-edit nd_edit-icon"></i>
|
||||
<div class="nd_editable-cell-content">
|
||||
@@ -273,3 +273,17 @@
|
||||
[% END %]
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
[% IF user_can_port_control %]
|
||||
<div id="nd_portlog" class="nd_modal nd_deep-horizon modal hide fade" tabindex="-1"
|
||||
role="dialog" aria-hidden="true">
|
||||
<div class="modal-body">
|
||||
<textarea id="nd_portlog_log" class="input-block-level" rows="2" name="log"
|
||||
placeholder="Enter a log message"></textarea>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
|
||||
<button id="nd_portlog_submit" class="btn btn-info" data-dismiss="modal">Continue</button>
|
||||
</div>
|
||||
</div>
|
||||
[% END %]
|
||||
|
||||
@@ -59,6 +59,9 @@
|
||||
,delay: 150
|
||||
,minLength: 0
|
||||
});
|
||||
|
||||
// activate modals
|
||||
$('.nd_modal').modal({show: false});
|
||||
}
|
||||
|
||||
// on load, establish global delegations for now and future
|
||||
|
||||
@@ -27,7 +27,8 @@
|
||||
$('#nd_netmap-help').hide();
|
||||
}
|
||||
|
||||
// activate tooltips and popovers
|
||||
// activate modals, tooltips and popovers
|
||||
$('.nd_modal').modal({show: false});
|
||||
$("[rel=tooltip]").tooltip({live: true});
|
||||
$("[rel=popover]").popover({live: true});
|
||||
}
|
||||
@@ -37,7 +38,7 @@
|
||||
var tab = '[% tab.tag %]'
|
||||
var target = '#' + tab + '_pane';
|
||||
|
||||
// sidebar form fields should change colour and have bin/copy icon
|
||||
// sidebar form fields should change colour and have trash/copy icon
|
||||
form_inputs.each(function() {device_form_state($(this))});
|
||||
form_inputs.change(function() {device_form_state($(this))});
|
||||
|
||||
@@ -52,7 +53,7 @@
|
||||
.toggleClass('icon-chevron-up icon-chevron-down');
|
||||
});
|
||||
|
||||
// handler for bin icon in port filter box
|
||||
// handler for trashcan icon in port filter box
|
||||
var portfilter = $('#ports_form').find("input[name=f]");
|
||||
$('.nd_field-clear-icon').click(function() {
|
||||
portfilter.val('');
|
||||
@@ -101,15 +102,24 @@
|
||||
,async: true
|
||||
,dataType: 'html'
|
||||
,url: uri_base + '/ajax/control/admin/' + mode
|
||||
,data: tr.find('input[data-form="' + mode + '"]').serializeArray()
|
||||
,data: tr.find('input[data-form="' + mode + '"],textarea[data-form="' + mode + '"]').serializeArray()
|
||||
,success: function() {
|
||||
toastr.info('Queued '+ mode +' for device '+ tr.attr('data-for-device'));
|
||||
toastr.info('Queued '+ mode +' for device '+ tr.data('for-device'));
|
||||
}
|
||||
// skip any error reporting for now
|
||||
// TODO: fix sanity_ok in Netdisco Web
|
||||
,error: function() {
|
||||
toastr.error('Failed to queue '+ mode +' for device '+ tr.attr('data-for-device'));
|
||||
toastr.error('Failed to queue '+ mode +' for device '+ tr.data('for-device'));
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// bootstrap modal mucks about with mouse actions on higher elements
|
||||
// so need to bury and raise it when needed
|
||||
$('#ports_pane').on('show', '.nd_modal', function () {
|
||||
$(this).toggleClass('nd_deep-horizon');
|
||||
});
|
||||
$('#ports_pane').on('hidden', '.nd_modal', function () {
|
||||
$(this).toggleClass('nd_deep-horizon');
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user