Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
  • 5 commits
  • 6 files changed
  • 0 comments
  • 1 contributor
3  .gitmodules
... ... @@ -1,3 +1,6 @@
1 1 [submodule "js/vendor/btapp"]
2 2 path = js/vendor/btapp
3 3 url = git://github.com/bittorrenttorque/btapp.git
  4 +[submodule "js/vendor/backbrace"]
  5 + path = js/vendor/backbrace
  6 + url = git@github.com:bittorrenttorque/backbrace.git
62 css/app.css
@@ -532,19 +532,6 @@ a {
532 532 z-index: 1;
533 533 color: #000;
534 534 overflow: hidden;
535   - background-image: -webkit-linear-gradient(-45deg, rgba(255,255,255,0.075) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.075) 50%, rgba(255,255,255,0.075) 75%, transparent 75%, transparent);
536   - background-image: -ms-linear-gradient(-45deg, rgba(255,255,255,0.075) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.075) 50%, rgba(255,255,255,0.075) 75%, transparent 75%, transparent);
537   - background-image: linear-gradient(-45deg, rgba(255,255,255,0.075) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.075) 50%, rgba(255,255,255,0.075) 75%, transparent 75%, transparent);
538   - -webkit-background-size: 40px 40px;
539   - -moz-background-size: 40px 40px;
540   - -ms-background-size: 40px 40px;
541   - -o-background-size: 40px 40px;
542   - background-size: 40px 40px;
543   - -webkit-animation: progress-bg-in 1.5s linear infinite;
544   - -moz-animation: progress-bg-in 1.5s linear infinite;
545   - -ms-animation: progress-bg-in 1.5s linear infinite;
546   - -o-animation: progress-bg-in 1.5s linear infinite;
547   - animation: progress-bg-in 1.5s linear infinite;
548 535 -webkit-transition: width 0.05 linear;
549 536 -moz-transition: width 0.05 linear;
550 537 -ms-transition: width 0.05 linear;
@@ -559,6 +546,44 @@ a {
559 546 #torrents .torrent .progress .icon::after {
560 547 color: #000 !important;
561 548 }
  549 +#torrents .torrent.downloading .progress {
  550 + background-image: -webkit-linear-gradient(45deg, rgba(255,255,255,0.075) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.075) 50%, rgba(255,255,255,0.075) 75%, transparent 75%, transparent);
  551 + background-image: -moz-linear-gradient(45deg, rgba(255,255,255,0.075) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.075) 50%, rgba(255,255,255,0.075) 75%, transparent 75%, transparent);
  552 + background-image: -ms-linear-gradient(225deg, rgba(255,255,255,0.075) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.075) 50%, rgba(255,255,255,0.075) 75%, transparent 75%, transparent);
  553 + background-image: -o-linear-gradient(45deg, rgba(255,255,255,0.075) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.075) 50%, rgba(255,255,255,0.075) 75%, transparent 75%, transparent);
  554 + background-image: linear-gradient(225deg, rgba(255,255,255,0.075) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.075) 50%, rgba(255,255,255,0.075) 75%, transparent 75%, transparent);
  555 + -webkit-animation: progress-bg-in 1.5s linear infinite;
  556 + -moz-animation: progress-bg-in 1.5s linear infinite;
  557 + -ms-animation: progress-bg-in 1.5s linear infinite;
  558 + -o-animation: progress-bg-in 1.5s linear infinite;
  559 + animation: progress-bg-in 1.5s linear infinite;
  560 + -webkit-background-size: 40px 40px;
  561 + -moz-background-size: 40px 40px;
  562 + -ms-background-size: 40px 40px;
  563 + -o-background-size: 40px 40px;
  564 + background-size: 40px 40px;
  565 +}
  566 +#torrents .torrent.seeding {
  567 + border-color: #86c440;
  568 +}
  569 +#torrents .torrent.seeding .progress {
  570 + background-color: #86c440;
  571 + background-image: -webkit-linear-gradient(-45deg, rgba(255,255,255,0.075) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.075) 50%, rgba(255,255,255,0.075) 75%, transparent 75%, transparent);
  572 + background-image: -moz-linear-gradient(-45deg, rgba(255,255,255,0.075) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.075) 50%, rgba(255,255,255,0.075) 75%, transparent 75%, transparent);
  573 + background-image: -ms-linear-gradient(135deg, rgba(255,255,255,0.075) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.075) 50%, rgba(255,255,255,0.075) 75%, transparent 75%, transparent);
  574 + background-image: -o-linear-gradient(-45deg, rgba(255,255,255,0.075) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.075) 50%, rgba(255,255,255,0.075) 75%, transparent 75%, transparent);
  575 + background-image: linear-gradient(135deg, rgba(255,255,255,0.075) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.075) 50%, rgba(255,255,255,0.075) 75%, transparent 75%, transparent);
  576 + -webkit-animation: progress-bg-out 1.5s linear infinite;
  577 + -moz-animation: progress-bg-out 1.5s linear infinite;
  578 + -ms-animation: progress-bg-out 1.5s linear infinite;
  579 + -o-animation: progress-bg-out 1.5s linear infinite;
  580 + animation: progress-bg-out 1.5s linear infinite;
  581 + -webkit-background-size: 40px 40px;
  582 + -moz-background-size: 40px 40px;
  583 + -ms-background-size: 40px 40px;
  584 + -o-background-size: 40px 40px;
  585 + background-size: 40px 40px;
  586 +}
562 587 #torrents .torrent.done {
563 588 border-color: #86c440;
564 589 }
@@ -591,17 +616,6 @@ a {
591 616 #torrents .torrent.waiting .progress {
592 617 background: #ccc;
593 618 }
594   -#torrents .torrent.seeding {
595   - border-color: #86c440;
596   -}
597   -#torrents .torrent.seeding .progress {
598   - background-color: #86c440;
599   - -webkit-animation: progress-bg-out 1.5s linear infinite;
600   - -moz-animation: progress-bg-out 1.5s linear infinite;
601   - -ms-animation: progress-bg-out 1.5s linear infinite;
602   - -o-animation: progress-bg-out 1.5s linear infinite;
603   - animation: progress-bg-out 1.5s linear infinite;
604   -}
605 619 #torrents .torrent.selected::before {
606 620 border: 2px solid #fff;
607 621 }
41 css/app.styl
@@ -50,7 +50,7 @@ linear_gradient(start, stop)
50 50 background-image -webkit-gradient(linear, left top, left bottom, from(start), to(stop))
51 51 background-image -webkit-linear-gradient(top, start, stop)
52 52 background-image -moz-linear-gradient(top, start, stop)
53   - background-image -ms-linear-gradient(top, start, stop)
  53 + background-image -ms-linear-gradient(to bottom, start, stop)
54 54 background-image -o-linear-gradient(top, start, stop)
55 55 background-image linear-gradient(to bottom, start, stop)
56 56
@@ -61,6 +61,14 @@ angled_gradient(angle, start, stop)
61 61 background-image -o-linear-gradient(angle, start, stop)
62 62 background-image linear-gradient(180 + angle, start, stop)
63 63
  64 +full_angled_gradient(angle, args...)
  65 + new_args = unquote(join(', ', args))
  66 + background-image -webkit-linear-gradient(angle, new_args)
  67 + background-image -moz-linear-gradient(angle, new_args)
  68 + background-image -ms-linear-gradient(180 + angle, new_args)
  69 + background-image -o-linear-gradient(angle, new_args)
  70 + background-image linear-gradient(180 + angle, new_args)
  71 +
64 72 trans()
65 73 -webkit-transition: arguments
66 74 -moz-transition: arguments
@@ -69,8 +77,8 @@ trans()
69 77 transition: arguments
70 78
71 79 vendor_transition(property, args...)
72   - -webkit-transition: s('-webkit-%s', property)args
73   - -moz-transition: s('-moz-%s', property)args
  80 + -webkit-transition: s('-webkit-%s', property) args
  81 + -moz-transition: s('-moz-%s', property) args
74 82 -ms-transition: s('-ms-%s', property) args
75 83 -o-transition: s('-o-%s', property)args
76 84 transition: s('%s', property) args
@@ -524,11 +532,6 @@ $bottom_height = 30px
524 532 z-index 1
525 533 color #000
526 534 overflow hidden
527   - background-image -webkit-linear-gradient(-45deg, rgba(255, 255, 255, .075) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .075) 50%, rgba(255, 255, 255, .075) 75%, transparent 75%, transparent)
528   - background-image -ms-linear-gradient(-45deg, rgba(255, 255, 255, .075) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .075) 50%, rgba(255, 255, 255, .075) 75%, transparent 75%, transparent)
529   - background-image linear-gradient(-45deg, rgba(255, 255, 255, .075) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .075) 50%, rgba(255, 255, 255, .075) 75%, transparent 75%, transparent)
530   - bg_size(40px 40px)
531   - anim(progress-bg-in 1.5s linear infinite)
532 535 trans(width 0.05 linear)
533 536
534 537 .spacer
@@ -540,6 +543,21 @@ $bottom_height = 30px
540 543 &::after
541 544 color #000 !important
542 545
  546 + &.downloading
  547 + .progress
  548 + full_angled_gradient(45deg, rgba(255, 255, 255, .075) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .075) 50%, rgba(255, 255, 255, .075) 75%, transparent 75%, transparent)
  549 + anim(progress-bg-in 1.5s linear infinite)
  550 + bg_size(40px 40px)
  551 +
  552 + &.seeding
  553 + border-color $color_lime
  554 +
  555 + .progress
  556 + background-color $color_lime
  557 + full_angled_gradient(-45deg, rgba(255, 255, 255, .075) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .075) 50%, rgba(255, 255, 255, .075) 75%, transparent 75%, transparent)
  558 + anim(progress-bg-out 1.5s linear infinite)
  559 + bg_size(40px 40px)
  560 +
543 561 &.done
544 562 border-color $color_lime
545 563
@@ -567,13 +585,6 @@ $bottom_height = 30px
567 585 .progress
568 586 background #ccc
569 587
570   - &.seeding
571   - border-color $color_lime
572   -
573   - .progress
574   - background-color $color_lime
575   - anim(progress-bg-out 1.5s linear infinite)
576   -
577 588 &.selected
578 589 &::before
579 590 border 2px solid #fff
16 index.html
@@ -34,9 +34,14 @@
34 34 </script>
35 35
36 36 <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
37   - <script src="http://cdnjs.cloudflare.com/ajax/libs/json2/20110223/json2.js"></script>
38   - <script src="http://underscorejs.org/underscore-min.js"></script>
39   - <script src="http://backbonejs.org/backbone-min.js"></script>
  37 + <script src="http://cdnjs.cloudflare.com/ajax/libs/json2/20110223/json2.js"></script>
  38 +
  39 + <!-- <script src="http://underscorejs.org/underscore-min.js"></script> -->
  40 + <script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js"></script>
  41 +
  42 + <!-- <script src="http://backbonejs.org/backbone-min.js"></script> -->
  43 + <script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.2/backbone-min.js"></script>
  44 +
40 45 <script src="https://raw.github.com/andris9/jStorage/master/jstorage.js"></script>
41 46
42 47 <script src="http://torque.bittorrent.com/btapp/btapp.js"></script>
@@ -44,8 +49,7 @@
44 49 <script src="http://torque.bittorrent.com/btapp/plugin.btapp.js"></script>
45 50 <script src="http://torque.bittorrent.com/btapp/pairing.btapp.js"></script>
46 51
47   - <!-- Backbrace was developed specifically to help with Backbone structures arranged like ours -->
48   - <script src="https://raw.github.com/bittorrenttorque/backbrace/master/backbrace.js"></script>
  52 + <script src="js/vendor/backbrace/backbrace.js"></script>
49 53
50 54 <script src="js/vendor/transformjs.js"></script>
51 55 <script src="js/vendor/handlebars.js"></script>
@@ -213,7 +217,7 @@ <h1 class="name">All Torrents</h1>
213 217 </ul>
214 218 <ul class="end">
215 219 <li><a href="#" data-action="label" data-multiple="false" class="label"><span class="icon"></span><br />Label</a></li>
216   - <li><a href="#" data-action="share" data-multiple=" false" class="share"><span class="icon"></span><br />Share</a></li>
  220 + <li><a href="#" data-action="share" data-multiple="false" class="share"><span class="icon"></span><br />Share</a></li>
217 221 <li><a href="#" data-action="info" data-multiple="false" class="info"><span class="icon"></span><br />Info</a></li>
218 222 </ul>
219 223 </section>
22 js/metro.js
@@ -254,10 +254,12 @@ var AppView = Backbone.View.extend({
254 254 $(this).addClass('hidden')
255 255 })
256 256
257   - elems.css('height', 75).removeClass('hidden').animate({
258   - opacity: 1,
259   - scale: 1
260   - }, 150)
  257 + elems.css('height', 75)
  258 + .removeClass('hidden')
  259 + .animate({
  260 + opacity: 1,
  261 + scale: 1
  262 + }, 150)
261 263
262 264 this.torrents_contents.setName(el.data('title'))
263 265 }
@@ -282,13 +284,9 @@ var TorrentRow = Backbone.View.extend({
282 284
283 285 this.model.on('destroy', this.remove, this)
284 286
285   - this.model.live('properties', _.bind(function(properties) {
  287 + this.model.live('properties', _.bind(function(properties)
  288 + {
286 289 properties.on('change', this.render, this)
287   -
288   - // properties.each(function()
289   - // {
290   -
291   - // })
292 290 }, this))
293 291
294 292 this.bits = ['started', 'checking', 'start after check', 'checked', 'error', 'paused', 'queued', 'loaded']
@@ -553,7 +551,7 @@ var TopControls = Backbone.View.extend({
553 551 .animate({
554 552 opacity: 0,
555 553 rotateZ: -0.75,
556   - translateY: '+=300'
  554 + translateY: '+=200'
557 555 }, 250, function()
558 556 {
559 557 $(this).addClass('hidden')
@@ -569,6 +567,8 @@ var TopControls = Backbone.View.extend({
569 567 {
570 568 e.preventDefault()
571 569
  570 + this.$el.find('.sub-panel').addClass('hidden')
  571 +
572 572 var me = $(e.currentTarget)
573 573
574 574 me.parent().toggleClass('open')
1  js/vendor/backbrace
... ... @@ -0,0 +1 @@
  1 +Subproject commit 662cbe4326e68a4d7ef88422f89c822bbace44c0

No commit comments for this range

Something went wrong with that request. Please try again.