Webradio
view | history | commit | commitdiff
ulrich
2018-03-24 d166463aa463122d2387b05e8f4bfe82fe2ad104
commit | author | age
d16646 1
9c2c3c 2 var prefsRendered = false;
U 3 var senderKlickModus = "1"; // 1=abspielen, 2=bearbeiten, 3=loeschen
4 var ID_UNDEFINED = -1;
5 var A_ID_UNDEFINED = -1;
6 var suchTimeout;
d16646 7 var vorlagen;
9c2c3c 8
U 9 function app_init() {
d16646 10   vorlagen = new Vorlagen();
9c2c3c 11   $('.sued').text('Initialisieren..');
U 12   $('.dialog').hide();
13   $('.ost').hide();
14
15   // Menü initialisieren
16   app_menu_init(
17     "data/menu/",
18     "hauptmenue.json",
19     "../jslib/app-menu/app-menu.tpl",
20     ".west",
21     "8em");
22
23   // Klicks auf das Hamburger-Menü-Icon an eine Funktion leiten
24   $(".hamburger").on("click", function(e) {
25     app_menue_umschalten();
26   });
27
28   // Eingaben ins Suchfeld an eine Funktion leiten
29   $(".sendersuche-eingabe").on('keyup', function() {
30     clearTimeout(suchTimeout);
31     suchTimeout = setTimeout('app_sendersuche()', 500);
32   });
33
34   // Abspieler und Sender laden
35   setTimeout(function() {
36     app_get_abspieler();
37     app_get_sender();
38     $('.sued').text('Bereit.');
39   }, 200);
40 }
41
42 function app_sendersuche() {
43   var suchbegriff = $(".sendersuche-eingabe").val();
44
45   app_meldung_mit_timeout(
46     'Suchbegriff: ' + suchbegriff,
47     1500
48   );
49
50   /*
51     nachfolgend wird ueber alle divs der Klasse sender-kachel
52     iteriert und diejenigen mit .hide() ausgeblendet, die nicht
53     den Suchbegiff im Namen tragen
54
55     evtl. findet sich spaeter noch eine elegantere Suchfunktion..
56   */
57
58   var divs = $(".sender-kachel");
59   if(suchbegriff.length > 0) {
60     divs.each(function(index, element) {
61       if ($(element).html().indexOf(suchbegriff) < 0) {
62         $(element).hide();
63       } else {
64         $(element).show();
65       }
66     });
67   } else {
68     $(divs).show();
69   }
70 }
71
72 function app_menue_umschalten() {
73   $(".hamburger").toggleClass("is-active"); // hamburger-icon umschalten
74   app_menu_toggle(); // menue oeffnen/schliessen
75 }
76
77 /* Abspieler und abspielen */
78
79 function app_get_abspiel_ziel() {
80   var opt = $(".abspieler-auswahl :selected");
81   var atyp = opt.attr("atyp");
82   var aname = opt.text();
83   var aurl = opt.attr("aurl");
84   var zustand = opt.attr("standardzustand");
647739 85   var id = opt.attr("aid");
U 86   return new Abspieler(id, aname, aurl, atyp, "", zustand);
9c2c3c 87 }
U 88
89 /*
90   Abspiel-URL für Raspi:
91   http://raspi:8080/pirc/sys/rpc?c=de.uhilger.pirc.App&m=abspielen&p=http://bob.hoerradar.de/radiobob-live-mp3-hq&p=
92
93   der folgende Aufruf übergibt zusätzlich einen Parameter zum Abspielen über
94   das Audiokabel (nicht das HDMI-Kabel) des Raspi (sofern angeschlossen)
95   http://raspi-wz:8080/pirc/sys/rpc?c=de.uhilger.pirc.App
96   &m=abspielenMitParametern&p=http://bob.hoerradar.de/radiobob-live-mp3-hq
97   &p=-o%20local&p=
98 */
99 function app_abspielen(sender, abspieler) {
100   var url;
101   if(abspieler.typ === 'pirc') {
74f15b 102     /*
9c2c3c 103     url =
U 104       abspieler.url +
105       '/sys/rpc?c=de.uhilger.pirc.App&m=abspielenMitParametern&p=' +
106       sender.url +
107       '&p=-o%20local&p=';
74f15b 108     */
U 109     url = URL_ABSPIELER_API + 'abspielen&p=' + abspieler.id + '&p=' + sender.id;
9c2c3c 110     app_radio_kommando_senden(url);
U 111   } else {
112     url = sender.url;
113     var win = window.open(url, '_blank');
114     win.focus();
115   }
116 }
117
118 function app_abspielen_stoppen() {
119   var abspieler = app_get_abspiel_ziel();
120   if(abspieler.typ === 'pirc') {
74f15b 121     /*
9c2c3c 122     var url =
U 123       abspieler.url +
124       '/sys/rpc?c=de.uhilger.pirc.App&m=kommando&p=q';
74f15b 125     */
U 126     var url = URL_ABSPIELER_API + 'abspielenStoppen&p=' + abspieler.id;
9c2c3c 127     app_radio_kommando_senden(url);
U 128   } else {
129     // 'hier abspielen' stoppen muss noch gebaut werden
130   }
131 }
132
133 function app_abspieler_neu(abspieler) {
6ec660 134   app_neuen_abspieler_speichern(abspieler, function(a) {
U 135     //console.log(a.Abspieler.id);
d16646 136     vorlagen.html_erzeugen(
U 137       'data/tpl/abspieler-eintrag.tpl',
138       a.Abspieler,
139       function(html) {
140         if(a.zustand === 'selected') {
141           $.each($(".abspieler-auswahl option:selected"), function() {
142              $(this).prop('selected', false);
143           });
144         }
145         $(".abspieler-auswahl").append(html);
146     });
6ec660 147   });
9c2c3c 148 }
U 149
150 function app_abspieler_entfernen(abspieler) {
151   $(".abspieler-auswahl :selected").remove();
647739 152   app_abspieler_loeschen_aus_db(abspieler);
9c2c3c 153 }
U 154
155 /* Senderliste */
156
157 function app_kachel_anpassen(sender) {
158   var kachel = $( "div[sid='" + sender.id + "']" );
159   kachel.find(".sender-name").text(sender.name);
160   kachel.attr("data-verweis", sender.url);
161   kachel.find("img").attr("src", sender.logo);
162 }
163
164 function app_kachel_neu(sender) {
d16646 165   vorlagen.html_erzeugen(
U 166     'data/tpl/kachel.tpl',
167     sender,
168     function(html) {
169       $("#sender").append(html);
170       var kachel = $( "div[sid='" + sender.id + "']" );
171       kachel.on('click', app_kachel_klick);
172   });
9c2c3c 173 }
U 174
175 function app_kachel_entfernen(sender) {
176   $( "div[sid='" + sender.id + "']" ).remove();
177 }
178
179 function app_kachel_klick() {
180   var kachel = $( this );
181   var senderId = kachel.attr("sid");
182   var senderName = kachel.find(".sender-name").text();
183   var senderUrl = kachel.attr("data-verweis");
184   var senderLogo = kachel.find("img").attr("src");
185   var s = new Sender(senderId, senderName, senderUrl, senderLogo);
186   switch (senderKlickModus) {
187       case "1":
188         app_abspielen(s, app_get_abspiel_ziel());
189         break;
190       case "2":
d16646 191         vorlagen.html_erzeugen(
U 192           'data/tpl/dlg-sender-edit-form.tpl',
193           s,
194           function(html) {
195             $(".dlg-behaelter").html(html);
196             $('#sender-speichern').on('click', function() {
197               $('#sender-speichern').off('click');
198               var sender = app_sender_dialog_lesen(senderId);
199
200               app_sender_aendern(sender);
201
202               app_kachel_anpassen(sender);
203               app_dialog_schliessen();
204               app_meldung_mit_timeout('Speichern gewaehlt', 1500);
205             });
9c2c3c 206         });
d16646 207         
U 208         
9c2c3c 209         break;
U 210       case "3":
d16646 211         app_dialog_zeigen('data/tpl/dlg-sender-loeschen.tpl', s);
9c2c3c 212         $('#sender-loeschen').on('click', function() {
U 213           $('#sender-loeschen').off('click');
18af7c 214           
H 215           app_sender_entfernen(s);
216           
9c2c3c 217           app_kachel_entfernen(s);
U 218           app_dialog_schliessen();
219           app_meldung_mit_timeout('Loeschen gewaehlt ' + s.name, 1500);
220         });
221         //app_menue_umschalten();
222         break;
223       default:
224         app_meldung_mit_timeout(
225           'Sender ' + s.name + ', ID ' + s.id,
226           1500
227         );
228         break;
229   }
230 }
231
232 /* --- Menüfunktionen --- */
233
234 function app_nachricht_test() {
235   app_dialog_laden_und_zeigen(
d16646 236     'data/tpl/dlg-msg.tpl', 'data/msg-test.json');
9c2c3c 237   app_menue_umschalten();
U 238 }
239
240 function app_info_dialog_zeigen() {
d16646 241   app_dialog_laden_und_zeigen('data/tpl/dlg-info.tpl', '');
9c2c3c 242   app_menue_umschalten();
U 243 }
244
245 function app_neuer_sender() {
d16646 246   app_dialog_laden_und_zeigen('data/tpl/dlg-sender-neu.tpl', '');
9c2c3c 247   $('#sender-speichern').on('click', function() {
U 248     $('#sender-speichern').off('click');
a0ec7b 249     var sender = app_sender_dialog_lesen(--ID_UNDEFINED);
6ec660 250     app_neuen_sender_speichern(sender, function(s) {
U 251       app_kachel_neu(s.Sender);
252       app_dialog_schliessen();
253       app_meldung_mit_timeout('Speichern gewaehlt', 1500);
254     });
9c2c3c 255   });
U 256   app_menue_umschalten();
257 }
258
259 function app_sender_bearbeiten() {
260   senderKlickModus = "2"; // bearbeiten
d16646 261   app_dialog_laden_und_zeigen('data/tpl/dlg-sender-edit.tpl', '');
9c2c3c 262   app_menue_umschalten();
U 263 }
264
265 function app_sender_loeschen() {
266   senderKlickModus = "3"; // loeschen
d16646 267   app_dialog_laden_und_zeigen('data/tpl/dlg-sender-edit.tpl', '');
9c2c3c 268   app_menue_umschalten();
U 269 }
270
271 function app_abspieler_loeschen() {
272   var abspieler = app_get_abspiel_ziel();
d16646 273   app_dialog_zeigen('data/tpl/dlg-abspieler-loeschen.tpl', abspieler);
9c2c3c 274   $('#abspieler-loeschen').on('click', function() {
U 275     $('#abspieler-loeschen').off('click');
276     app_abspieler_entfernen(abspieler);
277     app_dialog_schliessen();
278     app_meldung_mit_timeout('Loeschen gewaehlt ' + abspieler.name, 1500);
279   });
280   app_menue_umschalten();
281 }
282 function app_neuer_abspieler() {
d16646 283   app_dialog_laden_und_zeigen('data/tpl/dlg-abspieler-neu.tpl', '');
9c2c3c 284   $('#abspieler-speichern').on('click', function() {
U 285     $('#abspieler-speichern').off('click');
286     app_abspieler_neu(app_abspieler_dialog_lesen(--A_ID_UNDEFINED));
287     app_dialog_schliessen();
288     app_meldung_mit_timeout('Speichern gewaehlt', 1500);
289   });
290   app_menue_umschalten();
291 }
292 function app_abspieler_bearbeiten() {
293   var abspieler = app_get_abspiel_ziel();
d16646 294   app_dialog_zeigen('data/tpl/dlg-abspieler-edit-form.tpl', abspieler);
9c2c3c 295   $("#abspieler-typ").val(abspieler.typ);
U 296   $("#abspieler-zustand").val(abspieler.zustand);
297   $('#abspieler-speichern').on('click', function() {
298     $('#abspieler-speichern').off('click');
299
300     // Aenderungen auf die Bedienoberflaeche uebernehmen
647739 301     var abspieler2 = app_abspieler_dialog_lesen(abspieler.id);
U 302     if(abspieler2.zustand === 'selected') {
9c2c3c 303       $(".abspieler-auswahl").children().attr("standardzustand", "");
U 304     }
305     var opt = $(".abspieler-auswahl :selected");
647739 306     opt.attr("atyp", abspieler2.typ);
U 307     opt.attr("aurl", abspieler2.url);
308     opt.attr("standardzustand", abspieler2.zustand);
309     opt.text(abspieler2.name);
9c2c3c 310
U 311     /*
312       hier fehlt noch eine Funktion zum Speichern
313       der Aenderungen
314     */
647739 315     app_abspieler_aendern(abspieler2);
9c2c3c 316
U 317     app_dialog_schliessen();
318     app_meldung_mit_timeout('Speichern gewaehlt', 1500);
319   });
320   app_menue_umschalten();
321 }
322
323 /* --- Dialogfunktionen --- */
324
d16646 325 function app_dialog_zeigen(vurl, inhalt) {
9c2c3c 326   var dlg = $(".dialog");
d16646 327   vorlagen.html_erzeugen(
U 328     vurl,
329     inhalt,
330     function(html) {
331       dlg.html(html);
332       $(".close-btn").on('click', function() {
333         app_dialog_schliessen();
334       });
335       dlg.slideDown(300);
9c2c3c 336   });
U 337 }
338
339 function app_sender_dialog_lesen(senderId) {
340   var nameNeu = $("#sender-name").val();
341   var logoNeu = $("#sender-logo").val();
342   var urlNeu = $("#sender-url").val();
343   return new Sender(senderId, nameNeu, urlNeu, logoNeu);
344 }
345
346 function app_abspieler_dialog_lesen(abspielerId) {
347   var aName = $("#abspieler-name").val();
348   var aUrl = $("#abspieler-url").val();
349   var aTyp = $("#abspieler-typ").val();
350   var aBild = $("#abspieler-bild").val();
351   var aZustand = $("#abspieler-zustand").val();
352   return new Abspieler(abspielerId, aName, aUrl, aTyp, aBild, aZustand);
353 }
354
355 function app_dialog_schliessen() {
356   senderKlickModus = "1";
357   $('.close-btn').off('click');
358   $('.dialog').slideUp(300);
359 }
360
361 /* --- Meldungen in der Fusszeile --- */
362
363 /*
364   Eine Meldung eine Zeitlang in der Fusszeile anzeigen
365
366   meldung - Text der Meldung
367   timeout - die Anzahl Millisekunden, die eine Meldung zu sehen sein soll
368 */
369 function app_meldung_mit_timeout(meldung, timeout) {
370   var s = $('.sued');
371   s.text(meldung);
372   setTimeout(function() {
373     s.text('Bereit.');
374   }, timeout);
375 }
376
377 /* --- Ajax-Aufrufe --- */
378
379 function app_get_sender() {
380   $.ajax({
6b63ff 381     url: "api?c=de.uhilger.radiozentrale.api.SenderApi&m=senderliste&f=JSONNICE",
9c2c3c 382     type: "GET",
U 383     dataType : "json"
384   }).done(function( senderliste ) {
385     $(".sender-kachel").off("click");
d16646 386     vorlagen.html_erzeugen(
U 387       'data/tpl/sender-transit.tpl',
388       senderliste,
389       function(html) {
390         $(".sender-behaelter").html(html);
391         $('.sender-kachel').on('click', app_kachel_klick);
392     });
9c2c3c 393   });
U 394 }
395
396 function app_get_abspieler() {
397   $.ajax({
b6585c 398     //url: "data/abspieler.json",
U 399     url: "api?c=de.uhilger.radiozentrale.api.AbspielerApi&m=abspielerliste&f=JSONNICE",
9c2c3c 400     type: "GET",
U 401     dataType : "json"
402   }).done(function( abspielerliste ) {
d16646 403     vorlagen.html_erzeugen(
U 404       'data/tpl/abspieler-transit.tpl',
405       abspielerliste,
406       function(html) {
407         $(".abspieler-behaelter").html(html);
408         $("#abspielen-stoppen").on('click', app_abspielen_stoppen);
409     });
9c2c3c 410   });
U 411 }
412
413 /*
414   vorlage - die Dialogvorlage
415   msgTpl - eine Vorlage mit einem Mitteilungstext (optional)
416 */
417 function app_dialog_laden_und_zeigen(vorlage, msgTpl) {
418   if(msgTpl !== '') {
419     $.ajax({
420       url: msgTpl,
421       type: "GET",
422       dataType : "json"
423     }).done(function( msg ) {
424       app_dialog_zeigen(vorlage, msg);
425     });
426   } else {
427     app_dialog_zeigen(vorlage, '');
428   }
429 }
430
431 function app_radio_kommando_senden(kommando) {
432   $.ajax({
433     url: kommando,
434     type: "GET",
435     dataType : "text",
436     crossDomain: true
437   }).done(function( antwort ) {
438     /*
439       der folgende Schritt wird nicht erreicht, weil beim Aufruf
440       aus dem Browser heraus keine Adresse aufgerufen werden darf,
441       die nicht von der Domain kommt, von der aus das radio-ui
442       ausgeliefert wird.
443
444       Kommt das radio-ui z.B. von der Domain uhilger.de, wird ein Aufruf
445       zur Domain raspi-az blockiert.
446
447       Das laesst sich vermeiden, wenn der Server den Aufruf zum Raspi
448       uebernimmt.
449
450       Interessanterweise kommt der Aufruf zum Raspi durch und löst auch
451       das Abspielen des Radiosenders aus. Nur die Antwort vom Raspi wird
452       blockiert und hier nicht ausgegeben.
453     */
454     app_meldung_mit_timeout(antwort, 2000);
455   }).fail(function(xhr, status, errorThrown ) {
456     app_meldung_mit_timeout(errorThrown + " " + status, 2000);
457   });
458 }
459
6ec660 460 function app_crud_api(api, methode, o, cb) {
98e5c6 461   var obj = serialisieren(o);
U 462   var url = api + methode;
463   $.post( url, 'p=' + obj, function( result ) {
464     console.log( result );
6ec660 465     if(cb !== undefined) {
U 466       cb(result);
467     }
98e5c6 468   }, "json");
U 469 }
470
18af7c 471 /* SenderApi */
H 472
473 var URL_SENDER_API = "api?c=de.uhilger.radiozentrale.api.SenderApi&m=";
474
6ec660 475 function app_neuen_sender_speichern(sender, cb) {
U 476   app_crud_api(URL_SENDER_API, 'neuerSender', sender, cb);
a0ec7b 477 }
U 478
ceb15c 479 function app_sender_aendern(sender) {
98e5c6 480   app_crud_api(URL_SENDER_API, 'senderAendern', sender);
18af7c 481 }
H 482
483 function app_sender_entfernen(sender) {
98e5c6 484   app_crud_api(URL_SENDER_API, 'senderLoeschen', sender);
18af7c 485 }
H 486
98e5c6 487 /* AbspielerApi */
U 488
489 var URL_ABSPIELER_API = "api?c=de.uhilger.radiozentrale.api.AbspielerApi&m=";
490
6ec660 491 function app_neuen_abspieler_speichern(abspieler, cb) {
U 492   app_crud_api(URL_ABSPIELER_API, 'neuerAbspieler', abspieler, cb);
ceb15c 493 }
U 494
647739 495 function app_abspieler_aendern(abspieler) {
U 496   app_crud_api(URL_ABSPIELER_API, 'abspielerAendern', abspieler);
497 }
498
499 function app_abspieler_loeschen_aus_db(abspieler) {
500   app_crud_api(URL_ABSPIELER_API, 'abspielerLoeschen', abspieler);
501 }
502
a0ec7b 503 /* Hilfsfunktionen */
U 504
505 function serialisieren(obj) {
506   return '{"' + obj.constructor.name + '":' + JSON.stringify(obj) + '}';
507 }
508
9c2c3c 509 /* Objekte */
U 510
511 function Sender(i, n, u, l) {
512   this.id = i;
513   this.name = n;
514   this.url = u;
515   this.logo = l;
516 }
517
518 function Abspieler(i, n, u, t, b, z) {
519   this.id = i;
520   this.name = n;
521   this.url = u;
522   this.typ = t;
523   this.bild = b;
524   this.zustand = z;
525 }