Adobe Edge Dateien/Code einbinden

**hellwach** · 23.02.2012, 11:44

Hallo,

Adobe Edge ist zwar noch in der Preview Version, doch es sieht schon sehr vielversprechend aus!
Nun wäre ich dabei das Ganze in Contao einzubinden. Via "iframe" hat es auch funktioniert, doch ist es nicht ganz so eine schöne Lösung.

Hier trotzdem der Code vielleicht benötigt ihn jemand:

HTML-Code:

<iframe src="/tl_files/template/ordner_mit_allen_edge_dateien/meinedatei.html" name="Bildname" width="640" height="450" scrolling="no" frameborder="0">
</iframe>

Hat jemand vielleicht schon Erfahrung damit, ob es eine elegantere Möglichkeit ohne "iframe" gibt?

Vielen Dank,
Gruß Markus

**Messa** · 23.02.2012, 11:52

Wie sieht den der Code aus der Adobe Edge ausgiebt?
Wie ich sehe ist eine .hmtl Datei.

Wenn ja dann könntest du den Code auch in ein Modul packen "Eigener HTML-Code"

lg Matthias

**hellwach** · 23.02.2012, 12:04

Ja der Code besteht aus einer .html Datei und aus weiteren sieben .js Dateien.
- dateiname.html
- dateiname_edgePreload.js
- dateiname_edgeActions.js
- dateiname_edge.js
- edge_includes/edge.0.1.4.min.js
- edge_includes/jquery-1.6.2.min.js
- edge_includes/jquery.easing.1.3.js
- edge_includes/yepnope.js

Im .html Dokument wird eigentlich nur eine Javascript Datei in einen div Layer geladen. Hier der Code der .html Datei:

HTML-Code:

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv='Content-Type' content='text/html; charset=utf-8'>
	<title>Untitled</title>
<!--Adobe Edge Runtime-->
    <script type="text/javascript" charset="utf-8" src="dateiname_edgePreload.js"></script>
<!--Adobe Edge Runtime End-->

</head>
<body style="margin:0;padding:0;">
	<div id="stage" class="dateiname-4">
	</div>
</body>
</html>

Ich hätte einmal ganz frech mit dem Inhaltselement "Eigener HTML-Code" folgendes probiert, was aber leider nicht funktioniert hat.

HTML-Code:

<script type="text/javascript" charset="utf-8" src="/tl_files/template/ordner_mit_edge_dateien/dateiname_edgePreload.js"></script>
<div id="stage" class="qness_intro-4"></div>

Jedenfalls danke für die rasche Antwort!
Gruß Markus

**Messa** · 23.02.2012, 13:23

Unter Themes - Seitenlayout kannst du Zusätzlich Head sachen einfügen auf dein Script so aufrufen
und dann einen egenen HTML Code mit dem Modul machen.
Dann solte das klappen.

lg

**hellwach** · 23.02.2012, 21:58

Hm, danke für den Hinweis, doch es hat leider auch nicht funktioniert.
Die beiden Tags werden zwar laut firebug richtig ausgegeben doch leider ist die Animation nicht zu sehen.
Ich hätte jetzt einmal anbei eine Testdatei mit Adobe Edge erstellt. Vielleicht findest du die Zeit dir das Problem näher anzusehen...

Vielen Dank!
Gruß Markus

**conny79** · 15.07.2012, 17:27

Hallo zusammen,
auch mich hat diese Frage beschäftigt.

Falls noch jemand die Lösung braucht:
Wenn das Edge-Projekt fertig gestellt wurde, darf man zunächst einmal das "Veröffentlichen" unter "Datei" nicht vergessen.
Erstellt einen Ordner in Eurer Contao-Instalation und ladet dorthin die Dateien aus dem publish/web-Ordner.
Dann sucht Euch in der html-Datei folgenden Code:

Code:

<div id="Stage" class="EDGE-….">
	</div>

und kopiert ihn in ein Modul mit eigenem html-Code oder in ein entsprechendes Inhaltselement.

Danach kopiert Ihr aus der selben Datei folgendes Script und packt es in Euer Seitentemplate oder unter Seitenlayout in den Bereich für eigenen Java-Script-Code. Ganz wichtig: Nutzt Euren eigenen Pfad zu der Datei.

Code:

<script type="text/javascript" charset="utf-8" src="EUER_PFAD/index_edgePreload.js"></script>
    <style>
        .edgeLoad-EDGE-... { display:none; }
    </style>

Dann müsst Ihr noch in der …_edgePreload.js sämtliche Dateipfade (5) anpassen. Am besten nutzt Ihr die komplette URL Eurer Seite. Also "http://www.EureSeite.de/Ordner/Ordner/Datei.js"
In der …_edge.js sucht die var im="…" und passt dort auch noch den Pfad an.

Dann sollte es gehen.
Wenn jemand noch eine Idee hat, wie das Ganze noch ein wenig schneller lädt, wäre das super.

**Messa** · 26.01.2013, 22:44

Habe gerade gesehen es ist eine Erweiterung entwickelt worden.

https://community.contao.org/de/show...obe-EDGE-Modul

lg Matthias

**matthias_g** · 14.11.2014, 18:39

Ich stehe auch gerade vor dem Problem eine Animation in Contao einzubinden.

Irgendwie scheitere ich daran total. Mich wundert es das mein Script kein _edgePreload.js eingbunden ist?
Hat jemand einen Tipp?

HTML-Code:

<script type="text/javascript" charset="utf-8" src="http://animate.adobe.com/runtime/5.0.0/edge.5.0.0.min.js"></script>
    <style>
        .edgeLoad-EDGE-12356440 { visibility:hidden; }
    </style>
<script>
   AdobeEdge.loadComposition('Map_Start', 'EDGE-12356440', {
    scaleToFit: "none",
    centerStage: "none",
    minW: "0",
    maxW: "undefined",
    width: "943",
    height: "334"
}, {"dom":{}}, {"dom":{}});
</script>
<!--Adobe Edge Runtime End-->

**zonky** · 13.04.2015, 08:10

Moin,

ich habe mein Edge "verbummelt" und suche die letzte freie Version 1.5.0 für Windows - leider ist die "im Netz" nicht mehr auffindbar => kann mir jemand helfen..??

Gruss & Dank