Microsoft/alguidelines
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

deploy: 9e06f72056

Browse source
This commit is contained in:
TheDoubleH 2022-02-11 17:30:04 +00:00
parent de09820554
commit e4f08bf9a7
187 changed files with 6620 additions and 6342 deletions
Download patch file Download diff file Expand all files Collapse all files

58
navpatterns/1-patterns/instructions-in-the-ui/index.html
View file

@ -5,16 +5,16 @@
<meta name=generator content="Hugo 0.92.1">
<meta name=description content>
<title>Instructions in the UI :: AL Guidelines</title>
<link href=/css/nucleus.css?1644506468 rel=stylesheet>
<link href=/css/fontawesome-all.min.css?1644506468 rel=stylesheet>
<link href=/css/featherlight.min.css?1644506468 rel=stylesheet>
<link href=/css/perfect-scrollbar.min.css?1644506468 rel=stylesheet>
<link href=/css/auto-complete.css?1644506468 rel=stylesheet>
<link href=/css/theme.css?1644506468 rel=stylesheet>
<link href=/css/theme-blue.css?1644506468 rel=stylesheet>
<link href=/css/variant.css?1644506468 rel=stylesheet>
<link href=/css/print.css?1644506468 rel=stylesheet media=print>
<script src=/js/jquery.min.js?1644506468></script>
<link href=/css/nucleus.css?1644600599 rel=stylesheet>
<link href=/css/fontawesome-all.min.css?1644600599 rel=stylesheet>
<link href=/css/featherlight.min.css?1644600599 rel=stylesheet>
<link href=/css/perfect-scrollbar.min.css?1644600599 rel=stylesheet>
<link href=/css/auto-complete.css?1644600599 rel=stylesheet>
<link href=/css/theme.css?1644600599 rel=stylesheet>
<link href=/css/theme-blue.css?1644600599 rel=stylesheet>
<link href=/css/variant.css?1644600599 rel=stylesheet>
<link href=/css/print.css?1644600599 rel=stylesheet media=print>
<script src=/js/jquery.min.js?1644600599></script>
<style>:root #header+#content>#left>#rlblock_left{display:none!important}</style>
</head>
<body data-url=/navpatterns/1-patterns/instructions-in-the-ui/>
@ -32,9 +32,9 @@ ALGuidelines.Dev
<input data-search-input id=search-by type=search placeholder=Search...>
<span data-search-clear><i class="fas fa-times"></i></span>
</div>
<script src=/js/lunr.min.js?1644506468></script>
<script src=/js/auto-complete.js?1644506468></script>
<script src=/js/search.js?1644506468></script>
<script src=/js/lunr.min.js?1644600599></script>
<script src=/js/auto-complete.js?1644600599></script>
<script src=/js/search.js?1644600599></script>
</div>
<div class=highlightable>
<ul class=topics>
@ -315,16 +315,14 @@ ALGuidelines.Dev
<p>Important parts:<br>
<strong>VideoPlayerAddIn.SetFrameAttribute</strong> function is used to set an attribute to the iframe that will be playing the video.</p>
<p>Example of the embed code:</p>
<p>You must assign <strong>src attribute</strong> to src of the embed code, for example:</p>
<pre><code>VideoPlayer.SetFrameAttribute('src', 'https://www.youtube.com/embed/7SGp9pA9cAY');
</code></pre>
<p>Without this, the video will not play. You can use the same function to assign other attributes, for example to remove frame border use:</p>
<pre><code>VideoPlayer.SetFrameAttribute(' frameborder', '0');
</code></pre>
<p>Height and width should be set by using the following functions, since they ensure that the video will be centered on the page.</p>
<pre><code>VideoPlayerAddIn.SetHeight(Height) and VideoPlayerAddIn.SetWidth(Width);
</code></pre>
<p>If you would like to reuse the <strong>Mini Video Player Page</strong> page (1395), then use:</p>
<div class=highlight><pre tabindex=0 style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-js data-lang=js><span style=color:#f92672>&lt;</span><span style=color:#a6e22e>iframe</span> <span style=color:#a6e22e>width</span><span style=color:#f92672>=</span><span style=color:#e6db74>&#34;560&#34;</span> <span style=color:#a6e22e>height</span><span style=color:#f92672>=</span><span style=color:#e6db74>&#34;315&#34;</span> <span style=color:#a6e22e>src</span><span style=color:#f92672>=</span><span style=color:#e6db74>&#34;//www.youtube.com/embed/7SGp9pA9cAY&#34;</span> <span style=color:#a6e22e>frameborder</span><span style=color:#f92672>=</span><span style=color:#e6db74>&#34;0&#34;</span> <span style=color:#a6e22e>allowfullscreen</span><span style=color:#960050;background-color:#1e0010>\</span><span style=color:#f92672>&gt;&lt;</span><span style=color:#960050;background-color:#1e0010>/iframe\&gt;</span>
</code></pre></div><p>You must assign <strong>src attribute</strong> to src of the embed code, for example:</p>
<div class=highlight><pre tabindex=0 style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-al data-lang=al> VideoPlayer<span style=color:#f92672>.</span>SetFrameAttribute<span style=color:#f92672>(</span><span style=color:#e6db74>&#39;src&#39;</span>, <span style=color:#e6db74>&#39;https://www.youtube.com/embed/7SGp9pA9cAY&#39;</span><span style=color:#f92672>)</span>;
</code></pre></div><p>Without this, the video will not play. You can use the same function to assign other attributes, for example to remove frame border use:</p>
<div class=highlight><pre tabindex=0 style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-al data-lang=al> VideoPlayer<span style=color:#f92672>.</span>SetFrameAttribute<span style=color:#f92672>(</span><span style=color:#e6db74>&#39; frameborder&#39;</span>, <span style=color:#e6db74>&#39;0&#39;</span><span style=color:#f92672>)</span>;
</code></pre></div><p>Height and width should be set by using the following functions, since they ensure that the video will be centered on the page.</p>
<div class=highlight><pre tabindex=0 style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-al data-lang=al> VideoPlayerAddIn<span style=color:#f92672>.</span>SetHeight<span style=color:#f92672>(</span>Height<span style=color:#f92672>) </span><span style=color:#f92672>and</span> VideoPlayerAddIn<span style=color:#f92672>.</span>SetWidth<span style=color:#f92672>(</span>Width<span style=color:#f92672>)</span>;
</code></pre></div><p>If you would like to reuse the <strong>Mini Video Player Page</strong> page (1395), then use:</p>
<pre><code>SetParameters(Height,Width,Src,Caption), which uses the functions described above.
</code></pre>
<p>4. As a last step you need to implement the action on the group and assign a video icon</p>
@ -364,12 +362,12 @@ ALGuidelines.Dev
<div style=left:-1000px;overflow:scroll;position:absolute;top:-1000px;border:none;box-sizing:content-box;height:200px;margin:0;padding:0;width:200px>
<div style=border:none;box-sizing:content-box;height:200px;margin:0;padding:0;width:200px></div>
</div>
<script src=/js/clipboard.min.js?1644506468></script>
<script src=/js/perfect-scrollbar.min.js?1644506468></script>
<script src=/js/perfect-scrollbar.jquery.min.js?1644506468></script>
<script src=/js/jquery.svg.pan.zoom.js?1644506468></script>
<script src=/js/featherlight.min.js?1644506468></script>
<script src=/js/modernizr.custom-3.6.0.js?1644506468></script>
<script src=/js/relearn.js?1644506468></script>
<script src=/js/clipboard.min.js?1644600599></script>
<script src=/js/perfect-scrollbar.min.js?1644600599></script>
<script src=/js/perfect-scrollbar.jquery.min.js?1644600599></script>
<script src=/js/jquery.svg.pan.zoom.js?1644600599></script>
<script src=/js/featherlight.min.js?1644600599></script>
<script src=/js/modernizr.custom-3.6.0.js?1644600599></script>
<script src=/js/relearn.js?1644600599></script>
</body>
</html>