I've setup PHP IntelliSense to use Allman Style linebreaks, so when I use CTRL+K+F it will successfully reformat from this:
if (condition) {
// code...
} else {
// code
}
To this (Allman style):
if (condition)
{
// code...
}
else
{
// code
}
What I cannot get working is how to get VSCodes auto-complete functions to format the same way:
I want braces to be on a new line, but nothing I've found, even extensions, seems to do this. Thanks!
Ok I figured this out, it's called a Snippet, and you can configure them via
CTRL+SHIFT+P
Snippets: Configure User Snippets
Then create a new one or extend from the list
If you want to add a PHP user snippet to use with HTML, then add your php tag to the html snippet.
You can use variables $1 $2 $3 to allow you to tab through components of snippet once it outputs.
Related
I'm running into some strange formatting issues with vscode using svelte. Whenever I create an HTML tag, say <p></p>, as soon as I save or click elsewhere, it reformats to this: <p />. I have no idea what's going on. It also doesn't seem to like certain Svelte tags like <slot></slot>. Has anyone else encountered this? If so, what did you do to fix it?
If you are using the official Svelte extension, it only comes with one way of formatting the code: Prettier.
If you want control back, turn off svelte.plugin.svelte.format.enable. You could also create a .prettierrc and see if there are any Prettier options to change this particular behavior.
By the way: Even though something like <div /> would be invalid in HTML, it is not in Svelte because the code gets compiled anyway.
If you have just a div like that in a component, it gets compiled to:
function create_fragment(ctx) {
let div;
return {
c() {
div = element("div");
},
m(target, anchor) {
insert(target, div, anchor);
},
p: noop,
i: noop,
o: noop,
d(detaching) {
if (detaching) detach(div);
}
};
}
Or with SSR:
const App = create_ssr_component(($$result, $$props, $$bindings, slots) => {
return `<div></div>`;
});
If you are using Svelte for VS Code extension, you can enable svelte strict mode in extension settings, or put this in settings.json
"svelte.plugin.svelte.format.config.svelteStrictMode": true
i use jodit in my website and wonder, how the content of an existing jodit editor can be updated within a function.
first i do....
$( document ).ready(function() {
var editor_adressblock = new Jodit('#adressblock', {
fullsize: false
});
});
and the editor is correctly created.
I have a function, which can be executed by the user and then should load content (via json-request) and then put the content into the existing jodit textarea.
Here is my try (for this example i have simplified the function) :
function takeover_adressblock(kunde_id, kunden_adresse_id) {
// get data by ajax.... not shown in this example
var data_by_ajax="test";
editor_adressblock.value=data_by_ajax; // this fails....
}
Means, i don't know how i can send data to the existing jodit texteditor...
I am a jquery beginner, so please don't be too hard ;-)
Best regards
Daniel
Per the documentation you seem to have the right format, so it would help to see the code for the ajax request you're making in case the issue is there.
Otherwise, I would suggest initializing the editor without jQuery in case it's a reference or scoping issue:
const editor = Jodit.make('#editor');
editor.value = '<p>start</p>';
Which formatter does Visual Code use? I read somewhere it uses jsbeautifier so I tried adding a compatible ignore comment to my .ejs template, but it doesn't work.
As far as I know, there is no way to do this without an extension.
However, you have full control of the formatting if you use this extension. It also uses js-beautify, but it adds configuration.
As specified in the js-beautify docs, the "preserve" directive only works in javascript sections. I have tested this in the script tag of an ejs file and formatting the document does NOT change the indentation of the console.log statement. This worked without changing any settings at all, actually. I simply installed the extension, saved this file as index.ejs and observed that vscode had the language mode set to html.
My test page
// These comments DON'T work because they aren't in a javascript section of the code
/* beautify preserve:start */
<h1><%= title %></h1>
/* beautify preserve:end */
<ul>
</ul>
<script>
function log() {
// Without the beautify comments, format document will move console.log
// to align with this
/* beautify preserve:start */
console.log('hello');
/* beautify preserve:end */
}
</script>
I'm trying to allow javascript in rich text editor inputs in my Umbraco setup. I'm using Umbraco 7.2. I've enabled the script tag in tinyMceConfig.config so the editor no longer eats my script tags. The problem now is that my content is cut off.
For example, in my RTE I put:
<p>before</p>
<script>
alert('blam');
</script>
<p>after</p>
This get's transformed by TinyMCE to:
<p>before</p>
<script>// <![CDATA[
alert('blam');
// ]]></script>
<p>after</p>
The problem is the value of Umbraco.Field("myRte") ends up being:
<p>before</p>
<script>// <![CDATA[
alert('blam');
// ]]
It seems related to CDATA. Does anyone else have javascript in RTE working in Umbraco 7?
A possible workaround would be to create a macro that would allow you to insert a script into the RTE. The macro would have a single Textarea parameter where you would paste in your script tag, and you would simply render the parameter value as raw Html. However, it might be a good idea to check that the input is valid html before you attempt to render it on the page.
If you use a razor macro the partial view could look like this:
#inherits Umbraco.Web.Macros.PartialViewMacroPage
#{
var script = Model.MacroParameters["script"].ToString();
}
#if (!script.IsNullOrWhiteSpace())
{
#Html.ValidateHtml(script)
}
Where ValidateHtml is an extension method to the Mvc HtmlHelper:
public static IHtmlString ValidateHtml(this HtmlHelper helper, string input)
{
if (!string.IsNullOrEmpty(input))
{
var htmlDoc = new HtmlDocument();
htmlDoc.LoadHtml(input);
if (htmlDoc.ParseErrors.Count() == 0)
{
return new MvcHtmlString(input);
}
}
return null;
}
The helper method uses the Html Agility Pack and I got the code from an answer posted to another SO question.
I've tested this on an Umbraco 7.2.1 install and it works fine even if you select the "Render in rich text editor and the grid" option.
My solution is not write direct script in editor, write it in a test.js file after that include
<script src="https:/....test.js></script>
In tiniMceConfig.config file (config folder)
validElements tag, add this
,script[type|src|language]
so it will look like this
<![CDATA[+a[id|style|rel
.....
,bdo,button,script[type|src|language]]]>
Test and work on Umbraco 4.7.x. I'm not test on umbraco 7
I am currently trying to create a borderless chrome app with a custom "control panel" for closing/minimizing/maximizing.
I have 3 divs (#minimize, #maximize, #close) that act as the buttons. I am trying to handle the clicks with javascript obviously. I have main.js included in my html header which has a the code I want.
As for closing the window my code looks like this:
document.querySelector('#close').onclick = function() {
window.close();
}
That works like a charm.
As for maximizing the window I tried:
document.querySelector('#maximize').onclick = function() {
window.maximize();
}
Which does not work. What did work was:
document.querySelector('#maximize').onclick = function() {
window.moveTo(0,0)
window.resizeTo(screen.width,screen.height);
}
I guess I am missing the obvious. window.hide() also does not work and it is also impossible to call other AppWindow functions such as getBounds. Does anyone know what I am doing wrong here?
The window object you are trying to manipulate is not Chrome's AppWindow. Use chrome.app.window.current().maximize() etc.