Skip to content

Remove usage of list-view so we can upgrade Ember. #543

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
teddyzeenny merged 1 commit into from
Apr 29, 2016
Merged

Remove usage of list-view so we can upgrade Ember. #543

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion app/controllers/container-type.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ export default ArrayController.extend({

search: null,

arrangedContent: filter('model', function(item) {
filtered: filter('model', function(item) {
return searchMatch(get(item, 'name'), this.get('search'));
}).property('model.@each.name', 'search')
});
2 changes: 1 addition & 1 deletion app/mixins/fake-table.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ const { on } = Ember;

function accountForScrollbar() {
/*jshint validthis:true */
let outside = this.$('.list-tree').innerWidth();
let outside = this.$('.view-list').innerWidth();
let inside = this.$('.ember-list-container').innerWidth();
this.$('.spacer').width(outside - inside);
}
Expand Down
3 changes: 3 additions & 0 deletions app/styles/base.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,9 @@ code {
overflow: auto !important;
overflow-y: scroll !important;
position: relative;

-webkit-overflow-scrolling:touch;
overflow-scrolling:touch;
}
.ember-list-item-view {
position: absolute;
Expand Down
1 change: 1 addition & 0 deletions app/styles/fake_table.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -63,6 +63,7 @@
.row-wrapper {
width: 100%;
background: #f3f3f3;
height: 30px;
}

.row-wrapper:nth-of-type(2n) {
Expand Down
2 changes: 1 addition & 1 deletion app/templates/container-type.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,6 @@
</div>

<div class="list-view__list-container">
{{view "instanceList" content=this}}
{{view "instanceList" content=filtered}}
</div>
</div>
10 changes: 6 additions & 4 deletions app/templates/instance-item.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
<div class="list-tree__item row" data-label="instance-row" {{action "inspectInstance" this}}>
<div {{bind-attr class=":cell inspectable:cell_clickable"}} >
{{name}}
{{#with view.content as |content|}}
<div class="list-tree__item row" data-label="instance-row" {{action "inspectInstance" content}}>
<div class="cell {{if content.inspectable 'cell_clickable'}}">
{{content.name}}
</div>
</div>
</div>
{{/with}}
5 changes: 5 additions & 0 deletions app/templates/list.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
<div class="ember-list-container">
{{#each view.content as |item|}}
{{view view.itemViewClass content=item}}
{{/each}}
</div>
81 changes: 41 additions & 40 deletions app/templates/promise-item.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,45 +1,46 @@
<div {{bind-attr style="nodeStyle" class=":list-tree__item :row expandedClass"}} data-label="promise-item">
<div class="cell_type_main cell" {{action "toggleExpand" model}} {{bind-attr style="labelStyle"}}>
<div class="list-tree__limited list-tree__limited_helper_large">
<span {{bind-attr title="label"}} data-label="promise-label">
<span class="cell__arrow"></span>
{{label}}
</span>
{{#with view.content as |content|}}
<div style="{{content.nodeStyle}}" class="list-tree__item row {{content.expandedClass}}" data-label="promise-item">
<div class="cell_type_main cell" style="{{content.labelStyle}}" {{action "toggleExpand" content.model}}>
<div class="list-tree__limited list-tree__limited_helper_large">
<span title="{{content.label}}" data-label="promise-label">
<span class="cell__arrow"></span>
{{content.label}}
</span>
</div>
<div class="list-tree__right-helper">
{{#if content.hasStack}}
<div class="send-trace-to-console" {{action "tracePromise" content.model}} title="Trace promise in console" data-label="trace-promise-btn">
Trace
</div>
{{/if}}
</div>
</div>
<div class="list-tree__right-helper">
{{#if hasStack}}
<div class="send-trace-to-console" {{action "tracePromise" model}} title="Trace promise in console" data-label="trace-promise-btn">
Trace
</div>
{{/if}}
<div class="cell cell_size_medium">
<div class="pill pill_text_clear" style="{{content.style}}" data-label="promise-state">{{content.state}}</div>
</div>
</div>
<div class="cell cell_size_medium">
<div class="pill pill_text_clear" {{bind-attr style="style"}} data-label="promise-state">{{state}}</div>
</div>
<div class="cell cell_size_large" data-label="promise-value">
{{#if hasValue}}
<div class="list-tree__limited list-tree__limited_helper_very-large" {{bind-attr title="settledValue.inspect"}}>
{{#if isValueInspectable}}

<span class="cell_clickable" {{action "inspectObject" settledValue.objectId}} data-label="promise-object-value">{{settledValue.inspect}}</span>
{{else}}
{{settledValue.inspect}}
{{/if}}
</div>
<div class="list-tree__right-helper">
{{#if isError}}
<div class="send-trace-to-console" {{action "sendValueToConsole" model}} data-label="send-to-console-btn" title="Send stack trace to the console">
Stack trace
<div class="cell cell_size_large" data-label="promise-value">
{{#if content.hasValue}}
<div class="list-tree__limited list-tree__limited_helper_very-large" title="{{content.settledValue.inspect}}">
{{#if content.isValueInspectable}}
<span class="cell_clickable" {{action "inspectObject" content.settledValue.objectId}} data-label="promise-object-value">{{content.settledValue.inspect}}</span>
{{else}}
{{content.settledValue.inspect}}
{{/if}}
</div>
{{else}}
{{send-to-console action="sendValueToConsole" param=model}}
{{/if}}
<div class="list-tree__right-helper">
{{#if content.isError}}
<div class="send-trace-to-console" {{action "sendValueToConsole" content.model}} data-label="send-to-console-btn" title="Send stack trace to the console">
Stack trace
</div>
{{else}}
{{send-to-console action="sendValueToConsole" param=content.model}}
{{/if}}

</div>
{{else}}
--
{{/if}}
</div>
{{else}}
--
{{/if}}
</div>
<div class="cell cell_size_medium cell_value_numeric" data-label="promise-time">{{ms-to-time content.timeToSettle}}</div>
</div>
<div class="cell cell_size_medium cell_value_numeric" data-label="promise-time">{{ms-to-time timeToSettle}}</div>
</div>
{{/with}}
16 changes: 9 additions & 7 deletions app/templates/record-item.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,9 @@
{{#record-item model=this modelTypeColumns=view.columns inspect="inspectModel" as |item|}}
{{#each column in item.columns}}
<div class="cell cell_clickable" data-label="record-column" {{bind-attr style="item.style"}}>
{{column.value}}
</div>
{{/each}}
{{/record-item}}
{{#with view.content as |content|}}
{{#record-item model=content modelTypeColumns=view.columns inspect="inspectModel" as |item|}}
{{#each column in item.columns}}
<div class="cell cell_clickable" data-label="record-column" style="{{item.style}}">
{{column.value}}
</div>
{{/each}}
{{/record-item}}
{{/with}}
64 changes: 33 additions & 31 deletions app/templates/route-item.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,36 +1,38 @@
{{#route-item model=this currentRoute=view.currentRoute as |item|}}
<div class="cell_type_main cell" data-label="route-name">
<div {{bind-attr style="item.labelStyle"}}>
<span title="{{unbound value.name}}" data-label="view-name">{{value.name}}</span>
</div>
</div>
<div class="cell">
<div class="list-tree__limited cell_clickable" {{action "inspectRoute" value.routeHandler.name}} data-label="route-handler">
<span title="{{unbound value.routeHandler.className}}">{{value.routeHandler.className}}</span>
</div>
<div class="list-tree__right-helper">
{{send-to-console action="sendRouteHandlerToConsole" param=value.routeHandler.name}}
{{#with view.content as |content|}}
{{#route-item model=content currentRoute=view.currentRoute as |item|}}
<div class="cell_type_main cell" data-label="route-name">
<div style="{{item.labelStyle}}">
<span title="{{unbound content.value.name}}" data-label="view-name">{{content.value.name}}</span>
</div>
</div>
</div>
<div class="cell">
{{#if value.controller.exists}}
<div class="list-tree__limited cell_clickable" {{action "inspectController" value.controller}} data-label="route-controller">
<span title="{{unbound value.controller.className}}">{{value.controller.className}}</span>
<div class="cell">
<div class="list-tree__limited cell_clickable" {{action "inspectRoute" content.value.routeHandler.name}} data-label="route-handler">
<span title="{{unbound content.value.routeHandler.className}}">{{content.value.routeHandler.className}}</span>
</div>
<div class="list-tree__right-helper">
{{send-to-console action="sendControllerToConsole" param=value.controller.name}}
{{send-to-console action="sendRouteHandlerToConsole" param=content.value.routeHandler.name}}
</div>
</div>
<div class="cell">
{{#if content.value.controller.exists}}
<div class="list-tree__limited cell_clickable" {{action "inspectController" content.value.controller}} data-label="route-controller">
<span title="{{unbound content.value.controller.className}}">{{content.value.controller.className}}</span>
</div>
<div class="list-tree__right-helper">
{{send-to-console action="sendControllerToConsole" param=content.value.controller.name}}
</div>

{{else}}
<div data-label="route-controller">
<span title="{{unbound value.controller.className}}">{{value.controller.className}}</span>
</div>
{{/if}}
</div>
<div class="cell" data-label="route-template">
<span title="{{unbound value.template.name}}">{{value.template.name}}</span>
</div>
<div class="cell cell_size_large" data-label="route-url">
<span title="{{unbound value.url}}">{{value.url}}</span>
</div>
{{/route-item}}
{{else}}
<div data-label="route-controller">
<span title="{{unbound content.value.controller.className}}">{{content.value.controller.className}}</span>
</div>
{{/if}}
</div>
<div class="cell" data-label="route-template">
<span title="{{unbound content.value.template.name}}">{{content.value.template.name}}</span>
</div>
<div class="cell cell_size_large" data-label="route-url">
<span title="{{unbound content.value.url}}">{{content.value.url}}</span>
</div>
{{/route-item}}
{{/with}}
Empty file added app/templates/route-list.hbs
View file
Open in desktop
Empty file.
94 changes: 48 additions & 46 deletions app/templates/view-item.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,49 +1,51 @@
{{#view-item model=this inspect="inspect" pinnedObjectId=view.pinnedObjectId inspectElement="inspectElement" as |item|}}
<div class="cell_type_main cell" >
<div {{bind-attr style="item.labelStyle"}}>
<span {{bind-attr title="value.name"}} data-label="view-name">{{unbound value.name}}</span>
{{#with view.content as |content|}}
{{#view-item model=content inspect="inspect" pinnedObjectId=view.pinnedObjectId inspectElement="inspectElement" as |item|}}
<div class="cell_type_main cell" >
<div style="{{item.labelStyle}}">
<span title="{{content.value.name}}" data-label="view-name">{{unbound content.value.name}}</span>
</div>
</div>
</div>

<div {{bind-attr class=":cell item.hasElement:cell_clickable"}} {{action "inspectElement" target=item}} data-label="view-template">
<span title="{{unbound value.template}}">{{unbound value.template}}</span>
</div>
<div class="cell" data-label="view-model">
{{#if item.hasModel}}
<div {{bind-attr class=":list-tree__limited item.modelInspectable:cell_clickable"}} {{action "inspectModel" value.model.objectId target=item}} data-label="view-model-clickable">
<span title="{{unbound value.model.completeName}}">{{unbound value.model.name}}</span>
</div>
<div class="list-tree__right-helper">
{{send-to-console action="sendModelToConsole" param=value}}
</div>
{{else}}
--
{{/if}}
</div>
<div class="cell" data-label="view-controller">
{{#if item.hasController}}
<div {{bind-attr class=":list-tree__limited item.hasController:cell_clickable"}} {{action "inspect" value.controller.objectId}} >
<span title="{{unbound value.controller.completeName}}">{{unbound value.controller.name}}</span>
</div>
<div class="list-tree__right-helper">
{{send-to-console action="sendObjectToConsole" param=value.controller.objectId}}
</div>
{{/if}}
</div>
<div class="cell" data-label="view-class">
{{#if item.hasView}}
<div {{bind-attr class=":list-tree__limited item.hasView:cell_clickable"}} {{action "inspectView" target=item}} >
<span title="{{unbound value.completeViewClass}}">{{unbound value.viewClass}}</span>
</div>
<div class="list-tree__right-helper">
{{send-to-console action="sendObjectToConsole" param=value.objectId}}
</div>
{{else}}
--
{{/if}}
</div>
<div class="cell {{if item.hasElement 'cell_clickable'}}" {{action "inspectElement" target=item}} data-label="view-template">
<span title="{{unbound content.value.template}}">{{unbound content.value.template}}</span>
</div>
<div class="cell" data-label="view-model">
{{#if item.hasModel}}
<div class="list-tree__limited {{if item.modelInspectable 'cell_clickable'}}" {{action "inspectModel" content.value.model.objectId target=item}} data-label="view-model-clickable">
<span title="{{unbound content.value.model.completeName}}">{{unbound content.value.model.name}}</span>
</div>
<div class="list-tree__right-helper">
{{send-to-console action="sendModelToConsole" param=content.value}}
</div>
{{else}}
--
{{/if}}
</div>
<div class="cell" data-label="view-controller">
{{#if item.hasController}}
<div class="list-tree__limited {{if item.hasController 'cell_clickable'}}" {{action "inspect" content.value.controller.objectId}} >
<span title="{{unbound content.value.controller.completeName}}">{{unbound content.value.controller.name}}</span>
</div>
<div class="list-tree__right-helper">
{{send-to-console action="sendObjectToConsole" param=content.value.controller.objectId}}
</div>
{{/if}}
</div>
<div class="cell" data-label="view-class">
{{#if item.hasView}}
<div class="list-tree__limited {{if item.hasView 'cell_clickable'}}" {{action "inspectView" target=item}} >
<span title="{{unbound content.value.completeViewClass}}">{{unbound content.value.viewClass}}</span>
</div>
<div class="list-tree__right-helper">
{{send-to-console action="sendObjectToConsole" param=content.value.objectId}}
</div>
{{else}}
--
{{/if}}
</div>

<div class="cell cell_size_small cell_value_numeric" >
<span class="pill pill_not-clickable pill_size_small" data-label="view-duration">{{ms-to-time value.duration}}</span>
</div>
{{/view-item}}
<div class="cell cell_size_small cell_value_numeric" >
<span class="pill pill_not-clickable pill_size_small" data-label="view-duration">{{ms-to-time content.value.duration}}</span>
</div>
{{/view-item}}
{{/with}}
4 changes: 2 additions & 2 deletions app/views/list-item.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
import ListItemView from 'ember-list-view/list-item-view';
import Ember from 'ember';

/**
* @module Views
* @extends ListItemView
* @class ListItem
* @namespace Views
*/
export default ListItemView.extend({
export default Ember.View.extend({
/**
* @property classNames
* @type {Array}
Expand Down
17 changes: 10 additions & 7 deletions app/views/list.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import Ember from 'ember';
import ListView from 'ember-list-view';
import ListItemView from 'ember-inspector/views/list-item';

const { computed, computed: { alias } } = Ember;
Expand All @@ -12,19 +11,27 @@ const { computed, computed: { alias } } = Ember;
* @class List
* @namespace Views
*/
export default ListView.extend({
export default Ember.View.extend({
templateName: "list",

/**
* @property classNames
* @type {Array}
*/
classNames: ["list-tree"],
classNames: ["list-tree", "ember-list-view"],

/**
* @property contentHeight
* @type {Integer}
*/
contentHeight: alias('controller.controllers.application.contentHeight'),

attributeBindings: ['style'],

style: computed('height', function() {
return `height:${this.get('height')}px`;
}),

/**
* @property height
* @type {Integer}
Expand All @@ -48,9 +55,5 @@ export default ListView.extend({
*/
rowHeight: 30,

/**
* @property itemViewClass
* @type {Ember.View}
*/
itemViewClass: ListItemView
});
Loading
⚡