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

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

refonte des pages medias
File size: 13.8 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        this.createLeftSlides();
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 divSlideCredits = new Slide( { contentId:"slideContentCredits", buttonId: "slideCredits", parent:$( "#creditSlide" ), isIndexToChange:true,
206            contentButton:"<img src='resources/icons/man_credits.gif' width='50px' height='50px'/><br/>" , contentSlide:"CREDDDDIIITS"} );
207
208        var divSlideMentions = new Slide( { contentId:"slideContentMentions", buttonId: "slideMentions", parent:$( "#mentionSlide" ),specificButtonClass:"containerSlideButtonMentions", isIndexToChange:true,
209            contentButton:"<img src='resources/icons/man_mentions_2.png' width='50px' height='50px'/><br/>", contentSlide:"MENTIIIOOONNSS"} );
210
211        var divSlideInfos = new Slide( { contentId:"slideContentInfos", buttonId: "slideInfos", parent:$( "#infoSlide" ), specificButtonClass:"containerSlideButtonInfos", isIndexToChange:true,
212            contentButton:"<img src='resources/icons/man_info.gif' width='50px' height='50px'/>", contentSlide:"IINNFFFOOOOSSS"} );
213    },
214
215    // REQUESTS ********************************************************
216    requestLogin: function()
217    {
218        // TODO : passer en crypter ces infos !!!!!
219        var login = $( "#login" ).val();
220        var pwd = $( "#pwd" ).val();
221        $.ajax( {
222            url: "project?methodName=login&login=" + login + "&pwd=" + pwd,
223            success:jQuery.proxy( this.onHandleLogin, this )
224        } );
225    },
226
227    requestLogout: function()
228    {
229        $.ajax( {
230            url: "project?methodName=logout",
231            success:jQuery.proxy( this.onHandleLogout, this )
232        } );
233    },
234
235    // HANDLES ********************************************************
236    onHandleLogin: function( result )
237    {
238        this.errors = jQuery.parseJSON( result ).errors;
239        setJSONUser( null != jQuery.parseJSON( result ).jSONPeople ? jQuery.parseJSON( result ).jSONPeople : false );
240        if( null == this.errors )
241            this.updateLogin();
242        else
243            displayLoginErrors( templateTexts[this.errors] );
244    },
245
246    onHandleLogout: function( result )
247    {
248        this.errors = jQuery.parseJSON( result ).errors;
249        if( null == this.errors )
250        {
251            setJSONUser( false );
252            this.updateLogin();
253        }
254        else
255            displayLoginErrors( templateTexts[this.errors] );
256    },
257
258    // EVENTS ********************************************************
259    onClickHome: function()
260    {
261        document.location.href = "index.jsp";
262    },
263
264    onClickLogin: function()
265    {
266        $( "#errors" ).hide();
267        this.requestLogin();
268    },
269
270    onClickLogout: function()
271    {
272        this.requestLogout();
273    },
274
275    onClickLanguage: function()
276    {
277        if( this.isLanguageFr )
278            document.location.href = this.path + "/English.do?requestUri=" + this.relativePageUri;
279        else
280            document.location.href = this.path + "/French.do?requestUri=" + this.relativePageUri;
281    },
282
283    onClickMail: function()
284    {
285        document.location.href = "mailto:" + this.webmaster + "?subject=[MEGAPOLI]";
286    },
287
288    /**
289     * This method display a small Ether logo if the screen is too small to contain the big one
290     */
291    updateLogoEther: function()
292    {
293        if( this.screenWidthLimit > innerWidth )
294        {
295            $( "#logoEther" ).hide();
296            $( "#linkLogoEther" ).hide();
297            $( "#smallLogoEther" ).show();
298        }
299        else
300        {
301            $( "#logoEther" ).show();
302            $( "#linkLogoEther" ).show();
303            $( "#smallLogoEther" ).hide();
304        }
305    },
306
307    updateLogin: function()
308    {
309        this.containerTools.empty();
310        this.createTools();
311        this.createMenuData();
312    }
313} );
314
315/** *********************************************** **/
316/** ******************** LOGIN ******************** **/
317/** *********************************************** **/
318function displayLoginErrors( text )
319{
320    $( "#errors" ).show();
321    $( "#errors" ).html( text );
322}
323
324function showLogin( text )
325{
326    if( $( "fieldset#signin_menu" ) && $( ".signin" ) )
327    {
328        $( "fieldset#signin_menu" ).toggle();
329        $( ".signin" ).toggleClass( "menu-open" );
330        if( text )
331            displayLoginErrors( text );
332    }
333    else
334        alert( templateTexts["data.authentification.text"] );
335}
336
337function neededLogin( href )
338{
339    $( "#signin_menu" ).ready( function()
340    {
341        if( !getJSONUser() )
342            showLogin( templateTexts["data.authentification.text"] );
343        else
344            document.location.href = getPath() + href;
345    } );
346}
347
348/** *********************************************** **/
349/** ******************** USER ********************* **/
350/** *********************************************** **/
351function getJSONUser()
352{
353    return InterfaceTemplate.jSONUser;
354}
355
356function setJSONUser( user )
357{
358    InterfaceTemplate.jSONUser = user;
359}
360
361function getPath()
362{
363    return InterfaceTemplate.path;
364}
365
366function setPath( path )
367{
368    InterfaceTemplate.path = path;
369}
370
371</script>
Note: See TracBrowser for help on using the repository browser.