source: t29-www/shared/js/tools.js @ 189

Last change on this file since 189 was 189, checked in by sven, 14 years ago

Translation-System erweitert, offizieller Upload in Homepage.

  • editor.php ist AJAX-Backend, welches Mail aufsetzt (ziemlich spartanisch)
  • submit.php (ziemlich Quick & Dirty) ist Noscript-Alternative, die komplette Seite auf Text runtergestrippt bearbeitet und an einen dev.technikum29.de-Formmailer verschickt (ansonsten haette man hier noch ein Captcha-System einbauen muessen).
  • tools.js: Ladezeit - editor.js wird bei Aktivierung nachgeladen. Leider geht das mit dem viel groesseren editor.css nicht, weil es den schicken Button rendern muss.
  • Property svn:keywords set to Id
File size: 8.5 KB
Line 
1/**
2 * technikum29.de | page wide javascripts
3 *
4 * Dies ist eine Sammlung von kleinen jQuery-Funktionen, die jeweils kleine
5 * Anpassungen und Verbesserungen an der www.technikum29.de-Website bieten.
6 * Fuer seitenspezifische Scripts siehe common.js.
7 * Per Default werden alle Funktionen am Ende dieses Scripts beim Seitenladen
8 * ausgefuehrt.
9 * Dieses Script benoetigt eine aktuelle jquery.js.
10 *
11 * 2010 Sven Koeppel $Id: tools.js 189 2010-09-05 04:01:37Z sven $
12 * Released under the public domain
13 *
14 **/
15 
16var t29 = {}; // the t29 namespace
17
18/**
19 * Common helper functions
20 **/
21 
22// get the language of the current document
23t29.language = function(){ return $("h1").hasClass("de") ? "de" : "en"; }
24
25// T29 Gettext. Usage:
26//   t29.gettext("deutscher text", "englsischer text");
27//   t29.gettext({ de: "deutscher Text", en: "englischer Text" });
28//   t29.gettext(anything, null) wont work, use t29.gettext({ de: anything, en: null});
29t29.gettext  = function(de, en) {
30        if(!en){ en=de.en; de = de.de; }
31        return t29.language()=="de" ? de : en;
32}
33
34/**
35 * technikum29.de | javascript: Unobstructive copyright information
36 *
37 * Since there are so many people copying pictures from the website without
38 * even knowing ot the copyright statements on the imprint, we tested some
39 * jQuery-powered ways to inform them in an "unobstructive" way:
40 *
41 * - hovering a picture replaces it with the "hotlinking picture"
42 *   (see http://dev.technikum29.de/src/hotlinking), that is, an embedded
43 *   watermark / copyright tag
44 * - hovering some more time over the picture yields a small informative
45 *   box (containing the alt-label of the picture) that informs about the
46 *   copyright message
47 *
48 * See Revision 169 for these features. They have been completely developed,
49 * but removed again for a much smaller and lighter solution (just some black
50 * box at the bottom corner of the picture).
51 *
52 * 2010 Sven Koeppel
53 **/
54t29.img_license_settings = {
55        // enable or disable system (e.g. used as API in Translation subsystem)
56        enabled : true,
57
58        // content for the license tags (depending on language)
59        text : {
60                de: '&copy; technikum29. <a href="/de/impressum.shtm#image-copyright">Lizenzbestimmungen</a>',
61                en: '&copy; technikum29. <a href="/en/contact.shtm#image-copyright">Licensing terms</a>',
62        },
63
64        // min size of pictures to display the license tag
65        treshold_size : [255,100], // [w,h]
66       
67        // selector to exclude images from being license tagged
68        exclude : "img.no-copyright, .no-copyright img, .start img, .impressum img"
69};
70
71// configuration end
72
73t29.img_license = function() {
74        $("body").append('<div id="img-license-tag"><p>'+
75                // detect language by heading language (ripped from t29_gmaps...)
76                t29.img_license_settings.text[t29.language()]+'</p></div>');
77        var tag = $("#img-license-tag");
78        var tag_top = function() { if(t29.img_license_settings.img)
79                tag.css("top", Math.min(
80                        t29.img_license_settings.img.offset().top + t29.img_license_settings.img.height(),
81                        $(window).scrollTop()+$(window).height()));
82        };
83        $("img").not(t29.img_license_settings.exclude).hover(function(){
84                if(!t29.img_license_settings.enabled
85                      || this.width < t29.img_license_settings.treshold_size[0]
86                      || this.height < t29.img_license_settings.treshold_size[1])
87                        return;
88                t29.img_license_settings.img = $(this);
89                tag.css({
90                        left: $(this).offset().left,
91                        // top: tag_top();
92                        width: $(this).width(),
93                        display: "block"
94                });
95                tag_top();
96                tag.css("margin-top", -tag.height()); // erst in zweitem schritt
97        }, function(){ tag.hide(); t29.img_license_settings.img = null; });
98        $(window).scroll(tag_top);
99        tag.hover(function(){ $(this).show(); }, function(){ $(this).hide(); });
100};
101
102/**
103 * technikum29.de | javascripts: window-size-classes
104 *
105 * Seit August 2010 gibt es endlich eine saubere Moeglichkeit, mit verschieden
106 * grossen Monitoren vs. grossen Bildern gut umgehen zu koennen. Per CSS kann
107 * nun unterschieden werden zwischen
108 *   body.lesser1024  -  es liegt Bildschirmbreite <= 1024 vor
109 *   body.greater1024 -  es liegt Bildschirmbreite < 1024 vor
110 *   body.greater1028 -  es liegt Bildschirmbreite >= 1280 vor
111 *
112 * Wird etwa fuer das Univac-Titelbild verwendet.
113 *
114 **/
115t29.window_size = function() {
116        var body = $("body"); // Reichenzeit sparen
117        $(window).resize(function(){
118                var width = window.innerWidth;
119                body.toggleClass("lesser1024", width < 1024)
120                    .toggleClass("greater1024", width >= 1024)
121                    .toggleClass("greater1280", width >= 1280); 
122        }).resize();
123}
124
125/**
126 * technikum29.de | javascripts: hostinfo
127 *
128 * Um optisch zwischen verschiedenen Hosts der Website unterscheiden zu koennen,
129 * wurde im August das hostinfo-System eingefuehrt. Es laedt per AJAX die un-
130 * versionierte "hostinfo.shtm" aus dem Homepage-Root (wo auch /de, etc. ist).
131 * Dort kann beliebiges HTML stehen, was in eine Box in die Sidebar gesetzt wird.
132 * Beispiel fuer hostinfo.shtm:
133 *
134 * <!-- Dies ist die Hostinfo fuer technikum29.irgendein.server.lan -->
135 * <div class="de">Deutscher Erklaerungstext</div>
136 * <div class="en">Englischer Erklaerungstext</div>
137 * <script ...></script>
138 *
139 **/
140t29.hostinfo = function() {
141        if(location.hostname != "www.technikum29.de") {
142                $.get("/hostinfo.shtm", function(data) {
143                        $("#sidebar").append("<div class='box' id='sidebar-hostinfo'/>");
144                        $("#sidebar-hostinfo").html(data);
145                });
146        }
147}
148
149/**
150 * technikum29.de | javscripts: auto-bildbreite
151 *
152 * Zur Ergaenzung des Bildbox-Konzepts wurde Januar 2010 die automatische
153 * Erkennung der Breiten der Bilder hinzugefuegt. Funktionsweise:
154 *
155 * <div class="box center auto-bildbreite">
156 *   <img ... />
157 *   <p class="bildtext"> bla bla bla </p>
158 * </div>
159 *
160 * Im Januar wurde ein 60-zeiliges JavaScript geschrieben, was nun in einen
161 * jQuery-oneliner (!) migriert wurde
162 **/
163t29.auto_bildbreite = function() {
164        $("div.auto-bildbreite").each(function(){ $(this).css("width", $("img", this).width()); });
165}
166
167/**
168 * technikum29.de | javascripts: links to headings
169 *
170 * Um auf Ueberschriften direkt verweisen zu können, erzeugt diese Funktion
171 * fuer jede Ueberschrift einen Anker, der dann per CSS formatiert wird.
172 * Ankernamen koennen etwa mit
173 *  <h2 id="Ankername">...
174 *  <h3 title="Ankername">...
175 * erzwungen werden. Ansonsten wird wie in Wikipedia die Ueberschrift selbst
176 * verwendet:
177 *  <h2>Foo Bar</h2>  =>  #Foo_Bar
178 **/
179t29.heading_links = function() {
180        $("#content").find("h2,h3").not("h2:first").each(function(){
181                anchor = ($(this).attr("title") || $(this).attr("id") || $(this).text())
182                        .replace(/\s+/g, '_').replace(/[?!"']/g, '').replace(/^_+|_+$/g, '');
183                $("<a class='anchor'> \u00B6</a>").attr({
184                        href: "#"+anchor,
185                        name: anchor,
186                        title: t29.gettext("Direktlink zu diesem Abschnitt", "Link to this section")
187                }).appendTo(this);
188        });
189       
190        // Opera und Internet Explorer machen mit, Firefox nicht, also:
191        if((hash=location.hash.substr(1)).length && (link=$("a[name="+hash+"]")).length)
192                //$('html, body').animate({scrollTop: link.offset().top}, 1000);  // smooth scrolling
193                $('html, body').scrollTop(link.parent().offset().top); // springen
194}
195
196
197/**
198 * technikum29.de | javascripts: english translation system loader
199 *
200 * Um die Ladezeiten des translation systems geringer zu halten, werden
201 * JavaScript und CSS dynamisch nachgeladen.
202 * @param success_function Function to execute after set_enabled(true) has been called.
203 * @returns immediately returns, asynchronous content loading
204 **/
205t29.start_tr = function(success_function) {
206        // kruder Hack, um die Ladezeit zu ueberstehen: schon mal Designaenderung
207        $("body").toggleClass("tr-enabled tr-disabled");
208        $.getScript('/en/dev/translation/editor.js', function(){
209                t29.tr.set_enabled(true); if(success_function) success_function(); });
210        // unfortunately the CSS is already needed for #sidebar-tr styles (button)
211        /*$.get('/en/dev/translation/editor.css', function(css) {
212                $("<style type='text/css'/>").html(css).appendTo("head");
213        });*/
214};
215
216t29.prepare_tr = function() {
217        $("#sidebar-tr .tr-disabled a").click(function() {
218                t29.start_tr();
219                return false;
220        }).attr('href', '#help_with_mistakes');
221
222        // startup tr system with query string like ?tr or ...tr-...
223        // or for people who opened link in another tab
224        if(location.search.match(/tr-|^tr/i) || location.hash.match(/help_with_mistakes/)) {
225                t29.start_tr(function(){ t29.tr.display_top_notice(); });
226        }
227}
228
229 
230
231$(t29.auto_bildbreite);
232$(t29.hostinfo);
233$(t29.window_size);
234$(t29.img_license);
235$(t29.heading_links);
236$(t29.prepare_tr);
Note: See TracBrowser for help on using the repository browser.
© 2008 - 2013 technikum29 • Sven Köppel • Some rights reserved
Powered by Trac
Expect where otherwise noted, content on this site is licensed under a Creative Commons 3.0 License