External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-01-13 19:10:07 -03:30
Code Issues Packages Projects Releases Wiki Activity

Help generator now supports an img object with src, maxWidth and maxHeight properties. Added fading and sizing changes to Group help images.

Browse Source
This commit is contained in:
chouseknecht 2013-10-15 11:01:22 -04:00
parent 3ef1e0aea6
commit bc49317c23
4 changed files with 26 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
awx/ui/static/img/help/help001.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 21 KiB

After

Width:  |  Height:  |  Size: 30 KiB

BIN
awx/ui/static/img/help/help002.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.9 KiB

After

Width:  |  Height:  |  Size: 19 KiB

4
awx/ui/static/js/help/InventorySummary.js
View File

@ -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 <em>Create New</em> 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 <em>Hosts</em> using the drop-down menu, where you can add hosts to the new group",
height: 480
}

25
awx/ui/static/lib/ansible/Utilities.js
View File

@ -238,7 +238,14 @@ angular.module('Utilities',['RestServices', 'Utilities'])
function buildHtml(step) {
var html = '';
html += (step.intro) ? "<div class=\"help-intro\">" + step.intro + "</div>" : "";
html += (step.img) ? "<img src=\"" + $basePath + "img/help/" + step.img + "\" style=\"max-width:" + (width - 30) + "px\" >" : "";
if (step.img) {
html += "<img src=\"" + $basePath + "img/help/" + step.img.src + "\" ";
html += "style=\"";
html += (step.img.maxWidth) ? "max-width:" + step.img.maxWidth + "px;" : "";
html += (step.img.maxHeight) ? " max-height: " + step.img.maxHeight + "px;" : "";
html += "\" ";
html += ">";
}
html += (step.box) ? "<div class=\"help-box\">" + step.box + "</div>" : "";
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();