Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Oct 21 14:39
    jcubic labeled #629
  • Oct 21 14:39
    jcubic opened #629
  • Oct 21 14:30
    jcubic labeled #628
  • Oct 21 14:30
    jcubic opened #628
  • Oct 21 12:45
    jcubic labeled #627
  • Oct 21 12:45
    jcubic opened #627
  • Oct 21 11:55
    jcubic commented #610
  • Oct 21 11:54
    jcubic edited #610
  • Oct 21 10:40
    jcubic edited #610
  • Oct 21 10:38
    jcubic edited #610
  • Oct 21 10:36
    jcubic commented #610
  • Oct 13 12:44
    jcubic labeled #588
  • Oct 13 12:43
    jcubic labeled #616
  • Oct 04 11:28
    jcubic labeled #623
  • Oct 04 11:27
    jcubic commented #623
  • Oct 04 11:27
    jcubic commented #623
  • Oct 04 11:26
    jcubic commented #623
  • Oct 04 11:25
    jcubic commented #623
  • Oct 04 11:06
    jcubic closed #624
terminaleffect
@terminaleffect
I have no idea how to fix it
Jakub T. Jankiewicz
@jcubic
@terminaleffect if you update JS you need to update CSS as well.
Jakub T. Jankiewicz
@jcubic
you use some really old css for jQuery Terminal, that don't even have copy right note, so I don't know which version.
if you use version 2.9.0 use css for that version
terminaleffect
@terminaleffect
you are correct, i'm not sure why the css was modified - restoring to the original CSS worked.
terminaleffect
@terminaleffect
I have another CSS related question, how can i enable the glow and blink?
Jakub T. Jankiewicz
@jcubic
glow is added using formatting [[g;;]glow]
for cursor you can add this:
.terminal {
    --animation: terminal-glow;
    --color: green;
}
Jakub T. Jankiewicz
@jcubic
@terminaleffect right now you need this, maybe I will be able to add some of the styles into terminal:
  .terminal {
    --animation: terminal-glow;
    --color: rgba(0, 255, 0, 1);
    --error-color: rgba(255, 0, 0, 1);
  }
  .terminal-error {
    --color: var(--error-color);
  }
  .terminal span[data-text] {
    text-shadow: 1px 1px 5px var(--color);
  }
Jakub T. Jankiewicz
@jcubic
will add class terminal-glow in next version to simplify this
since the code I've posted don't work for normal text it require some tweaks
terminaleffect
@terminaleffect
hmmm maybe a 'grain' effect would be more effective. like grain.js
Jakub T. Jankiewicz
@jcubic
Jakub T. Jankiewicz
@jcubic
glow was added in 2.10.0 just add terminal-glow class
one thing is missing is default prompt, and it don't work with Prism.js (Syntax Highlighting) but it will require to duplicate lot of css code from prism so it's not worth it
terminaleffect
@terminaleffect
Jakub T. Jankiewicz
@jcubic
if you like it you can add it to you project, I have other effect at https://codepen.io/jcubic/pen/BwBYOZ
Ben
@BenMcDonald____twitter

I'm having trouble following this guide for Prism syntax highlighting https://github.com/jcubic/jquery.terminal/wiki/Formatting-and-Syntax-Highlighting

I've included required css/js files

I'm only seeing bolding of token characters. No Python syntax highlighting

$.terminal.syntax('python')

Ben
@BenMcDonald____twitter
Solved my problem... was missing an import
Jakub T. Jankiewicz
@jcubic
@BenMcDonald____twitter there is one more file that you can use https://github.com/jcubic/terminal-prism
that make Text selection over prism look better and also cursor when you click on different color text. I was using locally similar files but forget to publish it.
Ben
@BenMcDonald____twitter
@jcubic thanks for the link. Will take a look
terminaleffect
@terminaleffect

Hey Jakub. I'm getting a null error with no throw response when trying to 'cat' and folder instead of a file.

-> {"version":"1.1","method":"is_image","params":["0b172c7adcd3eed789d772c46ee947634f52e0563ed17dbaa3e6a07365114fdc5a2b","/x01"],"id":11}
fs.js:26 <- {"jsonrpc":"2.0","result":false,"id":11,"error":null}
fs.js:26 -> {"version":"1.1","method":"readFile","params":["0b172c7adcd3eed789d772c46ee947634f52e0563ed17dbaa3e6a07365114fdc5a2b","/x01"],"id":12}
fs.js:26 <- {"jsonrpc":"2.0","result":"","id":12,"error":null}
DevTools failed to load SourceMap: Could not load content for chrome-extension://gighmmpiobklfepjocnamgkkbiglidom/include.preload.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
DevTools failed to load SourceMap: Could not load content for chrome-extension://gighmmpiobklfepjocnamgkkbiglidom/include.postload.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
DevTools failed to load SourceMap: Could not load content for https://cdnjs.cloudflare.com/ajax/libs/less.js/3.11.3/less.min.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE

Instead of printing 'invalid file' invalid input it just skips a line and returns to the prompt.

Jakub T. Jankiewicz
@jcubic
This message was deleted
@terminaleffect You need to write code that will check if path is actual file before you read it, do you have code somewhere? Maybe on GitHub?
ovk
@ovk

Hi @jcubic,

A question about terminal mousewheel callback. You can set it to a function that returns true/false like so:

terminal.option('mousewheel', function (e) {
    return someCheck(e) ? true : false;
});

A while ago it used to be that if true is returned - the terminal will handle the even as usual (i.e. scroll).
But if false is returned - the terminal won't do anything with the event and let it propagate to other consumers who might be interested in handling this even.

Now I see that in the case of returning false the terminal doesn't process the event, but it also seems to prevent all other consumers from receiving this event.
I wonder if this was an intentional change and the way it works now is expected?

Jakub T. Jankiewicz
@jcubic
Hi @ovk I think it was always like this, this is becasue you may want to scroll with your own code like with less command, it was created just so less can scroll the content, it don't have scrollbar in rerender the content when you use mousewheel
if it was not like that before it was probably a bug it was meant to work like this from the beginning. Do you have any use case example what you want to do?
ovk
@ovk
I understand why there is a callback, my question was more about why when this callback returns false the event is not propagated to other listeners? This is an example when it causes a problem: https://clcalc.net/#eyJjIjpbIjIrMiIsInNpbihwaSkiLCJiYXNlNjRFbmNvZGUodG9VdGY4KFwiSGVsbG/CoHdvcmxkXCIpKSIsIjEwISIsIiNmZjAwMDDCoCvCoCMwMGZmMDAiLCIxMMKgQcKgKsKgMTEwwqBWwqAqwqAxwqBkYXnCoHRvwqBrV2giLCIyXjMyIiwicGxvdDJkKHheMyzCoHgswqBbLTUswqA1XSkiLCJwbG90MmQoeF4yLMKgeCzCoFstNSzCoDVdKSJdLCJ2IjoiMSJ9 - on this page you normally can scroll terminal with the mouse wheel, but when the mouse pointer is over one of the graphs I want graph to be zoomed instead. You can see in that case page is not scrolling (which is correct) but the graph is not zooming either, because it appears like the terminal prevents it from receiving mousewheel events.
The graph listens for events like so: $(document).on({ 'mousewheel': function (e) { zoomGraph(e); } }, '.graphs-css-selector');
Jakub T. Jankiewicz
@jcubic
mouse wheel in terminal was created in such a way to disable anything outside, this standard in jQuery return false disable event completely. The only thing you can try is to add zoom to terminal mousewheel not calling it outside. you can also try prevent default + return True. that will disable any window scroll. Both return True and false disable scroll, only return false work like in any jQuery event.
ovk
@ovk

The only thing you can try is to add zoom to terminal mousewheel not calling it outside

This is what I was going to use as a workaround, but I just did a quick test of your suggestion to use e.preventDefault(); return true; and it seems to work just fine. This approach seems much better to me, as it doesn't tie terminal to the plot library. Thank you for the suggestion!

And another quick question: if you follow the link I provided above, scroll to the top and then just click anywhere - the terminal jumps to the bottom for some reason. Is there a way to prevent that?
Jakub T. Jankiewicz
@jcubic
it was intentional, because I thought that when someone click to get focus into terminal, so he probably want to type something, I may add option to disable that.
ovk
@ovk
That would be helpful, thank you.
Kingsy
@Kingsy
Is this still used?
Marc Laporte
@marclaporte_gitlab
I use it
Jakub T. Jankiewicz
@jcubic
It's not used much because I've deleted all the links to the chat
Marc Laporte
@marclaporte_gitlab
why?
Jakub T. Jankiewicz
@jcubic
There was one feature that was lacking, sound notification. I wanted it because people join ask question and leave after few minutes. If I'm online I can rely if I know someone asked a question. I've implemented simple chat using jQuery Terminal and Firebase. But I think that Gitter is much better. Maybe I should add bot and ask ppl to stay a while after they ask a question. One thing that is nice about Gitter is email. Maybe I will restore the link.
There is issue created for sound notification they where not able to add this in few years. Desktop app have sound notification but I was not able to compile on fedora. The app was accuared by Gitter and devs that was working on it now work for gitter and other things.
Marc Laporte
@marclaporte_gitlab
Yeah, drive-by questions are a problem indeed...
Jakub T. Jankiewicz
@jcubic
I've replaced link to chat on the website, it now point to gitter. Maybe it's better idea then custom chat. Will use terminal based chat as example.
mynameismon
@mynameismon
Is there an option to add images and text next to each other in the jQuery terminal?
Jakub T. Jankiewicz
@jcubic
@mynameismon you can use raw: true option and your own html/css or using Terminal formatting just add text and inside use formatting for images (I still don't have this properly documented)
hello [[@;;;;http://placekitten.com/200/140]] world
this will print <span><img><span> that you can style with css to make image float.
if you want just one line to can add class to this one div with finalize function of echo
term.echo('hello [[@;;;;http://placekitten.com/200/140]] world', {
    finalize: function(div) {
        div.addClass('float-image');
    }
});
and with css .float-image img, .float-image span { float: left; }
you can also use any css you want like display: inline, flex box or css grid to make any layout you want