Skip to content

Commit

Permalink
Better management of the Modal view, and the Select / Unselect buttons
Browse files Browse the repository at this point in the history 
Summary of the Selected team added.
  • Loading branch information
@Gulix
Gulix committed Jun 18, 2015
1 parent 3fddefb commit 038f80f
Show file tree
Hide file tree
Showing 4 changed files with 79 additions and 23 deletions.
92 changes: 73 additions & 19 deletions builder/builder.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,26 +26,32 @@ <h2>A team builder for <b>Pulp City</b></h2>

<!-- Filters -->
<div class="row">
<!-- Factions -->
<div class='col-md-offset-2 bg-danger'>

<!-- Team Summary -->
<div class='col-md-2'>
<p>Team Level : <strong id='team-summary-level'></strong></p>
<p># of Supremes : <strong id='team-summary-number'></strong></p>
<p>AP+ : <strong id='team-summary-apgranted'></strong></p>
<p>Minions+ : <strong id='team-summary-minionsgranted'></strong></p>
</div>

<div class='col-md-10'>
<!-- Factions -->
<div class='col-md-2'>
<label for="selFactions">Faction</label>
<select id="selFactions" class="form-control" ></select>
</div>
</div>
<!-- Role -->
<div class='col-md-offset-2 bg-danger'>
<!-- Roles -->
<div class='col-md-2'>
<label for="selRoles">Role</label>
<select id="selRoles" class="form-control" ></select>
</div>
</div>
</div>
</div>

<div class="row">
<!-- Selected items -->
<div class="col-md-2 bg-info" id="list-selected">
<p>Test</p>
<div class="col-md-2 bg-info" id="list-selected">
</div>
<!-- List of items -->
<div class="col-md-10 bg-danger" id="list-supremes">
Expand All @@ -60,7 +66,9 @@ <h2>A team builder for <b>Pulp City</b></h2>
</body>
<script>


/********************/
/*** The Supremes ***/
/********************/
function fill_supremes()
{
$.getJSON("json/supremes.json", function(json) {
Expand All @@ -76,6 +84,7 @@ <h2>A team builder for <b>Pulp City</b></h2>
var renderedHtml = Mustache.render(mustacheTemplate, view);
$("#list-supremes").html(renderedHtml);
filter_supremes();
$(".btn-select-supreme").click(function() { select_supreme(getSupremeId("btn-select-supreme-", $(this).attr('id'))); });
},
dataType: "text"
});
Expand All @@ -95,11 +104,10 @@ <h2>A team builder for <b>Pulp City</b></h2>
{
var renderedHtml = Mustache.render(mustacheTemplate, view);
$("#list-modal-supremes").html(renderedHtml);
// Click on Select Buttons
$(".btn-select-supreme").click(function() {
var supremeId = getSupremeId("btn-select-supreme-", $(this).attr('id'));
$("#supreme-selection-" + supremeId).show();
});
// Events on Buttons
$(".btn-select-supreme-modal").click(function() { select_supreme(getSupremeId("btn-select-supreme-modal-", $(this).attr('id'))); });
$(".btn-unselect-supreme-modal").click(function() { unselect_supreme(getSupremeId("btn-unselect-supreme-modal-", $(this).attr('id'))); });
$(".btn-unselect-supreme-modal").hide();
},
dataType: "text"
});
Expand All @@ -123,10 +131,7 @@ <h2>A team builder for <b>Pulp City</b></h2>
// Hiding the elements
$(".supreme-selection").each(function() { $( this ).hide(); });
// Click on Buttons
$(".btn-unselect-supreme").click(function() {
var supremeId = getSupremeId("btn-unselect-supreme-", $(this).attr('id'));
$("#supreme-selection-" + supremeId).hide();
});
$(".btn-unselect-supreme").click(function() { unselect_supreme(getSupremeId("btn-unselect-supreme-", $(this).attr('id'))); });
},
dataType: "text"
});
Expand All @@ -140,6 +145,21 @@ <h2>A team builder for <b>Pulp City</b></h2>
function select_supreme(id)
{
$("#supreme-selection-" + id).show();
// Buttons in the modal view
$("#btn-select-supreme-modal-" + id).hide();
$("#btn-unselect-supreme-modal-" + id).show();
filter_supremes();
update_summary();
}

function unselect_supreme(id)
{
$("#supreme-selection-" + id).hide();
// Buttons in the modal view
$("#btn-select-supreme-modal-" + id).show();
$("#btn-unselect-supreme-modal-" + id).hide();
filter_supremes();
update_summary();
}

function getSelectedSupremes(afterSelectionFunction)
Expand Down Expand Up @@ -285,13 +305,16 @@ <h2>A team builder for <b>Pulp City</b></h2>

for(var i=0; i < jsonSupremes.length; i++)
{
var isSelected = $('#supreme-selection-' + jsonSupremes[i].id).is(':visible');

if (((roleFilter != "0") && (jsonSupremes[i].role_key != roleFilter)) // Role
// Factions
|| (isFactionSelected && !isInTable(jsonSupremes[i].factions, factionFilter))
|| (isFactionWithout && !(jsonSupremes[i].factions.length == 0))
|| (isFactionWithoutWithFreelance && !(jsonSupremes[i].factions.length == 0) && !jsonSupremes[i].is_freelance)
|| (isHeroesOnly && !jsonSupremes[i].is_hero) // Hero
|| (isVillainsOnly && !jsonSupremes[i].is_villain)) // Villain
|| (isVillainsOnly && !jsonSupremes[i].is_villain) // Villain
|| isSelected)
{
$('#supreme-list-' + jsonSupremes[i].id).hide();
}
Expand All @@ -303,6 +326,35 @@ <h2>A team builder for <b>Pulp City</b></h2>
});
}

/***************/
/*** Summary ***/
/***************/
function update_summary()
{
$.getJSON("json/supremes.json", function(jsonSupremes) {

var teamLevel = 0;
var teamNumber = 0;
var teamAP = 0;
var teamMinions = 0;
for(var i=0; i<jsonSupremes.length; i++)
{
if ($("#supreme-selection-" + jsonSupremes[i].id).is(':visible') == true)
{
teamLevel += jsonSupremes[i].level;
teamNumber += 1;
teamAP += jsonSupremes[i].ap_granted;
teamMinions += jsonSupremes[i].minions_granted;
}
}

$("#team-summary-level").html(teamLevel);
$("#team-summary-number").html(teamNumber);
$("#team-summary-apgranted").html(teamAP);
$("#team-summary-minionsgranted").html(teamMinions);
});
}

/************************/
/*** Helper Functions ***/
/************************/
Expand All @@ -328,6 +380,8 @@ <h2>A team builder for <b>Pulp City</b></h2>
fill_supremes();
fill_supremes_modal();
fill_supremes_selection();

update_summary();

// Events on the Affiliation
changeAffiliation();
Expand Down
3 changes: 2 additions & 1 deletion builder/mustache/supremes.mst
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
<p class='text-right'><strong>{{role}} lvl.{{level}}</strong></p>
<p class='text-right'>AP+ : {{ap_granted}}</p>
<p class='text-right'>Minions+ : {{minions_granted}}</p>
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#supreme-modal-{{id}}">Show</button>
<button type="button" class="btn btn-primary btn-sm" data-toggle="modal" data-target="#supreme-modal-{{id}}">Show</button>
<button type="button" class="btn btn-primary btn-sm btn-select-supreme" id="btn-select-supreme-{{id}}">Add</button>
</div>
{{/supremes}}
3 changes: 2 additions & 1 deletion builder/mustache/supremes_modal.mst
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,8 @@
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary btn-select-supreme" id="btn-select-supreme-{{id}}">Add to selection</button>
<button type="button" class="btn btn-primary btn-select-supreme-modal" data-dismiss="modal" id="btn-select-supreme-modal-{{id}}">Add to selection</button>
<button type="button" class="btn btn-primary btn-unselect-supreme-modal" data-dismiss="modal" id="btn-unselect-supreme-modal-{{id}}">Remove from selection</button>
</div>
</div>
</div>
Expand Down
4 changes: 2 additions & 2 deletions builder/mustache/supremes_selection.mst
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@
<h4>{{name}}</h4>
<p class='text-left'><strong>{{role}} lvl.{{level}}</strong></p>
<div>
<button type="button" class="btn btn-default" data-toggle="modal" data-target="#supreme-modal-{{id}}">Show</button>
<button type="button" class="btn btn-primary btn-unselect-supreme" id="btn-unselect-supreme-{{id}}">Remove</button>
<button type="button" class="btn btn-default btn-sm" data-toggle="modal" data-target="#supreme-modal-{{id}}">Show</button>
<button type="button" class="btn btn-primary btn-sm btn-unselect-supreme" id="btn-unselect-supreme-{{id}}">Remove</button>
</div>
</div>
{{/supremes}}

0 comments on commit 038f80f

Please sign in to comment.