[Javascript] QUESITO SU FUNZIONI

[Andrea Perrone]

Coumnque guarda che ciò che mi avevi scritto e fatto vedere funzionava alla perfezione intendiamoci! ciao!

 

[criric]

Non son bravo con gli scacchi. Dico che devi prima sviluppare l'idea e poi pensare al codice. Di esempi già pronti ne trovi parecchi , guarda questo.

 

[daniloc]

Coumnque guarda che ciò che mi avevi scritto e fatto vedere funzionava alla perfezione intendiamoci! ciao!

Ciao Andrea
sono un esperto di scacchi e ho fatto il programmatore per tanti anni anche se non di js

ho visto parecchio a riguardo, che puo' tornare utile a te e a quello che gli scacchisti si aspettano,
siccome da poco sto facendo un lavoretto serviva anche a me adattare js
ma prima ti chiedo
perche' non usi cio' che di buono c'e' in giro gia' pronto?
il sito che stai facendo è statico, scritto da te o usi un prodotto open source come wordpress?
hai un link dove vedere la pagina con la scacchiera che vuoi realizzare?

ciao a presto!

 

[Andrea Perrone]

Ciao Danilo. Grazie all'aiuto di molti, sono arrivato alla soluzione di usare una semplice (e prolissa) tabella - di cui ti posto un estratto - e uno script drag and drop preso dal sito w3schools. In questo modo, le partite commentate che inserirò - se tutto va bene - nella nuova impaginazione del sito del circolo della mia città a cui sto lavorando, potranno essere seguite con l'ausilio di questa scacchiera virtuale.

<table id="scacchiera">

<tr>
<td class="chiaro" id="a8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="torre n.png" id="drag1" draggable="true"
ondragstart="drag(event)" class="pezzo" alt="" /></td>
<td class="scuro" id="b8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="cavallo n.png" id="drag2" draggable="true"
ondragstart="drag(event)" class="pezzo" alt="" /></td>
<td class="chiaro" id="c8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="alfiere n.png" id="drag3" draggable="true"
ondragstart="drag(event)"  class="pezzo" alt="" /></td>
<td class="scuro" id="d8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="regina n.png" id="drag4" draggable="true"
ondragstart="drag(event)" class="pezzo" alt="" /> </td>
<td class="chiaro" id="e8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="re n.png" id="drag5" draggable="true"
ondragstart="drag(event)" class="pezzo" alt="" /></td>
<td class="scuro" id="f8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="alfiere n.png" id="drag6" draggable="true"
ondragstart="drag(event)" class="pezzo" alt="" /></td>
<td class="chiaro" id="g8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="cavallo n.png" id="drag7" draggable="true"
ondragstart="drag(event)" class="pezzo" alt="" /></td>
<td class="scuro" id="h8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="torre n.png" id="drag8" draggable="true"
ondragstart="drag(event)" class="pezzo" alt="" /></td>
</tr>

Per quanto riguarda gli esempi che si trovano in rete, un mio amico (che ha lavorato allo sviluppo del so MeeGo quando lavorava in Nokia) me ne ha fatto notare uno molto interessante, ma anche visualizzando la sorgente non ci ho capito molto.

L'esempio è questo:

http://bmarini.github.io/jchess/

Potrei "copiare" qualche pezzo di codice da qui??? Non saprei proprio da dove iniziare, dato che la mia esperienza di programmazione è nulla: solo quest'anno inizio a studiare un po' di C per l'esame di informatica

Ciao Danilo mi fa piacere che ti sia interessato nonostante la natura poco chiara del titolo

 

[daniloc]

Ciao Danilo. Grazie all'aiuto di molti, sono arrivato alla soluzione di usare una semplice (e prolissa) tabella - di cui ti posto un estratto - e uno script drag and drop preso dal sito w3schools. In questo modo, le partite commentate che inserirò - se tutto va bene - nella nuova impaginazione del sito del circolo della mia città a cui sto lavorando, potranno essere seguite con l'ausilio di questa scacchiera virtuale.

<table id="scacchiera">

<tr>
<td class="chiaro" id="a8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="torre n.png" id="drag1" draggable="true"
ondragstart="drag(event)" class="pezzo" alt="" /></td>
<td class="scuro" id="b8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="cavallo n.png" id="drag2" draggable="true"
ondragstart="drag(event)" class="pezzo" alt="" /></td>
<td class="chiaro" id="c8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="alfiere n.png" id="drag3" draggable="true"
ondragstart="drag(event)"  class="pezzo" alt="" /></td>
<td class="scuro" id="d8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="regina n.png" id="drag4" draggable="true"
ondragstart="drag(event)" class="pezzo" alt="" /> </td>
<td class="chiaro" id="e8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="re n.png" id="drag5" draggable="true"
ondragstart="drag(event)" class="pezzo" alt="" /></td>
<td class="scuro" id="f8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="alfiere n.png" id="drag6" draggable="true"
ondragstart="drag(event)" class="pezzo" alt="" /></td>
<td class="chiaro" id="g8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="cavallo n.png" id="drag7" draggable="true"
ondragstart="drag(event)" class="pezzo" alt="" /></td>
<td class="scuro" id="h8" ondrop="drop(this,event)" ondragover="allowDrop(event)"><img src="torre n.png" id="drag8" draggable="true"
ondragstart="drag(event)" class="pezzo" alt="" /></td>
</tr>

Per quanto riguarda gli esempi che si trovano in rete, un mio amico (che ha lavorato allo sviluppo del so MeeGo quando lavorava in Nokia) me ne ha fatto notare uno molto interessante, ma anche visualizzando la sorgente non ci ho capito molto.

L'esempio è questo:

http://bmarini.github.io/jchess/

Potrei "copiare" qualche pezzo di codice da qui??? Non saprei proprio da dove iniziare, dato che la mia esperienza di programmazione è nulla: solo quest'anno inizio a studiare un po' di C per l'esame di informatica

Ciao Danilo mi fa piacere che ti sia interessato nonostante la natura poco chiara del titolo

Andrea, dovrei capire cosa devi fare esattamente
per il codice guarda qui
https://github.com/siansell/pgnviewer
o qui http://chessboardjs.com/

ma prima di affogarti nel codice
devi tener presente alcune cose che dipendono da cosa devi fare

se invece stai facendo un sito in wordpress allora cambia tutto
fammi sapere

ciao!

 

[Andrea Perrone]

Danilo, in realtà prima di fare la scacchiera drag and drop, avevo scritto una funzione javascript per ogni mossa e, tramite un button, andavo avanti nella visualizzazione delle posizioni; ho lasciato perdere questa soluzione poichè non riuscivo a fare in modo che si potesse tornare indietro, una volta che l'ultima funzione era scatenata! Ora, credo che per migliorare il lavoro, si potrebbe - e potresti aiutarmi a capire come fare - fare in modo che nel testo della partita commentata, ogni mossa, onclick, visualizzi sulla scacchiera la relativa posizione, come se fosse inserito nel codice un pgn. In questo modo, penso, si potrebbe anche lasciare la scacchiera in modalità drag and drop per permettere di eseguire manualmente una eventuale variante descritta o meno nel testo. Per quanto riguarda la scrittura del codice, sto lavorando con bluefish su ubuntu: non utilizzo programmi come wordpress o kompozer - quest'ultimo mi è stato molto utile perchè mi ha fornito l'input per iniziare a studiare come fare a scrivere manualmente.
Sarebbe bello se il risultato finale possa dirsi "artigianale" e alternativo a soluzioni come quelle descritte in github, sempre tenendo conto del valido aiuto che persone come te hanno voluto darmi. La mia squadra gioca il CIS in promozione. Tu, Danilo, chi sei? Che categoria?

Andrea

 

[daniloc]

posso solo dirti che faresti tutto sfruttando le API di lichess
https://it.lichess.org/developers
se poi per tue ragioni devi fare qualcosa di diverso, andrebbe precisato.
se hai un js semplice semplice
scacchiera piu' bottoni avanti/dietro piu' area mosse del pgn
tipo http://www.lutanho.net/pgn/ltpgnviewer.html?black_king_walk.html
ma anche piu' semplice potresti aiutarmi

io non gioco piu' da un bel po', diciamo circa 1800.
ps
wordpress non è un programma
è un prodotto con cui realizzi siti e aggiungi componenti per realizzare le varie funzionalità
tra queste ci sono componenti (plugin) per realizzare le pagine delle partite
o implementi manualmente altri viewer tipo chessbase

ciao

 

[Andrea Perrone]

danilo provo a inviare un file zip con la scacchiera

 

[daniloc]

ho visto la scacchiera
sorvolando tutti i problemi grafici
per adesso rimango sulle funzionalità

stai mettendo un drag&drop libero senza controllo sulla regolarità delle mosse
ti immagini se uno inserisce una ventina di mosse e poi si accorge che aveva immesso una mossa illegale?
(non poteva arroccare, ha messo il re sotto scacco, ha spostato un pezzo inchiodato...)
che fa? rincomincia tutto da capo?
se fai tutto da zero devi fare una montagna di roba...
ti conviene partire da un codice preconfezionato, di solito e' fatto a moduli, la scacchiera, il modulo di controllo, etc...

la scacchiera libera puo' servire laddove devi impostare una posizione, quindi: cancella scacchiera, inserisci, trascina, ...

ciao