How can i deal with prettier behavior? - javascript

Prettier is messing my arrays so when i have a long array and i click save, prettier format it to a lot of lines so every item toke one line. i'll add some pictures to see the problem..
I want to have normal linesthis is what i want
and this is how its formating it when i save
I tried to disable prettier, it worked.. But i don't want that, i need this extension

Related

vscode change javascript indent size

I'm wondering if there is a way to change the indent size when formatting javascript in VSCode.
I found this
git commit that adds quite a few formatting options for JS but I don't see any ability to change indent size.
Anyone know of a way to do this?
--Edit--
I have already tried to change the indent size at the bottom of the editor.
Toolbar Image (can't embed images yet...)
I have also tried changing the detect indentation setting.
"editor.detectIndentation": false
But when I format it still uses two spaces.
I use a plugin called JS-CSS-HTML Formatter. It does exactly that, the ability to change editor settings for different file types.
https://marketplace.visualstudio.com/items?itemName=lonefy.vscode-JS-CSS-HTML-formatter

Reorder parameters in WebStorm

In ReSharper I used to have a Ctrl+Alt+Shift+Left arrow bound to reordering values. It would take whatever paramater/value/argument I had selected and move it one to the right. For example:
first, second third
would become
first, third, second
I've since switched to WebStorm and don't have my old ReSharper settings and can't find any such similar bind. Is this possible in WebStorm? Is there any macro functionality in WebStorm so that I could implement it myself?
It's worth noting that there is a Move Element Left, however this doesn't appear to do anything in JS files.
Edit
There is macro functionality, however the only way to implement it would be to:
select the current word -> cut -> delete the proceeding comma -> move the cursor one word left -> paste -> add comma
This results in a lot of undo's if I decided I don't want that.
Currently the only way to reorder parameters is Refactor | Change signature. If you miss the other way to change parameters order, please file a feature request to youtrack. See also https://youtrack.jetbrains.com/issue/WEB-2175

Grabbing the sentence that a selected word appears in

Using Javascript, I need to allow a user to double click a word on a page and retrieve the sentence that it appears in. Not just any sentence, but that specific one. I've toyed with retrieving all sentences that that word appears in and somehow choosing the correct sentence, so maybe that's an option.
I've scoured the web looking for this beast, and I've thought a lot about it. Some have recommended using Rangy but I haven't been able to find the functionality I'm looking for, or even functionality that would help me get where I need to be.
Any ideas?
You could turn your page into one or multiple read-only textareas, use clever CSS styling to mask it, then use the onselect event as described here: Detect selected text in a text area with javascript
Depends of course, how your page looks like and where it's used.

Javascript - Comparing string environment

I am working on a WYSIWYG editor. As it has to include just some basic functions I want to do it myself and avoid problems. Now it is working perfectly but I want to add a functionality in order to unbold, unitalic...
I know that with execCommand it is an automatic thing, but it does not work in the same way in all browsers so... my idea was the next: When pressing BOLD button, check the environment of the string, and...
If the selection is Between the open and close <b> tags, like <b>ab||selected||cd</b> replace selected with </b>selected<b>.
If the selection starts or finishes with the <b> tag, like <b>ab||selected||</b> replace it by </b>selected<b> (and then strip out all <b></b> groups.)
If the selection starts and finishes with the <b> tag, like <b>||selected||</b> replace it by </b>selected<b> (and then strip out all <b></b> groups.)
But... how can I get into a var the <b>content</b> string when just having the caret/selection IN content? It might be possible...
UPDATE
It is curious that the replacement is always the same. So, should I really get what I am asking for, or just replace it in this way, always?
I am working on a WYSIWYG editor. As it has to include just some basic
functions I want to do it myself and avoid problems. Now it is working
perfectly but I want to add a functionality in order to unbold,
unitalic...
Do not write your own WYSIWYG editor.
Do you really want to "avoid problems"? Then use one of existing good editors (there're only 2... maybe 3 in fact). Creating editor is extremely hard task for which you need a lot of time (I mean... few years), a lot of knowledge and patience (a lot of too :P).
I can myself write that "I am working on a WYSIWYG editor". For more than half of the year I'm a core developer of one of these "good editors". And during this period I implemented only one feature - very important and very complex, but one of tens/hundreds of them.
That problem you have... I don't even want to start answering. It sounds like a piece of cake, but it isn't. It's a piece of brick that can kill you when fall on your head :). I'll only start enumerating important parts of the impl: Selection + range implementations, because native differ and are buggy (~5k LOC + min Nk LOC for tests). Then you need the proper styles handling (applying and removing) impl (min 1k LOC + tests), because you have to take care about styles spanning on many blocks (like entire table bolded) and different selections containing parts or entire styles etc. And you have to avoid native execCommand, because they will break your content. Then you should also think about updating toolbar buttons states and, to make your impl bullet proof, handling different style tags (e.g. pasted). And that's only the tip of an iceberg - you'll have styles handling, but hundreds of other things broken. Things that big editors have fixed.
Anyway - learn config options for one of main editors and customize it as you want. This will take you a few hours, not a few years.

What kind of algorithm does an HTML SELECT element uses to show results as you type?

I'm trying to replicate an HTML SELECT element (drop-down-list or combobox) in Flash (AS3).
In most browsers, when you have one in focus and you type something, the combobox will try to find the value within its options and show the closest one. I was wondering what kind of algorithm is used for that.
I don't think its Levenshtein or similar since it only works with the beginning of the string.
I'm thinking that it works by keeping a buffer of what has been written, and tries to find a string starting with that... if it doesn't find anything, it clears the buffer, and searches a string beginning with the last character pressed.
I already prototyped this, and it works quite ok, with one caveat... In HTML, when you repeatedly press the same key, it will rotate between all options starting with that character. I think I could fix this, but was wondering if someone has already done it, to compare the algorithms... its turning into quite a complex code to test and debug, and I'm not sure I'm covering all the possibilities...
The reaction of form widgets to keyboard interaction is not standardised and different browsers don't agree. This is always an issue when creating ersatz form controls from script.
In HTML, when you repeatedly press the same key, it will rotate between all options starting with that character.
This feature comes from Windows and is quite unintuitive. The exact rule isn't that exactly, is quite obscure, and gives different results in IE and Opera versus the other browsers.
IMO this behaviour is highly undesirable. Since no average user is going to be able to predict how the rule works, I personally would leave it out and simply select the first option to match the typed leftstring. This is easier for you to code and easier for the user to understand.
Just did some tests on firefox, and I noticed (this is not official information, just pure speculation):
Key pressed event:
Esc (firefox only): clear buffer
Arrow up/down: move up/down on the list, clear buffer
Page up/down: move up/down by 20 on the list, clear buffer
Home: move to the top of the list, clear buffer
End: move to the end of the list, clear buffer
Other:
Empty buffer?
Yes: add key to buffer
buffer.length == 1 AND key is same as last key pressed?
Yes: go on next item starting with key.
No: add key to buffer and search next item starting with buffer.
1.5 seconds passed event: clear buffer
This will need a timer of course.
I don't know what algorithm is used in the browsers but one that comes to mind that would do what you want is sequence alignment or a longest common subsequence algorithm. It would allow you to match any part of the string to any other part of the string (with possible gaps between the matched sub strings). It's not massively quick though.
http://en.wikipedia.org/wiki/Sequence_alignment
there's also some very good lecture videos online at MIT open course ware
http://ocw.mit.edu/OcwWeb/Electrical-Engineering-and-Computer-Science/6-046JFall-2005/VideoLectures/detail/embed15.htm
In HTML, when you repeatedly press the same key, it will rotate between all options starting with that character. I think I could fix this, but was wondering if someone has already done it, to compare the algorithms
You might want to reset to the top of the dropdown after every key press and then search for the appended buffer.

Categories

Resources