Connecting The Dots

아빠의 우주연구

User Tools

Site Tools


ctd:slides:timematrix

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision Both sides next revision
ctd:slides:timematrix [2018/12/14 11:04]
admin
ctd:slides:timematrix [2018/12/25 12:50]
admin Goto, Fullscreen added
Line 55: Line 55:
     </​select>​     </​select>​
     <button class="​playpause">​Play Pause</​button>​     <button class="​playpause">​Play Pause</​button>​
-    <​label><​input type="​checkbox"​ id="​voiceEnabledCheckBox"​ name="​voiceEnabledCheckBox"​ checked onclick="​onVoiceCheckBoxChange();">​음성출력</​label>​ +    <​label><​input type="​checkbox"​ id="​voiceEnabledCheckBox"​ name="​voiceEnabledCheckBox"​ checked onclick="​onVoiceCheckBoxChange();">​음성출력&​nbsp;&​nbsp;​</​label>​ 
-    ​+    ​<button onclick="​full_screen()">​Fullscreen</​button>​ 
 +    <button class="​goto">​Goto:</​button>​ 
 +    <input type="​number"​ min="​1"​ max="​99"​ style="​width:​ 3em;" pattern="​\d*"​ id="​chapter"​ /> 
 +    <input type="​number"​ min="​1"​ max="​99"​ style="​width:​ 3em;" pattern="​\d*"​ id="​page"​ />
  
     <div class="​controls">​ <!------ 상태표시 ------->     <div class="​controls">​ <!------ 상태표시 ------->
         <div style="​padding:​ 0.7em 0.4em 0.2em 0.4em; border-bottom:​1px solid #99999a; width:100%; margin:0 auto;"><​b>​Commentary</​b></​div>​         <div style="​padding:​ 0.7em 0.4em 0.2em 0.4em; border-bottom:​1px solid #99999a; width:100%; margin:0 auto;"><​b>​Commentary</​b></​div>​
         <div class="​comment"></​div>​         <div class="​comment"></​div>​
-        <!------ button onclick="​full_screen()">​Fullscreen</​button -------->​ 
     </​div>​     </​div>​
  
Line 86: Line 88:
                 } else {                 } else {
                     slideChangedTimer(data.state.indexh,​ data.state.indexv);​                     slideChangedTimer(data.state.indexh,​ data.state.indexv);​
-                } +                } 
 +                document.getElementById("​chapter"​).value = data.state.indexh + 1; 
 +                document.getElementById("​page"​).value = data.state.indexv + 1;
             }             }
         }         }
Line 107: Line 111:
         }         }
     }     }
 +    ​
 +    /**
 +     * Example of sending messages into the presentation frame.
 +     * https://​github.com/​hakimel/​reveal.js#​api
 +    */
 +    document.querySelector( '​.goto'​ ).addEventListener( '​click',​ function( event ) {
 +        event.preventDefault();​
 +        // Find our presentation iframe
 +        var frame = document.querySelector( '​iframe'​ );
 +        // Post a message into the frame
 +        frame.contentWindow.postMessage( JSON.stringify(
 +        {
 +            method: '​slide',​
 +            args: [ document.getElementById("​chapter"​).value - 1,
 +                    document.getElementById("​page"​).value - 1 ]
 +        }), '​*'​ );
 +    } );
     ​     ​
     </​script>​     </​script>​
ctd/slides/timematrix.txt · Last modified: 2019/06/15 23:00 (external edit)