Styling the cursor
Closed this issue · 4 comments
I'd like the change the cursor from its default "[?]". I previously accomplished this with this bit of code
var guppy = new Guppy(inputId, {
empty_content: "\\color{gray}{\\text{Visual editor. Enter your expression here}}",
done_callback: process
});
I've updated my Guppy.init to the following since
Guppy.init({
osk: new GuppyOSK({"goto_tab":"qwerty","attach":"focus"}),
path: "plugins/guppy/build",
symbols: "plugins/guppy/sym/symbols.json"
});
The default guppy input would then contain the placeholder text and then display the cursor as "|" when selected. Neither happens now. How do I accomplish this in newer versions?
In the documentation it's stated
settings | Object | A dictionary of settings. Available settings are as specified in Guppy.init. Values in this dictionary will, for this instance of the editor, override settings specified through Guppy.init. |
---|
Where is the list of settings? Does this include the cursor style?
As a side question:
How can I hide the OSK?
Thanks in advance.
The settings can now be set globally for all instances of the editor through Guppy.init
, as documented here. So, in your case, if you want all editors to have that empty content, you'd do:
Guppy.init({
osk: new GuppyOSK({"goto_tab":"qwerty","attach":"focus"}),
path: "plugins/guppy/build",
symbols: "plugins/guppy/sym/symbols.json",
settings: {"empty_content":"\\color{gray}{\\text{Visual editor. Enter your expression here}}"},
events: {"done": process}
});
Note that, in another slight API change, process
will now receive an argument, e
where e.target will be the guppy instance that triggered the event. (So if you want to get the editor's LaTeX content in the event handler, you could do
var process = function(e){ console.log(e.target.latex()); }
for example)
That documentation you referenced for the Guppy
constructor (which, reading it now, is not the most clear thing in the world--I've updated it slightly) was attempting to say that if you want a specific instance of the editor to have different settings from the global ones specified in Guppy.init
, you can pass those different settings into the constructor for that specific instance like:
var guppy = new Guppy(inputId, {
settings: {empty_content: "\\color{gray}{\\text{Hello this is a visual editor! Enter your expression here!}}"},
events: {"done": process}
});
The OSK can be hidden by a user by either clicking outside the editor (if "attach":"focus"
was passed to GuppyOSK) or by clicking the keyboard button in the editor. The OSK can be hidden programatically by Guppy.OSK.detach(my_guppy)
.
Thanks! The cursor still displays as "[?]". Is there anything I can do about this or do I have to modify the source code to get it to display as "|"?
Interesting--that is an actual regression. Should now be fixed. (Apparently I forgot that ""
is falsey)
Perfect! Thanks again.