Skip to content

Commit 008a901

Browse files
Christoffer-CortesChristoffer-Cortes
authored
Fix tooltip bug (#88)
* Fix tooltip bug with form recreation and propagation block * Fix recalc on subscription table
1 parent 4ccb92e commit 008a901

File tree

4 files changed

+32
-60
lines changed

4 files changed

+32
-60
lines changed

‎src/main/resources/static/js/main.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -182,7 +182,7 @@ jQuery(document).ready(function() {
182182

183183
$('body').on('click', function (e) {
184184
if ($(e.target).data('toggle') !== 'tooltip' && $(e.target)[0].className !== 'tooltip-inner') {
185-
$('[data-toggle="tooltip"]').tooltip('hide');
185+
$('.tooltip').tooltip('hide');
186186
}
187187
});
188188
});

‎src/main/resources/static/js/subscription.js

Lines changed: 19 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,6 @@ jQuery(document).ready(function () {
9898
});
9999
// END OF EI Backend Server check #########################################
100100

101-
102101
// /Start ## Knockout ####################################################
103102

104103
// Subscription model
@@ -146,7 +145,6 @@ jQuery(document).ready(function () {
146145
this.jmespath = ko.observable(jmespath.jmespath);
147146
}
148147

149-
150148
// ViewModel - SubscriptionViewModel
151149
var SubscriptionViewModel = function () {
152150
var self = this;
@@ -181,38 +179,15 @@ jQuery(document).ready(function () {
181179

182180
self.repeat_in = ko.observableArray([true, false]);
183181

184-
self.add_requirement = function (data, event) {
185-
186-
var conditions_array = [];
187-
conditions_array.push(new jmespath_model({ "jmespath": ko.observable("") }));
188-
self.subscription()[0].requirements().push(new conditions_model(conditions_array));
189-
190-
// Force update
191-
var data = self.subscription().slice(0);
192-
self.subscription([]);
193-
self.subscription(data);
194-
self.subscription.valueHasMutated();
195-
loadTooltip();
196-
};
197-
198-
199182
self.choosen_subscription_template.subscribe(function (template_var) {
200183
if (self.choosen_subscription_template() != null) { // only execute if value exists
201184
json_obj_clone = JSON.parse(JSON.stringify(template_vars[template_var]));
202185
populate_json(json_obj_clone, "add");
203186
}
204187
});
205188

206-
207189
self.addNotificationMsgKeyValuePair = function (data, event) {
208190
self.subscription()[0].notificationMessageKeyValues.push(new formdata_model(defaultFormKeyValuePair));
209-
210-
// Force update
211-
var data = self.subscription().slice(0);
212-
self.subscription([]);
213-
self.subscription(data);
214-
self.subscription.valueHasMutated();
215-
loadTooltip();
216191
};
217192

218193
self.addNotificationMsgKeyValuePairAuth = function (data, event) {
@@ -222,22 +197,27 @@ jQuery(document).ready(function () {
222197

223198
})
224199
});
225-
// ko.observable(value);
226-
// Force update
227-
var data = self.subscription().slice(0);
228-
self.subscription([]);
229-
self.subscription(data);
230-
self.subscription.valueHasMutated();
231-
loadTooltip();
232200
};
233201

234-
235202
self.getUTCDate = function (epochtime) {
236203
var d = new Date(0); // The 0 there is the key, which sets the date to the epoch
237204
d.setUTCMilliseconds(epochtime);
238205
return d; // Is now a date (in client time zone)
239206
}
240207

208+
self.add_requirement = function (data, event) {
209+
210+
var conditions_array = [];
211+
conditions_array.push(new jmespath_model({ "jmespath": ko.observable("") }));
212+
self.subscription()[0].requirements().push(new conditions_model(conditions_array));
213+
// Force update
214+
var data = self.subscription().slice(0);
215+
self.subscription([]);
216+
self.subscription(data);
217+
self.subscription.valueHasMutated();
218+
closeTooltip();
219+
loadTooltip();
220+
};
241221

242222
self.add_condition = function (data, event, requirement_index) {
243223
self.subscription()[0].requirements()[ko.toJSON(requirement_index)].conditions().push(new jmespath_model({ "jmespath": ko.observable("") }));
@@ -246,25 +226,23 @@ jQuery(document).ready(function () {
246226
self.subscription([]);
247227
self.subscription(data);
248228
self.subscription.valueHasMutated();
229+
closeTooltip();
249230
loadTooltip();
250231
};
251232

252-
253233
self.delete_condition = function (data, event, requirement_item, condition_index, requirement_index) {
254234
self.subscription()[0].requirements()[ko.toJSON(requirement_index)].conditions.remove(data);
255235
if (self.subscription()[0].requirements()[ko.toJSON(requirement_index)].conditions().length <= 0) {
256236
self.subscription()[0].requirements.remove(self.subscription()[0].requirements()[ko.toJSON(requirement_index)]);
257237
}
258238
};
259239

260-
261240
self.delete_NotificationMsgKeyValuePair = function (data, event, index) {
262241
if (self.subscription()[0].notificationMessageKeyValues().length > 1) {
263242
self.subscription()[0].notificationMessageKeyValues.remove(self.subscription()[0].notificationMessageKeyValues()[ko.toJSON(index)]);
264243
}
265244
};
266245

267-
268246
self.delete_BulkNotificationMsgKeyValuePair = function () {
269247
$.each(self.subscription()[0].notificationMessageKeyValues(), function (index, value) {
270248
if (self.subscription()[0].notificationMessageKeyValues().length > 1) {
@@ -274,7 +252,6 @@ jQuery(document).ready(function () {
274252
};
275253
};
276254

277-
278255
// Start to check is backend secured
279256
var isSecured = false;
280257
$.ajax({
@@ -307,6 +284,7 @@ jQuery(document).ready(function () {
307284
var currentUser = localStorage.getItem("currentUser");
308285
table = $('#table').DataTable({
309286
"responsive": true,
287+
"autoWidth": false,
310288
"processing": true, //Feature control the processing indicator.
311289
"serverSide": false, //Feature control DataTables' server-side processing mode.
312290
"fixedHeader": true,
@@ -415,7 +393,6 @@ jQuery(document).ready(function () {
415393
});
416394
// /Stop ## Datatables ##################################################
417395

418-
419396
// /Start ## check all subscriptions ####################################
420397
$("#check-all").click(function () {
421398
$(".data-check").prop('checked', $(this).prop('checked'));
@@ -436,7 +413,6 @@ jQuery(document).ready(function () {
436413
});
437414
// /Stop ## Reload Table#################################################
438415

439-
440416
// /Start ## Bulk delete#################################################
441417
$("#bulkDelete").click(function () {
442418
var subscriptionsToDelete = [];
@@ -499,8 +475,6 @@ jQuery(document).ready(function () {
499475
});
500476
// /Stop ## Bulk delete##################################################
501477

502-
503-
504478
function getTemplate() {
505479
var req = new XMLHttpRequest();
506480
req.open("GET", frontendServiceUrl + '/download/subscriptionsTemplate', true);
@@ -522,8 +496,6 @@ jQuery(document).ready(function () {
522496
});
523497
// /END ## get_subscription_template #################################################
524498

525-
526-
527499
function validateJsonAndCreateSubscriptions(subscriptionFile) {
528500
var reader = new FileReader();
529501
reader.onload = function () {
@@ -583,7 +555,6 @@ jQuery(document).ready(function () {
583555
ajaxHttpSender.sendAjax(frontendServiceUrl + "/subscriptions", "POST", ko.toJSON(subscriptionJson), callback);
584556
}
585557

586-
587558
// /Start ## upload_subscriptions #################################################
588559
$("#uploadSubscription").click(function () {
589560
function createUploadWindow() {
@@ -685,7 +656,6 @@ jQuery(document).ready(function () {
685656
item[0].notificationMessageKeyValues[i] = new formdata_model(item[0].notificationMessageKeyValues[i])
686657
}
687658

688-
689659
return new subscription_model(item[0]);
690660
});
691661
// Load data into observable array
@@ -883,19 +853,12 @@ jQuery(document).ready(function () {
883853
}
884854
};
885855

886-
887856
// Perform AJAX
888857
var ajaxHttpSender = new AjaxHttpSender();
889858
ajaxHttpSender.sendAjax(url, type, ko.toJSON(vm.subscription()), callback);
890-
891-
892-
893859
});
894860
// /Stop ## Save Subscription ###########################################
895861

896-
897-
898-
899862
// /Start ## Delete Subscription ########################################
900863
$('#table').on('click', 'tbody tr td button.delete_record', function (event) {
901864
event.stopPropagation();
@@ -923,7 +886,6 @@ jQuery(document).ready(function () {
923886
}
924887
};
925888

926-
927889
$.confirm({
928890
title: 'Confirm!',
929891
content: 'Are you sure delete this subscription?',
@@ -949,4 +911,8 @@ jQuery(document).ready(function () {
949911
function loadTooltip() {
950912
$('[data-toggle="tooltip"]').tooltip({ trigger: "click", html: true });
951913
}
914+
915+
function closeTooltip() {
916+
$('.tooltip').tooltip('hide');
917+
}
952918
});

‎src/main/resources/static/js/testrules.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -200,6 +200,7 @@ jQuery(document).ready(
200200
vm.rulesBindingList = ko.observableArray(rulesList);
201201
ko.applyBindings(vm, $("#testRulesDOMObject")[0]);
202202
ko.applyBindings(vm, $("#submitButton")[0]);
203+
closeTooltip();
203204
loadTooltip();
204205
};
205206
reader.readAsText(subscriptionFile);
@@ -226,6 +227,7 @@ jQuery(document).ready(
226227
$('.eventsListDisplay > div:gt(0)').remove();
227228
vm.eventsBindingList = ko.observableArray(eventsList);
228229
ko.applyBindings(vm, $("#testEventsDOMObject")[0]);
230+
closeTooltip();
229231
loadTooltip();
230232
};
231233
reader.readAsText(subscriptionFile);
@@ -378,5 +380,9 @@ jQuery(document).ready(
378380
function loadTooltip() {
379381
$('[data-toggle="tooltip"]').tooltip({ trigger: "click", html: true });
380382
}
383+
384+
function closeTooltip() {
385+
$('.tooltip').tooltip('hide');
386+
}
381387
}
382388
);

‎src/main/resources/templates/subscription.html

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -189,7 +189,7 @@ <h3 class="modal-title text-center" id="formHeader">Subscription Form</h3>
189189
</td>
190190
<td valign="top" data-bind="visible: $root.formpostkeyvaluepairs">
191191
<button data-bind="click: function(data, event) { $root.delete_NotificationMsgKeyValuePair(data, event, $index()); },
192-
clickBubble: false, style:{visibility:($root.subscription()[0].notificationMessageKeyValues().length > 1) ? 'visible' : 'hidden'}"
192+
style:{visibility:($root.subscription()[0].notificationMessageKeyValues().length > 1) ? 'visible' : 'hidden'}"
193193
class="btn btn-danger float-right" style="visibility:hidden">
194194
<i class="glyphicon glyphicon-trash"></i>Delete
195195
</button>
@@ -199,7 +199,7 @@ <h3 class="modal-title text-center" id="formHeader">Subscription Form</h3>
199199
</table>
200200

201201
<div data-bind="visible: $root.formpostkeyvaluepairs" class="pt-1 d-flex justify-content-end">
202-
<button id="kvID" data-bind="click: $root.addNotificationMsgKeyValuePair, clickBubble: false" class="btn btn-success">
202+
<button id="kvID" data-bind="click: $root.addNotificationMsgKeyValuePair" class="btn btn-success">
203203
<i class="glyphicon glyphicon-plus float-right"></i> Add Key/Value Pair
204204
</button>
205205
</div>
@@ -232,7 +232,7 @@ <h3 class="modal-title text-center" id="formHeader">Subscription Form</h3>
232232
</div>
233233

234234
<div class="pt-1 d-flex justify-content-end">
235-
<button data-bind="click: $root.addNotificationMsgKeyValuePairAuth, clickBubble: false" class="btn btn-success">
235+
<button data-bind="click: $root.addNotificationMsgKeyValuePairAuth" class="btn btn-success">
236236
<i class="glyphicon glyphicon-plus float-right"></i> Generate Key/Value Pair</button>
237237
</div>
238238
</div>
@@ -295,7 +295,7 @@ <h5 style="display:inline">AND</h5>
295295
placeholder="jmespath" class="form-control" type="text"></textarea>
296296
<div class="pt-1 d-flex justify-content-end">
297297

298-
<button data-bind="click: function(data, event) { $root.delete_condition(data, event, requirements_item , $index(), $parentContext.$index() ); }, clickBubble: false"
298+
<button data-bind="click: function(data, event) { $root.delete_condition(data, event, requirements_item , $index(), $parentContext.$index() ); }"
299299
class="btn btn-danger">
300300
<i class="glyphicon glyphicon-trash"></i>Delete
301301
</button>
@@ -304,15 +304,15 @@ <h5 style="display:inline">AND</h5>
304304
<!-- /ko -->
305305

306306
<div class="pt-1 d-flex justify-content-end">
307-
<button id="addCondition" data-bind="click: function(data, event) { $root.add_condition(data, event, $index()); }, clickBubble: false" class="btn btn-success">
307+
<button id="addCondition" data-bind="click: function(data, event) { $root.add_condition(data, event, $index()); }" class="btn btn-success">
308308
<i class="glyphicon glyphicon-plus"></i> Add Condition
309309
</button>
310310
</div>
311311
</div>
312312
</div>
313313
<!-- /ko -->
314314

315-
<button id="addRequirement" data-bind="click: $root.add_requirement, clickBubble: false" class="btn btn-success float-left">
315+
<button id="addRequirement" data-bind="click: $root.add_requirement" class="btn btn-success float-left">
316316
<i class="glyphicon glyphicon-plus float-right"></i> Add Requirement
317317
</button>
318318

0 commit comments

Comments
 (0)