bryanhunt/ember-split-view

EmberJS SplitView

ember-split-view's Issues

Styling should be in css where possible to allow developer to override it

Does not work without `jQuery`

Currently it doesn't work if jQuery is disabled.

It appears to use this.$() instead of this.element in a few places.

Add option to render as plain html table

For the simplest requirements - a few rows and columns only, no need for scrolling

position and size of non-empty child views

When elements are placed on top of the individual child views, the views lose both their relative positions and sizes.

Doesn't lay out correctly in container with position:absolute parent

Add unit tests

This addon is very lacking in the unit test department.

Unit tests are failing

The split-view component test fails at:

_setStyle: function() {
  var style = this.get('element').style;

this.get('element') is returning null. This comes from:

Ember.run.next(this, function() {
  this._setStyle();
});

I don't understand yet why the element is null. _setStyle() is called prior to this and the element is not null. I see the same call stacks in the dummy app, but element is never null.

Content security policy violations

The dummy app is throwing content security policy violations again.

prefer binding to style attribute over setting width/height from observers

observers are low level concepts, writing straight to the DOM at this point and time can result in many wasteful draws/writes and also make your view prone to race conditions.

• https://github.com/BryanHunt/ember-split-view/blob/master/app-addon/components/split-view.js#L90-L96
• https://github.com/BryanHunt/ember-split-view/blob/master/app-addon/components/split-child.js#L22-L32
• https://github.com/BryanHunt/ember-split-view/blob/master/app-addon/components/split-child.js#L13
• https://github.com/BryanHunt/ember-split-view/blob/master/app-addon/components/split-child.js#L22-L32

Utilizing a bindableAttribute to bind style attribute directly with the needed dimensions will result in a much better experience as it lets embers binding system and rendering system do the work only once and at a much more optimal time.

Borders do not render correctly on Chrome

When you drag the sash, the border on the left (vertical sash) or top (horizontal sash) will not render correctly. You end up with artifacts of the border that are not erased. This problem does not occur with Safari or Firefox.

Update to ember-cli 0.1.12

Nested split view doesn't handle window resize correctly

I've got this setup:

  {{#split-view isVertical=true splitPosition=initialVerticalSplit}}
    {{#split-child}}
      {{#split-view isVertical=false splitPosition=initialHorizontalSplit }}
        {{#split-child}}
          <div></div>
        {{/split-child}}
        {{split-sash}}
        {{#split-child}}
          <div></div>
        {{/split-child}}
      {{/split-view}}
    {{/split-child}}
    {{split-sash}}
    {{#split-child}}
      <div></div>
    {{/split-child}}
  {{/split-view}}

So, basically two columns, with the first having two rows. When I resize the window horizontally (or diagonally), all panes get resized correctly. However, when I resize vertically, the bottom of the top row on the left column moves too far up, becoming separated from the sash and bottom row which stay fixed to the bottom of the window.

When I then resize the window horizontally, the bottom of the top row on the left column snaps back into position at the top of the sash.

Has anyone had this issue? I tried making a JSBin but am not sure how to add ember-split-view as a component.

Ember 1.7.0-beta2 breaks ember-split-view

Tried using ember-split-view with Ember 1.7.0-beta5 last night but kept getting errors. The error was in the SplitViewChild#updateMovableSide because movableSide was null. I tracked this back to changes between beta 1 and 2.

Pre beta 2, SplitViewComponent#updateOrientation sets movableSide. After beta 2 this doesn't get called as SplitSashComponent#didInsertElement changes its parentView.sash attribute which triggers SplitView#constrainSplit. SplitView#constrainSplit subsequently changes splitPercentage which is aliased to SplitChildComponent#splitPercentage and triggers SplitViewChild#updateMovableSide without calling updateOrientation to set movableSide.

After discussion with rwjblue on IRC it seems this change in behaviour is because ember now lazily evaluates aliases.

Heres a rough trace for both versions using console.log statements.

Pre beta 2:
SplitViewComponent#didInsertElement
SplitChildComponent#didInsertElement
SplitViewComponent#addChildView
SplitSashComponent#didInsertElement
SplitViewComponent#constrainSplit
SplitSashComponent#updateWidth
SplitChildComponent#didInsertElement
SplitViewComponent#addChildView
SplitViewComponent#updateOrientation - this sets movableSide
SplitViewChild#updateMovableSide
SplitViewChild#updateMovableSide

Beta 2 and after:
SplitViewComponent#didInsertElement
SplitChildComponent#didInsertElement
SplitViewComponent#addChildView
SplitSashComponent#didInsertElement
SplitView#constrainSplit
SplitViewChild#updateMovableSide

Haven't really had chance to look at how this can be fixed yet.

Remove debug tracing once emberjs/ember.js#5515 is resolved

The lines to remove are:

• https://github.com/BryanHunt/ember-split-view/blob/master/app-addon/components/split-view.js#L96-Lundefined
• https://github.com/BryanHunt/ember-split-view/blob/master/app-addon/components/split-child.js#L58-Lundefined

Add support for EmberJS 2.0

Update the code to support EmberJS 2.0.

Appears to be broken on Ember 3.x

loader.js:247 Uncaught Error: Could not find module `ember` imported from `ember-resize/services/resize`
    at missingModule (loader.js:247)
    at findModule (loader.js:258)
    at Module.findDeps (loader.js:168)
    at findModule (loader.js:262)
    at Module.findDeps (loader.js:168)
    at findModule (loader.js:262)
    at requireModule (loader.js:24)
    at resolveInitializer (index.js:34)
    at registerInitializers (index.js:47)
    at exports.default (index.js:28)
...

Uncaught TypeError: Cannot read property 'listeners' of undefined
    at window.onerror 
...

Resizing window so that split conflicts with min-width makes sash overlap child view

Consider adopting computedStyle()

See: https://medium.com/@ivanderbyl/ember-addon-computed-style-3e80dd122be0#.bmrb36hdn

Splitter is wrongly positioned when child panes have padding or margins

Ember 0.2.3 warns about unsafe style binding

split-view height doesn't update when browser size changes

Show an ember split view
In Chrome, show the debugger window (F12)
Split view correctly shrinks to fill above the debugger window
Close the debugger
Split view does not expand to fit

Can anyone else confirm this bug?

build instructions

how do I build your nice project?

Update to latest Ember-cli to avoid old bug

I'm hitting this bug when running the demo app

ember-cli/ember-cli#2150

It's been fixed, so best to upgrade ember-cli in your demo app and in the addon

Sash not displayed with Ember 2.14.0

I've upgraded Ember in the ember-2.14 branch. The sash is not displayed between the child views. I'm guessing it is a problem with the flex layout in the dummy test app. If anyone has time to look at this, help would be appreciated.