SliceSlide/jquery.sliceslide.templates.html at master · jervert/SliceSlide · GitHub

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
<script type="text/template" id="slice-slide-controls">
	<div class="slide-controls" role="toolbar" data-slice-slide-controls>
		<nav>
			<p><a class="slide-pause-or-resume" href="#" aria-controls="{{id}}" data-slice-slide-controls-pause-resume><span data-slice-slide-playing>{{text.controlsPause}}</span></a><span class="indented">{{text.controlsGoTo}}:</span></p>
			<ul data-slice-slide-controls-prev-and-next>
				<li class="slide-control-previous"><a href="#" aria-controls="{{id}}" data-slice-slide-controls-prev><img src="assets/SL_IMG_controls_previous.png" alt="{{text.controlsPrevious}}" /></a></li>
				<li class="slide-control-next"><a href="#" aria-controls="{{id}}" data-slice-slide-controls-next><img src="assets/SL_IMG_controls_next.png" alt="{{text.controlsNext}}" /></a></li>
			</ul>
			<ul class="clear">
			[[ var sliceSlidePage = 1, sliceSlidePageIndex = 1; while (sliceSlidePage <= pagesNumber) { ]]
				<li class="slide-control-element[[ if (sliceSlidePage === 1) { ]] slice-slide-active[[ } ]]" data-slice-slide-controls-fixed><a href="#" aria-controls="{{id}}" data-slice-slide-destination="#{{id}}-{{sliceSlidePageIndex}}">{{sliceSlidePage}}</a></li>
				[[ sliceSlidePage += 1; ]]
				[[ sliceSlidePageIndex += numberSimultaneousSlides; ]]
			[[ } ]]
			</ul>
		</nav>
	</div>
</script>

<script type="text/template" id="slice-slide-controls-only-text">
	<div class="slide-controls" data-slice-slide-controls>
		<nav>
			<p><a class="slide-pause-or-resume" href="#" aria-controls="{{id}}" data-slice-slide-controls-pause-resume><span data-slice-slide-playing>{{text.controlsPause}}</span></a><span class="indented">{{text.controlsGoTo}}:</span></p>
			<ul data-slice-slide-controls-prev-and-next>
				<li class="slide-control-previous"><a href="#" aria-controls="{{id}}" data-slice-slide-controls-prev>{{text.controlsPrevious}}</a></li>
				<li class="slide-control-next"><a href="#" aria-controls="{{id}}" data-slice-slide-controls-next>{{text.controlsNext}}</a></li>
			</ul>
			<ul class="clear">
			[[ var sliceSlidePage = 1, sliceSlidePageIndex = 1; while (sliceSlidePage <= pagesNumber) { ]]
				<li class="slide-control-element[[ if (sliceSlidePage === 1) { ]] slice-slide-active[[ } ]]" data-slice-slide-controls-fixed><a href="#" aria-controls="{{id}}" data-slice-slide-destination="#{{id}}-{{sliceSlidePageIndex}}">{{sliceSlidePage}}</a></li>
				[[ sliceSlidePage += 1; ]]
				[[ sliceSlidePageIndex += numberSimultaneousSlides; ]]
			[[ } ]]
			</ul>
		</nav>
	</div>
</script>

<script type="text/template" id="slice-slide-controls-thumbs">
	<div class="slide-controls" data-slice-slide-controls>
		<nav>
			<p><a class="slide-pause-or-resume" href="#" aria-controls="{{id}}" data-slice-slide-controls-pause-resume><span data-slice-slide-playing>{{text.controlsPause}}</span></a><span class="indented">{{text.controlsGoTo}}:</span></p>
			<ul data-slice-slide-controls-prev-and-next>
				<li class="slide-control-previous"><a href="#" aria-controls="{{id}}" data-slice-slide-controls-prev><img src="assets/SL_IMG_controls_previous.png" alt="{{text.controlsPrevious}}" /></a></li>
				<li class="slide-control-next"><a href="#" aria-controls="{{id}}" data-slice-slide-controls-next><img src="assets/SL_IMG_controls_next.png" alt="{{text.controlsNext}}" /></a></li>
			</ul>
			<ul class="clear thumbnail-controls">
			[[ _.each(slides, function (item, index) { ]]
				<li class="slide-control-element[[ if ((index + 1) === 1) { ]] slice-slide-active[[ } ]]" data-slice-slide-controls-fixed><a href="#" aria-controls="{{id}}" data-slice-slide-destination="#{{id}}-{{(index + 1)}}"><img src="{{thumbnails[index]}}" alt="{{(index + 1)}}" /></a></li>
			[[ }); ]]
			</ul>
		</nav>
	</div>
</script>

<script type="text/template" id="slice-slide-controls-playing">
	<span data-slice-slide-playing>{{text.controlsPause}}</span>
</script>
<script type="text/template" id="slice-slide-controls-paused">
	<span data-slice-slide-paused>{{text.controlsResume}}</span>
</script>

<script type="text/template" id="slice-slide-translucent">
	<div class="slice-slide-translucent"></div>
</script>