Skip to content

Commit 3f4f284

Browse files
cpeelcpeel
committed
Replace JS popup help with tooltips
1 parent 0d38228 commit 3f4f284

File tree

15 files changed

+158
-87
lines changed

15 files changed

+158
-87
lines changed

‎SETUP/tests/smoketests/pageload_smoketest.py‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,6 @@
3030
BASE_TESTS = [
3131
{'path': 'activity_hub.php'},
3232
{'path': 'pastnews.php'},
33-
{'path': 'pophelp.php?category=teams&name=edit_teamname'},
3433
{'path': 'project.php?id=projectID5e23a810ef693'},
3534
{'path': 'project.php?id=projectID5e23a810ef693&detail_level=1'},
3635
{'path': 'project.php?id=projectID5e23a810ef693&detail_level=2'},

‎faq/pophelp/prefs/prefs_pophelp.inc‎

Lines changed: 7 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -71,13 +71,6 @@ _("<p>This setting specifies how your credits will appear when a project is comp
7171
'content' => _("<p>The language that the site will be presented in.</p>"),
7272
],
7373

74-
// OBSOLETED. MAYBE.
75-
//'set_lang' =>
76-
// array (
77-
// 'title' => _("Language"),
78-
// 'content' => _("Your primary language.")
79-
// );
80-
8174
'set_name' =>
8275
[
8376
'title' => _("Name"),
@@ -181,15 +174,13 @@ have them assigned directly to you.</p>
181174
[
182175
'title' => _("Interface Type"),
183176
'content' =>
184-
_("<p>This setting determines which proofreading interface you prefer.</p>
185-
186-
<p>The Standard Interface is the default and is designed to work with very minimal
187-
browser requirements.</p>
188-
189-
<p>The Enhanced Interface has additional tools and features which are not present in the
190-
Standard Interface and may require a more recent browser for complete functionality.</p>
191-
192-
<p>Both interfaces require a frames and JavaScript enabled browser as a minimum.</p>"),
177+
_("<p>This setting determines which proofreading interface you prefer. Both interfaces require a frames and JavaScript enabled browser as a minimum.</p>
178+
<ul>
179+
<li>The Standard Interface is the default, uses text-based buttons,
180+
and is designed to work with minimal browser requirements.</li>
181+
<li>The Enhanced Interface uses images that have tooltips for buttons,
182+
and some buttons not present in the Standard Interface.</li>
183+
</ul>"),
193184
],
194185

195186
// FIXME In the userprefs display, add hover text to these icons

‎pinc/js_newpophelp.inc‎

Lines changed: 0 additions & 21 deletions
This file was deleted.

‎pinc/pophelp.inc‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<?php
2+
3+
function get_pophelp_json(string $category): string
4+
{
5+
global $code_url, $code_dir;
6+
7+
if ($category == "prefs") {
8+
include("$code_dir/faq/pophelp/prefs/prefs_pophelp.inc");
9+
$help = $prefs_pophelp;
10+
} elseif ($category == "teams") {
11+
include("$code_dir/faq/pophelp/teams/teams_pophelp.inc");
12+
$help = $teams_pophelp;
13+
} else {
14+
throw new ValueError("Invalid category");
15+
}
16+
17+
return json_encode($help);
18+
}

‎scripts/pophelp.js‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
/* global popHelpData */
2+
3+
document.addEventListener("DOMContentLoaded", function () {
4+
const pophelp = document.createElement("div");
5+
pophelp.className = "pophelp";
6+
document.body.appendChild(pophelp);
7+
8+
document.querySelectorAll("[data-pophelp]").forEach((elem) => {
9+
elem.addEventListener("mouseenter", function () {
10+
let content = popHelpData[this.dataset.pophelp]["content"];
11+
pophelp.innerHTML = content;
12+
const rect = this.getBoundingClientRect();
13+
pophelp.style.left = rect.left + window.scrollX + "px";
14+
pophelp.style.top = rect.bottom + window.scrollY + "px";
15+
pophelp.style.display = "block";
16+
});
17+
18+
elem.addEventListener("mouseleave", function () {
19+
pophelp.style.display = "none";
20+
});
21+
});
22+
});

‎stats/includes/team.inc‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -490,28 +490,28 @@ function showEdit($tname, $ttext, $twebpage, $tedit, $tsid)
490490
echo "</th></tr>";
491491

492492
echo "<tr>";
493-
echo "<td class='right-align'><b>"._("Team Name")."</b>:</td>";
494-
echo "<td class='left-align'><input type='text' value='" . attr_safe($tname) . "' name='teamname' size='50' maxlength='50' required>&nbsp;<b><a href=\"JavaScript:newHelpWin('teamname');\">?</a></b></td>";
493+
echo "<td class='right-align' data-pophelp='edit_teamname'><b>"._("Team Name")."</b>:</td>";
494+
echo "<td class='left-align'><input type='text' value='" . attr_safe($tname) . "' name='teamname' size='50' maxlength='50' required></td>";
495495
echo "</tr>";
496496

497497
echo "<tr>";
498-
echo "<td class='right-align'><b>"._("Team Webpage")."</b>:</td>";
499-
echo "<td class='left-align'><input type='text' value='$twebpage' name='teamwebpage' size='50' maxlength='255'>&nbsp;<b><a href=\"JavaScript:newHelpWin('teamwebpage');\">?</a></b></td>";
498+
echo "<td class='right-align' data-pophelp='edit_teamwebpage'><b>"._("Team Webpage")."</b>:</td>";
499+
echo "<td class='left-align'><input type='text' value='$twebpage' name='teamwebpage' size='50' maxlength='255'></td>";
500500
echo "</tr>";
501501

502502
echo "<tr>";
503-
echo "<td class='right-align'><b>"._("Team Avatar")."</b>:</td>";
504-
echo "<td class='left-align'><input type='file' name='teamavatar' size='50'>&nbsp;<b><a href=\"JavaScript:newHelpWin('teamavatar');\">?</a></b></td>";
503+
echo "<td class='right-align' data-pophelp='edit_teamavatar'><b>"._("Team Avatar")."</b>:</td>";
504+
echo "<td class='left-align'><input type='file' name='teamavatar' size='50'></td>";
505505
echo "</tr>";
506506

507507
echo "<tr>";
508-
echo "<td class='right-align'><b>"._("Team Icon")."</b>:</td>";
509-
echo "<td class='left-align'><input type='file' name='teamicon' size='50'>&nbsp;<b><a href=\"JavaScript:newHelpWin('teamicon');\">?</a></b></td>";
508+
echo "<td class='right-align' data-pophelp='edit_teamicon'><b>"._("Team Icon")."</b>:</td>";
509+
echo "<td class='left-align'><input type='file' name='teamicon' size='50'></td>";
510510
echo "</tr>";
511511

512512
echo "<tr>";
513-
echo "<td class='right-align' style='vertical-align: top;'><b>"._("Team Description")."</b></td>";
514-
echo "<td class='left-align' style='vertical-align: top;'><textarea name='text_data' cols='40' rows='6'>" . html_safe(unstripAllString($ttext)) . "</textarea>&nbsp;<b><a href=\"JavaScript:newHelpWin('teamdesc');\">?</a></b></td>";
513+
echo "<td class='right-align' data-pophelp='edit_teamdesc' style='vertical-align: top;'><b>"._("Team Description")."</b></td>";
514+
echo "<td class='left-align' style='vertical-align: top;'><textarea name='text_data' cols='40' rows='6'>" . html_safe(unstripAllString($ttext)) . "</textarea></td>";
515515
echo "</tr>";
516516

517517
echo "<tr>";

‎stats/teams/new_team.php‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,18 @@
22
$relPath = "./../../pinc/";
33
include_once($relPath.'base.inc');
44
include_once($relPath.'theme.inc');
5-
include_once($relPath.'js_newpophelp.inc');
5+
include_once($relPath.'pophelp.inc');
66
include_once($relPath.'metarefresh.inc');
77
include_once('../includes/team.inc'); // showEdit()
88

99
require_login();
1010

1111
$user = User::load_current();
1212

13-
$theme_extra_args = ["js_data" => get_newHelpWin_javascript("$code_url/pophelp.php?category=teams&name=edit_")];
13+
$theme_extra_args = [
14+
"js_data" => "var popHelpData = " . get_pophelp_json("teams") . ";",
15+
"js_files" => ["$code_url/scripts/pophelp.js"],
16+
];
1417

1518
$teamname = trim($_POST["teamname"] ?? "");
1619
$text_data = stripAllString($_POST["text_data"] ?? "");

‎stats/teams/tedit.php‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,16 @@
22
$relPath = "./../../pinc/";
33
include_once($relPath.'base.inc');
44
include_once($relPath.'theme.inc');
5-
include_once($relPath.'js_newpophelp.inc');
5+
include_once($relPath.'pophelp.inc');
66
include_once($relPath.'metarefresh.inc');
77
include_once('../includes/team.inc');
88

99
require_login();
1010

11-
$theme_extra_args = ["js_data" => get_newHelpWin_javascript("$code_url/pophelp.php?category=teams&name=edit_")];
11+
$theme_extra_args = [
12+
"js_data" => "var popHelpData = " . get_pophelp_json("teams") . ";",
13+
"js_files" => ["$code_url/scripts/pophelp.js"],
14+
];
1215

1316
// Either the parameter is $_POST['tsid'] when coming from the edit form,
1417
// or it is $_GET['tid'] when using the link on top of the team summary.

‎styles/layout.less‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1835,6 +1835,21 @@ p.mentor-oldest {
18351835
.center-align;
18361836
}
18371837

1838+
/* ------------------------------------------------------------------------ */
1839+
/* Popup Help */
1840+
1841+
.pophelp {
1842+
.solid-border;
1843+
display: none;
1844+
position: absolute;
1845+
background-color: @page-background;
1846+
color: @page-text;
1847+
padding: 0 5px;
1848+
border-radius: 5px;
1849+
z-index: 1000;
1850+
font-size: 90%;
1851+
}
1852+
18381853
/* ------------------------------------------------------------------------ */
18391854
/* Diff styling */
18401855
/* Import diff styling from MediaWiki */

‎styles/themes/charcoal.css‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2823,6 +2823,19 @@ p.mentor-oldest {
28232823
text-align: center;
28242824
}
28252825
/* ------------------------------------------------------------------------ */
2826+
/* Popup Help */
2827+
.pophelp {
2828+
border: thin solid #565656;
2829+
display: none;
2830+
position: absolute;
2831+
background-color: #262626;
2832+
color: #e2e2e2;
2833+
padding: 0 5px;
2834+
border-radius: 5px;
2835+
z-index: 1000;
2836+
font-size: 90%;
2837+
}
2838+
/* ------------------------------------------------------------------------ */
28262839
/* Diff styling */
28272840
/* Import diff styling from MediaWiki */
28282841
/*!

0 commit comments

Comments
 (0)