source: ether_megapoli/trunk/web/resources/jsp/megapoliHead.jsp @ 263

Last change on this file since 263 was 263, checked in by vmipsl, 13 years ago

refonte des pages medias _ upload
slides à gauche
File size: 14.6 KB
Line 
1<%@ page import="com.medias.Context" %>
2
3<script type="text/javascript">
4var InterfaceTemplate = Class.create( {
5
6    initialize: function()
7    {
8        /** *********** CONTAINERS *********** **/
9        this.containerTitle = $( "#title" );
10        this.containerTools = $( "#tools" );
11        this.containerMenuData = $( "#menuData" );
12
13        /** *********** VARIABLES *********** **/
14        this.isLanguageFr = <%=Context.getLangue(request).equals( "fr" )%>;
15        this.path = "<%=request.getContextPath()%>";
16        setPath( this.path );
17        this.webmaster = "<%=Context.getWebmaster(request)%>";
18        this.relativePageUri = <%=request.getQueryString() != null%> ? "<%=Context.getRelativePath( request )%>?<%=request.getQueryString()%>" : "<%=Context.getRelativePageURI(request)%>";
19        this.jSONUser = <%=Context.getJSONUser( request )%> ? <%=Context.getJSONUser( request )%> : false;
20        setJSONUser( this.jSONUser );
21        this.screenWidthLimit = 1336;
22
23        /** ************ CREATE ************ **/
24        this.createTitle();
25        this.createTools();
26        this.createMenuData();
27        jQuery.proxy( this.createLeftSlides(), this );
28    },
29
30    // CREATES ********************************************************
31    createTitle: function()
32    {
33        this.containerTitle.addClass( "containerTitle" );
34        this.containerTitle.html( templateTexts["app.fulltitle"] );
35    },
36
37    createTools: function()
38    {
39        this.createLoginForm();
40        this.createLogin();
41        var mailButton = new Button( {value:templateTexts["data.upload.metadata.contact.mail"], parent:this.containerTools, id:"button_mail", className: "blue_button", classNameText:"blue_button_text", onClick:jQuery.proxy( this.onClickMail, this )} );
42
43        var valueLanguage = templateTexts["app.fr"];
44        if( this.isLanguageFr )
45            valueLanguage = templateTexts["app.en"];
46
47        var languageButton = new Button( {value:valueLanguage, parent:this.containerTools, id:"button_language", className: "blue_button", classNameText:"blue_button_text", onClick:jQuery.proxy( this.onClickLanguage, this )} );
48        var homeButton = new Button( {value:templateTexts["app.home"], parent:this.containerTools, id:"button_home", className: "blue_button", classNameText:"blue_button_text", onClick:this.onClickHome} );
49
50        var divSmallLogoEther = $( document.createElement( "div" ) );
51        divSmallLogoEther.attr( {id:"smallLogoEther", class:"containerSmallLogoEther"} );
52        divSmallLogoEther.append( '<a href="http://ether.ipsl.jussieu.fr" target="help"><img src="resources/images/logo_Ether.jpg" width="40px" height="40px"/></a>' );
53        this.containerTools.append( divSmallLogoEther );
54
55        this.updateLogoEther();
56    },
57
58    createLogin: function()
59    {
60        var containerLoginButton = $( "#button_login" );
61
62        if( getJSONUser() )
63        {
64            var textLogin = getJSONUser().name + " " + getJSONUser().firstName;
65            if( getJSONUser().role && "coordinateur" == getJSONUser().role )
66                textLogin += " (" + templateTexts["app.admin"] + ")";
67
68            var loginButton = new ComplexButton( {value:textLogin, parent:this.containerTools, id:"button_login"} );
69
70            $( "#button_login #button_middle #button_text" ).addClass( "containerUserLogout" );
71
72            var loginMiddle = $( "#button_login #button_middle" );
73            var divImgLogout = $( document.createElement( "div" ) );
74            divImgLogout.addClass( "containerImgLogout" );
75            divImgLogout.append( "<img src='resources/images/utils/logout.png' width='15px' height='15px/>" );
76            divImgLogout.bind( "click", jQuery.proxy( this.onClickLogout, this ) );
77            loginMiddle.append( divImgLogout );
78        }
79        else
80        {
81            var loginButton = new ComplexButton( {value:templateTexts["app.connexion"], parent:this.containerTools, id:"button_login"} );
82
83            var loginMiddle = $( "#button_login #button_middle" );
84            loginMiddle.empty();
85            loginMiddle.attr( {id:"topnav", class:"topnav complexButton_middle"} );
86            var aLogin = $( document.createElement( "a" ) );
87            aLogin.attr( {id:"button_login_a", href:"login", class:"signin"} );
88            aLogin.html( "<span>" + templateTexts["app.connexion"] + "</span>" );
89            loginMiddle.append( aLogin );
90
91            $( document ).ready( function()
92            {
93                $( ".signin" ).click( function( e )
94                {
95                    e.preventDefault();
96                    $( "fieldset#signin_menu" ).toggle();
97                    $( ".signin" ).toggleClass( "menu-open" );
98                } );
99
100                $( "fieldset#signin_menu" ).mouseup( function()
101                {
102                    return false
103                } );
104
105                $( document ).mouseup( function( e )
106                {
107                    if( $( e.target ).parent( "a.signin" ).length == 0 )
108                    {
109                        $( ".signin" ).removeClass( "menu-open" );
110                        $( "fieldset#signin_menu" ).hide();
111                    }
112                } );
113            } );
114
115            $( function()
116            {
117                $( '#forgot_username_link' ).tipsy( {gravity: 'w'} );
118            } );
119        }
120    },
121
122    createLoginForm: function()
123    {
124        var containerLoginForm = $( document.createElement( "fieldset" ) );
125        containerLoginForm.attr( {id:"signin_menu"} );
126        this.containerTools.append( containerLoginForm );
127
128        var labelLogin = $( document.createElement( "label" ) );
129        labelLogin.attr( {for:"login"} );
130        labelLogin.append( templateTexts["data.authentification.login"] );
131        var inputLogin = $( document.createElement( "input" ) );
132        inputLogin.attr( {id:"login", name:"login", tabIndex:"4", type:"text"} );
133        containerLoginForm.append( labelLogin );
134        containerLoginForm.append( inputLogin );
135
136        var labelPwd = $( document.createElement( "label" ) );
137        labelPwd.attr( {for:"pwd"} );
138        labelPwd.append( templateTexts["data.authentification.pwd"] );
139        var inputPwd = $( document.createElement( "input" ) );
140        inputPwd.attr( {id:"pwd", name:"pwd", tabIndex:"5", type:"password"} );
141        containerLoginForm.append( labelPwd );
142        containerLoginForm.append( inputPwd );
143
144        var inputSubmitP = $( document.createElement( "p" ) );
145        inputSubmitP.addClass( "remember" );
146        var inputSubmit = $( document.createElement( "input" ) );
147        inputSubmit.attr( {id:"signin_submit", value:templateTexts["data.authentification.sign"], tabIndex:"6", type:"submit"} );
148        inputSubmit.bind( "click", jQuery.proxy( this.onClickLogin, this ) );
149        inputSubmitP.append( inputSubmit );
150        containerLoginForm.append( inputSubmitP );
151
152        var inputForgotP = $( document.createElement( "p" ) );
153        inputForgotP.addClass( "forgot" );
154        var aForgot = $( document.createElement( "a" ) );
155        aForgot.attr( {id:"resend_password_link", href:"mailto:${webmaster}?subject=[MEGAPOLI] login"} );
156        aForgot.append( templateTexts["data.authentification.pwdForget"] );
157        inputForgotP.append( aForgot );
158        containerLoginForm.append( inputForgotP );
159
160        var inputForgotUNP = $( document.createElement( "p" ) );
161        inputForgotUNP.addClass( "username" );
162        var aForgot = $( document.createElement( "a" ) );
163        aForgot.attr( {id:"forgot_username_link", href:"mailto:${webmaster}?subject=[MEGAPOLI] password", title:templateTexts["data.authentification.loginForget.help"]} );
164        aForgot.append( templateTexts["data.authentification.loginForget"] );
165        inputForgotUNP.append( aForgot );
166        containerLoginForm.append( inputForgotUNP );
167
168        var divErrors = $( document.createElement( "div" ) );
169        divErrors.attr( {id:"errors", class:"containerErrors"} );
170        containerLoginForm.append( divErrors );
171    },
172
173    createMenuData: function()
174    {
175        this.containerMenuData.empty();
176
177        var ulData = $( document.createElement( "ul" ) );
178        this.containerMenuData.append( ulData );
179
180        var liExtract = $( document.createElement( "li" ) );
181        var aExtract = $( document.createElement( "a" ) );
182        aExtract.html( "<span>" + templateTexts["data.access.extract.short"] + "</span>" );
183        liExtract.append( aExtract );
184        ulData.append( liExtract );
185        var liDownload = $( document.createElement( "li" ) );
186        var aDownload = $( document.createElement( "a" ) );
187        aDownload.html( "<span>" + templateTexts["data.upload.short"] + "</span>" );
188        liDownload.append( aDownload );
189        ulData.append( liDownload );
190
191        if( getJSONUser() )
192        {
193            aExtract.attr( {href:"DataAccess.do"} );
194            aDownload.attr( {href:"PrepareTree.do"} );
195        }
196        else
197        {
198            aExtract.attr( {href:"project?methodName=viewLogin"} );
199            aDownload.attr( {href:"project?methodName=viewLogin"} );
200        }
201    },
202
203    createLeftSlides: function()
204    {
205        var contentSlideCredits = "resources/jsp/credits_fr.jsp";
206        var contentSlideMentions = "resources/jsp/mentions_fr.jsp";
207        var contentSlideInfos = "resources/jsp/informations_fr.jsp";
208
209        var contentButtonCredits = "<button class='big_blue_button' title='" + templateTexts["app.credits"] + "'><div class='big_blue_button_text'>C</div></button>";
210        var contentButtonMentions = "<button class='big_blue_button' title='" + templateTexts["app.mentions"] + "'><div class='big_blue_button_text'>M</div></button>";
211        var contentButtonInfos = "<button class='big_blue_button' title='" + templateTexts["app.infos"] + "'><div class='big_blue_button_text'>I</div></button>";
212
213        if( !this.isLanguageFr )
214        {
215            contentSlideCredits = "resources/jsp/credits_en.jsp";
216            contentSlideMentions = "resources/jsp/mentions_en.jsp";
217            contentSlideInfos = "resources/jsp/informations_en.jsp";
218        }
219        var divSlideCredits = new Slide( { contentId:"slideContentCredits", buttonId: "slideCredits", parent:$( "#creditSlide" ), isIndexToChange:true,
220            contentButton:contentButtonCredits , contentPageSlide:contentSlideCredits} );
221
222        var divSlideMentions = new Slide( { contentId:"slideContentMentions", buttonId: "slideMentions", parent:$( "#mentionSlide" ),specificButtonClass:"containerSlideButtonMentions", isIndexToChange:true,
223            contentButton:contentButtonMentions, contentPageSlide:contentSlideMentions} );
224
225        var divSlideInfos = new Slide( { contentId:"slideContentInfos", buttonId: "slideInfos", parent:$( "#infoSlide" ), specificButtonClass:"containerSlideButtonInfos", isIndexToChange:true,
226            contentButton:contentButtonInfos, contentPageSlide:contentSlideInfos} );
227    },
228
229    // REQUESTS ********************************************************
230    requestLogin: function()
231    {
232        // TODO : passer en crypter ces infos !!!!!
233        var login = $( "#login" ).val();
234        var pwd = $( "#pwd" ).val();
235        $.ajax( {
236            url: "project?methodName=login&login=" + login + "&pwd=" + pwd,
237            success:jQuery.proxy( this.onHandleLogin, this )
238        } );
239    },
240
241    requestLogout: function()
242    {
243        $.ajax( {
244            url: "project?methodName=logout",
245            success:jQuery.proxy( this.onHandleLogout, this )
246        } );
247    },
248
249    // HANDLES ********************************************************
250    onHandleLogin: function( result )
251    {
252        this.errors = jQuery.parseJSON( result ).errors;
253        setJSONUser( null != jQuery.parseJSON( result ).jSONPeople ? jQuery.parseJSON( result ).jSONPeople : false );
254        if( null == this.errors )
255            this.updateLogin();
256        else
257            displayLoginErrors( templateTexts[this.errors] );
258    },
259
260    onHandleLogout: function( result )
261    {
262        this.errors = jQuery.parseJSON( result ).errors;
263        if( null == this.errors )
264        {
265            setJSONUser( false );
266            this.updateLogin();
267        }
268        else
269            displayLoginErrors( templateTexts[this.errors] );
270    },
271
272    // EVENTS ********************************************************
273    onClickHome: function()
274    {
275        document.location.href = "index.jsp";
276    },
277
278    onClickLogin: function()
279    {
280        $( "#errors" ).hide();
281        this.requestLogin();
282    },
283
284    onClickLogout: function()
285    {
286        this.requestLogout();
287    },
288
289    onClickLanguage: function()
290    {
291        if( this.isLanguageFr )
292            document.location.href = this.path + "/English.do?requestUri=" + this.relativePageUri;
293        else
294            document.location.href = this.path + "/French.do?requestUri=" + this.relativePageUri;
295    },
296
297    onClickMail: function()
298    {
299        document.location.href = "mailto:" + this.webmaster + "?subject=[MEGAPOLI]";
300    },
301
302    /**
303     * This method display a small Ether logo if the screen is too small to contain the big one
304     */
305    updateLogoEther: function()
306    {
307        if( this.screenWidthLimit > innerWidth )
308        {
309            $( "#logoEther" ).hide();
310            $( "#linkLogoEther" ).hide();
311            $( "#smallLogoEther" ).show();
312        }
313        else
314        {
315            $( "#logoEther" ).show();
316            $( "#linkLogoEther" ).show();
317            $( "#smallLogoEther" ).hide();
318        }
319    },
320
321    updateLogin: function()
322    {
323        this.containerTools.empty();
324        this.createTools();
325        this.createMenuData();
326    }
327} );
328
329/** *********************************************** **/
330/** ******************** LOGIN ******************** **/
331/** *********************************************** **/
332function displayLoginErrors( text )
333{
334    $( "#errors" ).show();
335    $( "#errors" ).html( text );
336}
337
338function showLogin( text )
339{
340    if( $( "fieldset#signin_menu" ) && $( ".signin" ) )
341    {
342        $( "fieldset#signin_menu" ).toggle();
343        $( ".signin" ).toggleClass( "menu-open" );
344        if( text )
345            displayLoginErrors( text );
346    }
347    else
348        alert( templateTexts["data.authentification.text"] );
349}
350
351function neededLogin( href )
352{
353    $( "#signin_menu" ).ready( function()
354    {
355        if( !getJSONUser() )
356            showLogin( templateTexts["data.authentification.text"] );
357        else
358            document.location.href = getPath() + href;
359    } );
360}
361
362/** *********************************************** **/
363/** ******************** USER ********************* **/
364/** *********************************************** **/
365function getJSONUser()
366{
367    return InterfaceTemplate.jSONUser;
368}
369
370function setJSONUser( user )
371{
372    InterfaceTemplate.jSONUser = user;
373}
374
375function getPath()
376{
377    return InterfaceTemplate.path;
378}
379
380function setPath( path )
381{
382    InterfaceTemplate.path = path;
383}
384
385</script>
Note: See TracBrowser for help on using the repository browser.