initial commits
							parent
							
								
									629addc07d
								
							
						
					
					
						commit
						c4b413d61b
					
				
							
								
								
									
										124
									
								
								index.xhtml
								
								
								
								
							
							
						
						
									
										124
									
								
								index.xhtml
								
								
								
								
							|  | @ -222,6 +222,130 @@ The following is <b>bold</b> and <a href="http://example.com/"> | |||
| 			<strong>So, what does that actually do‽</strong> | ||||
| 		</p> | ||||
| 	</section> | ||||
| 
 | ||||
| 	<section> | ||||
| 		<h2>Buttons</h2> | ||||
| 		<p> | ||||
| 			We already went over three of the names the <strong>Frames Protocol</strong> uses with the <abbr title="HyperText Markup Language">HTML</abbr> <code><meta></code> element: | ||||
| 		</p> | ||||
| 		<ul> | ||||
| 			<li><code>fc:frame</code></li> | ||||
| 			<li><code>fc:frame:image</code></li> | ||||
| 			<li><code>og:image</code></li> | ||||
| 		</ul> | ||||
| 		<p> | ||||
| 			But there are other <strong>optional</strong> names, too. | ||||
| 			We are going to look at 4 more of them: | ||||
| 		</p> | ||||
| 		<ul> | ||||
| 			<li><code>fc:frame:button:1</code></li> | ||||
| 			<li><code>fc:frame:button:2</code></li> | ||||
| 			<li><code>fc:frame:button:3</code></li> | ||||
| 			<li><code>fc:frame:button:4</code></li> | ||||
| 		</ul> | ||||
| 		<p> | ||||
| 			These add buttons to a <strong>Frames Protocol</strong> application. | ||||
| 		</p> | ||||
| 		<section> | ||||
| 			<h3>One Button</h3> | ||||
| 			<p> | ||||
| 				For example, this has <strong>one button</strong>: | ||||
| 			</p> | ||||
| 			<figure> | ||||
| <pre><code> | ||||
| 	<meta property="fc:frame"          content="vNext" /> | ||||
| 	<meta property="fc:frame:image"    content="/images/4aigvXF62jMY8iRzFN8x.jpeg" /> | ||||
| 	<meta property="og:image"          content="/images/4aigvXF62jMY8iRzFN8x.jpeg" /> | ||||
| 	<meta property="fc:frame:button:1" content="the first button" /> | ||||
| </code></pre> | ||||
| 			</figure> | ||||
| 			<p> | ||||
| 				Note that this looks exactly the same as the previous example, except one more <abbr title="HyperText Markup Language">HTML</abbr> <code><meta></code> element has been added to it: | ||||
| 			</p> | ||||
| 			<figure> | ||||
| <pre><code> | ||||
| 	<meta property="fc:frame:button:1" content="the first button" /> | ||||
| </code></pre> | ||||
| 			</figure> | ||||
| 		</section> | ||||
| 		<section> | ||||
| 			<h3>Two Buttons</h3> | ||||
| 			<p> | ||||
| 				Here is another example that has <strong>two buttons</strong>: | ||||
| 			</p> | ||||
| 			<figure> | ||||
| <pre><code> | ||||
| 	<meta property="fc:frame"          content="vNext" /> | ||||
| 	<meta property="fc:frame:image"    content="/images/4aigvXF62jMY8iRzFN8x.jpeg" /> | ||||
| 	<meta property="og:image"          content="/images/4aigvXF62jMY8iRzFN8x.jpeg" /> | ||||
| 	<meta property="fc:frame:button:1" content="the first button" /> | ||||
| 	<meta property="fc:frame:button:2" content="the second button" /> | ||||
| </code></pre> | ||||
| 			</figure> | ||||
| 			<p> | ||||
| 				Again, the focus is on the <code>fc:frame:button:*</code> <abbr title="HyperText Markup Language">HTML</abbr> <code><meta></code> elements: | ||||
| 			</p> | ||||
| 			<figure> | ||||
| <pre><code> | ||||
| 	<meta property="fc:frame:button:1" content="the first button" /> | ||||
| 	<meta property="fc:frame:button:2" content="the second button" /> | ||||
| </code></pre> | ||||
| 			</figure> | ||||
| 		</section> | ||||
| 		<section> | ||||
| 			<h3>Three Buttons</h3> | ||||
| 			<p> | ||||
| 				This example has <strong>three buttons</strong>: | ||||
| 			</p> | ||||
| 			<figure> | ||||
| <pre><code> | ||||
| 	<meta property="fc:frame"          content="vNext" /> | ||||
| 	<meta property="fc:frame:image"    content="/images/4aigvXF62jMY8iRzFN8x.jpeg" /> | ||||
| 	<meta property="og:image"          content="/images/4aigvXF62jMY8iRzFN8x.jpeg" /> | ||||
| 	<meta property="fc:frame:button:1" content="the first button" /> | ||||
| 	<meta property="fc:frame:button:2" content="the second button" /> | ||||
| 	<meta property="fc:frame:button:3" content="the third button" /> | ||||
| </code></pre> | ||||
| 			</figure> | ||||
| 			<p> | ||||
| 				Focusing on the <code>fc:frame:button:*</code> <abbr title="HyperText Markup Language">HTML</abbr> <code><meta></code> elements: | ||||
| 			</p> | ||||
| 			<figure> | ||||
| <pre><code> | ||||
| 	<meta property="fc:frame:button:1" content="the first button" /> | ||||
| 	<meta property="fc:frame:button:2" content="the second button" /> | ||||
| 	<meta property="fc:frame:button:3" content="the third button" /> | ||||
| </code></pre> | ||||
| 			</figure> | ||||
| 		</section> | ||||
| 		<section> | ||||
| 			<h3>Four Buttons</h3> | ||||
| 			<p> | ||||
| 				And finally, this example has <strong>four buttons</strong>: | ||||
| 			</p> | ||||
| 			<figure> | ||||
| <pre><code> | ||||
| 	<meta property="fc:frame"          content="vNext" /> | ||||
| 	<meta property="fc:frame:image"    content="/images/4aigvXF62jMY8iRzFN8x.jpeg" /> | ||||
| 	<meta property="og:image"          content="/images/4aigvXF62jMY8iRzFN8x.jpeg" /> | ||||
| 	<meta property="fc:frame:button:1" content="the first button" /> | ||||
| 	<meta property="fc:frame:button:2" content="the second button" /> | ||||
| 	<meta property="fc:frame:button:3" content="the third button" /> | ||||
| 	<meta property="fc:frame:button:4" content="the forth button" /> | ||||
| </code></pre> | ||||
| 			</figure> | ||||
| 		</section> | ||||
| 		<p> | ||||
| 			At the time of writing the <strong>Frames Protocol</strong> does <em>not</em> support more than 4 buttons. | ||||
| 		</p> | ||||
| 	</section | ||||
| 
 | ||||
| 	<section> | ||||
| 		<h2>Buttons Presses</h2> | ||||
| 		<p> | ||||
| 			So what happens when the user presses a button‽ | ||||
| 		</p> | ||||
| 	</section | ||||
| </article> | ||||
| </main> | ||||
| 
 | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue