Love Sublime text 2, but somehow can't get it to do 'if then else' properly within an html.erb template.
It correctly identifies the files as 'HTML (Rails)', but when I do 'if' followed by tab
I get:
<?php if (condition): ?>
<?php endif ?>
I've seen this reported a few other places, but not sure how to fix as new to Sublimetext.
Any tips much appreciated
I added a couple of custom snippets to cover if/elsif/else in erb files.
if-erb.sublime-snippet:
<snippet>
<content><![CDATA[<% if ${1:true} -%>]]></content>
<tabTrigger>if</tabTrigger>
<scope>text.html.ruby</scope>
<description>if (ERB)</description>
</snippet>
elsif-erb.sublime-snippet
<snippet>
<content><![CDATA[<% elsif ${1:true} -%>]]></content>
<tabTrigger>elsif</tabTrigger>
<scope>text.html.ruby</scope>
<description>elsif (ERB)</description>
</snippet>
else-erb.sublime-snippet
<snippet>
<content><![CDATA[<% else -%>]]></content>
<tabTrigger>else</tabTrigger>
<scope>text.html.ruby</scope>
<description>else (ERB)</description>
</snippet>
You have php autocomplete there.
Install ruby and rails plugins for rails development.
More at http://linuxrails.blogspot.com/2012/05/sublime-text-2-setup-for-rails.html
Well, the only way i could make it work was by deleting the php snippets and adding some of my own.
Steps:
1- Go to Preferences -> Browse Packages.
2- Go inside PHP folder.
3- Delete the else/elsif snippets.
4- Create your own like the following example:
<snippet>
<content><![CDATA[
<% else %>
]]></content>
<tabTrigger>else</tabTrigger>
<scope>text.html - source</scope>
</snippet>
Related
In Sublime Text 2, I'd like to create a snippet for Rails image_tag.
I want it to be a trigger, but it seems that it is already taken by <input>.
I'd like to remove <input> snippet at all. I've looked through most of Sublime packages, but I cannot find it anywhere.
Is there an easy way to find or override the <input> snippet?
First, if you are dead set on using it to trigger the snippet, you will need to edit this file:
~/Library/Application Support/Sublime Text 2/Packages/HTML/HTML.tmLanguage
and remove input from the string
<key>begin</key>
<string>(</?)((?i:a|abbr|acronym|area|b|base|basefont|bdo|big|br|button|caption|cite|code|col|colgroup|del|dfn|em|font|head|html|i|img|input|ins|isindex|kbd|label|legend|li|link|map|meta|noscript|optgroup|option|param|q|s|samp|script|select|small|span|strike|strong|style|sub|sup|table|tbody|td|textarea|tfoot|th|thead|title|tr|tt|u|var)\b)</string>
Next, comment out this line
{ "trigger": "input", "contents": "<input>" },
from ~/Library/Application Support/Sublime Text 2/Packages/HTML/HTML.sublime-completions
input should now be free to use as you like in HTML scopes.
Go to Tools -> New Snippet... and the write the following:
<snippet>
<content><![CDATA[
<%= image_tag ${1}, ${2} %>
]]></content>
<tabTrigger>it</tabTrigger>
</snippet>
And finally save the snippet.
This snippet it's working perfectly for me.
I'm working on jRuby on Rails app in Eclipse. I recently install Aptana to better support the rails files. This provides reasonable highlighting and support for most file types includes "html.erb" files but not for other *.erb files.
It's driving me insane their must be some editor that doesn't give me a damn syntax error when I use ruby tags in js.erb files. It seems like such a basic function.
Any advice is appreciated. I am open to pretty much anything I just want some way to write javascript in erb files without a million syntax errors after every ruby tag.
This example give me a syntax error in the editor despite working perfectly fine when I run the app:
<%= render :partial => 'qunit/frame_wrapper_top' -%>
module("Carousel");
asyncTest('Slider Right Button', 1, function() {
setTimeout(function() {
var center_image = frame.find('.carouselContainer li img.current').attr('id');
var e = $q.Event("click");
$('.navButton_right').trigger( e );
setTimeout(function(){
start();
var current_center = frame.find('.carouselContainer li img.current').attr('id');
notEqual( current_center, center_image, "New item is in center");
}, 1000);
},1000);
});
I'm also looking for an editor or IDE that can handle .js.erb. Aptana (3.0.9 or 3.2.0) only seems to recognise the ERB part, the JS does not get highlighted. Maybe Emacs+nXhtml will work.
Update: nXhtml does do the job for emacs. Load the file in your ~/.emacs as described in the README, then M-x eruby-javascript-mumamo-mode !
Can anyone help me out in implementing joehewitt's scrollability plugin.(https://github.com/joehewitt/scrollability.git)
I am trying to develop a mobile web app!
Thanks in advance!
Right so,
1)Include the javascript file and the css file (its in the static folder)
2) Head to http://scrollability.com/
and following the structure create the two divs:
<div id="overflow">
<div id="scrollysection">
</div>
</div>
With the following CSS
#overflow
overflow:hidden
position:absolute
top:0px
left:0px
width:100%
height:100%
#scrollysection
position:absolute
top:0px
left:0px
3)Then you need to apply the fix here: https://github.com/joehewitt/scrollability/issues/29
To get the code running just comment out or remove all of the exports
stuff (lines 77-84). Then on line 94 where require is mentioned, just
pull the two lines of code out of that ready function and comment the
ready function out.
Thats what I did and it worked.
Have a look at the source code of: http://www.uponahill.com/ It is done by Joe Hewitt and uses scrollability.
I've been documenting a software package using Sphinx and reStructuredText.
Within my documents, there are some long code snippets. I want to be able to have them hidden as default, with a little "Show/Hide" button that would expand them (Example).
Is there a standard way to do that?
You don't need a custom theme. Use the built-in directive container that allows you to add custom css-classes to blocks and override the existsting theme to add some javascript to add the show/hide-functionality.
This is _templates/page.html:
{% extends "!page.html" %}
{% block footer %}
<script type="text/javascript">
$(document).ready(function() {
$(".toggle > *").hide();
$(".toggle .header").show();
$(".toggle .header").click(function() {
$(this).parent().children().not(".header").toggle(400);
$(this).parent().children(".header").toggleClass("open");
})
});
</script>
{% endblock %}
This is _static/custom.css:
.toggle .header {
display: block;
clear: both;
}
.toggle .header:after {
content: " ▶";
}
.toggle .header.open:after {
content: " ▼";
}
This is added to conf.py:
def setup(app):
app.add_css_file('custom.css')
Now you can show/hide a block of code.
.. container:: toggle
.. container:: header
**Show/Hide Code**
.. code-block:: xml
:linenos:
from plone import api
...
I use something very similar for exercises here: https://training.plone.org/5/mastering-plone/about_mastering.html#exercises
You can use the built-in HTML collapsible details tag by wrapping the code in two raw HTML directives
.. raw:: html
<details>
<summary><a>big code</a></summary>
.. code-block:: python
lots_of_code = "this text block"
.. raw:: html
</details>
Produces:
<details>
<summary><a>big code</a></summary>
<pre>lots_of_code = "this text block"</pre>
</details>
I think the easiest way to do this would be to create a custom Sphinx theme in which you tell certain html elements to have this functionality. A little JQuery would go a long way here.
If, however you want to be able to specify this in your reStructuredText markup, you would need to either
get such a thing included in Sphinx itself or
implement it in a Sphinx/docutils extension...and then create a Sphinx theme which knew about this functionality.
This would be a bit more work, but would give you more flexibility.
There is a very simplistic extension providing exactly that feature: https://github.com/scopatz/hiddencode
It works rather well for me.
The cloud sphinx theme has custom directive html-toggle that provides toggleable sections. To quote from their web page:
You can mark sections with .. rst-class:: html-toggle, which will make the section default to being collapsed under html, with a “show section” toggle link to the right of the title.
Here is a link to their test demonstration page.
sphinx-togglebutton
Looks like a new sphinx extension has been made to do just this since this question has been answered.
Run: pip install sphinx-togglebutton
Add to conf.py
extensions = [
...
'sphinx_togglebutton'
...
]
In rst source file:
.. admonition:: Show/Hide
:class: dropdown
hidden message
since none of the above methods seem to work for me, here's how I solved it in the end:
create a file substitutions.rst in your source-directory with the following content:
.. |toggleStart| raw:: html
<details>
<summary><a> the title of the collapse-block </a></summary>
.. |toggleEnd| raw:: html
</details>
<br/>
add the following line at the beginning of every file you want to use add collapsible blocks
..include:: substitutions.rst
now, to make a part of the code collapsible simply use:
|toggleStart|
the text you want to collapse
..code-block:: python
x=1
|toggleEnd|
Another option is the dropdown directive in the sphinx-design extension. From the docs:
Install sphinx-design
pip install sphinx-design
Add the extension to conf.py in the extensions list
extensions = ["sphinx_design"]
Use the dropdown directive in your rst file:
.. dropdown::
Dropdown content
I am editing a .html.erb file with HTML(rails) selected at the bottom. When I type if I get:
< ?php if (condition): ? >
< ?php endif ? >
Any ideas?
Cheers
Don't fully understand but when I type:
if and hit TAB, I get PHP instead:
<?php if (condition): ?>
<?php endif ?>
You could create your own ERB snippet for example on IF, TAB:
<% if ${1:value?} %>
${2}
<% end %>
Suggestion: Open your Bundle Editor and delete the PHP bundle in you don't need it. This way, I won't interfere with your ERB templates again.
You probably have an incorrect manual binding for .erb files. To see what manual bindings you have run
defaults read com.macromates.textmate OakLanguageFileBindings
If you want to get rid of all your manual bindings, quit TextMate and run
defaults delete com.macromates.textmate OakLanguageFileBindings
More info here http://blog.macromates.com/2007/file-type-detection-rspec-rails/