cms/app-client/app/templates/components/player-component.hbs
author Chloe Laisne <chloe.laisne@gmail.com>
Fri, 05 Aug 2016 15:06:06 +0200
changeset 252 ba4fd614582a
parent 251 ac320de33ec7
child 253 0be9770b09b4
permissions -rw-r--r--
Load player with selected row
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
210
08ad36c693b1 Player design
Chloe Laisne <chloe.laisne@gmail.com>
parents: 196
diff changeset
     1
<div id="audio">
08ad36c693b1 Player design
Chloe Laisne <chloe.laisne@gmail.com>
parents: 196
diff changeset
     2
	<div class="controls">
212
f2c6080a73aa Player backward/forward design logic
Chloe Laisne <chloe.laisne@gmail.com>
parents: 211
diff changeset
     3
		<i title="Backward" class="fa fa-backward{{if isFirst ' disabled'}}" {{action 'backward'}}>Backward</i>
214
9bff007eb03c Reflect player-component actions on playlist-component
Chloe Laisne <chloe.laisne@gmail.com>
parents: 213
diff changeset
     4
		{{#if player.playing}}
241
da3c6ba8a80b Set time from progress bar - Toggle play plause to actions
Chloe Laisne <chloe.laisne@gmail.com>
parents: 229
diff changeset
     5
		<i title="Pause" class="fa fa-pause" {{action 'toggle'}}>Pause</i>
211
7451203a1321 Setup progress bar
Chloe Laisne <chloe.laisne@gmail.com>
parents: 210
diff changeset
     6
		{{else}}
241
da3c6ba8a80b Set time from progress bar - Toggle play plause to actions
Chloe Laisne <chloe.laisne@gmail.com>
parents: 229
diff changeset
     7
		<i title="Play" class="fa fa-play" {{action 'toggle'}}>Play</i>
211
7451203a1321 Setup progress bar
Chloe Laisne <chloe.laisne@gmail.com>
parents: 210
diff changeset
     8
		{{/if}}
212
f2c6080a73aa Player backward/forward design logic
Chloe Laisne <chloe.laisne@gmail.com>
parents: 211
diff changeset
     9
		<i title="Forward" class="fa fa-forward{{if isLast ' disabled'}}" {{action 'forward'}}>Forward</i>
210
08ad36c693b1 Player design
Chloe Laisne <chloe.laisne@gmail.com>
parents: 196
diff changeset
    10
	</div>
08ad36c693b1 Player design
Chloe Laisne <chloe.laisne@gmail.com>
parents: 196
diff changeset
    11
	<div class="progress">
211
7451203a1321 Setup progress bar
Chloe Laisne <chloe.laisne@gmail.com>
parents: 210
diff changeset
    12
		<span class="head">{{to-minutes head}}</span>
241
da3c6ba8a80b Set time from progress bar - Toggle play plause to actions
Chloe Laisne <chloe.laisne@gmail.com>
parents: 229
diff changeset
    13
		<span class="bar" onclick={{action 'setTime'}}><span class="value"></span></span>
211
7451203a1321 Setup progress bar
Chloe Laisne <chloe.laisne@gmail.com>
parents: 210
diff changeset
    14
		<span class="remaining">- {{to-minutes remaining}}</span>
86
15ded106ef1a add a player component to handle sound play/pause
nowmad@23.1.168.192.in-addr.arpa
parents:
diff changeset
    15
	</div>
251
ac320de33ec7 Add transcript button to player-component
Chloe Laisne <chloe.laisne@gmail.com>
parents: 242
diff changeset
    16
	<div class="controls extra">
ac320de33ec7 Add transcript button to player-component
Chloe Laisne <chloe.laisne@gmail.com>
parents: 242
diff changeset
    17
		<i title="Transcript" class="fa fa-bars{{if (eq player.window 'transcript') ' active'}}" {{action 'display' 'transcript'}}>
ac320de33ec7 Add transcript button to player-component
Chloe Laisne <chloe.laisne@gmail.com>
parents: 242
diff changeset
    18
			Transcript
ac320de33ec7 Add transcript button to player-component
Chloe Laisne <chloe.laisne@gmail.com>
parents: 242
diff changeset
    19
		</i>
ac320de33ec7 Add transcript button to player-component
Chloe Laisne <chloe.laisne@gmail.com>
parents: 242
diff changeset
    20
	</div>
210
08ad36c693b1 Player design
Chloe Laisne <chloe.laisne@gmail.com>
parents: 196
diff changeset
    21
	<div class="meta">
08ad36c693b1 Player design
Chloe Laisne <chloe.laisne@gmail.com>
parents: 196
diff changeset
    22
		<p>
08ad36c693b1 Player design
Chloe Laisne <chloe.laisne@gmail.com>
parents: 196
diff changeset
    23
			<span title="{{ item.title }}" class="title">{{ item.title }}</span>
08ad36c693b1 Player design
Chloe Laisne <chloe.laisne@gmail.com>
parents: 196
diff changeset
    24
			{{doc-language class="language" url=item.language}}
08ad36c693b1 Player design
Chloe Laisne <chloe.laisne@gmail.com>
parents: 196
diff changeset
    25
		</p>
08ad36c693b1 Player design
Chloe Laisne <chloe.laisne@gmail.com>
parents: 196
diff changeset
    26
		<p>
229
744379451219 add publisher and duration_ms to model
ymh <ymh.work@gmail.com>
parents: 215
diff changeset
    27
			<span title="{{item.publishers_disp}}" class="author">{{item.publishers_disp}}</span>
210
08ad36c693b1 Player design
Chloe Laisne <chloe.laisne@gmail.com>
parents: 196
diff changeset
    28
			<span class="date">{{short-date item.issued}}</span>
08ad36c693b1 Player design
Chloe Laisne <chloe.laisne@gmail.com>
parents: 196
diff changeset
    29
		</p>
08ad36c693b1 Player design
Chloe Laisne <chloe.laisne@gmail.com>
parents: 196
diff changeset
    30
	</div>
86
15ded106ef1a add a player component to handle sound play/pause
nowmad@23.1.168.192.in-addr.arpa
parents:
diff changeset
    31
</div>
15ded106ef1a add a player component to handle sound play/pause
nowmad@23.1.168.192.in-addr.arpa
parents:
diff changeset
    32
242
523ca6e73353 Add video player
Chloe Laisne <chloe.laisne@gmail.com>
parents: 241
diff changeset
    33
<div id="video">
523ca6e73353 Add video player
Chloe Laisne <chloe.laisne@gmail.com>
parents: 241
diff changeset
    34
	<video id="popcorn-audio">
523ca6e73353 Add video player
Chloe Laisne <chloe.laisne@gmail.com>
parents: 241
diff changeset
    35
		{{#each player.model.media as |medium|}}
523ca6e73353 Add video player
Chloe Laisne <chloe.laisne@gmail.com>
parents: 241
diff changeset
    36
		<source src="{{ medium.url }}" type="{{ medium.format }}">
523ca6e73353 Add video player
Chloe Laisne <chloe.laisne@gmail.com>
parents: 241
diff changeset
    37
		{{/each}}
523ca6e73353 Add video player
Chloe Laisne <chloe.laisne@gmail.com>
parents: 241
diff changeset
    38
	Your browser does not support the audio element.
523ca6e73353 Add video player
Chloe Laisne <chloe.laisne@gmail.com>
parents: 241
diff changeset
    39
	</video>
523ca6e73353 Add video player
Chloe Laisne <chloe.laisne@gmail.com>
parents: 241
diff changeset
    40
</div>