Skip to content
Snippets Groups Projects
Commit c18bf68d authored by Harshita Mehna's avatar Harshita Mehna Committed by Gisle Hannemyr
Browse files

Issue #3370174 by Harshita mehna: Replace jquery.once by core/once

parent bcf25dca
No related branches found
No related tags found
No related merge requests found
......@@ -3,8 +3,8 @@
This module provides a block that displays current
system time as a analog wallclock.
For a full description of the module, visit the
[project page](https://www.drupal.org/project/wallclock).
For a full description of the module, visit the [project
page](https://www.drupal.org/project/wallclock).
Submit bug reports and feature suggestions, or track changes in the
[issue queue](https://www.drupal.org/project/issues/wallclock).
......@@ -15,6 +15,7 @@ Submit bug reports and feature suggestions, or track changes in the
* Requirements
* Installation
* Configuration
* Theming
## Requirements
......@@ -26,18 +27,21 @@ Submit bug reports and feature suggestions, or track changes in the
## Installation
1. Install as you would normally install a contributed Drupal
module. Visit [Installing modules][IM] for further information.
module. Visit [Installing
modules](https://www.drupal.org/node/1897420) for further
information.
2. Install the latest compatible version of the 'snap.svg' Javascript
library. Visit [snapsvg.io][1] , and click on "Download". Then
unpack the zipfile and install "dist/snap-svg-min.js" in a
directory named "snap.svg" in the direcory "libraries" below the
webroot. The path to the library from the the webroot should be
library. Visit [snapsvg.io](http://snapsvg.io/), and click on
"Download". Then unpack the zipfile and install
"dist/snap-svg-min.js" in a directory named "snap.svg" in the
direcory "libraries" below the webroot. The path to the library
from the the webroot should be
"libraries/snap.svg/snap-svg-min.js".
Version 0.5.1 has been tested with this module and found to
work. You may download "snap-svg-min.js" of this version from from
[CDN][2]
[CDN](http://cdnjs.cloudflare.com/ajax/libs/snap.svg/0.5.1/snap.svg-min.js)
3. Enable the **Wallclock** module by locating it on the list under
the Extend tab in the administrative GUI.
......@@ -50,7 +54,16 @@ layout** and click on "Place block" for the region where you want the
clock to display. It is named "Wall Clock Block".
[1]: http://snapsvg.io/
[2]: http://cdnjs.cloudflare.com/ajax/libs/snap.svg/0.5.1/snap.svg-min.js
## Theming
See `wallclock.libraries.yml` for the CSS and JS libraries used. For
unknown reasons aggregation (`preprocess: false`) must be turned
offfor the CSS.
The CSS uses flex for layout and probably works best with a theme
supporting this, such as
[**Bootstrap5**](https://www.drupal.org/project/bootstrap5).
It assumes that the Segoe UI font is available. If it is not, it will
fall back in the default sans-serif font.
[IM]: https://www.drupal.org/node/1897420
/* Analog clock */
.block-wallclock {
background: #eeeeee;
}
#clocksvg {
display:flex;
align-items:center;
justify-content:center;
/* background: red; */
}
#partofday {
text-align: center;
font-family: 'Segoe UI', sans-serif;
font-size: 1.5em;
font-weight: bold;
}
/* Digital clock */
#digital .clock-wrapper {
background-color: #eeeeee;
width: 100%;
text-align: center;
margin: 0 auto;
margin-top: -10px;
}
#digital #clock {
background-color: #eeeeee;
font-family: 'Segoe UI', sans-serif;
font-size: 30px;
color: black;
}
(function ($) {
'use strict';
Drupal.behaviors.awesome = {
attach: function (context, settings) {
function startTime() {
var today = new Date();
var hr = today.getHours();
var min = today.getMinutes();
var sec = today.getSeconds();
min = checkTime(min);
sec = checkTime(sec);
jQuery('#digital #clock').html(hr + ' : ' + min);
setTimeout(function () { startTime(); }, 500);
}
function checkTime(i) {
if (i < 10) {
i = '0' + i;
}
return i;
}
startTime();
}
};
}(jQuery));
wallclock:
css:
component:
css/wallclock.css: {}
css/wallclock.css: { preprocess: false }
js:
js/wallclock.js: { weight: -2 }
/libraries/snap.svg/snap.svg-min.js: { weight: -1 }
dependencies:
- core/jquery
- core/jquery.once
- core/once
- core/drupal
digital:
css:
component:
css/wallclock.css: {}
css/wallclock.css: { preprocess: false }
js:
js/digital.js: { weight: -1 }
dependencies:
- core/jquery
- core/jquery.once
- core/once
- core/drupal
- core/drupalSettings
......@@ -32,4 +32,4 @@ snap-cdn:
https://cdnjs.cloudflare.com/ajax/libs/snap.svg/0.5.1/snap.svg-min.js: { type: external, minified: true }
dependencies:
- core/jquery
- core/jquery.once
- core/once
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment