Autocomplete of custom JavaScript functions in Sublime Text - autocomplete

I am using Sublime Text to code my website where I have a JavaScript file with a lot of functions. I use those functions quite frequently and every time I do, I have to type the whole function out.
I noticed that for each function, I could create a Sublime Text snippet with a shortcut. However there is a huge list of functions and they keep changing.
Is there a way where in I could just import this JavaScript file and this snippet file is created, such that I have my autocompletes ready to use?

A simple snippet that creates three opening and closing p tags:
<snippet>
<content>
<![CDATA[
<p>
$1
</p>
<p>
$2
</p>
<p>
$3
</p>
]]>
</content>
<tabTrigger>p3</tabTrigger>
<scope>text.html</scope>
</snippet>
Save it as html-p3.sublime-snippet in (Mac OS X) /Users/yourname/Library/Application Support/Sublime Text 2/Packages/User and you can enter p3+tab to create three <p> tags. The $1, $2, $3 are where your cursor will jump after you press tab. This allows you to easily add content without having to select manually.
This great blog post explains everything you need to know about Sublime Text snippets:
You can use snippets for CSS as well as HTML (actually, you can use snippets with any language or text that works inside Sublime Text).
To summarize, you can put all of your function snippets in between the <snippet><content><![CDATA[ *content here*]]></content></snippet> and save it as a .snippet file in the default preferences folder of Sublime Text.

Sublime Text should automatically autocomplete the function names (not the parameters) if everything is in one big file. The only possible issue I can think of is that Sublime Text doesn’t recognize the file type. Check if View → Syntax is set to JavaScript.
If you want full autocompletion with parameters, try Tern for Sublime.

You can try javascript plugin for sublime which will help in auto completion while writing code in js.
Here is the list of javascript plugin:
http://www.sitepoint.com/essential-sublime-text-javascript-plugins/
Here is the way to setup plugin in sublime:
How to install plugins to Sublime Text 2 editor?

Related

How do you configure emmet to show hints with tags in backticks?

I'm using a VS Code. I have a HTML file with section and I tried to add function where I'm returning a HTML code in backticks. Emmet doesn't work I have to type all html tags myself. Hint is missing.

Brackets auto tag completion like dreamweaver?

I've just about had as much as I can stand with Brackets, and NPP isn't much better. I'm so used to coding in Dreamweaver that I have become very accustomed to Adobe's auto tag completion - for example -
When I type
<div>
div content
misc. stuff
etc
</ (at this point, dreamweaver will complete the </div> tag)
In brackets, as soon as I type
<div>
it will automatically turn it into:
<div></div>
with the cursor in the middle, to insert content between the opening and closing tags.
Notepad++ will do neither of the above, unless I go into settings>preferences and turn on tag autocomplete, where it will do the exact same thing as brackets.
I absolutely hate this, I love the way Dreamweaver completes their tags but I don't like Dreamweaver in general. Is there a setting for this type of auto-completion in Brackets or Notepad++ that I may have overlooked? I've spent literally hours looking for a solution to this, everything from editing backets' JSON file to trying different HTML editors to almost throwing my G** D*** laptop against a wall from infuriation.
Is there a setting I can change, or a specific line of code I can add to Brackets' config.json file? If not, if you know of another program that has dreamweaver style tag closing, please please PLEASE let me know, I've been desperately looking for something to replace it!
Thank you very much in advance.
Yes, in Brackets you can get that behavior by adding this line to your preferences JSON file:
"closeTags": {"whenOpening": false, "whenClosing": true, "indentTags": [], "dontCloseTags": []}
To edit your preferences file, choose Debug > Open Preferences File from the menu. If the file is currently blank, be sure to wrap the above line in {}s.
For more details, check out the full list of Brackets preferences.

How to add a macro to an umbraco page when using the markdown editor

EDIT:
What I really need is an editor that'll allow me to write html directly and allow inserting macros.
I'm using WMD editor in umbraco 7 and need to add a partial view macro to the page.
The editor does not have an insert macro button and if I pasted the following code in the editor, it is not shown in the page. I think the markdown processor removes it from the page ; <umbraco:Macro Alias="YourMacroAlias" \>
How can I add the macro to the page ?
Out of the box, the WMD editor does not support embedding Macros in the same way as the Richtext Editor does. You could raise a feature request at http://issues.umbraco.org and see if they'll add it, or you could take the source of the WMD from the Umbraco source at https://github.com/umbraco/Umbraco-CMS and create your own version of the markdown editor based on it.
The way the Richtext editor does it is that it stores the macro details as a specially formatted bit of markup, and there's some code in the front end that looks for that markup and replaces it with the output of the Macro.
Go to the developer section. Open the Macros.
In your macro there is a checkbox "Use in rich text editor and the grid" and "Render in rich text editor and the grid" check this.
For Using in Rich Text the option must be checked in the Data Type.
In the Developer section there is below Data Types, the Richtext editor data type check umbmacro.
In the Rich Text editor there is a "Insert Macro" Button, the 2 gears icon.
But for a markdown datatype there is no button, no support, An option is invent a tag a replace you tag in the template with somethings else. To come a bit near a macro functionality.
Instead of using Markdown editor for less options, you can disable excess commands for the tinyMce too. Extra tags added by tinyMce can also be disabled, see at end
Firstly there is file in config folder named tinyMceConfig.config. It handles the options in all datatypes using tinyMce. Below is entry for macro
<command>
<umbracoAlias>umbracomacro</umbracoAlias>
<icon>images/editor/insMacro.gif</icon>
<tinyMceCommand value="" userInterface="true" frontendCommand="umbmacro">umbracomacro</tinyMceCommand>
<priority>62</priority>
</command>
Go to
Developer -> DataTypes -> Rich Text Editor
There will be toolbar checkbox list. Select umbmacro from the list and save the data type. You will see the macro on the WYSIWYG editor. Uncheck all unwanted options. Also you can create new datatype say "RTE Lite" using property editor "Rich Text Editor" and use this "RTE Lite" where less options are needed.
Edit: Okay, if you do not like extra p tag added by tinyMce, go to "tiny_mce_src.js" file from your umbraco solution, search for forced_root_block : 'p' and change it to forced_root_block : ''

How can I setup autocompletion of early typed word in Sublime3?

How can I setup autocompletion of early typed word in Sublime3?
For example in Notepad when I typing something, and if first symbols match I have popup window.
Can I do such window in sublime 3?
Thanks
Open Preferences -> Settings - User and add the following line:
"auto_complete_selector": "source, text",
Save the file, and you should be all set, whether you're coding (source), typing in plain text, or using HTML or any other markup language like XML, Markdown, reStructuredText, LaTeX, etc. (text).

Textmate shortcut/macro for selecting HTML tag's contents?

Is there a Textmate shortcut or macro for selecting an HTML tag's contents?
<p>Everything</p>
So, for the above, "Everything" would be selected.
Bonus points if you know of a shortcut or macro that also selects everything including the tags.
Surprised these aren't in the HTML bundle.
There is a bundle by this guy http://inquirylabs.com/blog2009/my-textmate-bundle/ that will do that for you.
Default hotkey is cmd right arrow... once you have the tag you want highlighted hit tab and it will select its contents.