Comments (15)
+1 for Zen Coding, but it would be better to implement newer syntax: https://github.com/pepelsbey/zen-coding-snippets β see CSS.txt and HTML.txt for the snippets and http://zen-coding.ru/textarea/ for the JS demo.
from dabblet.
from dabblet.
I might, if lots of people request it. So if it's something you want to see, please post here and say so.
Although I'd prefer to code some sort of generic system to allow people to use whatever such script they want.
from dabblet.
+1 for Zen Coding, it's one of the best ways to write HTML quickly. Having it there by default would be great, 'cause it's almost become an industry standard: it's already included by default in Sublime Text 2, Espresso, and many others.
from dabblet.
+1, must have feature.
from dabblet.
from dabblet.
Pretty please!
from dabblet.
Can anyone answer the following questions, as I don't personally use zen coding and I can't figure it out from the docs?
- Is it only for HTML generation? So it only has to be integrated in the HTML tab, right?
- Does it have a function to tell if some typed code uses Zen Coding or not?
- Is there any online demo? I can't figure out how that textarea demo on the website works at all. I type in it, nothing happens.
from dabblet.
β ZC generates both CSS and HTML, based on snippets, see CSS.txt and HTML.txt
tr + Tab
should give you
-webkit-transition:$1;
-moz-transition:$1;
-ms-transition:$1;
-o-transition:$1;
transition:$1;
β I'm not sure, it's better to ask https://github.com/sergeche
β Go to textarea type html:5
and press Tab
from dabblet.
- There're some CSS snippets: http://code.google.com/p/zen-coding/wiki/ZenCSSPropertiesEn β they are static, so in feature there would be something to replace them. But for start even this would be enough for CSS.
- On such questions you can ask @sergeche or zen_coding at twitter. From what I know it must be not so hard to add zen-coding to contenteditable: there is a plug-in for codemirror.
- Just press
tab
after abbreviation here or there :) It's not something that write code automatically, you must call it manually bytab
, so it won't cause any issues to anyone who don't use zen-coding, since it needs some code in abbreviation and if there are only whitespaces, then it would just use default behavior oftab
.
from dabblet.
Oh that's very good, I guess I can include it by default then, as long as it's loaded asynchronously and doesn't block initial load. I'd only need to customize pre.onkeydown to avoid inserting a tab character on these cases.
I wonder if the guys at Zen Coding want to help with the integration.
Edit: On second thinking, this is probably a large download, so it should be loaded conditionally. So I'd better add a setting about it.
from dabblet.
@LeaVerou, I can answer your questions and provide any help on ZC implementation. All you need is to implement Zen Editor interface in order to let ZC core know how to talk with back-end editor: https://github.com/sergeche/zen-coding/wiki/plugin-howto
- ZC is actually an advanced snippets system, used to generate structured data. Itβs primary used for XHTML generation, but can be adapted to any other structured data. Basically, it parses CSS-like abbreviation into a tree and then produces output based on filters.
- Most ZC actions returns
true
orfalse
depending on if action was performed successfully. So, after you implement editor interface, you can callzen_coding.runAction('expand_abbreviation', editor, syntaxMode)
and it will returntrue
if abbreviation was expanded successfully,false
otherwise. You can also callzen_coding.runAction('expand_abbreviation_with_tab', editor, syntaxMode)
, which will try to expand abbreviation and put 'tab' if it fails. Actions are defined in https://github.com/sergeche/zen-coding/blob/master/javascript/zen_actions.js#L1009
from dabblet.
I just checked out the implementation for codemirror and it looks kinda huge ( https://github.com/sergeche/zen-coding/blob/master/plugins/codemirror/zen_editor.js )
I most certainly can't devote that much time to this, especially now with 20+ other open issues to take care of. If anybody wants to do it, I can help. It has to be easier, as in dabblet:
- old browsers don't matter
- I've implemented read-only
element.selectionStart
/element.selectionEnd
andelement.setSelectionRange()
for setting the selection, so it should work similarly to a textarea, withtextContent
instead ofvalue
(but I can set an accessor onvalue
so it would work identically)
Also, it seems Zen Coding implements some things already in dabblet (increment/decrement) which would need to be removed from the bundled version.
from dabblet.
+1 for Zen Coding
from dabblet.
+1 Emmet rocks!
from dabblet.
Related Issues (20)
- Better javascript
- Minor JS issue for IE9 HOT 2
- Inline CSS previewers don't handle HTML entities/escapes in style attributes HOT 1
- Line break lost after paste HOT 2
- Enabling the <script> tags. HOT 5
- JavaScript Syntax Error (Does not show location)
- Why not integrate Codemirror or Ace? HOT 1
- Tab-switching shortcuts stop working after switching to Results tab
- Typo in CSS of 'Circular Text' HOT 1
- Import snipet into Silex with an API HOT 2
- adding images from local memory HOT 2
- line error in editor HOT 3
- This request has been blocked; HOT 1
- Validator returns 415 eror
- Can No Longer Save Gists/Dabblets Anonymously HOT 1
- my menu does not work HOT 1
- Nothing serious, description is removed.
- Log in issue HOT 13
- 404 Error - Link to: View Full Page Result HOT 2
- Why dabblet still not save codes and not login with GitHub HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from dabblet.