diff --git a/awx/ui/static/img/help/help001.png b/awx/ui/static/img/help/help001.png index 0455fa7f8b..eb1d498396 100644 Binary files a/awx/ui/static/img/help/help001.png and b/awx/ui/static/img/help/help001.png differ diff --git a/awx/ui/static/img/help/help002.png b/awx/ui/static/img/help/help002.png index f2df800be8..2bbb8374f7 100644 Binary files a/awx/ui/static/img/help/help002.png and b/awx/ui/static/img/help/help002.png differ diff --git a/awx/ui/static/js/help/InventorySummary.js b/awx/ui/static/js/help/InventorySummary.js index efa38c5f53..670ca1920a 100644 --- a/awx/ui/static/js/help/InventorySummary.js +++ b/awx/ui/static/js/help/InventorySummary.js @@ -14,13 +14,13 @@ angular.module('InventorySummaryHelpDefinition', []) steps: { step1: { intro: 'Start by creating a group:', - img: 'help002.png', + img: { src: 'help002.png', maxWidth: 460 , maxHeight: 111 }, box: "Click the Create New button and add a new group to the inventory.", height: 400 }, step2: { intro: 'After creating a group, add hosts:', - img: 'help001.png', + img: { src: 'help001.png', maxWidth: 467, maxHeight: 208 }, box: "Navigate to Hosts using the drop-down menu, where you can add hosts to the new group", height: 480 } diff --git a/awx/ui/static/lib/ansible/Utilities.js b/awx/ui/static/lib/ansible/Utilities.js index 0f11e5d876..ea37f81afd 100644 --- a/awx/ui/static/lib/ansible/Utilities.js +++ b/awx/ui/static/lib/ansible/Utilities.js @@ -238,7 +238,14 @@ angular.module('Utilities',['RestServices', 'Utilities']) function buildHtml(step) { var html = ''; html += (step.intro) ? "
" + step.intro + "
" : ""; - html += (step.img) ? "" : ""; + if (step.img) { + html += "" + step.box + "" : ""; return html; } @@ -265,6 +272,12 @@ angular.module('Utilities',['RestServices', 'Utilities']) showHelp({ defn: nxtStory }); } + try { + $('#help-modal').dialog('hide'); + } + catch(e) { + // ignore + } $('#help-modal').html(buildHtml(defn.story.steps[nxt])).dialog({ position: { my: "center top", at: "center top+150", of: 'body' }, title: defn.story.hdr, @@ -272,12 +285,20 @@ angular.module('Utilities',['RestServices', 'Utilities']) height: height, buttons: [{ text: "Next", click: nxtStep }], closeOnEscape: true, + show: 500, + hide: 500, close: function() { $('#help-modal').empty(); } }); $('.ui-dialog-buttonset button').addClass('btn btn-primary').focus(); $('.ui-dialog-titlebar-close').empty().removeClass('close').removeClass('ui-dialog-titlebar-close').addClass('close').append('x'); } else { + try { + $('#help-modal').dialog('hide'); + } + catch(e) { + // ignore + } $('#help-modal').html(buildHtml(defn.story.steps[nxt])).dialog({ position: { my: "center top", at: "center top+150", of: 'body' }, title: defn.story.hdr, @@ -285,6 +306,8 @@ angular.module('Utilities',['RestServices', 'Utilities']) height: height, buttons: [ { text: "OK", click: function() { $( this ).dialog( "close" ); } } ], closeOnEscape: true, + show: 500, + hide: 500, close: function() { $('#help-modal').empty(); } }); $('.ui-dialog-buttonset button').addClass('btn btn-primary').focus();