mirror of https://gitlab.com/brutaldon/brutaldon
Pjax page transitions that use the main page nav buttons
Things remain to do on this: - Make the indicator less blatant - Fix page titles - apply lots of other places
This commit is contained in:
parent
1dd8b1a316
commit
7c85f5474a
|
@ -103,3 +103,21 @@ emoji-link
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#page-load-indicator
|
||||||
|
{
|
||||||
|
width: 100%;
|
||||||
|
height: 4px;
|
||||||
|
background-color: blue;
|
||||||
|
opacity: 1;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: 666;
|
||||||
|
transition: all 500ms;
|
||||||
|
}
|
||||||
|
|
||||||
|
#page-load-indicator.ic-use-transition
|
||||||
|
{
|
||||||
|
width:0;
|
||||||
|
}
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
define(["jquery"], function (a0) {
|
define(["jquery"], function (a0) {
|
||||||
return (root['Intercooler'] = factory(a0));
|
return (root['Intercooler'] = factory(a0));
|
||||||
});
|
});
|
||||||
} else if (typeof exports === 'object') {
|
} else if (typeof module === 'object' && module.exports) {
|
||||||
// Node. Does not work with strict CommonJS, but
|
// Node. Does not work with strict CommonJS, but
|
||||||
// only CommonJS-like environments that support module.exports,
|
// only CommonJS-like environments that support module.exports,
|
||||||
// like Node.
|
// like Node.
|
||||||
|
@ -497,7 +497,6 @@ var Intercooler = Intercooler || (function() {
|
||||||
|
|
||||||
if (xhr.getResponseHeader("X-IC-PushURL") || closestAttrValue(elt, 'ic-push-url') == "true") {
|
if (xhr.getResponseHeader("X-IC-PushURL") || closestAttrValue(elt, 'ic-push-url') == "true") {
|
||||||
try {
|
try {
|
||||||
requestCleanup(indicator, elt); // clean up before snap-shotting HTML
|
|
||||||
var newUrl = xhr.getResponseHeader("X-IC-PushURL") || closestAttrValue(elt, 'ic-src');
|
var newUrl = xhr.getResponseHeader("X-IC-PushURL") || closestAttrValue(elt, 'ic-src');
|
||||||
if(_history) {
|
if(_history) {
|
||||||
_history.snapshotForHistory(newUrl);
|
_history.snapshotForHistory(newUrl);
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -60,27 +60,57 @@
|
||||||
<div class="navbar-menu is-active" id="navMenu">
|
<div class="navbar-menu is-active" id="navMenu">
|
||||||
<!-- navbar start, navbar end -->
|
<!-- navbar start, navbar end -->
|
||||||
<div class="navbar-start">
|
<div class="navbar-start">
|
||||||
<a href="{% url "home" %}" class="navbar-item">
|
<a href="{% url "home" %}" class="navbar-item"
|
||||||
|
ic-post-to="{% url "home" %}"
|
||||||
|
ic-target="#main"
|
||||||
|
ic-select-from-response="#main"
|
||||||
|
ic-push-url="true"
|
||||||
|
ic-indicator="#page-load-indicator">
|
||||||
<span class="fa fa-home"></span>
|
<span class="fa fa-home"></span>
|
||||||
<span> Home</span>
|
<span> Home</span>
|
||||||
</a>
|
</a>
|
||||||
<a class="navbar-item" href="{% url "note" %}">
|
<a class="navbar-item" href="{% url "note" %}"
|
||||||
|
ic-post-to="{% url "note" %}"
|
||||||
|
ic-target="#main"
|
||||||
|
ic-select-from-response="#main"
|
||||||
|
ic-push-url="true"
|
||||||
|
ic-indicator="#page-load-indicator">
|
||||||
<span class="fa fa-bell-o"></span>
|
<span class="fa fa-bell-o"></span>
|
||||||
<span > Notifications</span>
|
<span > Notifications</span>
|
||||||
</a>
|
</a>
|
||||||
<a class="navbar-item" href="{% url "local" %}">
|
<a class="navbar-item" href="{% url "local" %}"
|
||||||
|
ic-post-to="{% url "local" %}"
|
||||||
|
ic-target="#main"
|
||||||
|
ic-select-from-response="#main"
|
||||||
|
ic-push-url="true"
|
||||||
|
ic-indicator="#page-load-indicator">
|
||||||
<span class="fa fa-community"></span>
|
<span class="fa fa-community"></span>
|
||||||
<span > Local</span>
|
<span > Local</span>
|
||||||
</a>
|
</a>
|
||||||
<a class="navbar-item" href="{% url "fed" %}">
|
<a class="navbar-item" href="{% url "fed" %}"
|
||||||
|
ic-post-to="{% url "fed" %}"
|
||||||
|
ic-target="#main"
|
||||||
|
ic-select-from-response="#main"
|
||||||
|
ic-push-url="true"
|
||||||
|
ic-indicator="#page-load-indicator">
|
||||||
<span class="fa fa-globe"></span>
|
<span class="fa fa-globe"></span>
|
||||||
<span > Federated</span>
|
<span > Federated</span>
|
||||||
</a>
|
</a>
|
||||||
<a class="navbar-item" href="{% url "toot" %}">
|
<a class="navbar-item" href="{% url "toot" %}"
|
||||||
|
ic-post-to="{% url "toot" %}"
|
||||||
|
ic-target="#main"
|
||||||
|
ic-select-from-response="#main"
|
||||||
|
ic-push-url="true"
|
||||||
|
ic-indicator="#page-load-indicator">
|
||||||
<span class="fa fa-edit"> </span>
|
<span class="fa fa-edit"> </span>
|
||||||
<span > New Toot</span>
|
<span > New Toot</span>
|
||||||
</a>
|
</a>
|
||||||
<a class="navbar-item" href="{% url "search" %}">
|
<a class="navbar-item" href="{% url "search" %}"
|
||||||
|
ic-post-to="{% url "search" %}"
|
||||||
|
ic-target="#main"
|
||||||
|
ic-select-from-response="#main"
|
||||||
|
ic-push-url="true"
|
||||||
|
ic-indicator="#page-load-indicator">
|
||||||
<span class="fa fa-search"> </span>
|
<span class="fa fa-search"> </span>
|
||||||
<span > Search</span>
|
<span > Search</span>
|
||||||
</a>
|
</a>
|
||||||
|
@ -100,7 +130,8 @@
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</nav>
|
</nav>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
<section class="section">
|
<div id="page-load-indicator" class="ic-use-transition"> </div>
|
||||||
|
<section id="main" class="section">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<h1 class="title">
|
<h1 class="title">
|
||||||
|
|
Loading…
Reference in New Issue