{% include '@dashnex/modal/support.twig' %}

<header class="dashnex-frame-header">
	<h2 class="pull-left">GCode Research</h2>
	<div class="dashnex-frame-actions">
		<div class="dashnex-frame-action-buttons">
			<input type="button" class="btn btn-danger" data-toggle="modal" data-target="#clearModal" value="Clear">
		</div>
		<div class="dashnex-frame-loader-container"></div>
		<button type="button" class="btn btn-info dashnex-frame-popover-btn">Help!</button>
	</div>

	<div class="clearfix"></div>

	<div>
		<table class="table ptm-table-header">
			<colgroup>
			<col class="col-xs-7">
			<col class="col-xs-2">
			<col class="col-xs-3">
		</colgroup>
		<tbody>
			<tr>
				<td><input type="text" class="form-control" id="ptm-bulkKeywords" placeholder="Enter Keywords"></td>
				<td colspan="2">
					<input type="submit" class="btn btn-primary ptm-addKeyword" value="Add" data-loading-text="Adding...">
					<span class="ptm-addKeywordMsg"></span>
				</td>
			</tr>
		</tbody>
	</table>
	<table class="table ptm-table-header">
		<colgroup>
		<col class="col-xs-7">
		<col class="col-xs-2">
		<col class="col-xs-3">
	</colgroup>
	<thead>
		<tr>
			<th>Keywords</th>
			<th>Competition</th>
			<th>Actions</th>
		</tr>
	</thead>
</table>
</div>
</header>

<div class="dashnex-frame-popover">
	<div class="dashnex-frame-popover-arrow"></div>
	<h3 class="dashnex-frame-popover-title">Help!</h3>
	<div class="dashnex-frame-popover-content">
		<p>
			<a href="http://www.dashnex.com" target="_blank">Take me to the
				membership site.</a>
			</p>
			<p>
				<a id="show-support-modal-btn" href="#">I need to email support.</a>
			</p>
		</div>
	</div>

	<table class="table table-bordered table-striped" id="ptm-table">
		<colgroup>
		<col class="col-xs-7">
		<col class="col-xs-2">
		<col class="col-xs-3">
	</colgroup>
	<tbody>
		{% if keywords|length %}
		{% for item in keywords %}
		<tr data-row="{{ item.id }}">
			<td class="keywords-cell">{{ item.keyword }}</td>
			<td class="strength-cell">
				{% if item.competitionStrength == -1 or item.competitionStrength is null %}
				<a class="ptm-checkStrength">Check</a>
				{% elseif item.competitionStrength > 800 %}
				<span class="label label-danger">{{ item.competitionStrength }}</span>
				{% elseif item.competitionStrength < 200 %}
				<span class="label label-success">{{ item.competitionStrength }}</span>
				{% else  %}
				<span class="label label-warning">{{ item.competitionStrength }}</span>
				{% endif %}
			</td>
			<td>
				<a href="#" class="ptm-createSilo" data-toggle="modal" data-target="#addModal">
					<span class="glyphicon glyphicon-file" data-toggle="tooltip" data-placement="top" title="" data-original-title="Create Silo"></span>
				</a>
				<a href="#" data-toggle="modal" data-target="#importModal">
					<span class="glyphicon glyphicon-cloud-upload ptm-addToSilo" data-toggle="tooltip" data-placement="top" title="" data-original-title="Add to Silo"></span>
				</a>
				<a href="#" data-toggle="modal" data-target="#generateModal">
					<span class="glyphicon glyphicon-th-list ptm-generateKeywords" data-toggle="tooltip" data-placement="top" title="" data-original-title="Generate Keywords"></span>
				</a>
				<a href="#" data-toggle="modal" data-target="#deleteModal">
					<span class="glyphicon glyphicon-trash ptm-colorRed ptm-deleteRow" data-toggle="tooltip" data-placement="top" title="" data-original-title="Delete Keyword"></span>
				</a>
			</td>
		</tr>
		{% endfor %}
		{% endif %}
	</tbody>
</table>

{% include '@p1tm/competition-strength/modals/clear.twig' %}
{% include '@p1tm/competition-strength/modals/create-silo.twig' %}
{% include '@p1tm/competition-strength/modals/delete-keyword.twig' %}
{% include '@p1tm/competition-strength/modals/generate-keywords.twig' %}
{% include '@p1tm/competition-strength/modals/import-keyword.twig' %}
{% include '@p1tm/competition-strength/modals/retry-competition-strength.twig' %}