<div class="row blog-page blog-item">
    <!--/col-md-2-->

<?php if($model->activo == 1){?>
    <div class="blog col-md-9">
        <h2><a href="javascript:void(0);"><?php echo $model->encuesta; ?></a></h2>               
            
        <div id="chartdiv" style="width: 100%; height: 600px;">
        </div>

        <div id="chartPie" class="hidden" style="width: 100%; height: 750px;">
        </div>

        <div id="mapdiv"  class="hidden" style="width: 100%; height: 750px;">
        </div>

        <input type="hidden" id="tbl_encuesta" value="<?php echo $model->tabla; ?>">

        <div class="row" id="chartAxis">
            <div class="col-md-6">
                <div id="DropTargetX" class="DropTarget">
                    <h1 style="margin-top:60px">Arrastre aqu&iacute; el eje X</h1>
                </div> 
                <input type="hidden" id="ejex" value="" />
            </div>
            <div class="col-md-6">
                <div class="DropTarget ui-droppable" id="DropTargetY">
                    <h1 style="margin-top:60px">Arrastre aqu&iacute; el eje Y</h1>
                    <div id="axis_y">
                        
                    </div>
                </div>

                <div id="hidden_inputs"></div>
            </div>
        </div>

        <div class="row hidden" id="mapAxis">
            <div class="col-md-6">
                <div class="DropTarget">
                    <p>Eje X</p><p class="DragWord">Ubicacion</p>
                    <select class="form-control" name="" id="map_select_ejex" > 
                        <option value="">Agrupar</option>
                    </select>
                </div> 
                <input type="hidden" id="mapejex" value="estado" />
            </div>
            <div class="col-md-6">
                <div class="DropTarget ui-droppable" id="map_DropTargetY">
                   <h1>Arrastre aquí el eje Y</h1>
                </div>
                <input type="hidden" id="mapejey" value="" />
            </div>
        </div>

        <div class="row hidden" id="pieAxis">
            <div class="col-md-12">
                <div class="DropTarget ui-droppable" id="pieDropTarget" style="height: 80px !important;">
                   <h1>Arrastre aquí el campo a graficar</h1>
                </div>
                <input type="hidden" id="piefield" value="" />
            </div>
        </div>

        <div class="margin-bottom-30"></div>
    </div><!--/col-md-10-->

    <div class="col-md-3 magazine-page">
        <div class="headline"><h2>Información</h2></div>

        <div id="accordion-2" class="panel-group acc-v1">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a href="#collapse-1" data-parent="#accordion-1" data-toggle="collapse" class="accordion-toggle collapsed">
                            Metadatos
                        </a>
                    </h4>
                </div>
                <div class="panel-collapse collapse" id="collapse-1">
                    <div class="panel-body">
                        <a href="<?php echo $this->createUrl('metadatos',array('id'=>$model->id_encuesta_base)) ?>" class="pop_iframe btn-block btn-u btn-u-red"><i class="fa fa-info-circle"></i> Ver Metadatos </a>
                        <div style="margin: 10px"></div>
                        <?php 
                            if($libro_codigos != ''){
                                echo '<a href="'.Yii::app()->getBaseUrl(true).'/archivos/'.$libro_codigos.'" class="pop_iframe" target="_blank"><i class="fa fa-search"></i> Ver Libro de Códigos </a>';
                            }
                        ?>
                    </div>
                </div>
            </div>

            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a href="#collapse-3" data-parent="#accordion-1" data-toggle="collapse" class="accordion-toggle collapsed">
                            Tabla
                        </a>
                    </h4>
                </div>
                <div class="panel-collapse collapse" id="collapse-3">
                    <div class="panel-body">
                        <a href="<?php echo $this->createUrl('encuesta',array('id'=>$model->id_encuesta_base)) ?>" target="_blank" class="btn-block btn-u btn-u-red "><i class="fa fa-table"></i> Ver Tabla </a>
                    </div>
                </div>
            </div>

            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a href="#collapse-2" data-parent="#accordion-1" data-toggle="collapse" class="accordion-toggle">
                            Graficar
                        </a>
                    </h4>
                </div>
                <div class="panel-collapse collapse in" id="collapse-2">
                    <div class="panel-body" style='max-height: 300px; overflow: scroll;'>
                        <hr style="margin: 10px 0 !important;">
                        <?php
                        $band_edo = 0;
                        $lat_lng_edo =0;
                        if(!empty($modelEnc)){
                            echo '<ul id="DragWordList" class="list-unstyled">';
                            
                            foreach ($modelEnc as $encabezado) {
                                echo '<li class="DragWord" title="'.$encabezado['descripcion'].'" id="'.$encabezado['encabezado'].'">'.$encabezado['nombre_corto'].'</li>';
                                
                                //print_r($encabezado);
                                //Condicion para mostrar mostrar la opcion de grafica en mapa
                                if(strcasecmp($encabezado['encabezado'],'longitude') == 0){
                                    $band_edo = 1;
                                }
                                if(strcasecmp($encabezado['encabezado'],'estado') == 0){
                                    $lat_lng_edo = 1;
                                }
                            }

                            echo '</ul>';
                        }
                        ?>
                    </div>
                </div>
            </div>
        </div>

        <form class="sky-form">
            <fieldset>
                <section>
                    <label class="label">Tipo de gr&aacute;fica</label>
                    <label class="radio">
                        <input type="radio" name="radio" value="barras" onclick="setType(this.value);" checked><i class="rounded-x"></i> Gr&aacute;fica de barras
                    </label>
                    <label class="radio">
                        <input type="radio" name="radio" value="lineas" onclick="setType(this.value);"><i class="rounded-x"></i> Gr&aacute;fica de líneas
                    </label>
                    <label class="radio">
                        <input type="radio" name="radio" value="curvas" onclick="setType(this.value);"><i class="rounded-x"></i> Gr&aacute;fica de curvas
                    </label>
                    <label class="radio">
                        <input type="radio" name="radio" value="pie" onclick="setType(this.value);"><i class="rounded-x"></i> Gr&aacute;fica de pie
                    </label>
                    <?php 

                        if($band_edo == 1){
                            echo '<label class="radio"> <input type="radio" name="radio" value="mapa" onclick="setType(this.value);"><i class="rounded-x"></i> Gr&aacute;ficar en mapa </label>';
                        }

                        if($lat_lng_edo == 1){
                            echo '<label class="radio"> <input type="radio" name="radio" value="mapa" onclick="setType(this.value);"><i class="rounded-x"></i> Gr&aacute;ficar en mapa </label>';
                        }

                    ?>
                    <!--label class="radio">
                        <input type="radio" name="radio" value="mapa" onclick="setType(this.value);"><i class="rounded-x"></i> Gr&aacute;ficar en mapa
                    </label-->
                </section>
            </fieldset>
        </form>

    </div>
<?php }else{ ?>
				La gr&aacute;fica no se encuentra disponible.
<?php } ?> 
</div>