mirror of
https://github.com/flutter/flutter
synced 2024-10-13 11:42:54 +00:00
67ee3e191e
This adds an "anchor button" to each of the samples so that the user can link to individual samples instead of having to link to just the page. Clicking on the anchor button jumps to the anchor, as well as copying the anchor URL to the clipboard. There is some oddness in the implementation: because dartdoc uses a <base> tag, the href for the link can't just be "#id", it has to calculate the URL from the current window href. I do that in the onmouseenter and onclick because onload doesn't get triggered for <a> tags (and onmouseenter doesn't get triggered for mobile platforms), but I still want the href to be updated before someone right-clicks it to copy the URL.
44 lines
1.9 KiB
HTML
44 lines
1.9 KiB
HTML
{@inject-html}
|
|
<a name="{{id}}"></a>
|
|
<div class="anchor-container">
|
|
<a class="anchor-button-overlay anchor-button" title="Copy link to clipboard"
|
|
onmouseenter="fixHref(this, '{{id}}');"
|
|
onclick="fixHref(this, '{{id}}'); copyStringToClipboard(this.href);"
|
|
href="#">
|
|
<i class="material-icons copy-image">link</i>
|
|
</a>
|
|
</div>
|
|
<div class="snippet-buttons">
|
|
<script>var visibleSnippet{{serial}} = "shortSnippet{{serial}}";</script>
|
|
<button id="shortSnippet{{serial}}Button"
|
|
onclick="visibleSnippet{{serial}} = showSnippet('shortSnippet{{serial}}', visibleSnippet{{serial}});"
|
|
selected>Sample</button>
|
|
<button id="longSnippet{{serial}}Button"
|
|
onclick="visibleSnippet{{serial}} = showSnippet('longSnippet{{serial}}', visibleSnippet{{serial}});">Sample in an App</button>
|
|
</div>
|
|
<div class="snippet-container">
|
|
<div class="snippet" id="shortSnippet{{serial}}">
|
|
{{description}}
|
|
<div class="copyable-container">
|
|
<button class="copy-button-overlay copy-button" title="Copy to clipboard"
|
|
onclick="copyTextToClipboard(visibleSnippet{{serial}});">
|
|
<i class="material-icons copy-image">assignment</i>
|
|
</button>
|
|
<pre class="language-{{language}}"><code class="language-{{language}}">{{code}}</code></pre>
|
|
</div>
|
|
</div>
|
|
<div class="snippet" id="longSnippet{{serial}}" hidden>
|
|
<div class="snippet-description">To create a sample project with this code snippet, run:<br/>
|
|
<span class="snippet-create-command">flutter create --sample={{id}} mysample</span>
|
|
</div>
|
|
<div class="copyable-container">
|
|
<button class="copy-button-overlay copy-button" title="Copy to clipboard"
|
|
onclick="copyTextToClipboard(visibleSnippet{{serial}});">
|
|
<i class="material-icons copy-image">assignment</i>
|
|
</button>
|
|
<pre class="language-{{language}}"><code class="language-{{language}}">{{app}}</code></pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{@end-inject-html}
|