1
0
mirror of https://github.com/Radarr/Radarr.git synced 2024-11-10 13:02:47 +01:00

all links are automatically handled through backbone router.

no more page reload.
This commit is contained in:
kay.one 2013-06-05 22:13:31 -07:00
parent 5ea794939c
commit 50918ae65f
6 changed files with 55 additions and 41 deletions

View File

@ -3,7 +3,7 @@
<h1>{{day}}</h1> <h1>{{day}}</h1>
<h4>{{month}}</h4> <h4>{{month}}</h4>
</div> </div>
<a href="series/details/{{series.titleSlug}}"> <a href="/series/details/{{series.titleSlug}}">
<h4>{{series.title}}</h4> <h4>{{series.title}}</h4>
</a> </a>
<p>{{startTime}} {{bestDateString}}<span class="pull-right">{{seasonNumber}}x{{paddedEpisodeNumber}}</span><br>{{episodeTitle}}</p> <p>{{startTime}} {{bestDateString}}<span class="pull-right">{{seasonNumber}}x{{paddedEpisodeNumber}}</span><br>{{episodeTitle}}</p>

View File

@ -24,13 +24,6 @@ define(['app'], function () {
} else { } else {
this.setActive(event.target); this.setActive(event.target);
} }
if (href && href.startsWith('http')) {
window.location.href = href;
} else {
NzbDrone.Router.navigate(href, { trigger: true });
}
}, },
setActive: function (element) { setActive: function (element) {

View File

@ -21,29 +21,6 @@ Marionette.ItemView.prototype.self$ = function (selector) {
return this.$(selector).not("[class*='iv-'] " + selector); return this.$(selector).not("[class*='iv-'] " + selector);
}; };
Marionette.ItemView.prototype._handleRelativeLink = function (event) {
console.log('clikc');
event.preventDefault();
var $target = $(event.target);
var href = event.target.getAttribute('href');
if (!href && $target.parent('a') && $target.parent('a')[0]) {
var linkElement = $target.parent('a')[0];
href = linkElement.getAttribute('href');
}
if (!href) {
throw 'couldnt find route target';
}
NzbDrone.Router.navigate(href, { trigger: true });
};
Marionette.ItemView.prototype.render = function () { Marionette.ItemView.prototype.render = function () {
var result = oldMarionetteItemViewRender.apply(this, arguments); var result = oldMarionetteItemViewRender.apply(this, arguments);
@ -64,7 +41,6 @@ Marionette.ItemView.prototype.render = function () {
this._modelBinder.bind(this.model, this.el); this._modelBinder.bind(this.model, this.el);
} }
this.$('a[href^="/"]').children().click(this._handleRelativeLink);
this.$el.addClass('iv-' + this.viewName()); this.$el.addClass('iv-' + this.viewName());
return result; return result;

44
UI/RouteBinder.js Normal file
View File

@ -0,0 +1,44 @@
"use strict";
define(['app'], function () {
//This module will automatically route all links through backbone router rather than
//causing links to reload pages.
var routeBinder = {
bind: function () {
$(document).on('click', 'a[href]', this._handleClick);
},
_handleClick: function (event) {
var $target = $(event.target);
if ($target.hasClass('no-router')) {
return;
}
console.log('click');
event.preventDefault();
var href = event.target.getAttribute('href');
if (!href && $target.parent('a') && $target.parent('a')[0]) {
var linkElement = $target.parent('a')[0];
href = linkElement.getAttribute('href');
}
if (!href) {
throw 'couldnt find route target';
}
if (!href.startsWith('http')) {
NzbDrone.Router.navigate(href, { trigger: true });
}
}
};
return routeBinder;
});

View File

@ -1,5 +1,5 @@
"use strict"; "use strict";
require(['app', 'Controller'], function (app, controller) { require(['app', 'Controller', 'RouteBinder'], function (app, controller, routeBinder) {
NzbDrone.Router = Backbone.Marionette.AppRouter.extend({ NzbDrone.Router = Backbone.Marionette.AppRouter.extend({
@ -27,6 +27,7 @@ require(['app', 'Controller'], function (app, controller) {
NzbDrone.Router = new NzbDrone.Router(); NzbDrone.Router = new NzbDrone.Router();
Backbone.history.start({ pushState: true }); Backbone.history.start({ pushState: true });
routeBinder.bind();
}); });
}); });

View File

@ -1,11 +1,11 @@
<ul class="nav nav-tabs" id="myTab"> <ul class="nav nav-tabs" id="myTab">
<li><a href="#naming" class="x-naming-tab">Naming</a></li> <li><a href="#naming" class="x-naming-tab no-router">Naming</a></li>
<li><a href="#quality" class="x-quality-tab">Quality</a></li> <li><a href="#quality" class="x-quality-tab no-router">Quality</a></li>
<li><a href="#indexers" class="x-indexers-tab">Indexers</a></li> <li><a href="#indexers" class="x-indexers-tab no-router">Indexers</a></li>
<li><a href="#download-client" class="x-download-client-tab">Download Client</a></li> <li><a href="#download-client" class="x-download-client-tab no-router">Download Client</a></li>
<li><a href="#notifications" class="x-notifications-tab">Notifications</a></li> <li><a href="#notifications" class="x-notifications-tab no-router">Notifications</a></li>
<li><a href="#general" class="x-general-tab">general</a></li> <li><a href="#general" class="x-general-tab no-router">general</a></li>
<li><a href="#misc" class="x-misc-tab">Misc</a></li> <li><a href="#misc" class="x-misc-tab no-router">Misc</a></li>
</ul> </ul>
<div class="tab-content"> <div class="tab-content">