Buch zum Umblättern

[Rango]

Hallo Community!
Ich habe mal eine sehr spezielle Frage. Ich möchte gerne ein Buch (ca. 50 Seiten DIN A4, alle Rechte bei mir) einscannen und auf einer CMSimple_XH Site anzeigen. Möglichst aber nicht zum Download, sondern nur zum Lesen. Auf manchen Websites habe ich sowas mal als "animierte" Darstellung zum Umblättern gesehen. Also wie ein Buch, beim dem man links unten auf die Seitenecke klickt und dann blättert es um. Wäre das realisierbar? Hat jemand eine Lösung, wie das zu machen ist? Schon jetzt vielen Dank für Eure Hilfe.
Viele Grüße
Uwe

[Tata]

Das erste, dass mir eingefallen ist, ist die Fotogalerie Plugin mit einem Bild/Page. Da brauchst Du dann auch die maxGrösse den Bilder richtig wählen. Jeder Bild hat dann die Blätternmöglichkeit automatisch dabei. Schau mal auf CMSimplewiki auf andere ähnliche Plugins.

[cmb]

Hallo Uwe,

machbar ist das mit Flash oder Silverlight, oder bei neueren Browsern mit dem HTML5 Canvas Tag. Ich hab' mich diesbezüglich vor einer Weile mal umgeschaut -- allerdings nur für JS (Flash & Co. mag ich nicht). Da gibt es wohl verschiedene Bibliotheken, z.B. http://dl.dropbox.com/u/7235888/jpageflipper/index.html. Eigentlich hatte ich überlegt ein CMSimple-Plugin draus zu machen, aber: Canvas ist auch bei IE8 noch nicht verfügbar, und ich möchte ungern dazu beitragen den alten Browser-Krieg wieder neu zu starten Jetzt sehe ich aber, dass es wohl auch Plugins für IE gibt, die das Canvas-Element verfügbar machen. Vielleicht also doch eine interessante Option für ein CMSimple-Plugin -- zumindest für die Zukunft, wenn der IE9 etwas verbreiteter ist.

Für Deinen speziellen Fall kannst Du es vielleicht selbst umsetzen. Unter http://www.jquery.info/scripts/jFlip/demo.html findest Du eine Doku -- sieht eigentlich auch ohne JS-Kenntnisse machbar aus.

Ansonsten kannst Du auch mal nach "flash page flip" googeln. Da findet sich zumindest einiges.

Christoph

[snafu]

Es gibt einfach Dinge die sich mit CMSimple nicht generell oder auch nicht immer schön lösen lassen.
Ich benutze für meineMacro Auswahl so ein Page Flip Flash System, schaus dir einfach mal an

[cmb]

Hallo Winni,

Es gibt einfach Dinge die sich mit CMSimple nicht generell oder auch nicht immer schön lösen lassen.

Ja, schon richtig. CMSimple ist ja auch ein CMS und keine Galerie-Software. Und es bleibt auch immer das Problem, dass bei der Einbindung innerhalb einer CMSimple-Seite nicht mehr der gesamte Bildschirm zur Verfügung steht.

Ich benutze für meineMacro Auswahl so ein Page Flip Flash System, schaus dir einfach mal an

Die Bilder sind absolut super! Optisch und funktionell finde ich das MegaZine sehr gelungen. Die Technik (Flash) allerdings mag ich persönlich nicht.

Im Prinzip geht das aber auch mit JS. Das hier hab' ich mal auf die Schnelle zusammen gestellt (funktioniert prima in Chrome, Opera und Safari; im FF ist's etwas langsam; der IE<=8 kennt leider das Canvas-Element nicht). Verwendet habe ich http://www.turnjs.com/ und Colorbox.

Christoph

[snafu]

Eigentlich mag ich Flash auch nicht, aber ich hab für das Projekt etwas mit Buch"haptik" gesucht. Da ich meine Bilder gerne groß präsentiere, kam eine embedded Lösung für Wordpress (dafür gibt es einige page flip plugins), das ich zu der Zeit noch benutzte, nicht in Frage. Alles zu klein oder schlechte scalierung und so weiter ...
Natürlich etwas scalierungs und fullscreen Möglichkeiten, manigfaltige Optionen, leichte Installation/Administration (womit ich nicht unbedingt komfortabel meine, sondern leicht verständlich) und für privaten, nichtkomerziellen Einsatz kostenfrei (ohne signifikante Beschränkungen der Feautures, wie bei einigen Lightversionen der Mitbewerber). Ich hab so ziemlich alles ausprobiert, was der Markt hergibt und, Flash hin oder her, für Projekte die Büchern, Katalogen,Journalen oder Broschüren ähneln sollen nehm ich nix anderes mehr.

[cmb]

Hallo Winni,

für Wordpress ..., das ich zu der Zeit noch benutzte

du Ärmster

Spaß beiseite: natürlich hast Du völlig recht! Gerade wenn man gute Photos in entsprechend guter Qualtität präsentieren möchte, ist CMSimple nicht die "erste" Wahl (andere CMSe wohl auch nicht). Da lohnt es sich, einmal nach "externen" Skripten zu suchen, und diese zu verwenden. Allerdings würde es mich nicht wundern, wenn sich da in naher Zukunft attraktive, nicht Flash-basierte Lösungen auftun/anbieten.

Wem's aber nur um den Eyecatcher geht, kann wohl schon jetzt(/bald?) mit einem CMS(imple)-Plugin brauchbare Ergebnisse erzielen. Konkret zu Uwes Anfrage: Einscannen und Anbieten der Inhalte als Bild ist ohnehin nur "zweite" Wahl. Als PNG verliert es spätestens im Zoom-Modus, als JPEG sowieso. Besser wäre da schon, wenn überhaupt nötig, eine OCR-Software, die das Buch als Text verfügbar macht...

Christoph

[snafu]

moin Christoph

ich mag jetzt als überzeugter CMSimple Fan keine Megazine Werbung/Support betreiben, aber ein paar Kleinigkeiten muss ich doch zurechtrücken.
Ein Flip Book als Eyecatcher sieht eingebettet, egal ob CMSimple, Wordpress, Joomla oder Mediawiki immmer ziemlich "minderbemittelt" aus, im Vergleich zu Standalone Lösungen, einfach weil das Trägersystem nämlich ziemlich viel Präsentationsfläche raubt. Deswegen gibt es zwar genügend Plugins für die diversen Systeme, aber auf freier WWW Wildbahn (also nicht nur bei den Entwicklern) sieht man sie dann eher selten.

Als PNG verliert es spätestens im Zoom-Modus, als JPEG sowieso

<hust>
a. natürlich nimmt man auch hier besser JPGs ;-}
b. bei Megazine kann man die Zoomstufen mit unterschiedlichen Bildern verknüpfen, man kann also auf dem eigenen Rechner optimierte jpgs für die jeweilige Zoom Stufe generieren (per batch kein Aufwand) und sich nicht auf das mehr oder weniger gute Rendering der Flash Engine verlassen.
Man kann natürlich auch das Buch mit entsprechender Paginierung als PDF erzeugen, ein Konverter kann das in swf Futter für Megazine umwandeln (bei swf gibt es beim skalieren keine Qualitätsverluste ... dafür steigt halt das Datenvolumen).

Manche Bücher will man gar nicht als reinen Text verfügbar machen, sondern als "Original". Die "Sehbriefe" (ein Fotolehrgang aus den 20ern, eines meiner Megazine Projekte), Text mit Bildern gemischt, vergilbtes Papier, die würde ich nie als OCR Scan verfügbar machen, da geht jeder Reiz verloren.

wenn man auf jegliches eyecatching (wie das Zeigen eines Umblätterns) verzichtet, kann man das auch jetzt schon in CMSimple realisieren (ich hab sowas schonmal in HTML (Beispielbild) gemacht, Die Administration einer 2-3 stelligen Anzahl von HTML Seiten bekommt aber leicht die Dimension einer grichischen Tragödie.)
Header und Topnavigation, dann das Huptinhaltsfenster aufgeteilt in zwei 50% Boxen, in einer der Content und in der anderen dazu coco_xh, darunter der Footer.

[cmb]

Hallo Winni,

danke für die ausführlichen Erläuterungen und weiteren Tipps. Nun hat Uwe sicherlich einige Möglichkeiten, und kann sich die für ihn passende aussuchen.

Bzgl. PNG vs. JPEG hast Du recht! Ich hab's gerade mal getestet, und bin verblüfft, wie gut JPEG mit Text klar kommt -- da hab ich wieder mal was gelernt.

Zum Eyecatcher: darunter verstehe ich nicht eine gute optische Darstellung, oder irgendwelche Effekte an sich, sondern ein Element, das den Blick des Betrachters fängt. Und zu diesem Zweck ist eine "kleine" Buchdarstellung, die auf einer CMSimple-Seite integriert ist, vielleicht gar nicht schlecht. Diese kann ja dann zu einer Standalone-Lösung verlinkt sein.

Christoph

[Rango]

Hallo Leute,
erst einmal vielen Dank für die vielen Antworten. Ich war leider einige Zeit verhindert und melde mich daher erst jetzt wieder. Nachdem ich die aktuelle Version 1.5.3 von XH installiert hatte, bin ich auf das tolle Plugin TemPlug von Gert gestossen. Das ist ja echt der Hammer! Ein tp-Template damit anzupassen geht wirklich super einfach und schnell. Die reine Freude. Okay, nachdem also das Design fertig war, wollte ich nun den Page-Flipper einbauen. Da es auf möglichst vielen Browser-Versionen laufen soll, habe ich mich für den "jFlip" entschieden (soweit ich verstanden habe reines javascript). Leider musste ich feststellen, dass meine js-Kenntnisse doch etwas spärlich sind. Früher kamen wohl die Definitionen in den Head der HTML-Seite und der Script-Aufruf dann an die entsprechenden Stelle in den Body. Tja, aber wie mache ich das jetzt in XH unter jQuery? Der Code an sich ist wohl folgender:
----------------------------------------------------------------
<head>
<title>jFlip Gallery Demo</title>
<link rel="stylesheet" href="style.css">
<!--[if IE]><script type="text/javascript" src="excanvasX.js"></script><![endif]-->
<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="jquery.jflip-0.4.js"></script>
<script type="text/javascript">
(function($){
$(function(){
$("#g1").jFlip(300,300,{background:"green",cornersTop:false}).
bind("flip.jflip",function(event,index,total){
$("#l1").html("Image "+(index+1)+" of "+total);
});
$("#g2").jFlip(300,300,{background:"green",cornersTop:true,scale:"fit"});
$("#g3").jFlip(300,300,{background:"green",cornersTop:true,scale:"fill"});
});
})(jQuery);
</script>

<style type="text/css">
.flip_gallery,#l1 {margin:10px}
</style>
</head>

<body>
<pre>
$("#g1").jFlip(300,300,{background:"green",cornersTop:false}).
bind("flip.jflip",function(event,index,total){
$("#l1").html("Image "+(index+1)+" of "+total);
});
</pre>
<ul id="g1">
<li>
<img src="flower1.jpg" />
</li>
<li>
<img src="flower2.jpg" />
</li>
<li>
<img src="flower3.jpg" />
</li>
<li>
<img src="flower4.jpg" />
</li>
<li>
<img src="flower5.jpg" />
</li>
<li>
<img src="flower6.jpg" />
</li>
</ul>
<div id="l1">Image 1 of 6</div>
</body></html>
-----------------------------------------------------------------------
Benötige ich eigentlich die referenzierte "style.css" damit es funktioniert? Die wichtigste Frage aber: Was brauche ich von dem vorgenannten Code und vorallem wo muss was hin und wie mache ich den Aufruf auf der Seite?
Das es in der Art <script type="text/javascript"> --Script-Name -- ;</script> sein muss und dass die einzelnen Seiten per <li> gelistet werden ist mir zwar klar, ich habe aber keinen Schimmer, wie das in diesem konkreten Fall gehen soll. Also wieder mal ein (fast peinlicher) verzweifelter Hilfeschrei.
Viele Grüße
Uwe