2. Las fotos no se muestran - mavira21/RESOLUCION-DE-CONFLICTOS GitHub Wiki

Para que podamos ver las fotos de una galería utilizando Processwire con HANNA-CODE hay que tener en cuenta los siguientes elementos:

###1.- Del lado del administrador

####Hanna-code

Debe haber un hanna-code con nombre busca al que asignamos el siguiente código:

<?php

header("Content-type: application/json");

	$request = file_get_contents('php://input');
	$data = json_decode($request,true);
	$query = $data["query"];

	// $selector = wire("sanitizer")->text($selector);
	try {
		$paginas = wire('pages')->find($query)->toJSON();
	} catch (Exception $e) {
		echo ("Comprobar que los campos enviados y los de la BD son del mismo tipo INT, TEXT, DATE...");
	}
		
	echo $paginas; return;

####Configuracion de la plantilla hanna_code

-> En la pestaña basics:

Debe contener el campo hanna_code (que debe ser de tipo textarea y en la pestaña details seleccionar hanna code text formatter) y title

-> En la pestaña URLs:

Disable automatic prepend _init.php y append _main.php

-> En la pestaña Files:

Seleccionar Allow Url segments y HTTP or HTTPS

-> En la pestaña JSON data

No hay que seleccionar ningún campo.

####Web-service

Creamos un hijo de web-service (que a su vez es hijo de home) al que llamamos busca y le asignamos la plantilla hanna-code, y en la pestaña content ponemos [[busca]]

####Configuración del JSon de las dos plantillas (foto y fotos)

En el JSon de ambas hay que decirle que muestre los siguientes campos:

-Url
-Title
-Images

###2.- Del lado del Código en Sublime Text

####Script head de foto.php

<script>
  app.controller('FotoCtrl',function($scope){
      $scope.page=<?php echo $page->toJSON() ?>;
  });
</script>

####Script head de fotos.php

<script>
  app.controller('FotosCtrl',function($scope,$http,pw){
   
    $scope.busca = function(){
    pw.busca('template=foto, title|comentari~='+$scope.termino).then(function(data){
             console.log("ENCONTRADOS",data);
             $scope.encontrados=data;
             $scope.termino='';
      });
    } 
    $scope.buscaFotos= function(fotos){
   
        pw.busca(fotos).then(function(data){
           $scope.encontrados=data;
           console.log("todos",data)
        }); 

    }
      
      $scope.buscaFotos('template=foto,sort=title');
      $scope.page=<?php echo $page->toJSON() ?>;
      console.log("PAGINA", $scope.page);
      
    });

</script>

Y el Html que debe tener en el controlador:

<div ng-controller="FotosCtrl">

                 <div class="tagcloud">
                      <ul class="portfolio-filter center centered">    
                          <li><a href ng-click="buscaFotos('template=foto,sort=title')">2015</a></li>
                      </ul>         
                </div>
            
                 <div class="row portfolio-page">
                      <ul id="portfolio-list" data-animated="fadeIn">               
                          <li ng-repeat="hijo in encontrados" class="portfolio-item bootstrap">
                             <img class="img-responsive animated flipInY" src="{{hijo.images[0].url}}" alt="">
                             <div class="portfolio-item-content">
                                  <span class="header" ng-bind-html="hijo.title | unsafe"></span>
                                  <p class="body">{{hijo.datalletres}}</p>
                             </div>  
                             <a href="{{hijo.url}}"><i class="more">+</i></a>
                          </li><!--/.portfolio-item-->
                      </ul>  
                </div> 
  </div>

####Codigo del archivo factories.js

Debe contener el código siguiente:

angular.module('factories', [])


.factory('pw', function($http, $location) {

	var webService = "http://nano.bitnamiapp.com/miweb/web-service/";

	return {
		busca: function(query){ 
		return $http.post( webService + "busca/", {'query':query} ).then(function(response){
		return response.data;
			});
		},
	}
})

####Revisar la Url del archivo factories.js

Ir al archivo factories.js y, dependiendo del servidor donde tengamos ubicada nuestra web será necesaria una u otra de las siguientes:

	var webService = "http://nano.bitnamiapp.com/miweb/web-service/";


	var webService = "http://"+$location.$$host+"/web-service/";
⚠️ **GitHub.com Fallback** ⚠️