Skip to content

Topic settings refactor #739

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 13 commits into from
Sep 20, 2016
Merged

Topic settings refactor #739

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
bd45989
CAT-2329 and CAT-2332 Fixed
Durgesh1988 Sep 14, 2016
259c4c3
CAT-2333 Fixed
Durgesh1988 Sep 14, 2016
04723f2
CAT-2333 Fixed
Durgesh1988 Sep 14, 2016
81c5db0
Setting Wizard Implementation
Durgesh1988 Sep 15, 2016
d5e1a89
Merge remote-tracking branch 'upstream/topic-settings-refactor' into …
Durgesh1988 Sep 15, 2016
2db0f6b
Setting Wizard Implementation
Durgesh1988 Sep 15, 2016
523f240
Setting Wizard Implementation
Durgesh1988 Sep 15, 2016
e6de62a
Setting Wizard Implementation
Durgesh1988 Sep 15, 2016
126dbfe
Org Setup completed
srikanthv02 Sep 15, 2016
efccdae
Changes for wizard
srikanthv02 Sep 15, 2016
eb6832b
Changes for setting wizard
srikanthv02 Sep 16, 2016
8896d9d
Changes for settings wizard allong with seed data
srikanthv02 Sep 16, 2016
f63490a
Setting wizard implemented
srikanthv02 Sep 20, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion client/htmls/private/ajax/Settings/CreateProviders.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -234,7 +234,7 @@ <h4 class="widget-margin" style="color: black;"><span id="spnprovider"></span></
<span>
<img data-toggle="popover" data-html="true" data-placement="left" title="AWS Planned Cost for a Month." src="img/help.png"/>
</span>
<input name="plannedCost" id="plannedCost" class="form-control" type="text" cdata="catalyst" cat-validation="required" placeholder="Enter the Planned Cost">
<input name="plannedCost" id="plannedCost" class="form-control" type="text" cdata="catalyst" placeholder="Enter the Planned Cost">
</div>
</div>
<div class="row">
Expand Down
190 changes: 150 additions & 40 deletions client/htmls/private/ajax/Settings/Dashboard.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
.container {
width:1166px;
height:130px;
margin-top: 20px;
}
.btn-circle {
width: 49px;
Expand Down Expand Up @@ -29,6 +30,16 @@
color:#fff;
box-shadow: 0 0 5px #286090;
}
.green-btn {
background-color: green;
color:#fff;
box-shadow: 0 0 5px #286090;
}
.red-btn {
background-color: red;
color:#fff;
box-shadow: 0 0 5px #286090;
}
.process-btn {
background-color: #7d7676;
color: #fff;
Expand Down Expand Up @@ -71,53 +82,88 @@
color: #7d7676;
}

/*.content {
margin:0 auto;
width: 80%;
border: 1px solid #757575;
padding: 10px;
}*/
.form-controls {
display: inline;
height: 32px;
padding: 6px 12px;
font-size: 13px;
line-height: 1.428571429;
color: #555;
vertical-align: middle;
background-color: #fff;
background-image: none;
border: 1px solid #ccc;
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
height: 29px;
}

.marginRight20 {
margin-right: 20px;
}

#wizardActionListLoader {
opacity: 0.6;
height: 100%;
width: 100%;
position: absolute;
background: #ddd;
}
</style>
<div class="row">
<h3 style="color:#286090; font-weight:bold;margin-top:5px;">
<center>Setup &amp; Configuration Wizard</center>
</h3>
<div id="wizardActionListLoader" style="display: none">
<img class="center-block" style="height: 50px; width: 50px; margin-top: 20%; margin-left: 48%;margin-bottom: 10%; position: absolute;" src="img/loading.gif" />
</div>
<div class="widget-box">
<div class="widget-header">
<h5 class="widget-title" style="color:#4e5964;">
<strong>Setup &amp; Configuration Wizard</strong>
</h5>
<div class="widget-toolbar no-border">
<span class="providerSelect">
Choose Organization:
<select class="form-controls marginRight20 orgWidth" id ="orgDropdown">
</select>
</span>
<a id="createNew" class="btn btn-primary">
<i class="ace-icon ace-icon fa fa-plus bigger-110"></i>
New Wizard
</a>

</div>
</div>
<div class="container">
<div class="btn-cls">
<div class="btn-1">
<a type="button" class="btn btn-circle active-btn btn-text" style="line-height:3">Start</a><br />
<div class="btn-1" id="startConfig">
<a type="button" class="btn btn-circle btn-text" style="line-height:3">Start</a><br />
<p class="lable-name">Introduction</p>
</div>
<div class="btn-1" id="orgConfiguration">
<a type="button" href="ajax/Settings/settingsWizard.html" class="btn btn-circle process-btn">1</a><br />
<p class="lable-name">Org Configuration</p>
</div>
<div class="btn-1">
<a type="button" class="btn btn-circle process-btn">2</a><br />
<p class="lable-name">Chef Configuration</p>
<div class="btn-1" id="configManagement">
<a type="button" href="ajax/Settings/configManagementWizard.html" class="btn btn-circle process-btn">2</a><br />
<p class="lable-name">Config Management</p>
</div>
<div class="btn-1" id="providerConfiguration">
<a type="button" href="" class="btn btn-circle process-btn">3</a><br />
<a type="button" href="ajax/Settings/providerWizard.html" class="btn btn-circle process-btn">3</a><br />
<p class="lable-name">Provider Configuration</p>
</div>
<div class="btn-1">
<a type="button" class="btn btn-circle process-btn">4</a><br />
<p class="lable-name">Repositories</p>
</div>
<div class="btn-1">
<a type="button" class="btn btn-circle process-btn">5</a><br />
<p class="lable-name">Security Access Control</p>
<div class="btn-1" id="devopsConfiguration">
<a type="button" href="ajax/Settings/devopsRolesWizard.html" class="btn btn-circle process-btn">4</a><br />
<p class="lable-name">Devops Roles</p>
</div>
<div class="btn-1">
<a type="button" class="btn btn-circle process-btn">6</a><br />
<p class="lable-name">Telemetry</p>
<div class="btn-1" id="trackConfiguration">
<a type="button" href="ajax/Settings/trackWizard.html" class="btn btn-circle process-btn">5</a><br />
<p class="lable-name">Track</p>
</div>
<div class="btn-1">
<a type="button" class="btn btn-circle process-btn">7</a><br />
<a type="button" href="ajax/Settings/cmdbWizard.html" class="btn btn-circle process-btn">6</a><br />
<p class="lable-name">CMDB Configuration</p>
</div>
</div>
</div>
</div>
<hr/>
<div class="contentSetting">
</div>
Expand All @@ -126,11 +172,13 @@ <h3 style="color:#286090; font-weight:bold;margin-top:5px;">


<script type="text/javascript">
var orgIdForSetup, orgNameForSetup;
//added for v3.0 - when navigating from v2.0 workzone to settings-
$(document).ready(function() {
$("#content").attr('style', 'height: 100%!important')
if(isAngularIntegration){
$('#workZoneNew').attr('href','#');
$('#wizardActionListLoader').show();
$("#content").attr('style', 'height: 100%!important')
if (isAngularIntegration) {
$('#workZoneNew').attr('href', '#');
$('#workZoneNew').removeClass('active');
$('#Workspace1').addClass('hidden');
$('#Settings_nav').show();
Expand All @@ -140,23 +188,85 @@ <h3 style="color:#286090; font-weight:bold;margin-top:5px;">
}
});
var serviceURL = "/d4dMasters/";
window.selectedOrgName = 'Settings';
window.selectedOrgName = 'Settings';

drawBreadCrumb1();

$('#orgConfiguration a').click(function(e){
$('a.btn').addClass('active-btn');
$(this).removeClass('process-btn');
e.preventDefault();
$('.contentSetting').load(this.getAttribute('href'));
$('.btn-1 a').click(function(e) {
$('a.btn').addClass('active-btn');
$(this).removeClass('process-btn');
e.preventDefault();
$('.contentSetting').load(this.getAttribute('href'));
});

function clearActiveClasses() {
//check for active one's
$('a.btn').removeClass('active-btn').addClass('process-btn');
//check for already created one's
$('a.btn').removeClass('green-btn').addClass('process-btn');
}

$('#createNew').click(function(e) {
$('.providerSelect').addClass('hidden');
clearActiveClasses();
$('#startConfig a').addClass('green-btn').removeClass('process-btn');
$('#orgConfiguration a').addClass('active-btn').removeClass('process-btn');
$('#orgConfiguration a').trigger('click');

})
$('#orgConfiguration a').trigger('click');

$('#providerConfiguration a').click(function(e){
$('a.btn').addClass('active-btn');
$(this).removeClass('process-btn');
e.preventDefault();
$('.contentSetting').load('ajax/Settings/CreateProviders.html?new');
$.get('/d4dMasters/readmasterjsonnew/1', function(data) {
$("#orgDropdown").empty();
for (var i = 0; i < data.length; i++) {
var $option = $('<option></option>').val(data[i].rowid).attr('rowid', data[i].orgname).html(data[i].orgname);
$('#orgDropdown').append($option);
}
$('#orgDropdown').change(function(e) {
$('#wizardActionListLoader').show();
clearActiveClasses();
orgIdForSetup = $("#orgDropdown").val();
changeWizardStatus(orgIdForSetup);
$('#wizardActionListLoader').hide();
});
$("#orgDropdown").trigger("change");
});

function changeWizardStatus(orgIdForSetup) {
$('#wizardActionListLoader').show();
$.get('/setting-wizard/org/' + orgIdForSetup, function(data) {
if (data.length === 0) {
$('a.btn').addClass('active-btn');
$('#wizardActionListLoader').hide();
} else {
var isCompleted = data.previousStep.isCompleted;
if (isCompleted = 'true') {
if (data.previousStep.name === 'Introduction') {
$('#startConfig a').addClass('green-btn').removeClass('process-btn');
$('#orgConfiguration a').addClass('active-btn').removeClass('process-btn');
$('#orgConfiguration a').trigger('click');
} else if (data.previousStep.name === 'Org Configuration') {
$('.providerSelect').removeClass('hidden');
$('#startConfig a, #orgConfiguration a,#configManagement a').addClass('green-btn').removeClass('process-btn');
$('#configManagement a').trigger('click');
} else if (data.previousStep.name === 'Config Management') {
$('#configManagement a').removeClass('active-btn process-btn').addClass('green-btn');
$('#startConfig a,#orgConfiguration a').addClass('green-btn');
$('#providerConfiguration a').trigger('click');
} else if (data.previousStep.name === 'Provider Configuration') {
$('#startConfig a, #orgConfiguration a,#configManagement a,#providerConfiguration a').removeClass('active-btn process-btn').addClass('green-btn');

$('#devopsConfiguration a').trigger('click');
} else if (data.previousStep.name === 'Devops Roles') {
$('#startConfig a, #orgConfiguration a,#configManagement a, #providerConfiguration a,#devopsConfiguration a').removeClass('active-btn process-btn').addClass('green-btn');

$('#trackConfiguration a').trigger('click');
}
}
}
$('#wizardActionListLoader').hide();
}).error(function(jqXHR) {
$('#wizardActionListLoader').hide();
});
}
</script>
134 changes: 134 additions & 0 deletions client/htmls/private/ajax/Settings/bgWizard.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,134 @@

<form action="" id="myForm2">
<div class="widget-box">
<div class="widget-header">
<h4 class="widget-margin" style="color:black;">Create Business Group</h4>
</div>
<div class="widget-body">
<div class="widget-main" style="min-height:200px">
<div class="jarviswidget" data-widget-editbutton="false" data-widget-custombutton="false">
<div>
<div class="col-lg-6 col-md-6">
<label for="name">Business Group Name <span class="control-label redSpan">&nbsp;*</span></label>
<input autofocus name="productgroupname" value="" id="productgroupname" class="form-control" type="text" cdata="catalyst" cat-validation="required,nospecial,max15,nospace">
</div>
<div class="col-lg-6 col-md-6">
<label for="">Organization<span class="control-label redSpan">&nbsp;*</span></label>
<select id="orgname" class="chooseOrganization form-control width-100" cdata="catalyst" cat-validation="required">
<option value="">Select an Organization</option>
</select>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="btn-group pull-right">
<button name="next2" id="next2" class="nextBG action-button" value="Next">Next</button>
</div>
</form>



<script>
//jQuery time
var current_fs, next_fs, previous_fs; //fieldsets
var left, opacity, scale; //fieldset properties which we will animate
var animating; //flag to prevent quick multi-click glitches

$('.providerSelect').removeClass('hidden');
$.get('/d4dMasters/readmasterjsonnew/1',function(data){
$("#orgDropdown").empty();
for(var i=0;i<data.length;i++){
var $option = $('<option></option>').val(data[i].orgname).attr('rowid',data[i].rowid).html(data[i].orgname);
$('#orgDropdown').append($option);
}
orgIdForSetup = $('#orgDropdown option:last').attr('rowid');
orgNameForSetup = $('#orgDropdown option:last').val();
$('#orgDropdown option:last').attr('selected','selected')
var $optionSelect = $('<option></option').val(orgNameForSetup).attr('rowid',orgIdForSetup).html(orgNameForSetup);
$('#orgname').append($optionSelect);
});


$('#myForm2').submit(function() {
if($(this).valid){
if(!saveform('2'))
return false;
}else{
alert('invalid valid form submitted'); // for demo
}
return false; // for demo
});

$(".nextBG").click(function(){
$('.content').load("ajax/Settings/projWizard.html");
if(animating) return false;
animating = true;

current_fs = $(this).parent();
next_fs = $(this).parent().next();

//activate next step on progressbar using the index of next_fs
$("#progressbar li").eq($("div form").index(next_fs)).addClass("active");

//show the next fieldset
next_fs.show();
//hide the current fieldset with style
current_fs.animate({opacity: 0}, {
step: function(now, mx) {
//as the opacity of current_fs reduces to 0 - stored in "now"
//1. scale current_fs down to 80%
scale = 1 - (1 - now) * 0.2;
//2. bring next_fs from the right(50%)
left = (now * 50)+"%";
//3. increase opacity of next_fs to 1 as it moves in
opacity = 1 - now;
current_fs.css({'transform': 'scale('+scale+')'});
next_fs.css({'left': left, 'opacity': opacity});
},
duration: 800,
complete: function(){
current_fs.hide();
animating = false;
},
//this comes from the custom easing plugin
easing: 'easeInOutBack'
});
});

$(".previous").click(function(){
if(animating) return false;
animating = true;

current_fs = $(this).parent();
previous_fs = $(this).parent().prev();

//de-activate current step on progressbar
$("#progressbar li").eq($("form").index(current_fs)).removeClass("active");

//show the previous fieldset
previous_fs.show();
//hide the current fieldset with style
current_fs.animate({opacity: 0}, {
step: function(now, mx) {
//as the opacity of current_fs reduces to 0 - stored in "now"
//1. scale previous_fs from 80% to 100%
scale = 0.8 + (1 - now) * 0.2;
//2. take current_fs to the right(50%) - from 0%
left = ((1-now) * 50)+"%";
//3. increase opacity of previous_fs to 1 as it moves in
opacity = 1 - now;
current_fs.css({'left': left});
previous_fs.css({'transform': 'scale('+scale+')', 'opacity': opacity});
},
duration: 800,
complete: function(){
current_fs.hide();
animating = false;
},
//this comes from the custom easing plugin
easing: 'easeInOutBack'
});
});
</script>
Loading