{% extends "layout/default.html" %}

{% set title = _("Skills") %}

{% block body %}

<h1>{{_("Skills")}}</h1>

<div class="row">
  <div class="col s12">
      <ul class="tabs">
          <li class="tab col s3"><a class="active" href="#get">{{_('Skills')}}</a></li>
          <li class="tab col s3"><a href="#install">{{_('Install')}}</a></li>
          <li class="tab col s3"><a href="#install_url">{{_('Install With URL')}}</a></li>
    </ul>
    </div>
</div>

<div id="get" >
<div class="card-panel white">



<div class="row">

{% if skills == [] %}
<h4>{{ _('You have not install some skill') }}</h4>
{% else %}
{% for skill in skills %}
<div class="col s4">
<h2 class="header">{{skill['name']}}</h2>
	<div class="card horizontal blue-grey darken-1">
		<div class="card-stacked">
			<div class="card-content">
				<p>{{skill['desc']}}</p><br>
				<p>{{skill['version']}}</p>
			</div>
			<div class="card-action">
				{% if skill['index'] is defined %}<a href="{{ url_for(skill['index']) }}">{{ _("View") }}</a>{% endif %}
				<a href="{{ url_for('core.uninstall_skill', name=skill['raw']) }}">{{ _("Uninstall") }}</a>
				<a href="{{ url_for('core.update_skill', name=skill['raw']) }}">{{ _("Update") }}</a>
				<a href="#">{{ _("Config") }}</a>
			</div>
		</div>
	</div>
</div>
{% endfor %}
{% endif %}


</div>




</div>
</div>

<div id="install" >
<div class="card-panel white">
<div class="row">

{% for list in lists %}


	<div class="col s4">
		<div class="card">
			<div class="card-image waves-effect waves-block waves-light">
				<img class="activator" src="{{ list['img'] }}">
			</div>
			<div class="card-content">
				<span class="card-title activator grey-text text-darken-4">{{ list['name'] }}<i class="material-icons right">more_vert</i></span>

			</div>
			<div class="card-reveal">
				<span class="card-title grey-text text-darken-4">{{ list['name'] }}<i class="material-icons right">close</i></span>
				<p>{{ list['description'] }}</p>
				<p><a href="{{ url_for('core.install_skill', name=list['raw'] , url=list['url']) }}">Install</a></p>
			</div>
		</div>
	</div>

{% endfor %}

</div>
</div>
</div>

<div id="install_url" >
<div class="card-panel white">

<form action="{{ url_for('core.install_skill_url') }}" method="post">
 	<label for="url">{{ _('URL') }}</label>
	<input type="text" placeholder="{{ _('URL') }}" name="url" id="url">

	<label for="name">{{ _('skill Name') }}</label>
	<input type="text" placeholder="{{ _('Skill Name') }}" name="name" id="name"><br>

	<button class="btn {{buttonColor}}">{{ _('Send') }}</button>
</form>

</div>
</div>


</div>




{% endblock %}
