Skip to content

Custom insert popover problem Solved #794

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
RaviAnand111 wants to merge 11 commits into from
Closed

Custom insert popover problem Solved #794

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
4910c9a
Padding added to table popover button for editor fixes#752 #768
RaviAnand111 Dec 30, 2021
c0a1e3a
Padding added to table popover button for editor fixes#752 #768
RaviAnand111 Dec 30, 2021
ebda258
Merge branch 'publiclab:main' into main
RaviAnand111 Jan 3, 2022
3961701
Merge branch 'publiclab:main' into main
RaviAnand111 Jan 15, 2022
b43cfbe
Multiple PopUps open at a time fixes#750
RaviAnand111 Jan 15, 2022
e350928
Solved the problem with multiple popups at a time
RaviAnand111 Jan 18, 2022
9501870
Revert "Solved the problem with multiple popups at a time"
RaviAnand111 Jan 18, 2022
4730f8c
Revert " Multiple PopUps open at a time fixes#750"
RaviAnand111 Jan 18, 2022
db4df0d
Solved multiple popups at a time fixes #750 #793
RaviAnand111 Jan 18, 2022
4626a4a
CustomInsert in Command Table popover problem solved fixes #750 #793
RaviAnand111 Jan 18, 2022
b0f64f6
Error in Console solved in popover button
RaviAnand111 Jan 19, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
42 changes: 38 additions & 4 deletions dist/PublicLab.Editor.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22758,14 +22758,22 @@ module.exports = function CustomInsert(_module, wysiwyg) {
}
});
const builder = require("./PublicLab.CustomInsert.Template.js");
$('.wk-commands').append('<a class="woofmark-command-insert btn btn-outline-secondary" data-toggle="Insert" title="Custom Insert"><i class="fa fa-tags"></i></a>');
$('.wk-commands').append('<button class="woofmark-command-insert btn btn-outline-secondary" data-toggle="insert" title="Custom Insert"><i class="fa fa-tags"></i></button>');

$(document).ready(function() {
$('[data-toggle="insert"]').tooltip();
});

var Option1 = "Notes";
var Option2 = "List";
$('.woofmark-command-insert').attr('data-content', builder);
$('.woofmark-command-insert').attr('data-container', 'body');
$('.woofmark-command-insert').attr('data-placement', 'top');
$('.woofmark-command-insert').popover({html: true, sanitize: false});

let popoverIsOpen = false;
$('.wk-commands .woofmark-command-insert').click(function() {
popoverIsOpen = !popoverIsOpen;
var sel = window.getSelection();
if (sel.anchorNode !== null) {
var range = sel.getRangeAt(0);
Expand Down Expand Up @@ -22799,6 +22807,17 @@ module.exports = function CustomInsert(_module, wysiwyg) {
}
});
});

$(':not(".woofmark-command-insert")').click((e) => {
// check to see that the clicked element isn't fa-insert icon, else when you click on the fa-insert icon, the popover will close
if ( popoverIsOpen && $('.woofmark-command-insert').children()[0] != e.target) {
const popoverContainer = document.querySelector('.popover');
const isChildElement = popoverContainer.contains(e.target);
if (popoverIsOpen && !e.target.classList.contains("woofmark-command-insert") && !isChildElement) {
$('.woofmark-command-insert').click();
}
}
});
};

},{"./PublicLab.CustomInsert.Template.js":185}],187:[function(require,module,exports){
Expand Down Expand Up @@ -23345,9 +23364,9 @@ module.exports = function initTables(_module, wysiwyg) {
});

var builder = '<div class="form-inline form-group ple-table-popover" style="width:400px;">';
builder += '<a id="decRows" class="btn btn-sm btn-outline-secondary"><i class="fa fa-minus"></i></a> <span id="tableRows">4</span> <a id="incRows" class="btn btn-sm btn-outline-secondary"><i class="fa fa-plus"></i></a>';
builder += ' x ';
builder += '<a id="decCols" class="btn btn-sm btn-outline-secondary"><i class="fa fa-minus"></i></a> <span id="tableCols">3</span> <a id="incCols" class="btn btn-sm btn-outline-secondary"><i class="fa fa-plus"></i></a>';
builder += '<a id="decRows" class="btn btn-sm btn-outline-secondary"><i class="fa fa-minus"></i></a> <span id="tableRows" class="mx-1">4</span> <a id="incRows" class="btn btn-sm btn-outline-secondary"><i class="fa fa-plus"></i></a>';
builder += ' <span class="mx-1">x</span> ';
builder += '<a id="decCols" class="btn btn-sm btn-outline-secondary"><i class="fa fa-minus"></i></a> <span id="tableCols" class="mx-1">3</span> <a id="incCols" class="btn btn-sm btn-outline-secondary"><i class="fa fa-plus"></i></a>';
builder += '&nbsp;<a class="ple-table-size btn btn-outline-secondary">Add</a>';
builder += '</div>';

Expand Down Expand Up @@ -23375,7 +23394,9 @@ module.exports = function initTables(_module, wysiwyg) {

$('.woofmark-command-table').popover({html: true});

let popoverIsOpen = false;
$('.wk-commands .woofmark-command-table').click(function() {
popoverIsOpen = !popoverIsOpen;
$('.ple-table-size').click(function() {
wysiwyg.runCommand(function(chunks, mode) {
var table = createTable(
Expand All @@ -23393,6 +23414,19 @@ module.exports = function initTables(_module, wysiwyg) {
});
});
});


// close table popover when user click outside the page
$(':not(".woofmark-command-table")').click((e) => {
// check to see that the clicked element isn't fa-table icon, else when you click on the fa-table icon, the popover will close
if (popoverIsOpen && $('.woofmark-command-table').children()[0] != e.target) {
const popoverContainer = document.querySelector('.popover');
const isChildElement = popoverContainer.contains(e.target);
if (popoverIsOpen && !e.target.classList.contains("woofmark-command-table") && !isChildElement) {
$('.woofmark-command-table').click();
}
}
});
};

},{}],194:[function(require,module,exports){
Expand Down
14 changes: 14 additions & 0 deletions src/modules/PublicLab.CustomInsert.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,10 @@ module.exports = function CustomInsert(_module, wysiwyg) {
$('.woofmark-command-insert').attr('data-container', 'body');
$('.woofmark-command-insert').attr('data-placement', 'top');
$('.woofmark-command-insert').popover({html: true, sanitize: false});

let popoverIsOpen = false;
$('.wk-commands .woofmark-command-insert').click(function() {
popoverIsOpen = !popoverIsOpen;
var sel = window.getSelection();
if (sel.anchorNode !== null) {
var range = sel.getRangeAt(0);
Expand Down Expand Up @@ -113,4 +116,15 @@ module.exports = function CustomInsert(_module, wysiwyg) {
}
});
});

$(':not(".woofmark-command-insert")').click((e) => {
// check to see that the clicked element isn't fa-insert icon, else when you click on the fa-insert icon, the popover will close
if ( popoverIsOpen && $('.woofmark-command-insert').children()[0] != e.target) {
const popoverContainer = document.querySelector('.popover');
const isChildElement = popoverContainer.contains(e.target);
if (popoverIsOpen && !e.target.classList.contains("woofmark-command-insert") && !isChildElement) {
$('.woofmark-command-insert').click();
}
}
});
};
21 changes: 18 additions & 3 deletions src/modules/PublicLab.RichTextModule.Table.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,9 +48,9 @@ module.exports = function initTables(_module, wysiwyg) {
});

var builder = '<div class="form-inline form-group ple-table-popover" style="width:400px;">';
builder += '<a id="decRows" class="btn btn-sm btn-outline-secondary"><i class="fa fa-minus"></i></a> <span id="tableRows">4</span> <a id="incRows" class="btn btn-sm btn-outline-secondary"><i class="fa fa-plus"></i></a>';
builder += ' x ';
builder += '<a id="decCols" class="btn btn-sm btn-outline-secondary"><i class="fa fa-minus"></i></a> <span id="tableCols">3</span> <a id="incCols" class="btn btn-sm btn-outline-secondary"><i class="fa fa-plus"></i></a>';
builder += '<a id="decRows" class="btn btn-sm btn-outline-secondary"><i class="fa fa-minus"></i></a> <span id="tableRows" class="mx-1">4</span> <a id="incRows" class="btn btn-sm btn-outline-secondary"><i class="fa fa-plus"></i></a>';
builder += ' <span class="mx-1">x</span> ';
builder += '<a id="decCols" class="btn btn-sm btn-outline-secondary"><i class="fa fa-minus"></i></a> <span id="tableCols" class="mx-1">3</span> <a id="incCols" class="btn btn-sm btn-outline-secondary"><i class="fa fa-plus"></i></a>';
builder += '&nbsp;<a class="ple-table-size btn btn-outline-secondary">Add</a>';
builder += '</div>';

Expand Down Expand Up @@ -78,7 +78,9 @@ module.exports = function initTables(_module, wysiwyg) {

$('.woofmark-command-table').popover({html: true});

let popoverIsOpen = false;
$('.wk-commands .woofmark-command-table').click(function() {
popoverIsOpen = !popoverIsOpen;
$('.ple-table-size').click(function() {
wysiwyg.runCommand(function(chunks, mode) {
var table = createTable(
Expand All @@ -96,4 +98,17 @@ module.exports = function initTables(_module, wysiwyg) {
});
});
});


// close table popover when user click outside the page
$(':not(".woofmark-command-table")').click((e) => {
// check to see that the clicked element isn't fa-table icon, else when you click on the fa-table icon, the popover will close
if (popoverIsOpen && $('.woofmark-command-table').children()[0] != e.target) {
const popoverContainer = document.querySelector('.popover');
const isChildElement = popoverContainer.contains(e.target);
if (popoverIsOpen && !e.target.classList.contains("woofmark-command-table") && !isChildElement) {
$('.woofmark-command-table').click();
}
}
});
};