--- /dev/null
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
+ y="0px"
+ viewBox="0 0 101.9 84.2" style="enable-background:new 0 0 101.9 84.2;" xml:space="preserve">
+<style type="text/css">
+ .st0{fill:#FFFFFF;}
+ .st1{fill:none;stroke:#FFFFFF;stroke-width:3;stroke-miterlimit:10;}
+ .st2{opacity:0.5;fill:#FFFFFF;}
+</style>
+ <path class="st0" d="M48.4,68.2c6.2,1,8.1,1.1,12.7,2.5c4.6,1.3,18.1,13.4,18.1,13.4s11.7,1.1,17.4-5.7c5.7-6.8,5.2-15.7,5.2-15.7
+ S92,55.4,86.4,47c-5.6-8.4-13.5-24.1-16.2-25.3c-2.7-1.2-2.6,0-4.6-0.2c-1.9-0.2-5.4-2.3-7.1-2.6c-1.7-0.2-4.5,2.7-5.9,2.6
+ c-1.5-0.1-6.8-2.2-8.8,0c-2,2.2-2.1,2.6-2.8,2.6c-0.7,0-2.5-1.1-4-2.4c-1.5-1.2-10.6-6.3-13.7-8.1c-3.1-1.8-9-6.9-11.4-5.2
+ c-3.4,2.4-2,5.5-0.9,6.4c1.2,0.9,10.9,7.7,15.3,12.5c4.4,4.7,9.5,8.9,15.1,18.1c1.1,1.8,0.8,3.8,0.3,3.5c-0.6-0.3-5-2.8-5.4-3.6
+ c-0.5-0.8-1.7-5.3-2.4-6.4c-0.7-1.1-3.4-4.9-7.5-4.4c-4.2,0.5-1.5,3.4-0.7,5.5c0.8,2.1,2.5,13.1,4.5,15c2,1.8,8.4,6.2,10.1,8.1
+ C41.9,64.9,44.1,67.5,48.4,68.2z"/>
+ <g>
+ <path class="st1"
+ d="M1.5,10.7c0-5.1,4.1-9.2,9.2-9.2c5.1,0,9.2,4.1,9.2,9.2c0,5.1-4.1,9.2-9.2,9.2C5.6,20,1.5,15.8,1.5,10.7z"/>
+ <path class="st0" d="M8.8,33.5l-7-5.4c-1.1-1.1-1.1-2.8,0-3.9c1.1-1.1,2.1-0.9,3.9,0l5,2.7l5-2.7c1.6-1,2.8-1.1,3.9,0
+ c1.1,1.1,1.1,2.8,0,3.9l-6.9,5.3c0,0-1,0.9-1.9,0.9C9.8,34.3,8.8,33.5,8.8,33.5z"/>
+ <path class="st2" d="M8.8,45.3l-7-5.4c-1.1-1.1-1.1-2.8,0-3.9C3,35,4,35.2,5.7,36.1l5,2.7l5-2.7c1.6-1,2.8-1.1,3.9,0
+ c1.1,1.1,1.1,2.8,0,3.9l-6.9,5.3c0,0-1,0.9-1.9,0.9C9.8,46.1,8.8,45.3,8.8,45.3z"/>
+</g>
+</svg>
\ No newline at end of file
var help = '';
// Image centrale
- var ext = '';
- if (this.fluidbook.support.SVG) {
- ext = 'svg';
- } else {
- ext = 'png';
- }
+ var ext = 'svg';
var width = 400;
var height = 200;
var zoom = 2;
- var name = 'fingers';
- var text = this.fluidbook.l10n.__("tap twice or spread your fingers to zoom in");
- help += '<div class="illustration touch">' + this.fluidbook.loader.getImage('data/images/help-' + name + '.' + ext, width * zoom, height * zoom);
- help += '<p>' + text + '</p>';
- help += '</div>';
+
+ if (this.fluidbook.mobilefirst.enabled) {
+ var name = 'fingers';
+ var text = this.fluidbook.l10n.__("scroll down to read the page content");
+ help += '<div class="illustration touch">' + this.fluidbook.loader.getImage('images/help/help-touch-scroll.svg', width * zoom, height * zoom);
+ help += '<p>' + text + '</p>';
+ help += '</div>';
+
+
+ } else {
+ var name = 'fingers';
+ var text = this.fluidbook.l10n.__("tap twice or spread your fingers to zoom in");
+ help += '<div class="illustration touch">' + this.fluidbook.loader.getImage('data/images/help-' + name + '.svg', width * zoom, height * zoom);
+ help += '<p>' + text + '</p>';
+ help += '</div>';
+ }
var width = 100;
var height = 200;
var zoom = 1;
name = 'mouse';
- text = this.fluidbook.l10n.__('click once to zoom in, click again to zoom out') + '<br />' + this.fluidbook.l10n.__('roll the mouse wheel to zoom in/out');
+ if (this.fluidbook.mobilefirst.enabled) {
+ text = this.fluidbook.l10n.__('scroll down to read the page content');
+ } else {
+ text = this.fluidbook.l10n.__('click once to zoom in, click again to zoom out') + '<br />' + this.fluidbook.l10n.__('roll the mouse wheel to zoom in/out');
+ }
- help += '<div class="illustration mouse">' + this.fluidbook.loader.getImage('data/images/help-' + name + '.' + ext, width * zoom, height * zoom);
+ help += '<div class="illustration mouse">' + this.fluidbook.loader.getImage('data/images/help-' + name + '.svg', width * zoom, height * zoom);
help += '<p>' + text + '</p>';
help += '</div>';
help += '</div>';
// Interface
-
var next = this.fluidbook.l10n.__('next double page');
var previous = this.fluidbook.l10n.__('previous double page');
if (this.fluidbook.pad.enabled) {
next = this.fluidbook.l10n.__('next chapter');
previous = this.fluidbook.l10n.__('previous chapter');
}
+ if (this.fluidbook.mobilefirst.enabled) {
+ var next = this.fluidbook.l10n.__('next page');
+ var previous = this.fluidbook.l10n.__('previous page');
+ }
help += '<div class="interface">';
help += '<div class="next">' + next + '</div>';
help += '<div class="last">' + this.fluidbook.l10n.__('last page') + '</div>';
help += '<div class="previous">' + previous + '</div>';
help += '<div class="first">' + this.fluidbook.l10n.__('frontpage') + '</div>';
- help += '<div class="slider"><span>' + this.fluidbook.l10n.__('drag handle to switch page') + '</span></div>';
+ if ($("#slider").length > 0) {
+ help += '<div class="slider"><span>' + this.fluidbook.l10n.__('drag handle to switch page') + '</span></div>';
+ }
help += this.bookmarkLabel();
help += '</div>';
baseElement = $('#links .bookmark.' + side), // Original element used to provide position and sizing for overlay
html = '';
+
// If bookmark icon isn't present on the side we want, it means that we're on
// the first/last page and that side is missing so we can't display the help
if (baseElement.length === 0) {
// Build a HTML string via jQuery with all the styling
// Bookmark icon:
- var icon = $('<div/>').css({
+ var iconHolder = $('<div class="bookmark right" data-enabled="enabled" />').css({
width: Math.round(box.width),
height: Math.round(box.height),
margin: Math.round(circleOffset), // Centre inside circle
- backgroundSize: 'contain',
- backgroundPosition: 'center',
- backgroundRepeat: 'no-repeat',
- backgroundImage: baseElement.css('backgroundImage').replace('off.svg', 'on.svg') // Show the "on" state if not already set
- })[0].outerHTML;
+ });
+ iconHolder.html(getSpriteIcon('bookmark-corner'));
+ var icon = $(iconHolder).get(0).outerHTML;
// Circle around the icon - slightly bigger
html += $('<div>' + icon + '</div>').css({
projects / fluidbook-html5.git / commitdiff
