Einen "Picker" (auswählen/"Durchsuchen...") für Pfad+Dateinamen gesucht

[Wursel]

Hallo Forum,

ich möchte bei einem kleinen Projekt folgendes erreichen:

In einem Formular ist u.A. ein Textfeld "Videodatei". Dieses Feld soll auf eine lokale Datei auf dem Rechner (PC, Smarphone etc.) zeigen. Der Dateiname könnte eingetippt werden (z.B. file:///c:/videos/video01.mp4). Es wäre aber schön, wenn man den Dateinamen inkl. Pfad im lokalen Dateisystem des Rechners suchen könnte und dieser Pfad+Dateiname automatisch in das Textfeld übernommen würde.
Was schon geht: Ich kann eine Datei auswählen und bekomme den Dateinamen zurückgeliefert, jedoch ohne den dazugehörigen Pfad. Mir ist bewusst, dass das absichtlich d.h. aus Sicherheitsgründen nicht zurückgeliefert wird, da das sonst missbraucht werden könnte.
Vielleicht fällt euch aber trotzallem eine Möglichkeit ein, wie ich es dem User bequemer machen könnte, den Pfad+Dateinamen auszuwählen. Sonst müsste er die Datei im Explorer suchen (oder im Dateimanager beim Smartphone/Tablet), den Pfad+Dateinamen kopieren und im Formular einfügen. Und an das file:/// davor denken. Gut - letzteres könnte man vorne dran setzen lassen.
Bevor jemand fragt: Das Video wird lokal abgespielt. D.h. es wird nichts vom/zum Server herunter-/hochgeladen sondern einfach direkt lokal abgespielt. Das ist grob gesagt eine Art Kiosksystem. Die HTML-Datei kann lokal auf dem System liegen samt Videos oder auf einem Webserver mit lokalen Videos oder die HTML-Datei lokal aber die Videos über HTTP oder beides (HTML + Videos) über HTTP. Im Fall von Webvideo muss der Anwender die URL per copy+paste eintragen. Meistens liegen die Videos jedoch lokal und dort wäre ein "Picker" für Pfad+Dateinamen praktisch.

Im Formular habe ich folgendes:

Select Video: <input type='file' id="filename1" accept='text/plain' onchange='alertFilename();'>

Und als Test:

function alertFilename()
{
	var thefile = document.getElementById('filename1');
	alert(thefile.value);
}

Das funktioniert genau so wie gewünscht... bis darauf, dass nur der Dateiname zurückgeliefert wird. Eine andere Idee wäre, per Drag-and-Drop den Dateinamen zu übernehmen:

<div> 
    <object type="text/html" data="file:///c:/videos" width="800px" height="600px" style="overflow:auto;border:5px ridge blue">
    </object>
</div>

Und dann kann man in dem DIV die Datei suchen und per Drag-and-Drop ins Textfeld ziehen. Aber das geht vermutlich auch nicht so einfach wegen Sicherheitsrisiko. Hat da jemand Erfahrung?
Eine weitere Idee wäre, das Dateisystem einzulesen (mit einem Tool) und alle Pfade/Dateien in eine Datei zu schreiben und diese in der Website zu laden um dann dadurch an die Pfade zu kommen. Das ist natürlich umständlich und Plattformabhängig - kann man also eher vergessen.
Es gibt wohl noch einen Chrome Startparameter, der beim ersten Beispiel oben auch den vollen Pfad zur Verfügung stellt statt nur der Dateiname, aber das schränkt natürlich ebenfalls ein (Stichwort Smartphone, Tablet oder andere Browser).

Habt ihr sonst noch Ideen, was ich machen könnte?

Gruß,
Wursel

[Christian Marquardt]

Eine weitere Idee wäre, das Dateisystem einzulesen (mit einem Tool) und alle Pfade/Dateien in eine Datei zu schreiben und diese in der Website zu laden um dann dadurch an die Pfade zu kommen. Das ist natürlich umständlich und Plattformabhängig - kann man also eher vergessen.

Das ist im Internet nicht möglich! Javascript hat keine Befehle zur Dateiverarbeitung

Somit ist dein ganzes Vorhaben sinnlos, da du auf die Datei nicht zugreifen kannst.

Bevor jemand fragt: Das Video wird lokal abgespielt. D.h. es wird nichts vom/zum Server herunter-/hochgeladen sondern einfach direkt lokal abgespielt. Das ist grob gesagt eine Art Kiosksystem. Die HTML-Datei kann lokal auf dem System liegen samt Videos oder auf einem Webserver mit lokalen Videos oder die HTML-Datei lokal aber die Videos über HTTP oder beides (HTML + Videos) über HTTP. Im Fall von Webvideo muss der Anwender die URL per copy+paste eintragen. Meistens liegen die Videos jedoch lokal und dort wäre ein "Picker" für Pfad+Dateinamen praktisch.

Das spielt keine Rolle. Bloß weil du was lokal machst, werden Javascript und/oder Browser sich nicht anders verhalten

[Wursel]

<tl;dr>Suche Methode eine Datei zu "picken" und anschließend den Dateinamen inkl. Pfad als String übermittelt zu bekommen. Nur Dateiname funktioniert schon, der Pfad fehlt dabei jedoch. Alternativen/Ideen/Tricks gesucht.</tl;dr>

Das ist im Internet nicht möglich! Javascript hat keine Befehle zur Dateiverarbeitung

FileAPI (https://www.w3.org/TR/FileAPI/). Damit lese ich eine JSON Konfigurationsdatei vom lokalen Dateisystem ein. Das funktioniert und ist auch nicht mein Problem. Ich glaube Du hattest mich missverstanden.
Die Idee mit einem Tool das Dateisystem einzulesen war so gemeint:
Ein auf dem Rechner lokal laufendes / gestartetes Programm z.B. eine EXE unter Windows erstellt eine Datei mit allen Pfaden+Dateinamen und diese Datei wird dann via FileAPI eingelesen und verwendet. Das funktioniert (probeweise getestet), ist aber wie geschrieben nicht sinnvoll. Mir ist schon klar, dass ich über die FileAPI nicht das gesamte Dateisystem rekursiv via JavaScript einlesen kann. Deshab hatte ich als dritte Idee die mit einem Tool. Ich hoffe jetzt ist klarer, was ich damit meinte.

Somit ist dein ganzes Vorhaben sinnlos, da du auf die Datei nicht zugreifen kannst.

[...]
Das spielt keine Rolle. Bloß weil du was lokal machst, werden Javascript und/oder Browser sich nicht anders verhalten

Ich will keine Dateiverarbeitung mit Javascript durchführen. Ich habe nicht das Vorhaben, auf die Datei(en) zuzugreifen. Mein sinnloses Vorhaben läuft schon - nur suche ich noch eine Möglichkeit, bequemer eine Datei samt Pfad einzutragen (einen "String" mit dem Pfad+Dateinamen). Ich habe ein Formular mit Textfeldern in die man einen Pfad+Dateinamen händisch eintippen kann und dann läuft das, was laufen soll. Es funktioniert d.h. es ist fertig. Als Alternative zum händischen Eintippen oder Copy+Paste möchte ich hier die Frage stellen, ob es noch bequemere Alternativen gibt. Z.B. einen "Dateipicker", der den Pfad+Datei einträgt. Ich möchte diese Datei NICHT auslesen (auch wenn das zweifelsohne möglich ist) - ich brauche nur den Pfad+Dateinamen als String ("file:///c:/videos/video01.mp4"). Das habe ich auch wie beschrieben gefunden, mit der Einschränkung, dass nur der Dateiname übertragen wird ohne Pfad. Meine Frage lautet: gibt es sonst noch Möglichkeiten/Alternativen/Tricks? Falls nicht: kein Beinbruch - es läuft ja, nur wäre es viel bequemer mit einem "Picker". Vielleicht hat ja noch jemand eine Idee dazu, an den Dateipfad zu kommen. Man könnte natürlich festlegen, alle Dateien sollen im gleichen Unterverzeichnis "videos" relativ zur html-Datei liegen und man soll nur daraus die Dateien picken. Das ginge - ist aber nicht so schön.

Also statt file:///c:/videos/video01.mp4 in ein Textfeld einzutippen, eine Möglichkeit, im Dateisystem auf C:\videos\video01.mp4 zu browsen und diesen Namen als URL (file:///c:/videos/video01.mp4) automatisch in das Textfeld zu übernehmen. Das wars schon. Sonst soll nichts weiter gemacht werden.

Gruß,
Wursel

[Christian Marquardt]

Korrektur.

http://www.html5rocks.com/de/tutorials/file/dndfiles/

Seit HTML 5 können wohl Dateien gelesen werden.
Da ist ein Drag & Drop Beispiel