fertige JavaScript funktionen einbinden

köttbullar · Montag 19. Oktober 2015, 22:17

Hallo Python Gemeinde,

ich habe unter folgendem Link
http://www.highcharts.com/
ein paar toole Javascript applicationen gefunden
diese habe ich gleich ausprobiert und wollte diese einfach mal zu testzwecken in meinen WebServer einbinden.
Naja habe schnell gemerkt, dass das nicht so einfach geht
normalerweise wird in den settings ein static ordner definiert, iin dem ich meine scripte ablege.
In diesem Fall ist es so dass es sich hierbei um einen ganzen Ordner handelt, die eine Datei verweist auf die nächste
Nun meine Frage. Gibt es eine Möglichkeit, damit ich den ganzen Ordner irgende unter static file hinzufüge, sodass ich nicht jedes Script anfassen muss um die quellen zu richten?

wenn ja wie

vielen Dank im voraus

köttbullar · Montag 19. Oktober 2015, 22:21

achja, so sieht mein Template aus:

Code: Alles auswählen

<!DOCTYPE HTML>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>Highcharts Example</title>

		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
		<style type="text/css">
${demo.css}
		</style>
		<script type="text/javascript">
$(function () {
    $('#container').highcharts({
        title: {
            text: 'Monthly Average Temperature',
            x: -20 //center
        },
        subtitle: {
            text: 'Source: WorldClimate.com',
            x: -20
        },
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
                'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },
        yAxis: {
            title: {
                text: 'Temperature (°C)'
            },
            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        },
        tooltip: {
            valueSuffix: '°C'
        },
        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'middle',
            borderWidth: 0
        },
        series: [{
            name: 'Tokyo',
            data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
        }, {
            name: 'New York',
            data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
        }, {
            name: 'Berlin',
            data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
        }, {
            name: 'London',
            data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
        }]
    });
});
		</script>
	</head>
	<body>
<script src="../../js/highcharts.js"></script>
<script src="../../js/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

	</body>
</html>

das Problem liegt wahrscheinlich hier:
<script src="../../js/highcharts.js"></script>
wenn ich jetzt:
<script src="{{STATIC_URL}}s/highcharts.js"></script>
eingebe, funktioniert, das ganze wahrscheinlich auch bis zu einem Punkt, eben bis zum nächsten verweis, dann funktioniert es nicht mehr

BlackJack · Montag 19. Oktober 2015, 22:51

@köttbullar: Ich verstehe die Frage nicht. Man hat normalerweise einen Ordner, eventuell in Unterordner aufgeteilt mit den ganzen statischen Sachen und stellt im Rahmenwerk oder Webserver die URL für die statischen Inhalte ein und muss die dann halt auch im HTML/Template entsprechend einbinden.

köttbullar · Dienstag 20. Oktober 2015, 06:07

Das problem ist, dass man normalerweise eine Javascript Datei die man immer wieder benötigt wie folgt einbindent:
<script src="{{STATIC_URL}}s/highcharts.js"></script>
d.h dass ich nun zugriff auf die Funktionen von highcharts.js habe
Wenn nun ein Verweis in der Dateil auch folgende Datei ist:
<script src="../../js/highcharts.js"></script>
dann findet Django die Datei nicht mehr

Nun wollte ich wissen, ob ich alle Pfade anpassen muss oder ob es nicht eine möglichkeit gibt, diese Ordner mit allen benötigten Datei irgendwie eleganter einzubinden.

Sirius3 · Dienstag 20. Oktober 2015, 08:02

@köttbullar: ja, am besten machst Du absolute Verweise zu Deinen statischen Daten. Weil unter welcher URL Dein Template irgendwann ausgeliefert wird, steht meist noch gar nicht fest, könnte sich auch noch ändern und könnte auch über mehrere URL erreichbar sein.

köttbullar · Dienstag 20. Oktober 2015, 16:46

Nochmals zum verständnis:
Ich habe einen Ordner mit dem Namen Javascript_Ordner in diesem Ordner liegt die Datei1.js, die Datei2.js und die Datei3.js drin
Wenn ich jetzt meinen Webserver laufen lasse und den Javscriptcode ausführe geht das wie folgt:
<script src="{{STATIC_URL}}Javascript_Ordner/Datei1.js"></script>
Nun verweist Datei1.js auf Datei2.js und Datei2.js auf Datei3.js
normalerweise sieht das dann so aus:
<script src="/Datei2.js"></script>
d.h. Wenn ich die obrigen antworten richtig interpretiert habe, dass ich dann dies wie folgt machen muss:
<script src="{{STATIC_URL}}Javascript_Ordner/Datei2.js"></script>
hätte ich jetzt noch einen Unterordner, dann müsste das so aussehen:
<script src="{{STATIC_URL}}Javascript_Ordner/Unterordner/Dateixxx.js"></script>
Ist das richtig?
wie würde es dann aussehen wenn der Unterordner wieder auf die erste Javascript Datei verweist, etwas so?
<script src="{{STATIC_URL}}Javascript_Ordner/Datei1.js"></script>

Bitte um kurze Rückantwort.
so einfach ausprobieren ist da nicht, muss ca. 81 Dateien anpassen?

vielen Dank im voraus.

BlackJack · Dienstag 20. Oktober 2015, 17:02

@köttbullar: Was heisst denn eine *.js-Datei verweist auf eine andere? '<script src="/Datei2.js"></script>' ist HTML und steht ja wohl so nicht in der `Datei1.js`‽ Und wie kann ein Unterordner auf eine *Datei* verweisen? Das klingt sehr danach als wenn Du Begriffe verwendest unter denen man eigentlich etwas anderes versteht.