Skip to content

Instantly share code, notes, and snippets.

@rlivsey
Created April 26, 2017 13:33
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save rlivsey/dc4fd24d883373feb1ef660f44b7a92d to your computer and use it in GitHub Desktop.
Save rlivsey/dc4fd24d883373feb1ef660f44b7a92d to your computer and use it in GitHub Desktop.
New Twiddle
import Component from 'ember-component';
import jQuery from 'jquery';
import { getParent } from '../utils/dom';
import { next } from 'ember-runloop';
export default Component.extend({
tagName: '',
didInsertElement() {
this._super(...arguments);
next(() => {
jQuery(getParent(this)).find('[contenteditable=true],:input').first().focus();
});
}
});
import Ember from 'ember';
export default Ember.Controller.extend({
focus: "one",
actions: {
focusRandom() {
var items = ["one", "two", "three", "four"];
var item = items[Math.floor(Math.random()*items.length)];
this.set("focus", item);
}
}
});
<div>
<input value="one">
{{#if (eq focus "one")}}
{{auto-focus}}
{{/if}}
</div>
<div>
<input value="two">
{{#if (eq focus "two")}}
{{auto-focus}}
{{/if}}
</div>
<div>
<input value="three">
{{#if (eq focus "three")}}
{{auto-focus}}
{{/if}}
</div>
<div>
<input value="four">
{{#if (eq focus "four")}}
{{auto-focus}}
{{/if}}
</div>
<div>
Focused {{focus}}
<button onclick={{action "focusRandom"}}>Random</button>
</div>
{
"version": "0.12.1",
"EmberENV": {
"FEATURES": {}
},
"options": {
"use_pods": false,
"enable-testing": false
},
"dependencies": {
"jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
"ember": "2.12.0",
"ember-template-compiler": "2.12.0",
"ember-testing": "2.12.0"
},
"addons": {
"ember-data": "2.12.1",
"ember-truth-helpers": "1.3.0"
}
}
import Ember from 'ember';
export function getParent(view) {
if (view.get('tagName') === '') {
// Beware: use of private API! :(
if (Ember.ViewUtils && Ember.ViewUtils.getViewBounds) {
return Ember.ViewUtils.getViewBounds(view).parentElement;
} else {
return view._renderNode.contextualElement;
}
} else {
return view.get('element').parentNode;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment