{% extends "base.html" %} {% load static from staticfiles %}
{% block metatags %}
<title>{{ post.meta_title }} - WispHub.net</title>
<meta name="description" content="{{ post.meta_descripcion }}" />
<link rel="canonical" href="https://wisphub.net{{ post.get_absolute_url }}" />
{% endblock %}
{% block extra_files %}
<link href="{% static 'css/documentacion.css' %}" rel="stylesheet" type="text/css" />
<link title="Default" href="{% static 'assets/stylesheets/plugins/highlight/monokai-sublime.css' %}" rel="stylesheet"/>
<link href="{% static 'assets/stylesheets/plugins/jquery-ui/jquery-ui.css' %}" rel="stylesheet" type="text/css" media="all" />
{# <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">#}
{# <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>#}
{% endblock %}
{% block contenedor %}
<section class="section-border">
<div class="contenedor documentacion-post">
<aside id="left-menu" class="{% if staff_post or is_post_article_staff %}left-menu-wiki {% else %} left-menu-post {% endif %}">
<h3>{% if staff_post or is_post_article_staff %}Wiki{% else %}Manual de Usuario{% endif %}</h3>
<a href="javascript:void(0);" class="mostrar-documentacion">Ver Manual<span class="arrowBottom"> </span></a>
<div class="search-article">
<label for="title_article">
<i class="icon-search"></i>
</label>
<input class="form-control ui-autocomplete-input" id="title_article" maxlength="70" name="modelo" type="text" required="" aria-required="true" autocomplete="off" placeholder="Buscar">
</div>
<div class="menu-post">
<ul class="menu-level-1 menu-aside">
{% for post in listado_post %}
{% if post.post_postarticle.all %}
<li class="option-level-1">
<a data-toggle="collapse" href="javascript:void(0);" class="open-menu-article">{{ post.titulo }}<i class="icon-angle-down"></i></a>
<div class="content-menu-level-2">
<ul class="menu-level-2">
{% for post_article in post.post_postarticle.all %}
{% if post_article.publicado %}
<li class="option-level-2">
<a href="{{ post_article.get_absolute_url }}" class="article-menu-level-2">{{post_article}}</a>
</li>
{% endif %}
{% endfor %}
</ul>
</div>
</li>
{% elif post.post_postarticlestaff.all %}
<li class="option-level-1">
<a data-toggle="collapse" href="javascript:void(0);" class="open-menu-article">{{ post.titulo }}<i class="icon-angle-down"></i></a>
<div class="content-menu-level-2">
<ul class="menu-level-2">
{% for post_articlestaff in post.post_postarticlestaff.all %}
{% if post_articlestaff.publicado %}
<li class="option-level-2">
<a href="{{ post_articlestaff.get_absolute_url }}" class="article-menu-level-2">{{post_articlestaff}}</a>
</li>
{% endif %}
{% endfor %}
</ul>
</div>
</li>
{% else %}
<li class="option-level-1">
<a data-toggle="collapse" href="{{ post.get_absolute_url}}" class="open-menu-article">{{ post.titulo }}</a>
</li>
{% endif %}
{% endfor %}
{% if staff_post or is_post_article_staff %}
<!--<li class="option-level-1">
<a data-toggle="collapse" href="{% url 'ver_post_info_staff' 'qa' %}" class="open-menu-article menu">QA</a>
</li>-->
<li class="option-level-1">
<a data-toggle="collapse" href="{% url 'ver_post_info_staff' 'deploy' %}" class="open-menu-article">Deploy</a>
</li>
{% endif %}
</ul>
</div>
</aside>
<article id="content-post" class="{% if staff_post or is_post_article_staff %}content-post-wiki{% else %}{% endif %}">
{% block contenedor_post %} {% endblock %}
{% block contenedor_paginador %} {% endblock %}
</article>
</div>
</section>
<section id="content-disqus" class="section-border" style="{% if staff_post or is_post_article_staff %}display:None;{% else %}{% endif %}">
<div class="contenedor">
<div id="disqus_thread"></div>
<script>
/**
* RECOMMENDED CONFIGURATION VARIABLES: EDIT AND UNCOMMENT THE SECTION BELOW TO INSERT DYNAMIC VALUES FROM YOUR PLATFORM OR CMS.
* LEARN WHY DEFINING THESE VARIABLES IS IMPORTANT: https://disqus.com/admin/universalcode/#configuration-variables*/
/*
var disqus_config = function () {
this.page.url = PAGE_URL; // Replace PAGE_URL with your page's canonical URL variable
this.page.identifier = PAGE_IDENTIFIER; // Replace PAGE_IDENTIFIER with your page's unique identifier variable
};
*/
(function() { // DON'T EDIT BELOW THIS LINE
var d = document, s = d.createElement('script');
s.src = '//wisphub.disqus.com/embed.js';
s.setAttribute('data-timestamp', +new Date());
(d.head || d.body).appendChild(s);
})();
</script>
<script src="{% static 'assets/javascripts/plugins/highlight/highlight.pack.js' %}"></script>
<script src="{% static 'assets/javascripts/jquery/jquery.min.js' %}"></script>
<script type="text/javascript" src="{% static 'assets/javascripts/plugins/jquery-ui/jquery-ui.js' %} "></script>
<script>
setTimeout(function(){/*Ocultamos comentarios de disqus*/
var iframe = $("#disqus_thread iframe:first").hide();
},2000);
/*Query para abrir y cerrar submenu con cambio de icono*/
$(".option-level-1").click(function(){
$(this).children("div").slideToggle();
var icon_class = $(this).children("a").children().attr("class");
var icon_change = $(this).children("a").children();
if(icon_class == "icon-angle-up"){
icon_change[0].className = "icon-angle-down";
}
if(icon_class == "icon-angle-down"){
icon_change[0].className = "icon-angle-up";
}
})
/*Obtenemos el url de la pagina actual para abrir el menu y ver en que articulo se encuentra*/
var url_actual = window.location.pathname.split("/")[3];
/*var post_staff = {{ staff_post|lower }}
if (post_staff == true && window.location.pathname.split("/")[2] != "staff"){
url_actual = window.location.pathname.split("/")[2];
}*/
var opcion_sidebar = $('.menu-post ul.menu-level-1 li a[href*="/' + url_actual + '/"]');
opcion_sidebar.parent().addClass("active");
opcion_sidebar.addClass("active")
var active_dropdown = opcion_sidebar.parent().parent().parent().parent();
if (active_dropdown[0]) {
active_dropdown[0].firstElementChild.className += " active-option-level-1";
active_dropdown[0].firstElementChild.firstElementChild.className = "icon-angle-up";
}
$(opcion_sidebar).parent().parent().parent().slideToggle();
/* Copiar id de los H, y obtener url actual para crear un nuevo link*/
$('.documentacion-post').on('click', '.button-copy-title',function() {
var id = $(this).parent().attr('id');
var input_aux = document.createElement("input");
var article = window.location.href.split("#")[0] + "#" + id;
input_aux.setAttribute("value", article);
document.body.appendChild(input_aux);
input_aux.select();
document.execCommand("copy");
document.body.removeChild(input_aux);
var add_tooltip = document.createElement('span');
add_tooltip.classList.add('text-copy-success');
$(add_tooltip).text("Se ha copiado correctamente");
$(add_tooltip).appendTo($(this).parent());
setTimeout(function(){
$(".text-copy-success").remove()
}, 2000);
})
/*Creacion de boton copiar codigo en bloques de codigo*/
$('span.button-copy-code').remove();
var button_copy_code = document.createElement('span');
button_copy_code.classList.add('button-copy-code');
$('.documentacion-post pre').prepend($(button_copy_code));
/* Copiar contenido de Code */
$(".button-copy-code").click(function(){
var codigo = $(this).parent().text();
var input_aux = document.createElement("input");
input_aux.setAttribute("value", codigo);
document.body.appendChild(input_aux);
input_aux.select();
document.execCommand("copy");
document.body.removeChild(input_aux);
$(this).before("<span class='code-copy-success'>Se copio correctamente el codigo</span>");
setTimeout(function(){
$(".code-copy-success").remove()
}, 2000);
})
/*Se verifica si los H tienen id, en caso de tener se crear el boton de crear nuevo link 'button-copy-title'*/
$(document).ready(function(){
$(".documentacion-post article h1, .documentacion-post article h2, .documentacion-post article h3, .documentacion-post article h4, .documentacion-post article h5, .documentacion-post article h6").each(function(){
if($(this).attr('id') != null){
//$(this).children().remove()
$(this).append('<i class = "button-copy-title icon-link" data-placement = "bottom"></i>');
}
});
});
/*Autocomplete del input con busqueda en el titulo y contenido de cada articulo*/
$( "#title_article" ).autocomplete({
source: function( request, response ) {
$.ajax( {
url: {% if staff_post or is_post_article_staff %}"{% url 'autocomplete_documentacion_staff' %}", {% else %}"{% url 'autocomplete_documentacion' %}",{% endif %}
dataType: "json",
data: {
term: request.term,
},
success: function( data ) {
response( data );
}
});
},
minLength: 0
}).autocomplete( "instance" )._renderItem = function( ul, item ) {
return $( "<li>" )
.append( "<div class='results_search'><a href='"+ item.url + "'>" + item.label + "</a></div>" )
.appendTo( ul );
};
</script>
<script>hljs.initHighlightingOnLoad();</script>
</div>
</section>
{% endblock %}