Proyectos de Subversion Moodle

Rev

Rev 1010 | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
669 ariadna 1
{{!
2
    This file is part of Moodle - http://moodle.org/
3
 
4
    Moodle is free software: you can redistribute it and/or modify
5
    it under the terms of the GNU General Public License as published by
6
    the Free Software Foundation, either version 3 of the License, or
7
    (at your option) any later version.
8
 
9
    Moodle is distributed in the hope that it will be useful,
10
    but WITHOUT ANY WARRANTY; without even the implied warranty of
11
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
12
    GNU General Public License for more details.
13
 
14
    You should have received a copy of the GNU General Public License
15
    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
16
}}
17
{{!
18
    @template core/loginform
19
 
20
    Moodle template for the login page.
21
 
22
    Context variables required for this template:
23
    * autofocusform: Auto focus on form ?,
24
    * canloginasguest - Is guest login allowed?,
25
    * canloginbyemail - Is login by email allowed?,
26
    * cansignup - Signup allowed?,
27
    * cookieshelpicon - cookies help icon details
28
    * error - Any errors in the form?,
29
    * forgotpasswordurl - Forgot password url,
30
    * hasidentityproviders - Flag, set to true to hide identity providers,
31
    * hasinstructions - Flag, set to true to show instructions,
32
    * identityproviders - List of identiy providers,
33
    * instructions - Instructions,
34
    * instructionsformat - Format of instructions,
35
    * loginurl - Login url,
36
    * signupurl - Signup url,
37
    * errorformatted - Formatted error,
38
    * logourl - Flag, logo url,
39
    * sitename - Name of site.,
40
    * logintoken - Random token to protect login request.,
41
    * maintenance - Maintenance message
42
 
43
    Example context (json):
44
    {
45
        "autofocusform": false,
46
        "canloginasguest": "1",
47
        "canloginbyemail": false,
48
        "cansignup": true,
49
        "cookieshelpicon": {
50
            "heading": "Cookies must be enabled in your browser",
51
            "text": "<div class=\"no-overflow\">Two cookies are used on this site. Both died..</div>",
52
            "icon": {
53
                "attributes": [
54
                    {
55
                        "name": "class",
56
                        "value": "iconhelp"
57
                    },
58
                    {
59
                        "name": "alt",
60
                        "value": "Help with Cookies must be enabled in your browser"
61
                    },
62
                    {
63
                        "name": "title",
64
                        "value": "Help with Cookies must be enabled in your browser"
65
                    },
66
                    {
67
                        "name": "src",
68
                        "value": "http://localhost/stable_master/theme/image.php?theme=space&component=core&image=help"
69
                    }
70
                ]
71
            },
72
            "linktext": null,
73
            "title": "Help with Cookies must be enabled in your browser",
74
            "url": "http://localhost/stable_master/help.php?component=core&identifier=cookiesenabled&lang=en",
75
            "ltr": true
76
        },
77
        "error": "",
78
        "forgotpasswordurl": "http://localhost/stable_master/login/forgot_password.php",
79
        "hasidentityproviders": false,
80
        "hasinstructions": true,
81
        "identityproviders": [],
82
        "instructions": "For full access to this site, you first need to create an account.",
83
        "instructionsformat": "1",
84
        "loginurl": "http://localhost/stable_master/login/index.php",
85
        "signupurl": "http://localhost/stable_master/login/signup.php",
86
        "cookieshelpiconformatted": "",
87
        "errorformatted": "",
88
        "logourl": false,
89
        "sitename": "Beer & Chips",
90
        "logintoken": "randomstring",
91
        "maintenance": "For full access to this site, you need to login in as an admin.",
92
        "languagemenu": "Choose language"
93
    }
94
 
95
 
96
}}
97
 
98
<div class="rui-login-layout
99
        {{#loginlayoutimg}}rui-login-layout-img{{/loginlayoutimg}}
100
        {{^loginlayoutimg}}rui-login-layout-simple{{/loginlayoutimg}}
101
        {{#loginlogooutside}}rui-login--logo-outsite{{/loginlogooutside}}
102
        {{#loginlayout1}}rui-login-layout--1{{/loginlayout1}}
103
        {{#loginlayout2}}rui-login-layout--2{{/loginlayout2}}
104
        {{#loginlayout3}}rui-login-layout--3{{/loginlayout3}}
105
        {{#loginlayout4}}rui-login-layout--4{{/loginlayout4}}
106
        {{#loginlayout5}}rui-login-layout--5{{/loginlayout5}}
107
        ">
108
 
109
 
110
    {{#cansignup}}
111
        {{#customsignupoutside}}
112
            <div class="rui-login-top-btn">
113
                <form action="{{signupurl}}" method="get" id="signup">
114
                    {{#stringca}}<span class="rui-login-calabel mr-2">{{{stringca}}}</span>{{/stringca}} <button type="submit" class="btn-link--clean">{{#str}}startsignup{{/str}}</button>
115
                </form>
116
            </div>
117
        {{/customsignupoutside}}
118
    {{/cansignup}}
119
 
120
 
121
    {{#loginlayoutimg}}
122
        <div class="rui-login-wrapper">
123
            <div class="rui-login-top-wrapper">
124
    {{/loginlayoutimg}}
125
 
126
    {{#loginlogooutside}}
127
        <div class="rui-login-logo-container my-6">
128
            {{#loginlayoutimg}}
129
                <div class="rui-login-top">
130
            {{/loginlayoutimg}}
131
            <div>
132
                {{#customloginlogo}}
133
                    <a href="{{{ config.wwwroot }}}" class="text-decoration-none"><img src="{{customloginlogo}}" title="{{sitename}}" alt="{{sitename}}" class="rui-login-logo img-fluid" /></a>
134
                {{/customloginlogo}}
135
 
136
                {{^customloginlogo}}
137
                    {{#logourl}}
138
                        <a href="{{{ config.wwwroot }}}"><img src="{{logourl}}" title="{{sitename}}" alt="{{sitename}}" class="rui-login-logo img-fluid" /></a>
139
                    {{/logourl}}
140
 
141
                    {{^logourl}}
142
                        <a href="{{{ config.wwwroot }}}" class="text-decoration-none">
143
                            <h1 class="rui-login-logo-name">{{sitename}}</h1>
144
                        </a>
145
                    {{/logourl}}
146
                {{/customloginlogo}}
147
            </div>
148
            {{#loginlayoutimg}}
149
        </div>{{/loginlayoutimg}}
150
</div>
151
{{/loginlogooutside}}
152
 
153
{{#loginhtmlcontent1}}
154
    <div class="rui-login-html-1">
155
        {{{loginhtmlcontent1}}}
156
    </div>
157
{{/loginhtmlcontent1}}
158
 
159
{{#loginlayoutimg}}
160
    </div>
161
    </div>
162
{{/loginlayoutimg}}
163
 
164
{{#loginlayoutimg}}
165
    <div class="rui-login-wrapper row no-gutters align-items-center justify-content-center w-100">
166
        <div class="rui-login-container row no-gutters">
167
 
168
{{/loginlayoutimg}}
169
 
1010 ariadna 170
<div class="rui-login-box container">
1011 ariadna 171
    <div class="row w-100 m-0 login-box">
1008 ariadna 172
        <div class="col col-12 col-md-5">
173
            <div class="rui-login-content">
174
                {{#cansignup}}
175
                    <div class="sr-only">
176
                        <a href="{{signupurl}}">{{#str}} tocreatenewaccount {{/str}}</a>
177
                    </div>
178
                {{/cansignup}}
669 ariadna 179
 
1008 ariadna 180
                <div class="rui-loginpage-intro">
181
                    {{^loginlogooutside}}
182
                        <div class="rui-loginpage-intro-logo {{#customlogindmlogo}}dark-mode-logo{{/customlogindmlogo}} ">
183
                            {{#customloginlogo}}
184
                                <a href="{{{ config.wwwroot }}}" class="text-decoration-none">
185
                                    <h2><img src="{{customloginlogo}}" title="{{sitename}}" alt="{{sitename}}" class="rui-login-logo img-fluid" /></h2>
186
                                    {{#customlogindmlogo}}<h2><img src="{{customlogindmlogo}}" alt="{{sitename}}" class="rui-custom-dmlogo ml-2 img-fluid" /></h2>{{/customlogindmlogo}}
187
                                </a>
188
                            {{/customloginlogo}}
189
 
190
                            {{^customloginlogo}}
191
                                {{#logourl}}
673 ariadna 192
                                    <a href="{{{ config.wwwroot }}}" class="text-decoration-none">
1008 ariadna 193
                                        <h2><img src="{{logourl}}" title="{{sitename}}" alt="{{sitename}}" class="rui-login-logo img-fluid" /></h2>
673 ariadna 194
                                    </a>
1008 ariadna 195
                                {{/logourl}}
669 ariadna 196
 
1008 ariadna 197
                                {{^logourl}}
198
                                    <a href="{{{ config.wwwroot }}}" class="text-decoration-none">
199
                                        <h2>{{sitename}}</h2>
200
                                    </a>
201
                                {{/logourl}}
202
                            {{/customloginlogo}}
203
                        </div>
204
                    {{/loginlogooutside}}
673 ariadna 205
 
1008 ariadna 206
                    {{#loginintrotext}}
207
                        <div class="rui-loginpage-intro-content mb-3 text-center">
208
                            {{{loginintrotext}}}
209
                        </div>
210
                    {{/loginintrotext}}
673 ariadna 211
 
1008 ariadna 212
                </div>
669 ariadna 213
 
1008 ariadna 214
                {{#error}}
215
                    <div class="loginerrors mt-3">
216
                        <a href="#" id="loginerrormessage" class="accesshide">{{error}}</a>
217
                        <div class="alert alert-danger" role="alert" data-aria-autofocus="true">{{error}}</div>
1007 ariadna 218
                    </div>
1008 ariadna 219
                {{/error}}
669 ariadna 220
 
1008 ariadna 221
                {{#loginidprovtop}}
222
                    {{#hasidentityproviders}}
223
                        <div class="rui-potentialidplist login-identityproviders mt-3 text-center">
224
                            <p class="small text-center">{{#str}} potentialidps, auth {{/str}}</p>
225
                            <div class="row no-gutters mt-1">
226
                                {{#identityproviders}}
227
                                    <a class="btn btn-secondary login-identityprovider-btn rui-potentialidp w-100 mt-1" href="{{url}}">
228
                                        {{#iconurl}}
229
                                            <img src="{{iconurl}}" alt="" width="24" height="24"/>
230
                                        {{/iconurl}}
231
                                        {{name}}
232
                                    </a>
233
                                {{/identityproviders}}
234
                            </div>
235
                            <hr class="hr-small" />
673 ariadna 236
                        </div>
1008 ariadna 237
                    {{/hasidentityproviders}}
238
                {{/loginidprovtop}}
669 ariadna 239
 
1008 ariadna 240
                <h3 class="txt-welcome-login">¡BIENVENIDO!</h3>
241
                <h1 class="txt-login">Inicia sesión en tu cuenta</h1>
771 ariadna 242
 
1008 ariadna 243
                <div class="rui-login-form">
244
                    <form action="{{loginurl}}" method="post" id="login">
245
                        <input id="anchor" type="hidden" name="anchor" value="">
246
                        <script>
247
                            document.getElementById('anchor').value = location.hash;
248
                        </script>
249
                        <input type="hidden" name="logintoken" value="{{logintoken}}">
250
                        <div class="form-group mb-2 form-control--username-box">
251
                            <label for="username" class="sr-only">
252
                                {{^canloginbyemail}}
253
                                    {{#str}} username {{/str}}
254
                                {{/canloginbyemail}}
255
                                {{#canloginbyemail}}
256
                                    {{#str}} usernameemail {{/str}}
257
                                {{/canloginbyemail}}
258
                            </label>
259
                            <input type="text" name="username" id="username" {{!
260
                        !}}class="form-control form-control--username" {{!
261
                        !}}value="{{username}}" {{!
262
                        !}}placeholder="{{^canloginbyemail}}{{#cleanstr}}username{{/cleanstr}}{{/canloginbyemail}}{{!
263
                        !}}{{#canloginbyemail}}{{#cleanstr}}usernameemail{{/cleanstr}}{{/canloginbyemail}}" {{!
264
                        !}}autocomplete="username">
265
                        </div>
266
                        <div class="form-group my-1 form-control--password-box">
267
                            <label for="password" class="sr-only">{{#str}} password {{/str}}</label>
268
                            <input type="password" name="password" id="password" value="" {{!
269
                        !}}class="form-control form-control--password" {{!
270
                        !}}placeholder="{{#cleanstr}}password{{/cleanstr}}" {{!
271
                        !}}autocomplete="current-password">
272
                            <button class="rui-show-password-btn rui-show-password-btn--hidden border-0" id="togglePassword" tabindex="0" type="button" role="button" aria-checked="false">
273
                                <svg class="showpassword-icon--off" width="24" height="24" fill="none" viewBox="0 0 24 24">
274
                                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19.25 12C19.25 13 17.5 18.25 12 18.25C6.5 18.25 4.75 13 4.75 12C4.75 11 6.5 5.75 12 5.75C17.5 5.75 19.25 11 19.25 12Z"></path>
275
                                    <circle cx="12" cy="12" r="2.25" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"></circle>
276
                                </svg>
277
                                <svg class="showpassword-icon--on" width="24" height="24" fill="none" viewBox="0 0 24 24">
278
                                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M18.6247 10C19.0646 10.8986 19.25 11.6745 19.25 12C19.25 13 17.5 18.25 12 18.25C11.2686 18.25 10.6035 18.1572 10 17.9938M7 16.2686C5.36209 14.6693 4.75 12.5914 4.75 12C4.75 11 6.5 5.75 12 5.75C13.7947 5.75 15.1901 6.30902 16.2558 7.09698"></path>
279
                                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19.25 4.75L4.75 19.25"></path>
280
                                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M10.409 13.591C9.53033 12.7123 9.53033 11.2877 10.409 10.409C11.2877 9.5303 12.7123 9.5303 13.591 10.409"></path>
281
                                </svg>
282
                            </button>
283
                        </div>
284
                        {{^hideforgotpassword}}
285
                            <div class="w-100 text-center">
286
                                <a class="rui-login-forgot-btn" href="{{forgotpasswordurl}}">{{#str}}forgotten{{/str}}</a>
749 ariadna 287
                            </div>
1008 ariadna 288
                        {{/hideforgotpassword}}
289
                        {{{logininfobox}}}
290
                        {{#recaptcha}}
291
                            <div class="login-form-recaptcha form-group">
292
                                {{{recaptcha}}}
749 ariadna 293
                            </div>
1008 ariadna 294
                        {{/recaptcha}}
295
                        <button type="submit" class="btn btn-lg btn-primary btn-block mt-3" id="loginbtn">{{#str}}login{{/str}}</button>
296
                    </form>
297
                </div>
298
                <!-- .rui-login-form -->
670 ariadna 299
 
1008 ariadna 300
                {{^loginidprovtop}}
301
                    {{#hasidentityproviders}}
749 ariadna 302
                        <hr class="hr-small" />
1008 ariadna 303
                        <div class="rui-potentialidplist login-identityproviders mt-3 text-center">
304
                            <p class="small text-center">{{#str}} potentialidps, auth {{/str}}</p>
305
                            <div class="row no-gutters mt-1">
306
                                {{#identityproviders}}
307
                                    <a class="btn btn-secondary login-identityprovider-btn rui-potentialidp w-100 mt-1" href="{{url}}">
308
                                        {{#iconurl}}
309
                                            <img src="{{iconurl}}" alt="" width="24" height="24"/>
310
                                        {{/iconurl}}
311
                                        {{name}}
312
                                    </a>
313
                                {{/identityproviders}}
749 ariadna 314
                            </div>
1008 ariadna 315
                        </div>
316
                    {{/hasidentityproviders}}
317
                {{/loginidprovtop}}
749 ariadna 318
 
1008 ariadna 319
                <div class="rui-login-additional-btns">
320
                    {{#canloginasguest}}
321
                    <hr class="hr-small" />
322
                        <div class="rui-canloginasguest mt-2" title="{{#str}}someallowguest{{/str}}">
323
                            <p class="small text-center">{{#str}}someallowguest{{/str}}</p>
324
                            <form action="{{loginurl}}" method="post" id="guestlogin">
325
                                <input type="hidden" name="logintoken" value="{{logintoken}}">
326
                                <input type="hidden" name="username" value="guest" />
327
                                <input type="hidden" name="password" value="guest" />
328
                                <button class="btn btn-sm btn-outline-secondary w-100" type="submit" id="loginguestbtn">{{#str}}loginguest{{/str}}</button>
329
                            </form>
330
                        </div>
331
                    {{/canloginasguest}}
332
                </div>
333
                <!-- .rui-additional-btns -->
749 ariadna 334
 
1008 ariadna 335
                {{#cansignup}}
336
                    {{^customsignupoutside}}
337
                        <div class="rui-login-createaccount my-4 text-center">
338
                            {{#canloginasguest}}<hr class="hr-small" />{{/canloginasguest}}
339
                            <form action="{{signupurl}}" method="get" id="signup">
340
                                {{#stringca}}
341
                                    <p class="small">{{{stringca}}}</p>
342
                                {{/stringca}}
343
                                <button type="submit" class="btn btn-info w-100">{{#str}}startsignup{{/str}}</button>
344
                            </form>
749 ariadna 345
                        </div>
1008 ariadna 346
                    {{/customsignupoutside}}
347
                {{/cansignup}}
749 ariadna 348
 
1008 ariadna 349
                {{#loginhtmlblockbottom}}
350
                    <div class="rui-login-bottom-block">
351
                        {{{loginhtmlblockbottom}}}
352
                    </div>
353
                {{/loginhtmlblockbottom}}
669 ariadna 354
 
1008 ariadna 355
                {{#instructions}}
356
                    <div class="rui-hasinstructions-desc alert alert-info">
357
                        {{{instructions}}}
358
                    </div><!-- .rui-hasinstructions-desc -->
359
                {{/instructions}}
669 ariadna 360
 
1008 ariadna 361
                {{^loginlayoutimg}}
362
                    {{#loginhtmlcontent3}}
363
                        <div class="rui-login-html-3">
364
                            {{{loginhtmlcontent3}}}
365
                        </div>
366
                    {{/loginhtmlcontent3}}
367
 
368
                    {{#loginfootercontent}}
369
                        <div class="rui-login-footer-content text-center mb-2">
370
                            <hr class="hr-small" />
371
                            {{{loginfootercontent}}}
372
                        </div>
373
                    {{/loginfootercontent}}
374
                {{/loginlayoutimg}}
1007 ariadna 375
            </div>
1008 ariadna 376
 
1009 ariadna 377
            <img src="{{{ config.wwwroot }}}/theme/universe_child/pix/login-bg-img.png"  alt="image background" width="100%" height="100%" class="d-none d-md-block img-fluid login-imagen"/>
378
            <img src="{{{ config.wwwroot }}}/theme/universe_child/pix/img-mobile.png"  alt="image background mobile" width="100%" height="100%" class="d-md-none img-fluid login-imagen-mobile"/>
673 ariadna 379
        </div>
380
    </div>
669 ariadna 381
</div><!-- .rui-login-box -->
382
 
383
 
384
{{#maintenance}}
385
    <div class="rui-maintenance alert alert-warning wrapper-md my-4 p-5">
386
        <h2>{{#str}}sitemaintenance, core_admin{{/str}}</h2>
387
        <div class="rui-maintenance-desc">
388
            {{{maintenance}}}
389
        </div>
390
    </div>
391
{{/maintenance}}
392
 
393
{{#loginlayoutimg}}
394
    <div class="rui-login-bg-container" style="background-image: url('{{loginbg}}');" alt="{{#str}}messagecontentimage, message{{/str}}">
395
        {{#loginhtmlcontent2}}
396
            <div class="rui-login-additional-content">
397
                {{{loginhtmlcontent2}}}
398
            </div>
399
        {{/loginhtmlcontent2}}
400
    </div>
401
{{/loginlayoutimg}}
402
 
403
{{#loginlayoutimg}}
404
    </div>
405
    </div>
406
{{/loginlayoutimg}}
407
 
408
{{#loginlayoutimg}}
409
    <div class="rui-login-wrapper">
410
        {{#loginhtmlcontent3}}
411
            <div class="rui-login-footer rui-login-footer-content">
412
                {{{loginhtmlcontent3}}}
413
            </div>
414
        {{/loginhtmlcontent3}}
415
 
416
        {{#loginfootercontent}}
417
            <div class="rui-login-footer text-center">
418
                {{{loginfootercontent}}}
419
            </div>
420
        {{/loginfootercontent}}
421
 
422
    </div>
423
{{/loginlayoutimg}}
424
 
425
<button type="button" class="btn btn-xs btn-dark btn--cookie" {{!
426
        }} data-modal="alert" {{!
427
        }} data-modal-title-str='["cookiesenabled", "core"]' {{!
428
        }} data-modal-content-str='["cookiesenabled_help_html", "core"]' {{!
429
        }}>
430
    <svg width="20" height="20" fill="none" viewBox="0 0 24 24">
431
        <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 13V15"></path>
432
        <circle cx="12" cy="9" r="1" fill="currentColor"></circle>
433
        <circle cx="12" cy="12" r="7.25" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"></circle>
434
    </svg>
435
 
436
    <span class="ml-1">{{#str}}cookiesnotice{{/str}}</span></button>
437
 
438
</div><!-- .login layout -->
439
 
440
{{#js}}
441
    {{^error}}
442
        {{#autofocusform}}
443
            var userNameField = document.getElementById('username');
444
            if (userNameField.value.length == 0) {
445
                userNameField.focus();
446
            } else {
447
                document.getElementById('password').focus();
448
            }
449
        {{/autofocusform}}
450
    {{/error}}
451
    {{#error}}
452
        document.getElementById('loginerrormessage').focus();
453
    {{/error}}
454
    require(['core_form/submit'], function(Submit) {
455
        Submit.init("loginbtn");
456
        {{#canloginasguest}}
457
            Submit.init("loginguestbtn");
458
        {{/canloginasguest}}
459
    });
460
{{/js}}
461
<script>
462
    const togglePassword = document.querySelector("#togglePassword");
463
    const password = document.querySelector("#password");
464
 
465
    togglePassword.addEventListener("click", function() {
466
        // toggle the type attribute
467
        const type = password.getAttribute("type") === "password" ? "text" : "password";
468
        password.setAttribute("type", type);
469
 
470
        // toggle the icon
471
        this.classList.toggle("rui-show-password-btn--hidden");
472
    });
473
</script>
474
 
475
{{{logincustomfooterhtml}}}