Hay mucho código en otros lenguajes que podemos utilizar en Gambas.
Aquí les dejo un ejemplo de como usar la librería chessboard-0.3.0.js JavaScript.
Es interesante puesto que debemos aprender a manejar, un archivo html y como vincular y manipular archivos javascript y css.
Necesario activar el componente gb.qt4.webkit
Archivo Html que incrustaremos en un WebView:
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>JavaScript, Html y css en Gambas</title>
<base href="http://chessboardjs.com/" />
<link rel="stylesheet" href="css/chessboard.css" />
</head>
<body>
<center><div id="board" style="width: 400px"></div>
<input type="button" id="setRookCheckmateBtn" value="Jake Mate" />
<input type="button" id="setStartBtn" value="Posición inicial" />
<input type="button" id="clearBoardBtn" value="Borrar piezas" />
<input type="button" id="flipOrientationBtn" value="Girar tablero" />
<p><a href="https://novatocodegambas.blogspot.com.uy/">https://novatocodegambas.blogspot.com.uy/</a></p>
<p><a href="http://chessboardjs.com/">http://chessboardjs.com</a></p>
</center>
<h6>by postapase</h6>
<script src="js/json3.min.js"></script>
<script src="js/jquery-1.10.1.min.js"></script>
<script src="js/chessboard.js"></script>
<script>
var init = function() {
//--- start example JS ---
var ruyLopez = 'r1bqkbnr/pppp1ppp/2n5/1B2p3/4P3/5N2/PPPP1PPP/RNBQK2R';
var board = ChessBoard('board', ruyLopez);
$('#setStartBtn').on('click', board.start);
$('#clearBoardBtn').on('click', board.clear);
$('#flipOrientationBtn').on('click', board.flip);
$('#setRookCheckmateBtn').on('click', function() {
board.position({
a4: 'bK',
c4: 'wK',
a7: 'wR'
});
});
}; // end init()
$(document).ready(init);
</script>
</body>
</html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>JavaScript, Html y css en Gambas</title>
<base href="http://chessboardjs.com/" />
<link rel="stylesheet" href="css/chessboard.css" />
</head>
<body>
<center><div id="board" style="width: 400px"></div>
<input type="button" id="setRookCheckmateBtn" value="Jake Mate" />
<input type="button" id="setStartBtn" value="Posición inicial" />
<input type="button" id="clearBoardBtn" value="Borrar piezas" />
<input type="button" id="flipOrientationBtn" value="Girar tablero" />
<p><a href="https://novatocodegambas.blogspot.com.uy/">https://novatocodegambas.blogspot.com.uy/</a></p>
<p><a href="http://chessboardjs.com/">http://chessboardjs.com</a></p>
</center>
<h6>by postapase</h6>
<script src="js/json3.min.js"></script>
<script src="js/jquery-1.10.1.min.js"></script>
<script src="js/chessboard.js"></script>
<script>
var init = function() {
//--- start example JS ---
var ruyLopez = 'r1bqkbnr/pppp1ppp/2n5/1B2p3/4P3/5N2/PPPP1PPP/RNBQK2R';
var board = ChessBoard('board', ruyLopez);
$('#setStartBtn').on('click', board.start);
$('#clearBoardBtn').on('click', board.clear);
$('#flipOrientationBtn').on('click', board.flip);
$('#setRookCheckmateBtn').on('click', function() {
board.position({
a4: 'bK',
c4: 'wK',
a7: 'wR'
});
});
}; // end init()
$(document).ready(init);
</script>
</body>
</html>
En el Formulario:
El ejemplo esta disponible para su descarga en la Granja de Gambas
Nota: si vos tenes algún proyecto o ejemplo de este tipo me gustaría que lo compartieras, saludos.
