diff --git a/app/components/no-repos.coffee b/app/components/no-repos.coffee new file mode 100644 index 00000000..92130ae7 --- /dev/null +++ b/app/components/no-repos.coffee @@ -0,0 +1,5 @@ +`import Ember from 'ember'` + +NoReposComponent = Ember.Component.extend() + +`export default NoReposComponent` diff --git a/app/components/owner-repo-tile.coffee b/app/components/owner-repo-tile.coffee index 2cad3185..1f491361 100644 --- a/app/components/owner-repo-tile.coffee +++ b/app/components/owner-repo-tile.coffee @@ -3,7 +3,7 @@ OwnerRepoTileComponent = Ember.Component.extend tagName: 'li' - classNames: ['tile', 'tile--small', 'row'] + classNames: ['owner-tile'] classNameBindings: ['repo.default_branch.last_build.state'] ownerName: (-> @@ -14,6 +14,15 @@ OwnerRepoTileComponent = Ember.Component.extend @get('repo.slug').split(/\//)[1] ).property('repo.slug') + isAnimating: (-> + state = @get('repo.default_branch.last_build.state') + animationStates = ['received', 'queued', 'started', 'booting'] + + unless animationStates.indexOf(state) == -1 + true + + ).property('repo.default_branch.last_build.state') + diff --git a/app/router.coffee b/app/router.coffee index 2e8c93c2..8808ad21 100644 --- a/app/router.coffee +++ b/app/router.coffee @@ -73,7 +73,7 @@ Router.map -> @resource 'owner', path: '/:owner', -> @route 'repositories', path: '/' - @route 'running', path: '/running' + # @route 'running', path: '/running' @route 'error404', path: '/*path' diff --git a/app/routes/owner.coffee b/app/routes/owner.coffee index dc247146..d7c6ea4f 100644 --- a/app/routes/owner.coffee +++ b/app/routes/owner.coffee @@ -9,9 +9,6 @@ Route = TravisRoute.extend deactivate: -> @controllerFor('loading').set('layoutName', null) - titleToken: (model) -> - "#{model.name}" - model: (params) -> $.get(config.apiEndpoint + "/v3/owner/#{params.owner}") diff --git a/app/styles/app.scss b/app/styles/app.scss index 193e8ddb..9ebba52f 100644 --- a/app/styles/app.scss +++ b/app/styles/app.scss @@ -14,7 +14,6 @@ @import "app/main/annotations"; @import "app/userlike"; -@import "app/main/list"; @import "app/main/log"; @import "app/misc"; @import "app/popup"; @@ -22,6 +21,8 @@ @import "app/components/sync-button"; @import "app/components/loading-indicator"; +@import "app/animation/tractor"; + @import "app/modules/section"; @import "app/modules/loader"; @import "app/modules/tiles"; diff --git a/app/styles/app/animation/tractor.sass b/app/styles/app/animation/tractor.sass new file mode 100644 index 00000000..3b072feb --- /dev/null +++ b/app/styles/app/animation/tractor.sass @@ -0,0 +1,19 @@ +.tractor + @media #{$medium-up} + width: 258px + height: 188px +.tractor-arm + @media #{$medium-up} + width: 90px + height: 71px + transform-origin: 89px 70px + animation: armMovement 1.5s 1 ease + +@keyframes armMovement + 0%, + 100% + transform: rotateZ(0) + 40% + transform: rotateZ(-20deg) + 70% + transform: rotateZ(10deg) \ No newline at end of file diff --git a/app/styles/app/layouts/owner.sass b/app/styles/app/layouts/owner.sass index afacf718..2c81884c 100644 --- a/app/styles/app/layouts/owner.sass +++ b/app/styles/app/layouts/owner.sass @@ -23,6 +23,7 @@ text-decoration: underline img border-radius: 50% + background-color: #F4F3ED .sync-button margin-top: .8rem @@ -52,60 +53,6 @@ content: "" @include fadeOut(right, -90deg, $white) - -.owner-tiles - @extend .repo-main - @include resetul - - h2 - font-size: 20px - white-space: nowrap - line-height: 2.5 - - .tile-status .icon-status - margin-top: 2.1em - width: 1.2em - height: 1.3em - - .tile-single, - .tile-double - color: $grey-medium - padding: .1em 0 - font-size: $font-size-m - .icon - margin-right: .3em - width: 1em - height: 1.1em - vertical-align: middle - &.icon-github - width: .9em - height: 1.2em - &.push - width: 1.1em - height: .6em - margin: 0 - a - color: $grey-medium - &:hover - color: $grey-medium - text-decoration: underline - - .tile-single - line-height: 3em - .tile-double - line-height: 1.5em - - .tile-main - position: relative - overflow: hidden - &:after - content: "" - @include fadeOut(right, -90deg, $cream-light, 20%) - & ~ div - @media #{$medium-up} - padding-left: 2em - border-left: 1px solid $cream-dark - .tabs--owner padding : 0 $column-gutter/2 @@ -129,3 +76,118 @@ @media #{$medium-up} height: 2.2em border-bottom: solid 2px $cream-dark + + +.owner-tiles + padding: 0 + list-style-type: none + +%one-line + font-size: 16px + font-weight: 400 + vertical-align: middle + margin: 0 + display: inline-block + * + display: inline-block + font-size: inherit + font-weight: 400 + vertical-align: middle + margin: 0 + padding: 0 + line-height: 1 + +@mixin statusColors($color, $status) + &.#{$status} + background: linear-gradient(to right, $color 0%, $color 9px, transparent 10px, transparent 100%) no-repeat; + .build a, + .repo-title a + color: $color + &:hover + border-color: $color + .build-status + color: $color + + +.owner-tile + padding: .8em 0 .8em 2em + margin-bottom: .5em + border: #F2F0F0 solid 1px + + a + text-decoration: none + &:hover + span + text-decoration: underline + .repo-title a:hover + text-decoration: underline + + .icon--job, + .icon-push, + .icon-pull_request, + .icon-calendar, + .icon-hash, + .icon-github + width: 1em + height: 1.1em + margin-right: .5em + background-repeat: no-repeat + background-size: 100% + + .icon--job + height: 1em + margin-top: .1em + .icon-push + margin-top: .6em + .build-status + text-transform: capitalize + + .repo + @extend %one-line + white-space: nowrap + width: grid-calc(9, 12) + .build + @extend %one-line + width: grid-calc(5, 12) + .branch + @extend %one-line + width: grid-calc(6, 12) + .commit + @extend %one-line + width: grid-calc(6, 12) + .duration + @extend %one-line + width: grid-calc(12, 12) + + @media #{$medium-up} + display: flex + flex-direction: row + flex-flow: space-between + align-items: baseline + height: 3.8em + padding: .8em 0 + + .build + width: grid-calc(2, 12) + .branch + width: grid-calc(2, 12) + .commit + width: grid-calc(2, 12) + .duration + width: grid-calc(4, 12) + .repo + width: grid-calc(4, 12) + margin-left: 2em + + + @include statusColors($green-dark, 'passed') + @include statusColors($red-dark, 'failed') + @include statusColors($red-dark, 'errored') + @include statusColors($grey-medium, 'canceled') + @include statusColors(#ECCE4B, 'started') + @include statusColors(#ECCE4B, 'queued') + @include statusColors(#ECCE4B, 'booting') + @include statusColors(#ECCE4B, 'received') + @include statusColors(#ECCE4B, 'created') + + diff --git a/app/styles/app/main/list.sass b/app/styles/app/main/list.sass deleted file mode 100644 index e01b9831..00000000 --- a/app/styles/app/main/list.sass +++ /dev/null @@ -1,47 +0,0 @@ - -table.list - width: 100% - margin: 25px 0 0 12px - border-spacing: 0 - - a - text-decoration: underline - - caption - margin-bottom: 8px - text-align: left - color: $color-text - font-size: $font-size-big - font-weight: bold - - td, th - text-align: left - font-size: $font-size-small - padding: 5px 20px 5px 0 - vertical-align: top - - tr - max-height: 20px - - th - font-size: 13px - color: $color-text - white-space: nowrap - border-bottom: 2px solid white - - td - white-space: nowrap - border-bottom: 2px solid white - &.message - overflow: hidden - text-overflow: ellipsis - white-space: normal - - td:first-child - border-left-radius: 4px - - td:last-child - border-right-radius: 4px - - tr.message, td.message - width: 100% diff --git a/app/styles/app/modules/icons.sass b/app/styles/app/modules/icons.sass index 6a43244a..6534f042 100644 --- a/app/styles/app/modules/icons.sass +++ b/app/styles/app/modules/icons.sass @@ -10,7 +10,8 @@ @extend %icon .icon-cal, -.icon--cal +.icon--cal, +.icon-calendar background-image: inline-image('svg/finished-icon.svg') .icon-clock, @@ -83,9 +84,11 @@ .icon.pull_request background-image: inline-image('svg/pull-request-icon.svg') -.icon--grey.push +.icon--grey.push, +.icon-push background-image: inline-image('svg/icon-request-push.svg') -.icon--grey.pull_request +.icon--grey.pull_request, +.icon-pull_request background-image: inline-image('svg/icon-request-pull.svg') .icon-api, @@ -225,6 +228,13 @@ i:nth-of-type(3) animation-delay: 0.7s +.icon-owner-receiving + @extend .icon-receiving + margin-right: 0.5em !important + i + width: 5px + height: 5px + background-color: #ECCE4B @keyframes bubbleScale 0%, 80%, 100% diff --git a/app/templates/components/no-repos.hbs b/app/templates/components/no-repos.hbs new file mode 100644 index 00000000..cbed3683 --- /dev/null +++ b/app/templates/components/no-repos.hbs @@ -0,0 +1,63 @@ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +

No active repositories could be found

+

Want to start testing your projects on Travis CI?

+ Read the Docs on Getting Started +
diff --git a/app/templates/components/owner-repo-tile.hbs b/app/templates/components/owner-repo-tile.hbs index 83719f0f..a9cb5749 100644 --- a/app/templates/components/owner-repo-tile.hbs +++ b/app/templates/components/owner-repo-tile.hbs @@ -1,38 +1,38 @@ {{#if repo.private }}
{{/if}} -
- -
-
-

{{#link-to "repo" ownerName repoName }}{{repoName}}{{/link-to}}

-
-
- {{#if repo.default_branch.last_build}} -

- {{#link-to "build" ownerName repoName repo.default_branch.last_build.id}} - {{!-- {{repo.last_build.number}} {{repo.last_build.state}} --}} - {{repo.default_branch.last_build.number}} {{repo.default_branch.last_build.state}} - {{/link-to}}

- -
-
-

- - {{repo.default_branch.name}}

-

- {{format-sha repo.default_branch.last_build.commit.sha}}

-
-
-

- - {{format-duration repo.default_branch.last_build.duration}}

-

- - {{format-time repo.default_branch.last_build.finished_at}}

-
-
+
+ {{#if isAnimating}} + {{else}} -

there is no build

+ {{/if}} +

{{#link-to "repo" ownerName repoName }}{{repoName}}{{/link-to}}

+{{#if repo.default_branch.last_build}} +
+ {{#link-to "build" ownerName repoName repo.default_branch.last_build.id}} + + {{repo.default_branch.last_build.number}} + {{/link-to}} +
+
+ +

+ {{repo.default_branch.name}} +

+
+
+ + + {{format-sha repo.default_branch.last_build.commit.sha}} + +
+
+ + {{repo.default_branch.last_build.state}} + {{format-time repo.default_branch.last_build.finished_at}} +
+{{else}} +

there is no build

+{{/if}} diff --git a/app/templates/owner.hbs b/app/templates/owner.hbs index a5cc2479..b593deb4 100644 --- a/app/templates/owner.hbs +++ b/app/templates/owner.hbs @@ -10,13 +10,13 @@
- --}}
diff --git a/app/templates/owner/repositories.hbs b/app/templates/owner/repositories.hbs index 82d8a85e..e8ecf3d2 100644 --- a/app/templates/owner/repositories.hbs +++ b/app/templates/owner/repositories.hbs @@ -2,6 +2,6 @@ {{#each repo in repos}} {{owner-repo-tile repo=repo}} {{else}} -
  • No active repos
    • + {{no-repos}} {{/each}} diff --git a/app/templates/repo.hbs b/app/templates/repo.hbs index 090a8e79..d9571f95 100644 --- a/app/templates/repo.hbs +++ b/app/templates/repo.hbs @@ -7,7 +7,7 @@ {{#if repo.isLoaded}}
    -

    {{#link-to "repo" repo}}{{repo.slug}}{{/link-to}}

    +

    {{#link-to "owner" repo.owner}}{{repo.owner}}{{/link-to}} / {{#link-to "repo" repo}}{{repo.name}}{{/link-to}}