For the following code:

        <rx-form-option-table
            data="instance.dbList"
            columns="instance.columnList"
            type="checkbox"
            model="fields.user.dblist"
            field-id="createUserDBList">

With the following hard-coded values:

$scope.instance.columnList = [{ 'label': 'Database', 'key': 'name'}];
$scope.instance.dbList = [{"name":"so_data", "id": "so_data"},{"name":"such_storage", "id": "such_storage"}];

Clicking on a checkbox actually clicks on both of the checkboxes.

If all the files in the CDN are inadvertently removed, there isn't a simple way to re-instate them. We need either a backup system or a quick build system to rebuild all the various versions of encore-ui.

A common search input style will be used for any navigation item that needs an account/user search (e.g. Cloud Atlas, Billing UI):

We should provide a common directive to allow easy implementation of this.

Things to be documented:

• updating routes from an app
• accessing $root for menu items
• accessing $route for menu items
• rationale for including menu data in encore-ui (and future plans)

TODO:

• add style and 'example' text around live example region
• convert HTML/JS/CSS/Example to a tabset

The current layout for EncoreUI's components will not scale of the long run.

Per Eric, the design should stylistically match:

However the component page's layout should match the winjs's site:

For rxForm.js, the documentation for rxFormOptionTable says the following:

data - Array of objects used to populate table. Should have properties that match columns key.
columns - Array of objects with label/key values.

I would emphasize that column json data is required, and replace the "should" in data with "need to" - I just spent longer time than usual trying to get a serious of radio buttons working with chunky_bacon.

Noticed in the rxEnvironment code that the tld is being used in the domain name (as it should by definition)

However, the latest discussions regarding the environment URL's resulted in the URL being (For Example in staging): staging.en.core.rackspace.com and the apps will live

staging.en.core.rackspace.com/billing
staging.en.core.rackspace.com/cloudatlas
etc.

Maybe we change tld to appName? and apply it to the end of the environment URL?

Not sure what the best solution would be here

Encore-UI has reached a point where some performance testing of the JS could be added to find potential bottlenecks. It would be nice to add monitoring to these performance tests, so we can track performance over time.

Some components have existed long enough for their stability index to be increased. This issue should entail reviewing all the components currently available and adjusting their index according to their latest stability.

It'd be useful if we could fire off functions within the Ctrl when the model within these forms are modified.

Normally when developing a component, the time between a file save and the build completing ranges between 10-15 seconds. To reduce this time, these tasks shouldn't be run in the 'watch' statement:

• rxPageObjects
• complexity
• jscs (This check is done on commit)
• jshint (This check is done on commit)
• bower
• clean
• cssmin
• ngmin & uglify

Per the design, the username of the person logged in to encore should be available in the top left corner:

/cc @hussamd

With the addition of creating the opts hash for over-riding default parameters in rxPaginate, there are now more edge cases that need to be tested for in the midway tests.

I'm not sure how we should go about adding additional examples. Perhaps we can link to different pages with more examples somewhere in the app, so that the main page can stay the way it is?

Then we can pick and choose separate directives and overwrite any LESS variables for any hacks needed until encore-ui is fully stable. Which will be a huge help for those of us doing integration at this point in time.

Once encore ui is more stable this can go away.

When the bower component is created, a reference to the tpl.min.map file is incorrect (is still has the version number in it). A grunt 'replace' task needs to be written to remove the version number from the file reference.

Because of issues with apps including normalize.css after encore-ui.css, the two should be bundled together in the concat'd encore-ui.css file.

Encore-UI needs to be able to detect what environment it is in (or told via the app) so that things like app links can be appropriately determined.

For example, if I'm in cloud atlas on staging and try going to billing-ui, it should take me to the billing-ui environment.

Also, some functionality we only want in staging (e.g. if a product is in development, it should only be available via staging/dev). We should be able to hide/show navigation based on that.

See conversation here:
https://rackspace.hipchat.com/history/room/459546/2014/04/17?q=about+the+table+filtering+directive&t=rid-459546#13:52:41

Fixing a couple of 404 links:

• Encore UI Developer Setup
• CSS Style Guide
• JavaScript Style Guide

Should allow you to pass in options in 'ng-options' form. See: https://github.com/rackerlabs/chunky_bacon/pull/6#discussion_r9118498

In order to prevent JS errors from appearing on the demo app, the build script should get for errors on the demo page. To do this, a PhantomJS instance should be spun up, the demo page loaded, then it checks for any errors thrown (using window.onerror). If nothing is thrown, then the check will pass.

To make it easier for devs to see the src code for any specific component, a link to the src should be provided in the demo app.

Use LESS and cssmin tasks to add sourcemaps to the CSS files for easier development.

We are currently using within chunky_bacon, maybe we should add this common element to the encore-ui style set.

A lot of the error messages for Encore-UI components are vague and don't provide much help. Work should be done to add validation to public functions so that if the proper details aren't found, a proper error message is given.

Allow controllers/apps to dynamically update the navigation through utility functions in rxAppRoutes. These updates will be based on a 'key' defined in the route object.

Here is a brief outline of what it might look like.

{
    linkText: 'Ticket Queues',
    key: 'ticketqueues'
    href: { tld: 'cloudatlas', path: 'ticketqueues' }
}

var tqRoutes = rxApp.appRoutes.get('ticketqueues'); 
tqRoutes.setChildren([
    {
        href: 'ticketqueues/list',
        linkText: 'My Selected Queues'
    },
    {
        href: 'ticketqueues/my',
        linkText: 'My Tickets'
    }, {
        href: 'ticketqueues/queues',
        linkText: 'Queue Admin'
    }
]);

Pulling from these discussions with @chriscantu :
#132 (comment)
https://rackspace.hipchat.com/history/room/459546#13:29:02

We need to document dependency injection vs. mocking in the testing readme. Goals being:
Understand pros/cons of each
Have reference for future discussion/feedback
Have a starting point for unit test improvements in the future.

According to DavidDM our dependencies are a bit out of date. The package.json file needs to be updated to use that latest dependency versions:
https://david-dm.org/rackerlabs/encore-ui#info=devDependencies

Pressing backspace in modal goes back one page but doesn't close modal

The rxLogout directive depends on the Auth service, which isn't available in Encore-ui. We'll need to revisit this when we start to depend on this repo more.

Do you want to go with the Google Style Guide and have it look like this:

var privateVar_ = somePrivateFunction_(input);

Or go with the Python Style Guide, and do it like this:

var _privateVar = _somePrivateFunction(input);

I overwhelmingly prefer the second one. But I can do either.

Applications should be able to easily access/use the common variables (e.g. colors) defined in the vars.less file.

Currently there is a hardcoded '#' in the path URIs, ie. http://rackerlabs.github.io/#/servers/ from:

function rxBreadcrumbsCtrl ($scope, rxBreadcrumbsSvc) {
    rxBreadcrumbsSvc.set([{
        path: '/servers/',
        name: 'Servers'
    }, {
        name: 'Create New Server'
    }]);
}

. This can't be changed via the injected array / object.

To help prevent bugs/regressions with component styles, a CSS regression test suite should be set up.

Tools to consider:
hardy.io
dpxdt
wraith
siteeffect.io

Hi, I was looking at encore and just wondering what it is?

The link to the contributing doc results in a 404 page.

Per the design:

rxAppNavItem should include the ability to have a 'header' area for content to go above child navigation items.

DCX Applications needs to be able to modify the links, logo and whether to display the login link. Also exposing $scope to allow extending of directive.

Create a new attribute directive that allows toggling of a property on click. For example"

<button rx-toggle="myProp">Toggle myProp Value</button>

And on click, myProp would toggle between true and false.

Add rxFeedback directive and include it in rxApp

https://github.com/rackerlabs/chunky_bacon/blob/master/frontend/app/scripts/directives/rx-feedback.js

I run into this error:

Error: [$compile:multidir] Multiple directives [pager, rxDataTableItemsPerPage] asking for template on: <ul class="pager" pager="pager" label="{{ itemName &amp;&amp; itemName || 'Items'}} Per Page">

plunkr

Logged in the rxDataTable issues as well.

GET /css/images/encore-rocket-16x16.png 404 with bower module

When an href contains an expression with a reference to a route param:
href: '/{{user}}/cbs/snapshots'
That param isn't being updated in the link after it's changed (e.g. route change)

The $('.collapsible-toggle') selector should hide the entire rxApp, it doesn't appear to be working in the latest demo build on http://rackerlabs.github.io/encore-ui/.

As a support racker who uses multiple screens, I want to be able to expand the rxApp widget without clicking a tiny box in the corner of one of my monitors.

It would be nice if I could throw my mouse to the far left monitor, and know that clicking anywhere in that vicinity will expand my rxApp widget.

When implementing the payment options I had to list out two tables and implement sorting with it. Due to the default behavior of rxSortUtil.sortCol I was unable to do this (one table essentially would sort the other).

My solution was to create my own sortCol function where I would pass some sort ID that would be specific to that table, and from it generate the sortCol function to be used for that table.

function (sort) {
    return function (predicate) {
        var reverse = ($scope[sort].predicate === predicate) ? !$scope[sort].reverse : false;
        $scope[sort] = { reverse: reverse, predicate: predicate };
    };
}

May not be the best solution, or the right one, but just wanted to point this out

UI-Router is a major enhancement over the default Angular router. Implement use of it with rxAppNav and rxBreadcrumbs and require it for all Encore apps.