{"id":127,"date":"2020-12-09T11:34:48","date_gmt":"2020-12-09T11:34:48","guid":{"rendered":"https:\/\/specnext.dev\/es\/?p=127"},"modified":"2020-12-25T11:28:13","modified_gmt":"2020-12-25T11:28:13","slug":"tilemaps-por-hardware-tutorial-3","status":"publish","type":"post","link":"https:\/\/specnext.dev\/es\/2020\/12\/09\/tilemaps-por-hardware-tutorial-3\/","title":{"rendered":"TileMaps por Hardware  &#8211; Tutorial 3"},"content":{"rendered":"<div>\n<div class=\"block-editor-block-list__layout is-root-container\">\n<h5>Este es un extracto del art\u00edculo originariamente publicado en mi web <a href=\"https:\/\/lacavernainformatica.com\">lacavernainformatica.com<\/a><\/h5>\n<p id=\"block-3d979266-91ca-4add-87f3-879607f96b23\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"3d979266-91ca-4add-87f3-879607f96b23\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Una vez entendido el funcionamiento de los Sprites, vamos a abordar el uso de TileMaps, pero empecemos por el principio.<\/p>\n<p id=\"block-62d755f2-8fb2-4bfb-ad1b-86772816ede9\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"62d755f2-8fb2-4bfb-ad1b-86772816ede9\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Un TileMap no es mas que un conjunto de datos que nos permite posicionar de una manera predeterminada nuestros gr\u00e1ficos, (Tiles o baldosas), en nuestra pantalla.<\/p>\n<p id=\"block-f10b6f80-55e1-4060-b203-2a7d38eeca47\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"f10b6f80-55e1-4060-b203-2a7d38eeca47\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Como veis, el enfoque es parecido al de los Sprites, pero un poco distinto. Para empezar los gr\u00e1ficos usados para configurar nuestro TileMap no disponen de m\u00e9todos para calcular colisiones, ni movimientos autom\u00e1ticos como en el caso de los Sprites, ya que no tiene sentido.<\/p>\n<p id=\"block-1c4aead8-b5f6-47ff-81c9-83e35a2483d4\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"1c4aead8-b5f6-47ff-81c9-83e35a2483d4\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Entonces para resumir, un TileMap no es mas que una forma de pintar gr\u00e1ficos en posiciones ya predefinidas de antemano. Pero claro ahora viene la pregunta del mill\u00f3n, \u00bfY c\u00f3mo hago yo un TileMap?<\/p>\n<p id=\"block-30ee9979-5d90-47f0-bbf8-5e06e5c2157d\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"30ee9979-5d90-47f0-bbf8-5e06e5c2157d\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Pues aqu\u00ed vamos a introducir una herramienta externa al Zx Spectrum Next, que no es otra que la fant\u00e1stica p\u00e1gina de herramientas para el Spectrum de <a href=\"https:\/\/remysharp.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">Remy Sharp<\/a>.<\/p>\n<div class=\"wp-block\" data-align=\"center\">\n<figure id=\"block-0d6fc632-c828-4127-8991-904b6ac1988a\" class=\"wp-block-image is-style-default block-editor-block-list__block size-large\" role=\"group\" aria-label=\"Bloque: Imagen\" data-block=\"0d6fc632-c828-4127-8991-904b6ac1988a\" data-type=\"core\/image\" data-title=\"Imagen\">\n<div class=\"components-resizable-box__container\"><img decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/lacavernainformatica.com\/wp-content\/uploads\/Remy-Sharp-Web.png\" alt=\"Remy Sharp Web\" \/><\/div>\n<div class=\"components-drop-zone\"><\/div>\n<\/figure>\n<\/div>\n<p id=\"block-d932260b-7653-4be1-9a9c-722608472d64\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable has-text-align-center wp-block\" style=\"text-align: center\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"d932260b-7653-4be1-9a9c-722608472d64\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\"><a href=\"https:\/\/zx.remysharp.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/zx.remysharp.com\/<\/a><\/p>\n<p id=\"block-f004cccf-a173-4c04-b686-5fc5ff97031e\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"f004cccf-a173-4c04-b686-5fc5ff97031e\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Desde la misma vamos a poder dise\u00f1ar nuestros Sprites y utilizarlos para conformar nuestros TileMaps.<\/p>\n<p id=\"block-3bfa1b6a-4ba9-434e-b612-69f658915d27\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"3bfa1b6a-4ba9-434e-b612-69f658915d27\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Ojo, como veis se designa Sprite al gr\u00e1fico en si mismo, sea utilizado posteriormente como Sprite propiamente dicho o como un Tile.<\/p>\n<div class=\"wp-block\" style=\"text-align: center\" data-align=\"center\">\n<figure id=\"block-d41f6b79-79c2-4ba6-a8ea-0dd61f535606\" class=\"wp-block-image is-style-default block-editor-block-list__block size-large\" role=\"group\" aria-label=\"Bloque: Imagen\" data-block=\"d41f6b79-79c2-4ba6-a8ea-0dd61f535606\" data-type=\"core\/image\" data-title=\"Imagen\">\n<div class=\"components-resizable-box__container\"><img decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/lacavernainformatica.com\/wp-content\/uploads\/Remy-Sharp-Sprites-Web-1024x680.png\" alt=\"Edici\u00f3n de Sprites Zx Spectrum Next\" \/><\/div><figcaption class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"Escribe la leyenda\u2026\">Editor de Sprites Online<\/figcaption><div class=\"components-drop-zone\"><\/div>\n<\/figure>\n<\/div>\n<p id=\"block-2b0f7f57-07b1-4a24-b00c-1ab651256024\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"2b0f7f57-07b1-4a24-b00c-1ab651256024\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Como podemos ver en la pantalla de arriba el editor nos permite de una forma parecida al editor del Zx Spectrum Next editar los gr\u00e1ficos de nuestros Sprites, aunque de una forma mas c\u00f3moda y con algunas funcionalidades m\u00e1s.<\/p>\n<p id=\"block-20be413b-1864-40a5-a8a1-e94b8df6bb7f\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"20be413b-1864-40a5-a8a1-e94b8df6bb7f\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Una vez que tengamos nuestros gr\u00e1ficos podremos posicionarlos a nuestro gusto con el editor de Tile Map, definiendo las dimensiones del mismo y la posici\u00f3n de cada uno de los gr\u00e1ficos definidos anteriormente.<\/p>\n<div class=\"wp-block\" data-align=\"center\">\n<figure id=\"block-e2d894a0-e43d-4f0c-b1a7-e327913b7c55\" class=\"wp-block-image is-style-default block-editor-block-list__block size-large\" role=\"group\" aria-label=\"Bloque: Imagen\" data-block=\"e2d894a0-e43d-4f0c-b1a7-e327913b7c55\" data-type=\"core\/image\" data-title=\"Imagen\">\n<div class=\"components-resizable-box__container\"><img decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/lacavernainformatica.com\/wp-content\/uploads\/Remy-Sharp-Web-TileMaps-1024x540.png\" alt=\"Remy Sharp Web TileMaps\" \/><\/div><figcaption class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"Escribe la leyenda\u2026\">Definimos las posiciones de nuestros Sprites y las dimensiones de nuestro TileMap<\/figcaption><div class=\"components-drop-zone\"><\/div>\n<\/figure>\n<\/div>\n<p id=\"block-489043af-7738-4483-b4bd-871c59c5b313\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"489043af-7738-4483-b4bd-871c59c5b313\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">De todas formas y como siempre me gusta hacer, ten\u00e9is aqu\u00ed un v\u00eddeo donde explico de manera interactiva el funcionamiento de las herramientas de <a href=\"https:\/\/remysharp.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">Remy Sharp<\/a> del siguiente juego donde pondremos en pr\u00e1ctica el uso de Tile Maps<\/p>\n<div id=\"block-beeaaddf-2441-4a32-9e52-28971c3c0d8e\" class=\"block-editor-block-list__block wp-block wp-block\" role=\"group\" aria-label=\"Bloque: YouTube\" data-block=\"beeaaddf-2441-4a32-9e52-28971c3c0d8e\" data-type=\"core-embed\/youtube\" data-title=\"YouTube\">\n<figure class=\"wp-embed-aspect-16-9 wp-has-aspect-ratio wp-block-embed-youtube wp-block-embed is-type-video\">\n<div class=\"wp-block-embed__wrapper\">\n<div class=\"block-library-embed__interactive-overlay\">\n<p><iframe loading=\"lazy\" title=\"NextBasic  - Zx Spectrum Next -  TileMap Hardware  - Tutorial 3\" width=\"800\" height=\"450\" src=\"https:\/\/www.youtube.com\/embed\/effA8sl97Ww?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe><\/p>\n<\/div>\n<\/div>\n<\/figure>\n<\/div>\n<p id=\"block-a069a50b-97a2-43e6-97b1-7e650c624587\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"a069a50b-97a2-43e6-97b1-7e650c624587\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Bueno daremos por hecho que ya tenemos nuestros Tile Maps listos, con nuestros Sprites y todo necesario para poder empezar a incluirlo en nuestro c\u00f3digo.<\/p>\n<p id=\"block-f47a3f71-e0e7-4fc4-b954-716745ff6f1f\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"f47a3f71-e0e7-4fc4-b954-716745ff6f1f\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Por su puesto, como en todos los tutoriales, nos apoyaremos para las explicaciones en un juego, en este caso el Snake in Basic \ud83d\ude09<\/p>\n<div class=\"wp-block\" style=\"text-align: center\" data-align=\"center\">\n<figure id=\"block-b1d083c7-c33d-4624-8471-80853bea0c4a\" class=\"wp-block-image is-style-default block-editor-block-list__block size-large\" role=\"group\" aria-label=\"Bloque: Imagen\" data-block=\"b1d083c7-c33d-4624-8471-80853bea0c4a\" data-type=\"core\/image\" data-title=\"Imagen\">\n<div class=\"components-resizable-box__container\"><img decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/lacavernainformatica.com\/wp-content\/uploads\/Snake_In_Basic_Menu.png\" alt=\"Snake_In_Basic_Menu\" \/><\/div><figcaption class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"Escribe la leyenda\u2026\">Pantalla de Men\u00fa de Snake in Basic<\/figcaption><div class=\"components-drop-zone\"><\/div>\n<\/figure>\n<\/div>\n<p id=\"block-998d90e3-69a6-436f-8587-aa7ee1408441\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"998d90e3-69a6-436f-8587-aa7ee1408441\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">En Snape in Basic, hemos usado tres Tile Maps.<\/p>\n<p id=\"block-30810938-0f22-4500-b302-e0c1cd9c744d\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"30810938-0f22-4500-b302-e0c1cd9c744d\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Uno para el men\u00fa de inicio, otro para decorar el escenario de nuestro juego y el \u00faltimo para la pantalla de finalizaci\u00f3n de partida.<\/p>\n<p id=\"block-c06befb0-0b69-4675-a9fb-a96ca496475e\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"c06befb0-0b69-4675-a9fb-a96ca496475e\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Al igual que en la definici\u00f3n de bancos de Sprites, tendremos que definir nuestro banco de memoria para almacenar nuestro TileMap.<\/p>\n<pre id=\"block-8fe581f1-3c84-4d2c-a65a-1376c1e8442e\" class=\"wp-block-code block-editor-block-list__block wp-block wp-block\" role=\"group\" aria-label=\"Bloque: C\u00f3digo\" data-block=\"8fe581f1-3c84-4d2c-a65a-1376c1e8442e\" data-type=\"core\/code\" data-title=\"C\u00f3digo\"><code class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"C\u00f3digo\">870 REM Aqui el meollo del asunto de los tiles. Cargamos el conjunto de sprites que usamos en el Mapa de Sprites\/Tiles.<br data-rich-text-line-break=\"true\" \/>880 LOAD \"TILES.SPR\" BANK 17: LOAD \"TILES.MAP\" BANK 18: TILE BANK 17<\/code><\/pre>\n<p id=\"block-794aa449-0344-4e63-b04f-51e9f7b88617\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"794aa449-0344-4e63-b04f-51e9f7b88617\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Como veis realizamos dos cargas. Una de los Sprites que van a estar vinculados a nuestro TileMap y por otro lado el TileMap propiamente dicho.<\/p>\n<p id=\"block-79758a0a-8955-43d8-aaf0-cc95a2d8dfa8\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"79758a0a-8955-43d8-aaf0-cc95a2d8dfa8\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Ahora definimos las dimensiones que vamos a usar en nuestro TileMap.<\/p>\n<pre id=\"block-21190943-7637-4e91-bbe9-0abcfe85eedb\" class=\"wp-block-code block-editor-block-list__block wp-block wp-block\" role=\"group\" aria-label=\"Bloque: C\u00f3digo\" data-block=\"21190943-7637-4e91-bbe9-0abcfe85eedb\" data-type=\"core\/code\" data-title=\"C\u00f3digo\"><code class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"C\u00f3digo\">890 REM Aqui le indicamos las dimensiones de Mapa de Tiles. En este caso la pantalla completa<br data-rich-text-line-break=\"true\" \/>900 TILE DIM 18,0,16,16<br data-rich-text-line-break=\"true\" \/>910 REM posicionamos x elementos en la posicion de filas y columnas definidas<br data-rich-text-line-break=\"true\" \/>920 TILE 16,12<\/code><\/pre>\n<p id=\"block-c0a95191-c827-42f2-805b-d90ed5ef2dc8\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"c0a95191-c827-42f2-805b-d90ed5ef2dc8\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Si analizamos el comando.<\/p>\n<pre id=\"block-9904b425-cf2c-428a-95c1-fbcb6823f31a\" class=\"wp-block-code block-editor-block-list__block wp-block wp-block\" role=\"group\" aria-label=\"Bloque: C\u00f3digo\" data-block=\"9904b425-cf2c-428a-95c1-fbcb6823f31a\" data-type=\"core\/code\" data-title=\"C\u00f3digo\"><code class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"C\u00f3digo\">TILE DIM n,offset,w,tilesize<br data-rich-text-line-break=\"true\" \/>Define bank n as containing the tilemap, starting at offset offset in the bank.<br data-rich-text-line-break=\"true\" \/>The tilemap is width w (1-2048) and uses 8x8 (tilesize=8) or 16x16 (tilesize=16)<br data-rich-text-line-break=\"true\" \/>tiles.<\/code><\/pre>\n<div class=\"wp-block\" style=\"text-align: center\" data-align=\"center\">\n<figure id=\"block-113a3019-2cc7-4936-8e7b-827d20ebc3b7\" class=\"wp-block-image is-style-default block-editor-block-list__block size-large\" role=\"group\" aria-label=\"Bloque: Imagen\" data-block=\"113a3019-2cc7-4936-8e7b-827d20ebc3b7\" data-type=\"core\/image\" data-title=\"Imagen\">\n<div class=\"components-resizable-box__container\"><img decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/lacavernainformatica.com\/wp-content\/uploads\/Snake_In_Game.png\" alt=\"Snake in Basic Game\" \/><\/div><figcaption class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"Escribe la leyenda\u2026\">Pantalla de juego de Snake in Basic<\/figcaption><div class=\"components-drop-zone\"><\/div>\n<\/figure>\n<\/div>\n<p id=\"block-958aa7d7-13ca-4dc8-9c8d-85041a03fd7c\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"958aa7d7-13ca-4dc8-9c8d-85041a03fd7c\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Luego simplemente le decimos que pinte la pantalla completa, nada de una porci\u00f3n.<\/p>\n<pre id=\"block-bbb7c464-0e24-462a-b972-d5f8bac11463\" class=\"wp-block-code block-editor-block-list__block wp-block wp-block\" role=\"group\" aria-label=\"Bloque: C\u00f3digo\" data-block=\"bbb7c464-0e24-462a-b972-d5f8bac11463\" data-type=\"core\/code\" data-title=\"C\u00f3digo\"><code class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"C\u00f3digo\">TILE w,h <- TILE 16,12<br data-rich-text-line-break=\"true\" \/>TILE w,h AT x,y<br data-rich-text-line-break=\"true\" \/>TILE w,h TO x2,y2<br data-rich-text-line-break=\"true\" \/>TILE w,h AT x,y TO x2,y2<br data-rich-text-line-break=\"true\" \/>Draw section of screen from tilemap.<br data-rich-text-line-break=\"true\" \/>Number of tiles to draw is width w, height h.<br data-rich-text-line-break=\"true\" \/>Draw from tile offset x,y in the tilemap (or 0,0 if not specified).<br data-rich-text-line-break=\"true\" \/>Draw to tile offset x2,y2 on the screen (or 0,0 if not specified).<\/code><\/pre>\n<p id=\"block-42540cf4-fadc-4339-8001-2a865f3cfda9\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"42540cf4-fadc-4339-8001-2a865f3cfda9\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Aqu\u00ed ten\u00e9is otro ejemplo de la carga para el fondo del juego en si mismo.<\/p>\n<pre id=\"block-51a3307b-050b-4c06-bef1-2f44913e6e9e\" class=\"wp-block-code block-editor-block-list__block wp-block wp-block\" role=\"group\" aria-label=\"Bloque: C\u00f3digo\" data-block=\"51a3307b-050b-4c06-bef1-2f44913e6e9e\" data-type=\"core\/code\" data-title=\"C\u00f3digo\"><code class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"C\u00f3digo\">980 REM Cargamos los Tiles del fondo del juego en si mismo para cuando volvamos iniciar el juego correctamente<br data-rich-text-line-break=\"true\" \/>990 LOAD \"TILESG.MAP\" BANK 19<br data-rich-text-line-break=\"true\" \/>1000 TILE DIM 19,0,16,16<br data-rich-text-line-break=\"true\" \/>1010 TILE 16,12<\/code><\/pre>\n<p id=\"block-cf9633a3-aed0-4b17-8eaf-c1fa49d05af6\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"cf9633a3-aed0-4b17-8eaf-c1fa49d05af6\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Como veis es bastante sencillo de usar, aunque por su puesto se le pueden dar otros usos aparte de aplicarlo a la construci\u00f3n de un fondo est\u00e1tico.<\/p>\n<div class=\"wp-block\" style=\"text-align: center\" data-align=\"center\">\n<figure id=\"block-ce4061d2-a3cb-47e8-a202-3738d7d94484\" class=\"wp-block-image is-style-default block-editor-block-list__block size-large\" role=\"group\" aria-label=\"Bloque: Imagen\" data-block=\"ce4061d2-a3cb-47e8-a202-3738d7d94484\" data-type=\"core\/image\" data-title=\"Imagen\">\n<div class=\"components-resizable-box__container\"><img decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/lacavernainformatica.com\/wp-content\/uploads\/Snake_GameOver.png\" alt=\"Snale in Basic Game Over\" \/><\/div><figcaption class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"Escribe la leyenda\u2026\">Pantalla de Game Over de Snake in Basic<\/figcaption><div class=\"components-drop-zone\"><\/div>\n<\/figure>\n<\/div>\n<p id=\"block-084b2936-408d-4780-aa1b-840c0c07b3e6\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"084b2936-408d-4780-aa1b-840c0c07b3e6\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Como es m\u00e1xima en mis tutoriales, no nos quedaremos solo en el uso general de comandos, sino que ya de camino, analizaremos el c\u00f3digo completo para poder avanzar tambi\u00e9n en otras cuestiones mas enfocadas en como pensar las cosas y resolver lo problemas que nos vamos encontrando.<\/p>\n<p id=\"block-e4c06ad5-b76a-460a-9ba6-0050bfd614a7\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"e4c06ad5-b76a-460a-9ba6-0050bfd614a7\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">\u00a1Ojo, que seguro que existe una mejor implementaci\u00f3n que la m\u00eda! \ud83d\ude42<\/p>\n<p id=\"block-b032c331-762f-4918-9dfe-1ea7bd051fe4\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"b032c331-762f-4918-9dfe-1ea7bd051fe4\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Como siempre, ten\u00e9is el c\u00f3digo completo a vuestra disposici\u00f3n en:<\/p>\n<p id=\"block-f068d2de-ee53-4034-ab39-cdbcf00a42a2\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"f068d2de-ee53-4034-ab39-cdbcf00a42a2\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\"><a href=\"https:\/\/github.com\/Nextric\/Snake-in-Basic\">https:\/\/github.com\/Nextric\/Snake-in-Basic<\/a><\/p>\n<p id=\"block-3cbd56b2-cd4e-4ec5-a26e-5e13e12190fe\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"3cbd56b2-cd4e-4ec5-a26e-5e13e12190fe\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Pues entrado en detalles, como hab\u00e9is podido ver, estamos hablando del cl\u00e1sico juego de la serpiente que tan popular se hizo con su inclusi\u00f3n en los Nokia 6110 y posteriores.<\/p>\n<p id=\"block-7c94f79d-7f44-45e4-a930-faeaf4dff6c7\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"7c94f79d-7f44-45e4-a930-faeaf4dff6c7\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Aqu\u00ed hemos tenido que abordar principalmente el algoritmo para calcular los movimientos de la cola conforme nos vamos haciendo mas grandes.<\/p>\n<p id=\"block-c3a9cec9-1a7e-4b18-96d9-aee2dd3869ed\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"c3a9cec9-1a7e-4b18-96d9-aee2dd3869ed\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Si bien, inicialmente intent\u00e9 realizar dichos c\u00e1lculos con animaci\u00f3n autom\u00e1tica, resultaba muy complicado, por lo que opt\u00e9 por controlar manualmente los desplazamiento de las distintas partes de la serpiente.<\/p>\n<p id=\"block-9d286d36-e127-4984-a71a-15e13278563d\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"9d286d36-e127-4984-a71a-15e13278563d\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">En resumen, la idea es que cada vez que movemos el bicho, la cola de la serpiente revise en que posici\u00f3n ha estado su predecesor. Si solo tenemos un elemento en la cola, pues le preguntar\u00edamos a la la cabeza de la misma y sino fuera as\u00ed al elemento de la cola que viene delante.<\/p>\n<pre id=\"block-a78b5aac-2a84-4c7e-858b-d4adb4317ddd\" class=\"wp-block-code block-editor-block-list__block wp-block wp-block\" role=\"group\" aria-label=\"Bloque: C\u00f3digo\" data-block=\"a78b5aac-2a84-4c7e-858b-d4adb4317ddd\" data-type=\"core\/code\" data-title=\"C\u00f3digo\"><code class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"C\u00f3digo\">630 REM Aqui tenemos el nucleo gordo del programa, tenemos que recorrer la cola para recoger la posicion del elemento anterior a el y actualizar su posicion<br data-rich-text-line-break=\"true\" \/>640 FOR v=longserp TO 0 STEP -1<br data-rich-text-line-break=\"true\" \/>650 IF longserp > v THEN LET %p=v+10: LET x=% SPRITE AT (p,0): LET y=% SPRITE AT (p,1): SPRITE v+11,x,y,5,1<br data-rich-text-line-break=\"true\" \/>660 NEXT v<\/code><\/pre>\n<p id=\"block-1e6d395f-5785-4fa2-b461-1a1c3a622e28\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"1e6d395f-5785-4fa2-b461-1a1c3a622e28\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Como vemos, no nos queda otra que desplazarnos por todos los elementos que tenga la serpiente, de ah\u00ed la ralentizaci\u00f3n que se produce en cierto niveles del juego y que hemos paliado aumentado la frecuencia del reloj del Next y haci\u00e9ndolo pasar por una especie de bonus.<\/p>\n<pre id=\"block-c9216cdd-941b-4f02-851d-1ddd6f76ceaf\" class=\"wp-block-code block-editor-block-list__block wp-block wp-block\" role=\"group\" aria-label=\"Bloque: C\u00f3digo\" data-block=\"c9216cdd-941b-4f02-851d-1ddd6f76ceaf\" data-type=\"core\/code\" data-title=\"C\u00f3digo\"><code class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"C\u00f3digo\">550 REM Aqui cambiamos la velocidad del procesador en funcion de la longitud de la serpiente, para evitar que se ralentice y darle un poco mas de vidilla. Ademas ponemos sonido de bonus especial<br data-rich-text-line-break=\"true\" \/>560 IF longserp=6 THEN DRIVER 49,2,10: RUN AT 2<br data-rich-text-line-break=\"true\" \/>570 IF longserp=30 THEN DRIVER 49,2,10: RUN AT 3<\/code><\/pre>\n<p id=\"block-dec88ff3-a6d6-4771-bcab-1d645961c9fa\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"dec88ff3-a6d6-4771-bcab-1d645961c9fa\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Tambi\u00e9n veis el uso de un Driver de Sonido (ayfx.drv), que hemos usado para dotar de efectos de una forma sencilla a nuestro juego y que pod\u00e9is ver tambi\u00e9n en la p\u00e1gina de Remy Sharp.<\/p>\n<p id=\"block-f8772d35-0368-46a1-9789-404b84c346b8\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"f8772d35-0368-46a1-9789-404b84c346b8\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">El tema del uso del PEEK 64000 es solo para poder ejecutar numerosas veces el juego mientras que se estaba realizando su desarrollo y que no fallara indicando que el driver ya estaba instalado.<\/p>\n<pre id=\"block-4628cf5c-b77c-4ffa-8868-76165f348424\" class=\"wp-block-code block-editor-block-list__block wp-block wp-block\" role=\"group\" aria-label=\"Bloque: C\u00f3digo\" data-block=\"4628cf5c-b77c-4ffa-8868-76165f348424\" data-type=\"core\/code\" data-title=\"C\u00f3digo\"><code class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"C\u00f3digo\">40 REM leemos de la posicion memoria 64000 para ver si yatenemos intalado el driver<br data-rich-text-line-break=\"true\" \/>50 driverok= PEEK 64000<br data-rich-text-line-break=\"true\" \/>60 REM Si ya lo hemos cargado lo desinstalamos para volvelo a instalar.De esta forma estamos seguros de que no lo llamados estando instalado y salimos en error al realizar varias ejecuciones<br data-rich-text-line-break=\"true\" \/>70 IF driverok=1 THEN .uninstall \"ayfx.drv\": REM PRINT \"uninstall driver\"<br data-rich-text-line-break=\"true\" \/>80 .install \"ayfx.drv\"<br data-rich-text-line-break=\"true\" \/>90 REM Si hemos llegado aqui marcamos driver como instalado<br data-rich-text-line-break=\"true\" \/>100 POKE 64000,1<br data-rich-text-line-break=\"true\" \/>110 REM Cargamos el banco de sonidos<br data-rich-text-line-break=\"true\" \/>120 LOAD \"sounds.afb\" BANK 20<\/code><\/pre>\n<p id=\"block-b002f82a-1098-4fd7-a2cf-a626fda50d6c\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"b002f82a-1098-4fd7-a2cf-a626fda50d6c\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Vamos a comentar dos cosas m\u00e1s antes de dejaros con el v\u00eddeo explicativo.<\/p>\n<p id=\"block-7f9329c5-9f37-4694-99e9-ba1d1cacbe34\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"7f9329c5-9f37-4694-99e9-ba1d1cacbe34\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Una de ellas es la variaci\u00f3n del Sprite de la serpiente en base a la direcci\u00f3n que llevemos.<\/p>\n<pre id=\"block-1e4277c2-6be2-472a-9ddc-9f592f2138c6\" class=\"wp-block-code block-editor-block-list__block wp-block wp-block\" role=\"group\" aria-label=\"Bloque: C\u00f3digo\" data-block=\"1e4277c2-6be2-472a-9ddc-9f592f2138c6\" data-type=\"core\/code\" data-title=\"C\u00f3digo\"><code class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"C\u00f3digo\">670 REM En funcion de la direccion cambiamos el desplazamiento del sprite asi como la imagen de cada uno para girar la cabeza acorde al cambio de direccion<br data-rich-text-line-break=\"true\" \/>680 IF dirserp=1 THEN SPRITE 10,posx+vel,,0<br data-rich-text-line-break=\"true\" \/>690 IF dirserp=2 THEN SPRITE 10,posx-vel,,1<br data-rich-text-line-break=\"true\" \/>700 IF dirserp=4 THEN SPRITE 10, ,posy+vel,3<br data-rich-text-line-break=\"true\" \/>710 IF dirserp=3 THEN SPRITE 10, ,posy-vel,2<\/code><\/pre>\n<p id=\"block-8d8566f7-099b-428e-9b59-125db2b8d79a\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"8d8566f7-099b-428e-9b59-125db2b8d79a\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Tambi\u00e9n usamos esto para no dejar moverse a nuestra serpiente en direcci\u00f3n contraria al avance en la subrutina de entrada de teclado.<\/p>\n<p id=\"block-c031e0a1-6989-49b8-939c-3256250e8b24\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"c031e0a1-6989-49b8-939c-3256250e8b24\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Y por otro lado el c\u00e1lculo que hay que aplicar a la puntuaci\u00f3n para poder representarla mediante el uso de Sprites num\u00e9ricos. Esto tambi\u00e9n ha sido debido al uso del borde como espacio de juego, ya que en el mismo no podemos imprimir texto, solo Sprites.<\/p>\n<pre id=\"block-abcabf43-ef9a-49e9-b7f9-7e514ba21c0a\" class=\"wp-block-code block-editor-block-list__block wp-block wp-block\" role=\"group\" aria-label=\"Bloque: C\u00f3digo\" data-block=\"abcabf43-ef9a-49e9-b7f9-7e514ba21c0a\" data-type=\"core\/code\" data-title=\"C\u00f3digo\"><code class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"C\u00f3digo\">1040 REM gestion de los puntos<br data-rich-text-line-break=\"true\" \/>1050 REM tenemos que usar un bank de sprites para los numeros en la zona del border no valen los Tiles<br data-rich-text-line-break=\"true\" \/>1060 REM simplement ajustamos la operacion resto sumando 6 para que coincida con el valor relativo del sprite<br data-rich-text-line-break=\"true\" \/>1070 %s=score<br data-rich-text-line-break=\"true\" \/>1080 SPRITE 3,180,16,%s MOD 10+6,1: %s=%s\/10: SPRITE 2,164,16,%s MOD 10+6,1:%s=%s\/10: SPRITE 1,148,16,%s MOD 10+6,1:%s=%s\/10: SPRITE 0,132,16,%s MOD 10+6,1<\/code><\/pre>\n<p id=\"block-4bd69990-35ef-4f34-896d-444bef5d56ac\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"4bd69990-35ef-4f34-896d-444bef5d56ac\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Simplemente vamos qued\u00e1ndonos con las cifras del n\u00famero al aplicar el MOD 10, y luego para no tratar de nuevo ese d\u00edgito lo dividimos por 10. El sumar 6 elementos, es simplemente para que coincida con la posici\u00f3n donde se encuentran los Sprites de los n\u00fameros.<\/p>\n<div class=\"wp-block\" style=\"text-align: center\" data-align=\"center\">\n<figure id=\"block-667aa576-a20e-4ea5-a04b-c8dd1e094f7b\" class=\"wp-block-image is-style-default block-editor-block-list__block is-resized size-large\" role=\"group\" aria-label=\"Bloque: Imagen\" data-block=\"667aa576-a20e-4ea5-a04b-c8dd1e094f7b\" data-type=\"core\/image\" data-title=\"Imagen\">\n<div class=\"components-resizable-box__container\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/lacavernainformatica.com\/wp-content\/uploads\/Srites_Snake_In_Basic.png\" alt=\"Sprites usados en Snake In Basic para el Zx Spectrum Next\" width=\"166\" height=\"237\" \/><\/div><figcaption class=\"rich-text block-editor-rich-text__editable\" role=\"textbox\" aria-label=\"Escribe la leyenda\u2026\">Como vemos el 0 es el Sprite n\u00famero 6<\/figcaption><div class=\"components-drop-zone\"><\/div>\n<\/figure>\n<\/div>\n<p id=\"block-6dd2e325-39d0-40c1-b10b-6baef8d2404e\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"6dd2e325-39d0-40c1-b10b-6baef8d2404e\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">Y aunque sea solo por nombrarlas, tambi\u00e9n se ha tenido que gestionar la creaci\u00f3n aleatoria de las manzanas teniendo en cuenta que no puede aparecer en un lugar ocupado por la serpiente, os aseguro que cundo crece suele coincidir bastante, jajaja.<\/p>\n<p class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"6dd2e325-39d0-40c1-b10b-6baef8d2404e\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">As\u00ed que ya con ciertas nociones claras y como una imagen vale mas que mil palabras, aqu\u00ed os dejo el v\u00eddeo analizando el c\u00f3digo del juego en su totalidad.<\/p>\n<div id=\"block-7279255b-46b8-4d35-9b3e-514319b18233\" class=\"block-editor-block-list__block\" role=\"group\" aria-label=\"Bloque: YouTube\" data-align=\"center\" data-block=\"7279255b-46b8-4d35-9b3e-514319b18233\" data-type=\"core-embed\/youtube\" data-title=\"YouTube\">\n<div class=\"wp-block\" data-align=\"center\">\n<figure class=\"wp-embed-aspect-16-9 wp-has-aspect-ratio wp-block-embed-youtube wp-block-embed is-type-video\">\n<div class=\"wp-block-embed__wrapper\">\n<div class=\"block-library-embed__interactive-overlay\">\n<p><iframe loading=\"lazy\" title=\"NextBasic  - Zx Spectrum Next -  TileMap Hardware  - Tutorial 4\" width=\"800\" height=\"450\" src=\"https:\/\/www.youtube.com\/embed\/36pZVF42wWI?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe><\/p>\n<\/div>\n<\/div>\n<\/figure>\n<\/div>\n<\/div>\n<p id=\"block-53aa729a-3a7d-4937-9a58-709a7bb5170e\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"53aa729a-3a7d-4937-9a58-709a7bb5170e\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">\u00a1Espero que con esta aproximaci\u00f3n quede claro como usar los TileMaps en vuestros desarrollos!<\/p>\n<p id=\"block-71ec6b13-71d9-41f7-bf44-949d675ee286\" class=\"block-editor-block-list__block wp-block rich-text block-editor-rich-text__editable wp-block\" role=\"textbox\" aria-label=\"Bloque de p\u00e1rrafo\" data-block=\"71ec6b13-71d9-41f7-bf44-949d675ee286\" data-type=\"core\/paragraph\" data-title=\"P\u00e1rrafo\">\u00a1Para la pr\u00f3xima entrada veremos otro uso mol\u00f3n de los TileMaps en un nuevo juego!<\/p>\n<div class=\"block-list-appender\"><\/div>\n<\/div>\n<\/div>\n<div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Este es un extracto del art\u00edculo originariamente publicado en mi web lacavernainformatica.com Una vez entendido el funcionamiento de los Sprites, vamos a abordar el uso de TileMaps, pero empecemos por el principio. Un TileMap no es mas que un conjunto de datos que nos permite posicionar de una manera predeterminada nuestros gr\u00e1ficos, (Tiles o baldosas), [&hellip;]<\/p>\n","protected":false},"author":14,"featured_media":132,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[3,4],"tags":[6],"class_list":["post-127","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-desarrollo","category-nextbasic","tag-nextbasic"],"jetpack_featured_media_url":"https:\/\/specnext.dev\/es\/wp-content\/uploads\/sites\/2\/2020\/12\/DestacadaTutorial3.png","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/specnext.dev\/es\/wp-json\/wp\/v2\/posts\/127","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/specnext.dev\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/specnext.dev\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/specnext.dev\/es\/wp-json\/wp\/v2\/users\/14"}],"replies":[{"embeddable":true,"href":"https:\/\/specnext.dev\/es\/wp-json\/wp\/v2\/comments?post=127"}],"version-history":[{"count":9,"href":"https:\/\/specnext.dev\/es\/wp-json\/wp\/v2\/posts\/127\/revisions"}],"predecessor-version":[{"id":157,"href":"https:\/\/specnext.dev\/es\/wp-json\/wp\/v2\/posts\/127\/revisions\/157"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/specnext.dev\/es\/wp-json\/wp\/v2\/media\/132"}],"wp:attachment":[{"href":"https:\/\/specnext.dev\/es\/wp-json\/wp\/v2\/media?parent=127"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/specnext.dev\/es\/wp-json\/wp\/v2\/categories?post=127"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/specnext.dev\/es\/wp-json\/wp\/v2\/tags?post=127"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}