helper.format.html
3.82 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
<!--/*
ADOBE CONFIDENTIAL
__________________
Copyright 2015 Adobe Systems Incorporated
All Rights Reserved.
NOTICE: All information contained herein is, and remains
the property of Adobe Systems Incorporated and its suppliers,
if any. The intellectual and technical concepts contained
herein are proprietary to Adobe Systems Incorporated and its
suppliers and are protected by trade secret or copyright law.
Dissemination of this information or reproduction of this material
is strictly forbidden unless prior written permission is obtained
from Adobe Systems Incorporated.
*/-->
<!--/*
Format the date.
@param {Date} [date] The date to format (default to the current date)
@param {String} [dateFormat] The format to use
*/-->
<template data-sly-template.date="${ @ datetime, dateFormat }">
<sly data-sly-use.date="${'/libs/screens/dcc/components/helper.format.date.js' @ date=datetime, dateFormat=dateFormat}">${date.formattedDate}</sly>
</template>
<!--/*
Format the date and time.
@param {Date} [datetime] The datetime to format (default to the current date and time)
@param {String} [dateFormat] The format to use
*/-->
<template data-sly-template.datetime="${ @ datetime, class }">
<foundation-time type="datetime" class="${class}" value="${datetime.toInstant.toString @ context='attribute'}"/>
</template>
<!--/*
Format a duration.
@param {Date} [interval] The time interval
*/-->
<template data-sly-template.duration="${ @ interval }">
<sly data-sly-use.date="${'/libs/screens/dcc/components/helper.format.date.js' @ date=interval }">${date.formattedDuration}</sly>
</template>
<!--/*
Format the resolution.
@param {String} [resolution] The resolution to format
@param {String|Integer} [width] The width to use as a fallback
@param {String|Integer} [height] The height to use as a fallback
@param {String} [unit] The unit for the dimension
*/-->
<template data-sly-template.resolution="${ @ resolution, width, height, unit}">
<sly data-sly-use.dimension="${'/libs/screens/dcc/components/helper.format.dimension.js' @ value=resolution, valueArray=width && height && [width, height], delimiter='x'}">
<sly data-sly-test.resolution="${dimension.formattedDimension}">
<span itemprop="width">
${resolution.width}
<span data-sly-test="${unit}" class="u-coral-screenReaderOnly">
${unit @ i18n, hint='unit for the dimension (i.e. pixels, inches, etc.)', locale=request.locale}
</span>
</span>
${' x ' @ i18n, hint='Separator used to format the resolution (i.e. width x height)', locale=request.locale}
<span itemprop="height">
${resolution.height}
<span data-sly-test="${unit}" class="u-coral-screenReaderOnly">
${unit @ i18n, hint='unit for the dimension (i.e. pixels, inches, etc.)', locale=request.locale}
</span>
</span>
</sly>
</sly>
</template>
<!--/*
Shorten the specified long string.
@param {String} string The string to shorten
@param {Integer} [threshold] If the string elements are longer than this value, they will be truncated
@param {Integer} [keep] Number of characters to keep (start and end) in the shortened string elements
@param {String} [remove] A substring to remove from the string
@param {String} [delimiter] The delimiter to use when truncating
*/-->
<template data-sly-template.shortstring="${ @ string, threshold, keep, remove, delimiter }">
<sly data-sly-use.stringHelper="${'/libs/screens/dcc/components/helper.format.longstring.js' @ value=string, threshold=threshold, keep=keep, remove=remove, delimiter=delimiter}">${stringHelper.shortenedString}</sly>
</template>