Obliczenia brydżowe (HTML)
view | history | commit | commitdiff
Jacek Kowalski
2015-07-11 7f8ceb8e55b8778180ea890edae3daea5bd05cae
commit | author | age
7f8ceb 1 <!DOCTYPE html>
JK 2 <html>
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5 <meta name="viewport" content="width=device-width, user-scalable=no" />
6 <title>Wyniki brydżowe</title>
7 <link rel="stylesheet" href="bridge.css" type="text/css" />
8 </head>
9 <body>
10
11 <p>
12 <button onclick="addResult()">Dodaj wynik</button>
13 <button onclick="addPlayer()">Dodaj gracza</button>
14 <button onclick="clearAll()">Wyczyść</button>
15 </p>
16
17 <div id="results">
18 </div>
19
20 <div id="overlay">
21 </div>
22
23 <script type="text/javascript">
24 function ResultsTable(id, container) {
25     this.id = id;
26     this.players = [];
27     this.results = [];
28     this.store = window.sessionStorage;
29     
30     container.appendChild(this._createTable());
31 }
32 ResultsTable.prototype._createTable = function() {
33     this.table = document.createElement('table');
34     this.table.className = 'results';
35     this.thead = document.createElement('thead');
36     this.tbody = document.createElement('tbody');
37     this.tplayers = document.createElement('tr');
38     this.tresults = document.createElement('tr');
39     
40     this.table.appendChild(this.thead);
41     this.table.appendChild(this.tbody);
42     this.thead.appendChild(this.tplayers);
43     this.thead.appendChild(this.tresults);
44     
45     return this.table;
46 };
47 ResultsTable.prototype.load = function() {
48     if(this.store) {
49         this.players = JSON.parse(this.store.getItem(this.id+'_players'));
50         this.results = JSON.parse(this.store.getItem(this.id+'_results'));
51         this.refresh();
52     }
53 };
54 ResultsTable.prototype.save = function() {
55     if(this.store) {
56         this.store.setItem(this.id+'_players', JSON.stringify(this.players));
57         this.store.setItem(this.id+'_results', JSON.stringify(this.results));
58     }
59 };
60 ResultsTable.prototype.clear = function() {
61     this.players = [];
62     this.results = [];
63     this.refresh();
64     if(this.store) {
65         this.store.removeItem(this.id+'_players');
66         this.store.removeItem(this.id+'_results');
67     }
68 };
69 ResultsTable.prototype.addPlayer = function(name) {
70     var results = (this.results[0] && this.results[0].length) || 0;
71     results = new Array(results);
72     for(var i = 0; i < results.length; i++) {
73         results[i] = 'X';
74     }
75     
76     this.players.push(name);
77     this.results.push(results);
78     this.refresh();
79 };
80 ResultsTable.prototype._createPlayerTh = function(name) {
81     var th = document.createElement('th');
82     th.innerText = name;
83     th.onclick = function(self) { return function() {
84         var originalName = th.innerText;
85         var result = prompt('Podaj nowe inicjały gracza. Wyczyść pole, by go usunąć.', name);
86         
87         if(result == null) {
88             return;
89         }
90         
91         if(result) {
92             self.players[self.players.indexOf(originalName)] = result;
93             th.innerText = result;
94         }
95         else
96         {
97             var index = self.players.indexOf(originalName);
98             self.players = self.players.splice(index, 1);
99             self.results = self.results.splice(index, 1);
100             self.refresh();
101         }
102     } }(this);
103     return th;
104 };
105 ResultsTable.prototype.addResult = function(result) {
106     for(var i = 0; i < result.length; i++) {
107         this.results[i].push(result[i]);
108     }
109     this.refresh();
110 };
111 ResultsTable.prototype.refresh = function() {
112     this.save();
113     
114     while(this.tplayers.lastChild) {
115         this.tplayers.removeChild(this.tplayers.lastChild);
116     }
117     for(var i = 0; i < this.players.length; i++) {
118         this.tplayers.appendChild(this._createPlayerTh(this.players[i]));
119     }
120     
121     while(this.tresults.lastChild) {
122         this.tresults.removeChild(this.tresults.lastChild);
123     }
124     for(var i = 0; i < this.results.length; i++) {
125         var td = document.createElement('th');
126         td.innerText = this.results[i].reduce(function(a, b) { return (parseInt(a, 10) || 0)+(parseInt(b, 10) || 0); }, 0);
127         this.tresults.appendChild(td);
128     }
129     
130     while(this.tbody.lastChild) {
131         this.tbody.removeChild(this.tbody.lastChild);
132     }
133     if(this.results.length > 0) {
134         for(var i = 0; i < this.results[0].length; i++) {
135             var tr = document.createElement('tr');
136             
137             for(var j = 0; j < this.results.length; j++) {
138                 var td = document.createElement('td');
139                 td.innerText = this.results[j][i];
140                 td.onclick = function(j, i, self) { return function() {
141                     var result = prompt('Podaj nową wartość:', self.results[j][i]);
142                     if(result != null) {
143                         self.results[j][i] = result;
144                         self.refresh();
145                     }
146                 } }(j, i, this);
147                 tr.appendChild(td);
148             }
149             
150             this.tbody.appendChild(tr);
151         }
152     }
153 };
154
155 var resultsTable = new ResultsTable('html', document.getElementById('results'));
156 resultsTable.load();
157
158 function addPlayer() {
159     var result = prompt('Podaj inicjały gracza');
160     if(result) {
161         resultsTable.addPlayer(result);
162     }
163 }
164
165 function addResult() {
166     if(resultsTable.players.length < 4) {
167         alert('Dodaj przynajmniej 4 graczy.');
168         return;
169     }
170     window.open('compute.html');
171 }
172
173 function clearAll() {
174     resultsTable.clear();
175 }
176
177 function saveResult(result, p1, p2, p3, p4) {
178     var lista = document.getElementById('overlay');
179     
180     if(p1 == null || p2 == null || p3 == null || p4 == null) {
181         while(lista.lastChild) {
182             lista.removeChild(lista.lastChild);
183         }
184         
185         var selectable = [];
186         lista.appendChild(document.createElement('br'));
187         for(var i = 0; i < resultsTable.players.length; i++) {
188             if(p1 == i || p2 == i || p3 == i || p4 == i) {
189                 continue;
190             }
191             selectable.push(i);
192         }
193         if(p3 == null && p4 == null && selectable.length == 2) {
194             return saveResult(result, p1, p2, selectable[0], selectable[1]);
195         }
196         
197         var p = document.createElement('p');
198         if(p1 == null) {
199             p.appendChild(document.createTextNode('Rozgrywający 1:'));
200         } else if(p2 == null) {
201             p.appendChild(document.createTextNode('Rozgrywający 2:'));
202         } else if(p3 == null) {
203             p.appendChild(document.createTextNode('Przeciwnik 1:'));
204         } else {
205             p.appendChild(document.createTextNode('Przeciwnik 2:'));
206         }
207         lista.appendChild(p);
208         for(var j = 0; j < selectable.length; j++) {
209             var i = selectable[j];
210             var button = document.createElement('button');
211             button.innerText = resultsTable.players[i];
212             button.onclick = (function (j) { return function() {
213                 if(p1 == null) {
214                     saveResult(result, j, null, null, null);
215                 } else if(p2 == null) {
216                     saveResult(result, p1, j, null, null);
217                 } else if(p3 == null) {
218                     saveResult(result, p1, p2, j, null);
219                 } else {
220                     saveResult(result, p1, p2, p3, j);
221                 }
222             } })(i);
223             lista.appendChild(button);
224         }
225         
226         button = document.createElement('button');
227         button.innerText = 'Anuluj';
228         button.onclick = function() {
229             lista.style.display = 'none';
230         }
231         
232         lista.appendChild(button);
233         lista.style.display = 'block';
234     } else {
235         lista.style.display = 'none';
236         
237         var results = [];
238         for(var i = 0; i < resultsTable.players.length; i++) {
239             if(p1 == i || p2 == i) {
240                 if(result.dla == 0) {
241                     results.push(result.IMP);
242                 } else {
243                     results.push('-');
244                 }
245             } else if(p3 == i || p4 == i) {
246                 if(result.dla != 0) {
247                     results.push(result.IMP);
248                 } else {
249                     results.push('-');
250                 }
251             } else {
252                 results.push('X');
253             }
254         }
255         
256         resultsTable.addResult(results);
257     }
258 }
259
260 function handler(event) {
261     var result = event.data;
262     
263     setTimeout(function() {
264         saveResult(result, null, null, null, null);
265     }, 1);
266 }
267
268 window.addEventListener('message', handler, false);
269 </script>
270
271 </body>
272 </html>