Mercurial > hg > Members > amothic > html

comparison seminar/20110802.html @ 2:667ea58b05d2 default tip

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
add 20110802 seminar
author Daichi TOMA <e085740@ie.u-ryukyu.ac.jp>
date Tue, 02 Aug 2011 19:09:20 +0900
parents 23c1131ea61c
children
comparison
equal deleted inserted replaced
1:23c1131ea61c 2:667ea58b05d2
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
3 3
4 <html xmlns="http://www.w3.org/1999/xhtml"> 4 <html xmlns="http://www.w3.org/1999/xhtml">
5 5
6 <head> 6 <head>
7 <title>Seminar</title> 7 <title>Seminar</title>
8 <!-- metadata --> 8 <!-- metadata -->
9 <meta name="generator" content="S5" /> 9 <meta name="generator" content="S5" />
10 <meta name="version" content="S5 1.3" /> 10 <meta name="version" content="S5 1.3" />
11 <meta name="author" content="Daichi Toma" /> 11 <meta name="author" content="Daichi Toma" />
12 <!-- meta temporary --> 12 <!-- meta temporary -->
13 <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 13 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
14 <meta http-equiv="Content-Script-Type" content="text/javascript" /> 14 <meta http-equiv="Content-Script-Type" content="text/javascript" />
15 <meta http-equiv="Content-Style-Type" content="text/css" /> 15 <meta http-equiv="Content-Style-Type" content="text/css" />
16 <!-- configuration parameters --> 16 <!-- configuration parameters -->
17 <meta name="defaultView" content="slideshow" /> 17 <meta name="defaultView" content="slideshow" />
18 <meta name="controlVis" content="hidden" /> 18 <meta name="controlVis" content="hidden" />
19 <!-- configuration extensions --> 19 <!-- configuration extensions -->
20 <meta name="tranSitions" content="true" /> 20 <meta name="tranSitions" content="true" />
21 <meta name="fadeDuration" content="500" /> 21 <meta name="fadeDuration" content="500" />
22 <meta name="incrDuration" content="250" /> 22 <meta name="incrDuration" content="250" />
23 <!-- configuration autoplay extension --> 23 <!-- configuration autoplay extension -->
24 <meta name="autoMatic" content="false" /> 24 <meta name="autoMatic" content="false" />
25 <meta name="playLoop" content="true" /> 25 <meta name="playLoop" content="true" />
26 <meta name="playDelay" content="10000" /> 26 <meta name="playDelay" content="10" />
27 <!-- configuration audio extension --> 27 <!-- configuration audio extension -->
28 <meta name="audioSupport" content="false" /> 28 <meta name="audioSupport" content="false" />
29 <meta name="audioVolume" content="100" /> 29 <meta name="audioVolume" content="100" />
30 <meta name="audioError" content="false" /> 30 <meta name="audioError" content="false" />
31 <!-- configuration audio debug --> 31 <!-- configuration audio debug -->
32 <meta name="audioDebug" content="false" /> 32 <meta name="audioDebug" content="false" />
33 <!-- style sheet links --> 33 <!-- style sheet links -->
34 <link rel="stylesheet" href="ui/default_utf/slides.css" type="text/css" media="projection" id="slideProj" /> 34 <link rel="stylesheet" href="ui/default_utf/slides.css" type="text/css" media="projection" id="slideProj" />
35 <link rel="stylesheet" href="ui/default_utf/outline.css" type="text/css" media="screen" id="outlineStyle" /> 35 <link rel="stylesheet" href="ui/default_utf/outline.css" type="text/css" media="screen" id="outlineStyle" />
36 <link rel="stylesheet" href="ui/default_utf/print.css" type="text/css" media="print" id="slidePrint" /> 36 <link rel="stylesheet" href="ui/default_utf/print.css" type="text/css" media="print" id="slidePrint" />
37 <link rel="stylesheet" href="ui/default_utf/opera.css" type="text/css" media="projection" id="operaFix" /> 37 <link rel="stylesheet" href="ui/default_utf/opera.css" type="text/css" media="projection" id="operaFix" />
38 <!-- embedded styles --> 38 <!-- embedded styles -->
39 <style type="text/css" media="all"> 39 <style type="text/css" media="all">
40 .imgcon {width: 100%; margin: 0 auto; padding: 0; text-align: center;} 40 .imgcon {width: 100%; margin: 0 auto; padding: 0; text-align: center;}
41 #anim {width: 33%; height: 320px; position: relative;} 41 #anim {width: 33%; height: 320px; position: relative;}
42 #anim img {position: absolute; top: 0px; left: 0px;} 42 #anim img {position: absolute; top: 0px; left: 0px;}
43 </style> 43 </style>
44 <!-- S5 JS --> 44 <!-- S5 JS -->
45 <script src="ui/default_utf/slides.js" type="text/javascript"></script> 45 <script src="ui/default_utf/slides.js" type="text/javascript"></script>
46 </head> 46 </head>
47 <body> 47 <body>
48 48
49 <div class="layout"> 49 <div class="layout">
50 <div id="controls"><!-- DO NOT EDIT --></div> 50 <div id="controls"><!-- DO NOT EDIT --></div>
51 <div id="currentSlide"><!-- DO NOT EDIT --></div> 51 <div id="currentSlide"><!-- DO NOT EDIT --></div>
52 <div id="header"></div> 52 <div id="header"></div>
53 <div id="footer"> 53 <div id="footer">
54 <h1>Seminar</h1> 54 <h1>Seminar</h1>
55 <h2>Daichi Toma</h2> 55 <h2>2011/08/02</h2>
56 </div> 56 </div>
57 </div> 57 </div>
58 58
59 <ol class="xoxo presentation"> 59 <div class="presentation">
60 60
61 <li class="slide"> 61 <div class="slide">
62 <h1>Seminar</h1> 62 <h1>Ceriumのマルチコアプロセッサへの対応</h1>
63 <h3>Daichi Toma</h3> 63 <h3>Daichi Toma</h3>
64 <div class="handout"></div> 64 <h4><a href="http://www.cr.ie.u-ryukyu.ac.jp" rel="external">Concurrency Reliance Laboratory</a></h4>
65 </li> 65 <div class="handout"></div>
66 </div>
66 67
67 68
68 <li class="slide"> 69 <div class="slide">
69 <h1>What Is S5?</h1> 70 <h1>研究目的・研究背景</h1>
70 <ul> 71 プロセッサメーカは消費電力、発熱、クロックの限界からマルチコア構成の路線を打ち出しており、今後ますます、マルチコアプロセッサが主流になると想像できる。<br>
71 <li>It's a <strong>S</strong>imple <strong>S</strong>tandards-based <strong>S</strong>lide <strong>S</strong>how <strong>S</strong>ystem</li> 72 マルチコアプロセッサ上でリソースを有効活用するためには、並列プログラミングを行う必要があるが、効率のよい並列プログラミングを書くことは難しい。<br>
72 <li>One XHTML document provides all of the slide show's content</li> 73 そこで、当研究室で開発した、Ceriumをマルチコアプロセッサに対応させることで、マルチコアプロセッサ上での並列プログラミングをサポートする。<br>
73 <li>CSS handles the layout and look of the slides</li> 74 </div>
74 <li>JavaScript handles the dynamic aspects of the show</li>
75 <li>That's all there is to it! (<a href="#slide10">skip to summary</a>; demonstrates links internal to the slide show)</li>
76 </ul>
77
78 <div class="notes">
79 <ul>
80 <li>I have notes here!</li>
81 <li>Keen.</li>
82 <li>Remember to tell people that notes are a new feature in 1.2</li>
83 </ul>
84 </div>
85
86 </li>
87 75
88 76
89 <li class="slide"> 77 <div class="slide">
90 <h1>Operatic Origins</h1> 78 <h1>ReferencedDmaManager</h1>
91 <ul> 79 <ul>
92 <li>Opera 4 introduced <a href="http://www.opera.com/support/tutorials/operashow/" rel="external">Opera Show</a>, a projection-mode style sheet technology (link demonstrates external link styling and window spawning)</li> 80 <li>memcopyをポインタ渡しにした、DmaManager</li>
93 <li>Allows a single XHTML document to be turned into a PowerPoint-like slide show</li> 81 <li>FifoDmaManagerを継承、dma_loadをオーバーロード</li>
94 <li>Adding screen and print style sheets allows for multi-medium views of a single document</li> 82 <li>FifoDmaManagerで動かしている所を全部置き換えても動く（PS3でも確認しました）</li>
95 <li>Highly efficient, but highly browser centric...</li> 83 <br><br>
96 </ul> 84 <li>しかし、word_countは動かない</li>
85 </ul>
86 </div>
97 87
98 <div class="notes"> 88 <div class="slide">
99 <ul> 89 <h1>WordCount</h1>
100 <li>S5 and OperaShow diverged greatly in S5 1.1</li> 90 <ul>
101 <li>S5 1.2 should (we hope) bring them into harmony once more</li> 91 <li>セグメンテーション違反が発生</li>
102 </ul> 92 <li>使うところを事前に解放しているのが悪いらしい</li>
103 </div> 93 <ul>
94 <li>いままでは、コピーしてたので問題なかった</li>
95 </ul>
96 <li>Freeを解除することで動く</li>
97 <li>メモリリーク大丈夫なの？</li>
98 </ul>
99 </div>
104 100
105 </li> 101 <div class="slide">
102 <h1>Valgrind</h1>
103 <ul>
104 <li>メモリデバッグや、メモリリークの検出、プロファイリングを行うためのプログラミングツール</li>
105 <li>Mac OS X Lionには対応してないようです。</li>
106 </ul>
107 </div>
106 108
109 <div class="slide">
110 <h1>Blade Server</h1>
111 <ul>
112 <li>借りたブレードで試そう！</li>
113 <li>初期設定</li>
114 <li>リモートストレージ使えない</li>
115 <li>iRMCのバージョンを下げたらいけました。</li>
116 <li>しかしながら、BIOSで認識されない。</li>
117 <li>サーバー室で直接やるか…</li>
118 </ul>
119 </div>
107 120
108 <li class="slide"> 121 </div>
109 <h1>Incremental Display</h1> 122 </body>
110 <ul class="incremental show-first">
111 <li>Keep hitting/clicking "next" as long as it isn't the control link (&raquo;)</li>
112 <li>Bullet points are revealed one by one
113 <ul class="incremental">
114 <li>All based on class name of <code>inc</code></li>
115 <li>Lists can be classed to make items appear individually</li>
116 <li>Individual items can be classed as well to create "animations"; see <a href="http://boxofchocolates.ca/projects/s5-incremental-graphics/" rel="external">Derek Featherstone's example</a></li>
117 </ul>
118 </li>
119 <li>Let's try it again, but without the first bullet point being pre-highlighted...</li>
120 </ul>
121 </li>
122
123
124 <li class="slide">
125 <h1>Incremental Display II</h1>
126 <ul class="incremental fs90">
127 <li>Keep hitting/clicking "next" as long as it isn't the control link (&raquo;)</li>
128 <li>Bullet points are revealed one by one
129 <ul>
130 <li>All based on class name of <code>incremental</code></li>
131 <li>Lists can be classed to make items appear individually</li>
132 <li>Individual items can be classed as well to create "animations"; see <a href="http://boxofchocolates.ca/projects/s5-incremental-graphics/" rel="external">Derek Featherstone's example</a></li>
133 </ul>
134 </li>
135 <li>Notice how the sub-list was part of the parent bullet point; that was done on purpose</li>
136 <li>Now to move on to other test slides!</li>
137 </ul>
138 </li>
139
140
141 <li class="slide">
142 <h1>PNG Alpha Tests</h1>
143 <div style="width: 400px; height: 150px; text-align: center; background: url(pix/bg-shade.png)">
144 <p>DIV with PNG background followed by foreground PNG</p>
145 <img class="scale" src="pix/bg-shade.png" width="200" height="200" alt="" title="A translucent image" />
146 </div>
147 <div style="width: 100%; height: 150px; text-align: center; background: url(pix/bg-shade.png)">
148 <p>DIV with PNG background followed by foreground PNG</p>
149 <img class="scale" src="pix/bg-shade.png" width="200" height="200" alt="" title="A translucent image" />
150 </div>
151 </li>
152
153
154 <li class="slide">
155 <h1>S5 Default File Structure</h1>
156 <p style="text-align: center;">
157 <img class="scale" width="760" height="381" src="pix/s5filemap.png" alt="" title="At a Glance" />
158 </p>
159 </li>
160
161
162 <li class="slide">
163 <h1>S5 Themes</h1>
164 <p style="text-align: center;">
165 <img class="scale" width="256" height="187" src="pix/S501.jpg" alt="" title="Default" />&nbsp;<img class="scale" width="256" height="187" src="pix/S502.jpg" alt="" title="Avanced" /><br />
166 <img class="scale" width="256" height="187" src="pix/S503.jpg" alt="" title="Sunny" />&nbsp;<img class="scale" width="256" height="187" src="pix/S504.jpg" alt="" title="School" /><br />
167 <small>(one way of presenting multiple graphics)</small>
168 </p>
169 </li>
170
171
172 <li class="slide">
173 <h1>Incremental S5 Themes</h1>
174 <p style="text-align: center;">
175 <img class="scale incremental" width="256" height="187" src="pix/S501.jpg" alt="" title="Default" />&nbsp;<img class="scale incremental" width="256" height="187" src="pix/S502.jpg" alt="" title="Avanced" /><br />
176 <img class="scale incremental" width="256" height="187" src="pix/S503.jpg" alt="" title="Sunny" />&nbsp;<img class="scale incremental" width="256" height="187" src="pix/S504.jpg" alt="" title="School" /><br />
177 <small>(one by one!)</small>
178 </p>
179 </li>
180
181
182 <li class="slide">
183 <h1>Incremental Animation</h1>
184 <ul>
185 <li>A demonstration of just one of the many ways to accomplish simple animation-like effects <small>(using a diagram from <a href="http://gmpg.org/xfn/and/" rel="external">"XFN and..."</a>)</small></li>
186 </ul>
187 <p class="imgcon" id="anim">
188 <img class="scale" src="pix/mememe01.png" width="270" height="320" alt="" />
189 <img class="scale incremental" src="pix/mememe02.png" width="270" height="320" alt="" />
190 <img class="scale incremental" src="pix/mememe03.png" width="270" height="320" alt="" />
191 <img class="scale incremental" src="pix/mememe04.png" width="270" height="320" alt="" />
192 <img class="scale incremental" src="pix/mememe05.png" width="270" height="320" alt="" />
193 </p>
194 </li>
195
196
197 <li class="slide">
198 <h1>In Summary</h1>
199 <ul>
200 <li>With minimal scripting, we have recreated and improved upon a (currently) browser-specific technology, making it cross-browser in the process</li>
201 <li>The S5 format is OSF 1.0 compatible</li>
202 <li>S5 is a very flexible and lightweight slide show system available for anyone to use</li>
203 </ul>
204 </li>
205
206 </ol>
207
208 </body>
209 </html> 123 </html>