1 <h1 id=
"kodi-web-interface-chorus2">Kodi Web Interface - Chorus2
</h1>
2 <p>Die Standardoberfläche für die Webansicht von Kodi.
</p>
3 <p>Eine großartige, moderne Weboberfläche für Kodi. Stöbere durch deine Musik, Filme
4 oder TV-Sendungen - komfortabel mit dem Webbrowser. Du kannst Kodi fernsteuern
5 oder Medien in deinen Browser streamen. Am Besten funkioniert das mit Chrome, aber
6 auch gut mit den meisten anderen aktuellen Browsern.
</p>
7 <p>Chorus2 ist der Nachfolger von
<a href=
"https://github.com/jez500/chorus">Chorus
</a>.
8 Von Grund auf neuprogrammiert auf Basis von Coffee Script, Backbone, Marionette
9 und vielem, vielem, mehr.
</p>
10 <h2 id=
"autor">Autor
</h2>
11 <p><a href=
"http://jez.me">Jeremy Graham
</a> mit Hilfe von
12 <a href=
"https://github.com/xbmc/chorus2/graphs/contributors">diesen Typen
</a>.
</p>
13 <h2 id=
"aktueller-status">Aktueller Status
</h2>
14 <p>Ziemlich gut, das Meiste funktioniert richtig gut. Anderes braucht noch
15 <a href=
"https://github.com/xbmc/chorus2/issues">Politur/Abschluss/Korrektur
</a>.
16 Es steht beta drauf, also erwarte Fehler, Änderungen, den Atomkrieg usw.
</p>
17 <h2 id=
"an-s-laufen-bekommen">An
's Laufen bekommen
</h2>
18 <p>Ab Kodi v17 ist Chorus2 vorinstalliert, du brauchst es nur zu aktvieren und ein
19 paar Häkchen zu setzen.
</p>
20 <h3 id=
"aktivieren-und-einstellen">Aktivieren und Einstellen
</h3>
21 <p>Kodi
> Settings (cog)
> Services
> Control
</p>
23 <li>Aktiviere
"Allow control of Kodi via HTTP
"</li>
24 <li>Klicke auf
"Web interface
"</li>
25 <li>Klicke auf
"Kodi web interface - Chorus2
"</li>
26 <li>Aktiviere
"Allow programs on this system to control Kodi
"</li>
27 <li>Aktiviere
"Allow programs on other systems to control Kodi
"</li>
29 <p><strong>Aus Sicherheitsgründen solltest du einen Benutzernamen und ein Passwort
30 einstellen, um unbefugten Zugriff über die Weboberfläche zu verhinden.
</strong></p>
31 <h3 id=
"manuelle-installation">Manuelle Installation
</h3>
32 <p>Es gibt Gründe, Kodi als zip zu installieren. Etwa, wenn Kodi v16 oder älter ist
33 oder wenn du direkt die aktuellste Version installieren möchtest. Lade die
34 aktuellste Version des
<code>webinterface.default
.2.X.X.zip
</code> von der
35 <a href=
"https://github.com/xbmc/chorus2/releases">Seite mit den Veröffentlichungen
</a>
36 herunter, dann installiere es
<a href=
"http://kodi.wiki/view/Add-on_manager#How_to_install_from_a_ZIP_file">wie hier beschrieben
</a>.
37 <strong>Hinweis:
</strong> Chorus2 sollte mit der aktuellsten Version von Kodi benutzt werden,
38 einiges (oder sogar alles) könnte wegen Änderungen in der API mit älteren Versionen
39 nicht funktionieren.
</p>
40 <h3 id=
"benutzung">Benutzung
</h3>
41 <p>Rufe mit deinem Webbrowser die Adresse
<code>http://localhost:
8080</code> auf - ersetze dabei
42 <code>localhost
</code> mit deiner IP-Adresse, wenn du auf einen anderen Rechner zugreifst. Wenn
43 du einen anderen Port als
<code>8080</code> eingestellt hast, passe ihn bitte auch an.
44 Mehr Informationen und Tipps für fortgeschrittene Benutzung ist im
45 <a href=
"http://kodi.wiki/view/Web_interface">Kodi Wiki page
</a> zu finden.
</p>
46 <h2 id=
"feature-requests-bugs">Feature requests / Bugs
</h2>
47 <p>Add them to the
<a href=
"https://github.com/xbmc/chorus2/issues">list
</a>. For bugs please include Kodi version, Web browser version,
48 Chorus version and any errors that display in the console. For feature requests, checkout the API browser to see if your
49 request is currently possible.
</p>
50 <h2 id=
"streaming">Streaming
</h2>
51 <p>Disclaimer: The success of this depends on the file formats vs what the browser supports. In general most things work.
</p>
52 <h3 id=
"audio-streaming">Audio streaming
</h3>
53 <p>In the top right there are some tabs, two of them are named Kodi and Local, this is how you toggle what player the UI
54 is controlling. In Local mode the logo and accents are pinky-red, In Kodi mode the logo is the Kodi blue. When you
55 are in a given mode, actions affect that player, so if you click Play on a track when in Local mode, it will play
56 through the browser, likewise, when in Kodi mode all commands are sent to Kodi. You can also add media to other
57 playlists by clicking the menu buttons (three dots vertical) on most media items.
</p>
58 <h3 id=
"video-streaming">Video streaming
</h3>
59 <p>Video streaming via HTML5
"sort of
" works, it really depends on the codec used. An embedded VLC player is also available with better codec support.
60 This looks like the best we can get until Kodi supports transcoding.
61 <strong>Chrome users
</strong>: Chrome has removed support for vlc/divx plugins so streaming a video requires a
<a href=
"https://en.wikipedia.org/wiki/HTML5_video#Browser_support">Chrome friendly codec
</a>.
62 For best results use Chrome with mp4 video that has
2 channel audio (
5.1 audio doesn
't seem to work).
</p>
63 <h2 id=
"kodi-settings-via-the-web-interface">Kodi settings via the web interface
</h2>
64 <p>You can change most of the settings you would find in Kodi via the settings page in the web interface.
65 Some settings have been omitted as they require interaction with the GUI and others are just a basic text field with no options.
</p>
66 <h2 id=
"kodi-api-browser">Kodi API browser
</h2>
67 <p>There is a hidden feature in Chorus that allows you to play with the Kodi API and see what is capable via the JSON-RPC
68 interface. If you are building an app or addon that uses the API this can be super useful for both finding and testing
69 all the methods and types available. If you are thinking about a new feature for Chorus, this is also a great place to
70 test if it is possible (and fast track development by adding a working example to an issue). You can find the API browser
71 via
"Chorus Lab
" (bottom right
3 vertical dots
> "The Lab
") or directly via
<code>http://localhost:
8080/#lab/api-browser
</code>.
</p>
72 <h2 id=
"contributing">Contributing
</h2>
73 <p>If you would like to make this project better I would appreciate any help. Please do pull requests against the
<code>develop
</code> branch.
74 I am happy to assist with getting an development environment up and running if you are happy to contribute.
</p>
75 <h3 id=
"translations">Translations
</h3>
76 <p>I only know English so definitely need help with this. I also don
't know heaps about javascript multilingual stuff but
77 thanks to
<a href=
"https://github.com/mizaki">@mizaki
</a> we have a structure ready to go. So it should be nice and easy to translate the UI.
</p>
78 <p>At the moment, there are
<a href=
"https://github.com/xbmc/chorus2/tree/master/src/lang/_strings">a handful
</a> of languages available
79 but more can be easily added. More strings are always being added so always consider english as the source of truth.
</p>
80 <p>So if you see something in english but want it in your language, I need you! To contribute, send me a PR on a new branch
81 against
<code>develop
</code>, or if you don
't know git, a link to the language file.
</p>
82 <p>Language Files
<a href=
"https://github.com/xbmc/chorus2/tree/master/src/lang">here
</a>.
83 <em>English is the only real complete translation file so start with that as your base.
</em></p>
84 <h3 id=
"compiling">Compiling
</h3>
85 <p>Sass and Grunt are used to compile css and js in the dist folder.
86 To get your environment setup first install
<a href=
"http://bundler.io">Bundler
</a> and
<a href=
"https://www.npmjs.org/">npm
</a>.
</p>
88 <li>Install required gems with
<code>bundle install
</code></li>
89 <li>Install NodeJs packages with
<code>npm install
</code></li>
90 <li>Run grunt
<code>grunt
</code></li>
92 <p>If you are updating (eg. git pull), always do an
<code>npm update
</code> and
<code>bundle update
</code> to ensure all the tools are in the toolbox.
</p>
93 <h3 id=
"build">Build
</h3>
94 <p>A build will also include translation files.
</p>
96 <li>Run grunt
<code>grunt build
</code></li>
98 <h2 id=
"spenden">Spenden
</h2>
99 <p>Bist du ein Fan von Chorus2 geworden? Du kannst
<a href=
"https://www.paypal.com/cgi-bin/webscr?cmd=_donations&business=ZCGV976794JHE&lc=AU&item_name=Chorus%20Beer%20Fund&currency_code=AUD&bn=PP%2dDonationsBF%3abtn_donate_SM%2egif%3aNonHosted">Jeremy ein Bier kaufen
</a>,
100 um Danke zu sagen. :)
</p>
101 <h2 id=
"lizenz">Lizenz
</h2>
102 <p>Chorus2 steht unter der Creative Commons Attribution-Share Alike
3.0 United States License.
103 <a href=
"https://github.com/xbmc/chorus2/blob/master/src/lang/en/license.md">Hier klicken für Informationen.
</a></p>
104 <h2 id=
"screenshots">Screenshots
</h2>
105 <h3 id=
"homepage-wiedergabe-">Homepage (Wiedergabe)
</h3>
106 <p><img src=
"https://raw.githubusercontent.com/xbmc/chorus2/master/dist/screenshots/now-playing.jpg" alt=
"alt text" title=
"Homepage/Now Playing"></p>
107 <h3 id=
"suchergebnisse">Suchergebnisse
</h3>
108 <p><img src=
"https://raw.githubusercontent.com/xbmc/chorus2/master/dist/screenshots/search.jpg" alt=
"alt text" title=
"Search"></p>
109 <h3 id=
"k-nstler">Künstler
</h3>
110 <p><img src=
"https://raw.githubusercontent.com/xbmc/chorus2/master/dist/screenshots/artists.jpg" alt=
"alt text" title=
"Artists"></p>
111 <p><img src=
"https://raw.githubusercontent.com/xbmc/chorus2/master/dist//screenshots/artist.jpg" alt=
"alt text" title=
"Artist"></p>
112 <h3 id=
"videobibliothek">Videobibliothek
</h3>
113 <p><img src=
"https://raw.githubusercontent.com/xbmc/chorus2/master/dist/screenshots/tv.jpg" alt=
"alt text" title=
"TV"></p>
114 <h3 id=
"filterfunktionen">Filterfunktionen
</h3>
115 <p><img src=
"https://raw.githubusercontent.com/xbmc/chorus2/master/dist/screenshots/movie.jpg" alt=
"alt text" title=
"Movies"></p>
116 <h3 id=
"einstellungen">Einstellungen
</h3>
117 <p><img src=
"https://raw.githubusercontent.com/xbmc/chorus2/master/dist/screenshots/settings.jpg" alt=
"alt text" title=
"Settings"></p>
118 <h3 id=
"erweiterungen">Erweiterungen
</h3>
119 <p><img src=
"https://raw.githubusercontent.com/xbmc/chorus2/master/dist/screenshots/addons.jpg" alt=
"alt text" title=
"Add-ons"></p>
120 <h3 id=
"medien-bearbeiten">Medien bearbeiten
</h3>
121 <p><img src=
"https://raw.githubusercontent.com/xbmc/chorus2/master/dist/screenshots/edit-media.jpg" alt=
"alt text" title=
"Editing Media"></p>