kenshin54 / popline Goto Github PK

This is pretty much necessary, to save people from asking "will this work in (insert browser version)?" questions.

I don't understand (yet ;-) the "isBarOrChild" but it's the origin of a little bug.

When you select a line (a whole line) with the mouse from left to right, the menu appears.
But when you do from the right (the end of line) to the left (beginning of the line), the menu is not showing.

It's because the isTargetOrChild and isBarOrChild are false, so the bar is not showing up.

I don't know how to fix it yet (well, forcing isBarorChild to true, but I guess this is not the solution ;-)

The concept of having a bubble appear on text-select is pure genius, jQuery-wise.
But in my case I have a powerful WYSIWYG already, and don't need the one that popline provides.

In the popline.js I killed

//makeButtons.call(this, this.bar, $.popline.buttons);

And did this

  init: function() {
    this.bar = $("#tinymceWrapperBubbleNP").addClass("popline");

Now I have a beautiful Tinymce 4 real floating toolbar for contenteditables

This is reproducible on the demo page. Simply reduce the window to a size where scrolling is required (or alternatively add more content so that scrolling is required) and scroll part of the way down the page. Select the sentence at the top of the window. Popline appears out of screen bounds

I tested all functions on the menu.

All functions work well except creating link on selected text. It is broken I think.

Can you investigate on this one?

Hi, its a great plugin. Thanks for creating it.

Can you please add image upload also?

• go to your demo page (http://kenshin54.github.io/popline/)
• select everything from "The default [...]" to "[...] kenshin54"
• select "unordered list"

BAM - browser hangs

browser: Chrome 28

(I think it's the smiley which cause this)

sorry, this is not an issue.
Just wondering how to get the the source code if the text contains an image.

I created a custom button in the social section like so:

    custom: {
      iconClass: "fa fa-comments",
      mode: "view",
      action: function(event) {
        $('#customformcontainer').removeClass('hide');
        $('#customtextarea').text($.popline.utils.selection().text()); 
      }
    }

Im returning the text inside a commentBox/contactForm ... Just experimenting with your awesome code :-)
But if the text contains an image it is ignored.

Im wondering how can I return the html value like so:
<img src="https://github.com/image.png">

oh, btw Great job on the code ! Looks really great !

Hi, its a great plugin!

1. When the page is loaded, when you select text plugin works. When changing text on the page using ajax, plugin also works.
2. When the page is loaded, and then the text changes using ajax - when you select text to change the text of the plugin does not work.

How can I fix this?

I have installed popline (epub.amadreason.co.uk to see test code (scroll to bottom and highlight lorem ipsum)) and though the ul loads and pops up when text is highlighted there are no buttons (li elements) within the ul.

Any help with this would be greatly appreciated.

Hi,
when I mark part of the text as a link, and try to change the color it doesn't effect it. It's true that it wraps link with font tag but it can't override link's style.

Example:
<font color="#ff0000"> <a href="http://google.com">Text</a> </font>
a { color: #2E8CFA; }

In your demo

Hey @kenshin54,

I will request if you can or have a way to add inline css from what ever user is doing in editor it will translate inside tag as a inline css.

This will be very useful in Email solutions, where you need inline css on each tag in order to theme it.

I just have the issue with InsertOrderedList. Actually, I have modified your code (popline) into my own.

BTW, I'm still using this code to make a list.
document.execCommand("InsertOrderedList", false);

I posted the question on StackOverflow so people can help me figure it out.
http://stackoverflow.com/questions/25920561/insertorderedlist-doesnt-make-new-list-with-marked-text

Do you have any suggestions?

When inside a paragraph, hitting the enter key introduces a new paragraph instead of introducing a new line. Please refer to the attachment.

I was so excited with the features of popline,it's much better than any online writing tools I used.
And I came up with an idea to have a chrome plugin like this,and I think maybe it''s not hard to implement.

how can i make it work with IE6?

thx

Hello, could I set a button on the page somewhere that will pop the editor up? Is there a jQuery command I could use to show the toolbar? I would like to be able to make this usable on Android but the toolbar does not show when Android takes over the selection.

Thanks, this is perfect, every other editor is so crazy bloated.

I have been using your plugins and it works very well. So, I decided to add new features to menu such as "Insert image", "Insert table" on my forking repo.

I would like to ask you, is it possible to merge my code to your main repo (kenshin54/popline). I think it might be useful for everyone to use these features.

cheers

Is it possible to make the popline position into the center of selection? Not based on last key pos?

Article on http://medium.com is best example

Currently it is marked as 'link' but nothing happen when i click on the link, good if it can be a real anchor that take to new location when clicked.

Hello,

I have a floating window composed of an unordered list each containing a div that when double-clicked upon becomes editable. I then call on Popline by creating an instance clickedDiv.popline({position: "fixed"}). However when clicked outside the div, it ceases to be editable, but there is no documented mechanism to destroy the generated instance.
Then when clicked on another div (i.e. in another li element), Popline pops up, although the div does not have the "content editable" attribute.
I beileve this could be solved if there was a way to dynamically create Popline instance and destroy them as necessary.

Thank you!

is the option:
document.execCommand('ForeColor', false, '#cc6598');
most effective?

It's be excellent if we can insert a web image in the editable panel.

Hi,

I was try to use this plugin with textarea but I have no success. I do not want to give text editor to website users while adding any details. I am saving details to database by picking up from the textarea. I would like to give limited text formating functionalities to website user. I found this plugin useful but it is not working with textarea.

Kind regards,
Harjit Singh

Hi, the tool is great, but I encountered one issue. When I mark text as h1-h6 and then bold it, it doesn't apply. For this case italic and underline work. I even tried this on your demo page and it's the same. Any suggestions how to solve this?

Hello,

This is a feature request rather than an issue, but I do not know where to log it. Sorry for possible inconvenience.
I have elements whose contenteditable attribute change and gets activated when they are double-clicked. When double-clicking a text is selected, and in the process a Popline instance gets created.
For Popline to process the currently selected text, I must re-select it.
What I would like is for Popline to fire up and process the currently selected text.
Thank you!

Hi, really like this editor with a concept like Medium. However, how could I add a placeholder in the editable element? This might be very useful 👍

Thank you

Thanks for creating this plugin ,it is tiny but functional well satisfied my general needs.

however,I noticed that in popline it seemed that image has less maneuverability than test.I can call out popline's tool bar easy by select a bit of text,but it wouldn't happen if I select a single image instead.It confuse me alot.

beside,I wonder if popline can support some basic image manipulation method Like resize.It is unnecessary to achieve somekind of complicated word-like drag auto-resize,I think two simple editable blocks about width and height will be well satisfied.
I know things always complicated than we thought,so here i'm only wondering if it's in the develop plan,thanks~~

and at the end,sorry about my odd english and thanks try to understand it....

Any chance of markdown support?

Hi,

the color of selected text disappears when I perform next steps:
-set H1
-set color
-change heading to let's say H2

Any suggestions how to solve this?

Thanks in advance

It can be recovered it but probably should just stop indenting at the margin.

Scenario:

1. Text is selected and then linked via the link button.
2. Selecting the text thereafter does not always show the unlink button, instead it shows the link button. This is intermittent, at times it works and at other times it doesn't work even though only the text that is linked is selected. Selecting portions of the linked text and not the entire linked text seems to always show the unlink button.

In checking the code I see there is a different function that is called when Firefox is being used (ie. firefoxSelectionIsLink()).

I am using the latest version of Firefox at the time of writing - 82.0

I found a link on Stack Overflow (https://stackoverflow.com/questions/47232304/check-if-selection-contains-link) that deals with this and have replaced the existing function with the answer from "user670839". This seems to be working.

How can I make it work with IE 9?

Thanks