Skip to content

Commit 9bd790e

Browse files
HugoFaraHugoFara
committed
Do no longer use frames when reading text.
do_text_text and do_text_header are now summoned directly. The ability to resize was partially broken in the process. You can no longer resize vertically. Horizontal resize is no longer saved to settings. Refactored PHP in do_text_header.
1 parent b9755ae commit 9bd790e

6 files changed

Lines changed: 492 additions & 304 deletions

File tree

‎css/styles.css‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -129,7 +129,8 @@ dt
129129
{border-left:1px solid black;border-top:1px solid black;border-bottom:1px solid black;background-color:#EEEEEE}.bordermiddle
130130
{border-top:1px solid black;border-bottom:1px solid black;background-color:#EEEEEE}.borderright
131131
{border-right:1px solid black;border-top:1px solid black;border-bottom:1px solid black;background-color:#EEEEEE}.wizard
132-
{margin:20px 0 5px 0}
132+
{margin:20px 0 5px 0}.resizable
133+
{min-height:30px;min-width:30px;resize:both;overflow:auto;max-height:fit-content;max-width:fit-content}
133134
@media print
134135
{.noprint
135136
{display:none}

‎do_text.php‎

Lines changed: 52 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,17 @@
2626
WHERE TxID = ' . $_REQUEST['start']
2727
);
2828

29-
framesetheader('Read');
29+
//framesetheader('Read');
30+
pagestart_nobody(tohtml('Read'),
31+
'.resizable
32+
{
33+
min-height: 30px;
34+
min-width: 30px;
35+
resize: both;
36+
overflow: auto;
37+
max-height: fit-content;
38+
max-width: fit-content;
39+
}');
3040

3141
if ($mobile ) {
3242

@@ -116,22 +126,47 @@ function init() {
116126
// Not mobile
117127
?>
118128

119-
<frameset border="3" bordercolor="" cols="<?php echo tohtml(getSettingWithDefault('set-text-l-framewidth-percent')); ?>%,*">
120-
<frameset rows="<?php
121-
if (isset($audio)) {
122-
echo getSettingWithDefault('set-text-h-frameheight-with-audio');
123-
} else {
124-
echo getSettingWithDefault('set-text-h-frameheight-no-audio');
125-
} ?>,*">
126-
<frame src="do_text_header.php?text=<?php echo $_REQUEST['start']; ?>" scrolling="auto" name="h" />
127-
<frame src="do_text_text.php?text=<?php echo $_REQUEST['start']; ?>" scrolling="auto" name="l" />
128-
</frameset>
129-
<frameset rows="<?php echo tohtml(getSettingWithDefault('set-text-r-frameheight-percent')); ?>%,*">
130-
<frame src="empty.html" scrolling="auto" name="ro" />
131-
<frame src="empty.html" scrolling="auto" name="ru" />
132-
</frameset>
133-
<noframes><body><p>Sorry - your browser does not support frames.</p></body></noframes>
134-
</frameset>
129+
130+
<!--<frameset border="3" bordercolor="" cols="<?php echo tohtml(getSettingWithDefault('set-text-l-framewidth-percent')); ?>%,*">
131+
<frameset rows="<?php
132+
if (isset($audio)) {
133+
echo getSettingWithDefault('set-text-h-frameheight-with-audio');
134+
} else {
135+
echo getSettingWithDefault('set-text-h-frameheight-no-audio');
136+
} ?>,*">
137+
<frame src="do_text_header.php?text=<?php echo $_REQUEST['start']; ?>" scrolling="auto" name="h" />
138+
<frame src="do_text_text.php?text=<?php echo $_REQUEST['start']; ?>" scrolling="auto" name="l" />
139+
</frameset>
140+
<<frameset rows="<?php echo tohtml(getSettingWithDefault('set-text-r-frameheight-percent')); ?>%,*">
141+
<frame src="empty.html" scrolling="auto" name="ro" />
142+
<frame src="empty.html" scrolling="auto" name="ru" />
143+
</frameset>
144+
<noframes><body><p>Sorry - your browser does not support frames.</p></body></noframes>
145+
</frameset>-->
146+
<div class="resizable" style="width: 79%;">
147+
<div>
148+
<?php
149+
require 'do_text_header.php';
150+
do_text_header_content($_REQUEST['start'], true);
151+
?>
152+
</div>
153+
<hr />
154+
<div>
155+
<?php
156+
require 'do_text_text.php';
157+
do_text_text_content($_REQUEST['start'], true);
158+
?>
159+
</div>
160+
</div>
161+
<div class="resizable" style="position: fixed; top: 0; right: 5px; width: 20%; height: 99%;">
162+
<iframe src="empty.html" scrolling="auto" name="ro" style="height: 50%; width: 100%;">
163+
Your browser doesn't support iFrames, update it!
164+
</iframe>
165+
<iframe src="empty.html" scrolling="auto" name="ru" style="height: 50%; width: 100%;">
166+
Your browser doesn't support iFrames, update it!
167+
</iframe>
168+
</div>
169+
</body>
135170
</html>
136171
<?php
137172

‎do_text_header.php‎

Lines changed: 163 additions & 91 deletions
Original file line numberDiff line numberDiff line change
@@ -36,43 +36,15 @@ function getData($textid) {
3636
}
3737

3838
/**
39-
* Main function for displaying header. It will print HTML content.
39+
* Print the main title row.
4040
*
41-
* @param string $textid ID of the requiered text
42-
* @param bool $only_body If true, only show the inner body. If false, create a complete HTML document.
43-
* @global array $langDefs Language definitions
41+
* @param string $textid Text ID
42+
* @param string $langid Language ID to navigate between
43+
* texts of same language
44+
* @since 2.0.4-fork
4445
*/
45-
function do_text_header_content($textid, $only_body=true) {
46-
global $langDefs;
47-
48-
$record = getData($textid);
49-
$media = $record['TxAudioURI'];
50-
if (!isset($media)) {
51-
$media = '';
52-
}
53-
$media = trim($media);
54-
55-
$title = $record['TxTitle'];
56-
$sourceURI = $record['TxSourceURI'];
57-
$langid = $record['TxLgID'];
58-
$pos = $record['TxAudioPosition'];
59-
60-
61-
// User settings
62-
$showAll = getSettingZeroOrOne('showallwords', 1);
63-
$showLearning = getSettingZeroOrOne('showlearningtranslations', 1);
64-
65-
/** @var string $languageCode BCP 47 language tag, for istance "en" */
66-
$languageCode = $langDefs[$record["LgName"]][1];
67-
/** @var string $phoneticText Phonetic reading for this text */
68-
$phoneticText = phonetic_reading($record["TxText"], $languageCode);
69-
70-
saveSetting('currenttext', $textid);
71-
72-
if (!$only_body) {
73-
pagestart_nobody(tohtml($title), $addcss='html, body {margin-bottom:0;}');
74-
}
75-
?>
46+
function do_header_row($textid, $langid) {
47+
?>
7648
<h4>
7749
<a href="edit_texts.php">
7850
<?php echo_lwt_logo(); ?> LWT
@@ -98,16 +70,31 @@ function do_text_header_content($textid, $only_body=true) {
9870
<img src="icn/sticky-note--plus.png" title="New Term" alt="New Term" />
9971
</a>
10072
</h4>
73+
<?php
74+
}
75+
76+
/**
77+
* Print the title of the text.
78+
*
79+
* @param string $title Title of the text
80+
* @param string $sourceURI URL of the text (if any)
81+
*
82+
* @since 2.0.4-fork
83+
*/
84+
function do_title($title, $sourceURI) {
85+
?>
10186
<table>
10287
<tr>
10388
<td>
10489
<h3>READ&nbsp;▶</h3>
10590
</td>
10691
<td class="width99pc">
10792
<h3>
108-
<?php echo tohtml($title);
93+
<?php
94+
echo tohtml($title);
10995
if (isset($sourceURI) && substr(trim($sourceURI), 0, 1) != '#') {
110-
?><a href="<?php echo $sourceURI ?>">
96+
?>
97+
<a href="<?php echo $sourceURI ?>">
11198
<img src="<?php echo get_file_path('icn/chain.png') ?>" title="Text Source" alt="Text Source" />
11299
</a>
113100
<?php
@@ -117,6 +104,22 @@ function do_text_header_content($textid, $only_body=true) {
117104
</td>
118105
</tr>
119106
</table>
107+
<?php
108+
}
109+
110+
/**
111+
* Prepare user settings for this text.
112+
*
113+
* @param string $textid Text ID
114+
*
115+
* @since 2.0.4-fork
116+
*/
117+
function do_settings($textid) {
118+
// User settings
119+
$showAll = getSettingZeroOrOne('showallwords', 1);
120+
$showLearning = getSettingZeroOrOne('showlearningtranslations', 1);
121+
122+
?>
120123
<table class="width99pc">
121124
<tr>
122125
<td>TO DO:
@@ -137,72 +140,141 @@ function do_text_header_content($textid, $only_body=true) {
137140
<td id="thetextid" class="hide"><?php echo $textid; ?></td>
138141
<td><button id="readTextButton">Read in browser</button></td>
139142
</tr>
143+
</table>
144+
<?php
145+
}
140146

141-
<?php makeMediaPlayer($media, $pos); ?>
147+
/**
148+
* Prints javascript data and function to read text
149+
* in your browser.
150+
*
151+
* @param string $text Text to read
152+
* @param string $languageName Full name of the language (i. e.: "English")
153+
* @global array $langDefs Language definitions
154+
*
155+
* @since 2.0.3-fork
156+
*/
157+
function browser_tts($text, $languageName) {
158+
global $langDefs;
142159

143-
</table>
160+
/**
161+
* @var string $languageCode BCP 47 convention (i. e.: en-US) is suggested.
162+
* Two-letter language code is enough (i. e. "en")
163+
*/
164+
$languageCode = $langDefs[$languageName][1];
165+
/** @var string $phoneticText Phonetic reading for this text */
166+
$phoneticText = phonetic_reading($text, $languageCode);
167+
?>
144168
<script type="text/javascript">
145169

146-
/// Main object for text-to-speech interaction with SpeechSynthesisUtterance
147-
var text_reader = {
148-
/// The text to read
149-
text: `<?php echo htmlentities($phoneticText); ?>`,
150-
151-
/// {string} ISO code for the language
152-
lang: '<?php echo $languageCode; ?>',
153-
154-
/// {string} Rate at wich the speech is done
155-
rate: 0.8,
156-
157-
/**
158-
* Reads a text using the browser text reader.
159-
*/
160-
readTextAloud: function () {
161-
var msg = new SpeechSynthesisUtterance(this.text);
162-
msg.text = this.text;
163-
msg.lang = this.lang;
164-
msg.rate = this.rate;
165-
window.speechSynthesis.speak(msg);
166-
},
167-
168-
};
169-
170-
// Check browser compatibility before reading
171-
function init_reading() {
172-
if (!('speechSynthesis' in window)) {
173-
alert('Your browser does not support speechSynthesis!');
174-
} else {
175-
text_reader.readTextAloud();
176-
}
177-
}
170+
/// Main object for text-to-speech interaction with SpeechSynthesisUtterance
171+
var text_reader = {
172+
/// The text to read
173+
text: `<?php echo htmlentities($phoneticText); ?>`,
174+
175+
/// {string} ISO code for the language
176+
lang: '<?php echo htmlentities($languageCode); ?>',
177+
178+
/// {string} Rate at wich the speech is done
179+
rate: 0.8,
178180

179181
/**
180-
* Save audio position
182+
* Reads a text using the browser text reader.
181183
*/
182-
function saveAudioPosition() {
183-
if ($("#jquery_jplayer_1") === null) {
184-
return;
185-
}
186-
var pos = $("#jquery_jplayer_1").data("jPlayer").status.currentTime;
187-
$.ajax({
188-
type: "POST",
189-
url:'inc/ajax_save_text_position.php',
190-
data: {
191-
id: '<?php echo $_REQUEST['text']; ?>',
192-
audioposition: pos
193-
},
194-
async: false
195-
});
184+
readTextAloud: function () {
185+
var msg = new SpeechSynthesisUtterance(this.text);
186+
msg.text = this.text;
187+
msg.lang = this.lang;
188+
msg.rate = this.rate;
189+
window.speechSynthesis.speak(msg);
190+
},
191+
192+
};
193+
194+
// Check browser compatibility before reading
195+
function init_reading() {
196+
if (!('speechSynthesis' in window)) {
197+
alert('Your browser does not support speechSynthesis!');
198+
} else {
199+
text_reader.readTextAloud();
196200
}
197-
198-
$(window).on('beforeunload', saveAudioPosition);
201+
}
202+
</script>
203+
<?php
204+
}
205+
206+
/**
207+
* Save the position of the audio reading for a text.
208+
*
209+
* @param string $textid ID of the text
210+
*
211+
* @since 2.0.4-fork
212+
*/
213+
function save_audio_position($textid) {
214+
?>
199215

200-
// We need to capture the text-to-speach event manually for Chrome
201-
$(document).ready(function() {
202-
$('#readTextButton').click(init_reading)
216+
<script type="text/javascript">
217+
218+
/**
219+
* Save audio position
220+
*/
221+
function saveAudioPosition() {
222+
if ($("#jquery_jplayer_1") === null) {
223+
return;
224+
}
225+
var pos = $("#jquery_jplayer_1").data("jPlayer").status.currentTime;
226+
$.ajax({
227+
type: "POST",
228+
url:'inc/ajax_save_text_position.php',
229+
data: {
230+
id: '<?php echo $textid; ?>',
231+
audioposition: pos
232+
},
233+
async: false
203234
});
235+
}
236+
237+
$(window).on('beforeunload', saveAudioPosition);
238+
239+
// We need to capture the text-to-speach event manually for Chrome
240+
$(document).ready(function() {
241+
$('#readTextButton').click(init_reading)
242+
});
204243
</script>
205244
<?php
245+
}
246+
247+
/**
248+
* Main function for displaying header. It will print HTML content.
249+
*
250+
* @param string $textid ID of the requiered text
251+
* @param bool $only_body If true, only show the inner body. If false, create a
252+
* complete HTML document.
253+
*
254+
* @since 2.0.3-fork
255+
*/
256+
function do_text_header_content($textid, $only_body=true) {
257+
258+
$record = getData($textid);
259+
$title = $record['TxTitle'];
260+
$media = $record['TxAudioURI'];
261+
if (!isset($media)) {
262+
$media = '';
263+
}
264+
$media = trim($media);
265+
266+
267+
saveSetting('currenttext', $textid);
268+
269+
if (!$only_body) {
270+
pagestart_nobody(tohtml($title), 'html, body {margin-bottom:0;}');
271+
}
272+
save_audio_position($textid);
273+
do_header_row($textid, $record['TxLgID']);
274+
do_title($title, $record['TxSourceURI']);
275+
do_settings($textid);
276+
makeMediaPlayer($media, $record['TxAudioPosition']);
277+
browser_tts($record["TxText"], $record["LgName"]);
206278
if (!$only_body) {
207279
pageend();
208280
}

0 commit comments

Comments
 (0)