Skip to content

780 pat inject scroll #652

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Apr 29, 2019
Merged

780 pat inject scroll #652

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
ed38719
initial and very rudimentary scroll: support
pilz Apr 5, 2019
9284e6a
Added one extra example
Apr 5, 2019
9e59654
support for scroll: top
pilz Apr 5, 2019
1d06296
syntax fix
pilz Apr 7, 2019
70bc22d
Merge branch 'master' into 780-pat-inject-scroll
pilz Apr 29, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 15 additions & 0 deletions src/pat/inject/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,9 +55,24 @@
<a href="page-that-doesnt-exist#nothing" class="pat-inject">Trigger an inject that fails. (Puts an error message in a data attribute on the body tag)</a>
<em class="iconified icon-info-circle pat-tooltip" data-pat-tooltip="trigger: click; source: content; class: large code"><code class="pat-syntax-highlight">&lt;a href=&quot;page-that-doesnt-exist&quot; class=&quot;pat-inject&quot;&gt;</code></em>
</li>
<li>
Place "Wilde in column 2 when <button onclick="document.getElementById('autoload-visible-item').removeAttribute('style')">the hidden link appears</button>
<span id="autoload-visible-item" style="display:none">
<a href="inject-sources.html#pos-2" class="pat-inject" data-pat-inject="trigger: autoload-visible">I am visible now</a>
</span>
</li>
<li>
<a href="inject-text.html" class="pat-inject" data-pat-inject="scroll: #scroll-target">Load text into column 1 and scoll to #scroll-target</a>
<em class="iconified icon-info-circle pat-tooltip" data-pat-tooltip="trigger: click; source: content; class: large code"><code class="pat-syntax-highlight">&lt;a href=&quot;inject-text.html&quot; class=&quot;pat-inject&quot; data-pat-inject=&quot;scroll: #scroll-target&quot;&gt;</code></em>
</li>
<li>
<a href="index.html" class="pat-inject" data-pat-inject="scroll: #poems">Re-inject this entire page and scroll to the demo area</a>
<em class="iconified icon-info-circle pat-tooltip" data-pat-tooltip="trigger: click; source: content; class: large code"><code class="pat-syntax-highlight">&lt;a href=&quot;index.html&quot; class=&quot;pat-inject&quot; data-pat-inject=&quot;scroll: #poems&quot;&gt;</code></em>
</li>
</ul>
</article>


<div class="poems">
<article class="poem pat-rich" id="pos-1">
<p>
Expand Down
1 change: 0 additions & 1 deletion src/pat/inject/inject-sources.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Demo page</title>
<script data-main="../main" src="../../src/bower_components/requirejs/require.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>

Expand Down
45 changes: 45 additions & 0 deletions src/pat/inject/inject-text.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Demo page</title>
</head>
<body>
<article id="pos-1">
<h3>Immer wieder</h3>
<p>
Immer wieder, ob wir der Liebe Landschaft auch kennen<br>und den kleinen Kirchhof mit seinen klagenden Namen<br>
und die furchtbar verschweigende Schlucht, in welcher die anderen<br>
enden: immer wieder gehn wir zu zweien hinaus<br>unter die alten Bäume, lagern uns immer wieder<br>
zwischen die Blumen, gegenüber dem Himmel.
</p>
<p>
<em>— Rainer Maria Rilke</em>
</p>
<h3 id="scroll-target">A vision</h3>
<p>
Two crowned Kings, and One that stood alone<br>With no green weight of laurels round his head,<br>But with sad eyes as one uncomforted,<br>And wearied with man's never-ceasing moan<br>For sins no bleating victim can atone,<br>And sweet long lips with tears and kisses fed.<br>Girt was he in a garment black and red,<br>And at his feet I marked a broken stone<br>Which sent up lilies, dove-like, to his knees.<br>Now at their sight, my heart being lit with flame,<br>I cried to Beatrice, 'Who are these? '<br>And she made answer, knowing well each name,<br>'AEschylos first, the second Sophokles,<br>And last (wide stream of tears!) Euripides.'

</p>
<p>
<em>— Oscar Wilde</em>
</p>
<h3>Le dieu nu</h3>
<p>
Il allait en silence au milieu des risées –</br/>
Il feignait d’être sourd à l’unanime affront –</br/>
Il souriait avec des lèvres défrisées –</br/>
Un bandeau noir ceignait les boucles de son front –
</p>
<p>
Et je lui demandai : « Jeune homme aux membres frêles</br/>
Es-tu l’amour ? » -- Alors il me répondit : Non !</br/>
Je marche en me cachant à l’ombre de ses ailes,</br/>
Et je suis le dieu nu qui ne dit pas son nom.
</p>
<p>
<em>— Jean Cocteau</em>
</p>
</article>
</body>
</html>
13 changes: 13 additions & 0 deletions src/pat/inject/inject.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@ define([
// XXX: this should not be here but the parser would bail on
// unknown parameters and expand/collapsible need to pass the url
// to us
parser.addArgument("scroll");
parser.addArgument("url");

var inject = {
Expand Down Expand Up @@ -483,6 +484,18 @@ define([
}
});
}
if (cfg.scroll) {
if (cfg['scroll'] == 'top') {
$(cfg['target'])[0].scrollTop = 0;
} else if (cfg['scroll'] == 'target') {
/* scrollable: target Target indicates the target in the URL fragment the URL
that's in the href or action in the case of a form. After injection, the
page or scroll container will scroll to bring the element with that ID into view. */
/*$(cfg['target'])[0].scrollTop = $(cfg['selector'])[0].offsetTop;*/
} else {
$(cfg['target'])[0].scrollTop = $(cfg['scroll'])[0].offsetTop;
}
}
$el.trigger("pat-inject-success");
},

Expand Down