[Bps-public-commit] rt-extension-inlinehelp branch target-selector created. 3e2b2d9e686df537df3425172eedc0478e7fdf5e
BPS Git Server
git at git.bestpractical.com
Wed Oct 13 21:14:09 UTC 2021
This is an automated email from the git hooks/post-receive script. It was
generated because a ref change was pushed to the repository containing
the project "rt-extension-inlinehelp".
The branch, target-selector has been created
at 3e2b2d9e686df537df3425172eedc0478e7fdf5e (commit)
- Log -----------------------------------------------------------------
commit 3e2b2d9e686df537df3425172eedc0478e7fdf5e
Author: sunnavy <sunnavy at bestpractical.com>
Date: Thu Oct 14 04:49:01 2021 +0800
Use "append" as the default action
Compared to "after", "append" doesn't break layout in most cases, which
makes it more suitable as the default action.
diff --git a/README b/README
index 6e58969..7550366 100644
--- a/README
+++ b/README
@@ -281,7 +281,7 @@ REFERENCE
adding the help icons to the DOM. This controls, for example, where
the icon should be rendered relative to the matching DOM element.
- If missing, "after" is the default.
+ If missing, "append" is the default.
* *String* A shortcut method for referencing a number of
predefined action functions. The following values are supported:
diff --git a/lib/RT/Extension/InlineHelp.pm b/lib/RT/Extension/InlineHelp.pm
index d48f7cb..f1df24a 100644
--- a/lib/RT/Extension/InlineHelp.pm
+++ b/lib/RT/Extension/InlineHelp.pm
@@ -430,7 +430,7 @@ Optional. The action that should be taken with each help icon that results from
of C<selector>. Responsible for actually adding the help icons to the DOM. This controls, for
example, where the icon should be rendered relative to the matching DOM element.
-If missing, C<"after"> is the default.
+If missing, C<"append"> is the default.
=over
diff --git a/static/js/inlinehelp.js b/static/js/inlinehelp.js
index 664834a..81b4998 100644
--- a/static/js/inlinehelp.js
+++ b/static/js/inlinehelp.js
@@ -22,6 +22,9 @@ function helpify($els, item={}, options={}) {
case "before":
$el.before( buildPopupHelpHtml( title, content ) );
break;
+ case "after":
+ $el.after( buildPopupHelpHtml( title, content ) );
+ break;
case "prepend":
$el.prepend( buildPopupHelpHtml( title, content ) );
break;
@@ -32,11 +35,8 @@ function helpify($els, item={}, options={}) {
$el.replaceWith( buildPopupHelpHtml( title, content ) );
break;
case "append":
- $el.append( buildPopupHelpHtml( title, content ) );
- break;
- case "after": // intentionally fallthrough, as 'after' is the default
default:
- $el.parent().append( buildPopupHelpHtml( title, content ) );
+ $el.append( buildPopupHelpHtml( title, content ) );
}
})
}
commit 9606bd44aa6494655a5aa8234aca1a5b62027170
Author: sunnavy <sunnavy at bestpractical.com>
Date: Thu Oct 14 04:45:51 2021 +0800
Refactor to simplify code and make logic more clear and consistent
diff --git a/static/js/inlinehelp.js b/static/js/inlinehelp.js
index 388342f..664834a 100644
--- a/static/js/inlinehelp.js
+++ b/static/js/inlinehelp.js
@@ -9,82 +9,14 @@ if ( RT.CurrentUser.InlineHelp ) {
// add one or more items to the list of help entries to process for the page
function addPopupHelpItems() {
- const args = [].slice.call(arguments).reduce(function(acc,val) { return acc.concat(val) }, [] );
- pagePopupHelpItems = pagePopupHelpItems || [];
- pagePopupHelpItems = pagePopupHelpItems.concat(args);
-}
-
-function applySelectorQueryOrFunc( sel ) {
- if ( sel ) {
- if ( typeof(sel) === "string" ) {
- return jQuery(sel);
- } else if ( typeof(sel) === "function" ) {
- return sel(jQuery);
- }
- }
-}
-
-function getPopupHelpAction( entry={} ) {
- entry.action = entry.action || "append"
- if ( typeof(entry.action) === "string" ) {
- const funcMap = {
- "before": beforePopupHelp,
- "after": afterPopupHelp,
- "append": appendPopupHelp,
- "prepend": prependPopupHelp,
- "offset": offsetPopupHelp,
- "replace": replacePopupHelp
- }
- if (funcMap.hasOwnProperty(entry.action)) {
- return funcMap[entry.action];
- } else {
- console.error("Unknown action '" + entry.action + "' using 'after' instead");
- return funcMap.after;
- }
- } else if ( typeof(entry.action) === "function" ) {
- return entry.action;
- }
-}
-
-function getPopupHelpActionArgs( entry={}, $els ) {
- return entry.actionArgs ? [ $els, entry, entry.actionArgs ] : [ $els, entry ];
-}
-
-function beforePopupHelp( $els, item={}, options={} ) {
- item.action = options.action = "before";
- return helpify( $els, item, options );
-}
-
-function afterPopupHelp( $els, item={}, options={} ) {
- item.action = options.action = "after";
- return helpify( $els, item, options );
-}
-
-function appendPopupHelp( $els, item={}, options={} ) {
- item.action = options.action = "append";
- return helpify( $els, item, options );
-}
-
-function prependPopupHelp( $els, item={}, options={} ) {
- item.action = options.action = "prepend";
- return helpify( $els, item, options );
-}
-
-function offsetPopupHelp( $els, item={}, options={} ) {
- item.action = options.action = "offset";
- return helpify( $els, item, options );
-}
-
-function replacePopupHelp( $els, item={}, options={} ) {
- item.action = options.action = "replace";
- return helpify( $els, item, options );
+ pagePopupHelpItems = pagePopupHelpItems.concat([].slice.call(arguments));
}
function helpify($els, item={}, options={}) {
$els.each(function(index) {
- const $el = jQuery($els.get(index));
+ const $el = jQuery(this);
const action = $el.data("action") || item.action || options.action;
- const title = $el.data("title") || item.title || $el.data("help");
+ const title = $el.data("help") || $el.data("title") || item.title;
const content = $el.data("content") || item.content;
switch(action) {
case "before":
@@ -114,58 +46,30 @@ function buildPopupHelpHtml(title, content) {
return '<span class="popup-help" tabindex="0" role="button" data-toggle="popover" title="' + title + '" data-trigger="hover" ' + contentAttr + '><span class="far fa-question-circle"></span></span>';
}
-function applyPopupHelpAction( entry, $els ) {
- if ( entry ) {
- const fn = getPopupHelpAction( entry );
- const args = getPopupHelpActionArgs( entry, $els );
- fn.apply(this, args);
- }
-}
-
// Dynamically load the help topic corresponding to a DOM element using AJAX
// Should be called with the DOM element as the 'this' context of the function,
// making it directly compatible with the 'content' property of the popper.js
// popover() method, which is its primary purpose
const popupHelpAjax = function() {
- const isDefined = function(x) { return typeof x !== "undefined" };
- const buildUrl = function(title) { return RT.Config.WebHomePath + "/Helpers/HelpTopic?title=" + encodeURIComponent(title) };
- const boolVal = function(str) {
- try {
- return !!JSON.parse(str);
- }
- catch {
- return false;
- }
- }
-
const $el = jQuery(this);
- const title = $el.data("help") || $el.data("title") || $el.data("originalTitle");
var content = $el.data("content");
if (content) {
return content;
} else {
- const isAsync = isDefined($el.data("async")) ? boolVal($el.data("async")) : true;
- if (isAsync) {
- const tmpId = "tmp-id-" + jQuery.now();
- jQuery.ajax({
- url: buildUrl(title),
- dataType: "json",
- success: function(response, statusText, xhr) {
- jQuery("#" + tmpId).html(response.content);
- $el.data('content', response.content);
- $el.attr('data-original-title', response.title);
- if ( response.content && title != response.title ) {
- $el.popover('show');
- }
- },
- error: function(e) {
- jQuery("#" + tmpId).html("<div class='text-danger'>Error loading help for '" + title + "': " + e);
- }
- })
- return "<div id='" + tmpId + "'>Loading...</div>";
- } else {
- return "<div class='text-danger'>No help content available for '" + title + "'.</div>";
- }
+ const buildUrl = function(title) { return RT.Config.WebHomePath + "/Helpers/HelpTopic?title=" + encodeURIComponent(title) };
+ const title = $el.data("help") || $el.data("title") || $el.data("original-title");
+ jQuery.ajax({
+ url: buildUrl(title),
+ dataType: "json",
+ success: function(response, statusText, xhr) {
+ $el.data('content', response.content);
+ $el.popover('show');
+ },
+ error: function(e) {
+ return "<div class='text-danger'>Error loading help for '" + title + "': " + e + "</div>";
+ }
+ })
+ return RT.I18N.Catalog.loading;
}
}
@@ -174,11 +78,7 @@ function renderPopupHelpItems( list ) {
list = list || pagePopupHelpItems;
if (list && Array.isArray(list) && list.length) {
list.forEach(function(entry) {
- // console.log("processing entry:", entry)
- const $els = applySelectorQueryOrFunc(entry.selector);
- if ( $els ) {
- applyPopupHelpAction( entry, $els );
- }
+ helpify(jQuery(entry.selector), entry);
});
jQuery('[data-toggle="popover"]').popover({
trigger: 'hover',
commit a42eb79259eb75d655147988573425eb5b077437
Author: sunnavy <sunnavy at bestpractical.com>
Date: Thu Oct 14 03:54:56 2021 +0800
Add some space between content and help icon
diff --git a/static/css/inlinehelp.css b/static/css/inlinehelp.css
index 292d3c0..165a154 100644
--- a/static/css/inlinehelp.css
+++ b/static/css/inlinehelp.css
@@ -5,3 +5,7 @@
.darkmode .popover-header {
border-bottom: 1px solid rgba(255, 255, 255, 0.6);
}
+
+.popup-help {
+ margin-left: 5px;
+}
commit 5824094198a312295c79146b213eb34d434391b0
Author: sunnavy <sunnavy at bestpractical.com>
Date: Thu Oct 14 03:54:12 2021 +0800
Use <span> so we can insert help icons into menu links
diff --git a/static/js/inlinehelp.js b/static/js/inlinehelp.js
index b8c4b35..388342f 100644
--- a/static/js/inlinehelp.js
+++ b/static/js/inlinehelp.js
@@ -111,7 +111,7 @@ function helpify($els, item={}, options={}) {
function buildPopupHelpHtml(title, content) {
const contentAttr = content ? ' data-content="' + content + '" ' : '';
- return '<a class="popup-help" tabindex="0" role="button" data-toggle="popover" title="' + title + '" data-trigger="hover" ' + contentAttr + '><span class="far fa-question-circle fa-lg"></span></a>';
+ return '<span class="popup-help" tabindex="0" role="button" data-toggle="popover" title="' + title + '" data-trigger="hover" ' + contentAttr + '><span class="far fa-question-circle"></span></span>';
}
function applyPopupHelpAction( entry, $els ) {
commit 408065710cecb4f484208884b474d7a775a5ac01
Author: sunnavy <sunnavy at bestpractical.com>
Date: Thu Oct 14 03:29:43 2021 +0800
Support to render help content from Articles
Previously users had to write Mason or JS code to render help icons and
connect them with articles. Because of the separation, there could be
useless icons generated which don't actually have corresponding articles
created yet, and vice versa.
This commit adds a new approach, which loads help articles first and
then render them properly according to the "Target" selector.
diff --git a/etc/initialdata b/etc/initialdata
index 6395187..f109add 100644
--- a/etc/initialdata
+++ b/etc/initialdata
@@ -34,4 +34,10 @@ our @CustomFields = (
Type => 'Freeform',
MaxValues => 1,
},
+ { Name => 'Target',
+ Description => 'jQuery Selector',
+ LookupType => 'RT::Class-RT::Article',
+ Type => 'Freeform',
+ MaxValues => 1,
+ },
);
diff --git a/html/Callbacks/RT-Extensio-InlineHelp/Elements/JavascriptConfig/Data b/html/Callbacks/RT-Extensio-InlineHelp/Elements/JavascriptConfig/Data
new file mode 100644
index 0000000..ab3f5a0
--- /dev/null
+++ b/html/Callbacks/RT-Extensio-InlineHelp/Elements/JavascriptConfig/Data
@@ -0,0 +1,29 @@
+<%INIT>
+return unless $session{CurrentUser};
+return unless RT->Config->Get('ShowInlineHelp', $session{CurrentUser});
+
+my $lh = $session{CurrentUser}->LanguageHandle;
+my @locs = ( $lh->language_tag(), $lh->fallback_languages() );
+my $help_class = GetInlineHelpClass( \@locs );
+return unless $help_class;
+
+my $articles = RT::Articles->new($session{CurrentUser});
+$articles->Limit( FIELD => 'Class', VALUE => $help_class->Id );
+
+my @help;
+while ( my $article = $articles->Next ) {
+ my $target = $article->FirstCustomFieldValue('Target') or next;
+ push @help,
+ { selector => $target,
+ title => $article->FirstCustomFieldValue('Display Name'),
+ content => $article->FirstCustomFieldValue('Content'),
+ action => 'append',
+ };
+}
+
+$CurrentUser->{InlineHelp} = \@help;
+</%INIT>
+
+<%ARGS>
+$CurrentUser
+</%ARGS>
diff --git a/static/js/inlinehelp.js b/static/js/inlinehelp.js
index 0f3a503..b8c4b35 100644
--- a/static/js/inlinehelp.js
+++ b/static/js/inlinehelp.js
@@ -3,6 +3,10 @@ var pagePopupHelpItems = [
{ selector: "[data-help]", action: helpify } // by default, anything with data-help attributes gets processed
];
+if ( RT.CurrentUser.InlineHelp ) {
+ pagePopupHelpItems = pagePopupHelpItems.concat(RT.CurrentUser.InlineHelp);
+}
+
// add one or more items to the list of help entries to process for the page
function addPopupHelpItems() {
const args = [].slice.call(arguments).reduce(function(acc,val) { return acc.concat(val) }, [] );
-----------------------------------------------------------------------
hooks/post-receive
--
rt-extension-inlinehelp
More information about the Bps-public-commit
mailing list