1+ <!DOCTYPE html>
2+ < html lang ="en ">
3+ < head >
4+ < meta charset ="UTF-8 ">
5+ < meta http-equiv ="X-UA-Compatible " content ="IE=edge ">
6+ < meta name ="viewport " content ="width=device-width, initial-scale=1.0 ">
7+ < title > Playback</ title >
8+ <!-- external resources (editor, zip)-->
9+ < script src ="js/ext/src-min-noconflict/ace.js " type ="text/javascript " charset ="utf-8 "> </ script >
10+ < script src ="js/ext/src-min-noconflict/ext-modelist.js " type ="text/javascript " charset ="utf-8 "> </ script >
11+ < script src ="js/ext/jszip.min.js " type ="text/javascript " charset ="utf-8 "> </ script >
12+ <!-- non-ui playback -->
13+ < script src ="js/playbackEngine/EditorState.js "> </ script >
14+ < script src ="js/playbackEngine/CodeDownloader.js "> </ script >
15+ < script src ="js/playbackEngine/NewCodeFileMarker.js "> </ script >
16+ < script src ="js/playbackEngine/NewCodeMarkerGenerator.js "> </ script >
17+ < script src ="js/playbackEngine/PlaybackEngine.js "> </ script >
18+ < script src ="js/playbackEngine/ServerProxy.js "> </ script >
19+ <!-- playback ui -->
20+ < script src ="js/AceEditor.js "> </ script >
21+ < script src ="js/AddEditComment.js "> </ script >
22+ < script src ="js/App.js "> </ script >
23+ < script src ="js/AudioVideoRecorder.js "> </ script >
24+ < script src ="js/BlogCodeSnippet.js "> </ script >
25+ < script src ="js/BlogComponent.js "> </ script >
26+ < script src ="js/BlogView.js "> </ script >
27+ < script src ="js/CodeView.js "> </ script >
28+ < script src ="js/CommentGroup.js "> </ script >
29+ < script src ="js/CommentNavigator.js "> </ script >
30+ < script src ="js/CommentTags.js "> </ script >
31+ < script src ="js/CommentView.js "> </ script >
32+ < script src ="js/CreateMultipleChoiceQuestion.js "> </ script >
33+ < script src ="js/DevAvatar.js "> </ script >
34+ < script src ="js/DevGroupAvatar.js "> </ script >
35+ < script src ="js/EditorFileTabs.js "> </ script >
36+ < script src ="js/EditorView.js "> </ script >
37+ < script src ="js/FileSystemNavigator.js "> </ script >
38+ < script src ="js/ImageGallery.js "> </ script >
39+ < script src ="js/MultiLineTextInput.js "> </ script >
40+ < script src ="js/OptionsMenu.js "> </ script >
41+ < script src ="js/PlaybackControls.js "> </ script >
42+ < script src ="js/PlaybackNavigator.js "> </ script >
43+ < script src ="js/PlaybackSlider.js "> </ script >
44+ < script src ="js/QuestionAnswerView.js "> </ script >
45+ < script src ="js/SearchBar.js "> </ script >
46+ < script src ="js/ShowHideComponent.js "> </ script >
47+ < script src ="js/SurroundingLinesSelector.js "> </ script >
48+ < script src ="js/TagView.js "> </ script >
49+ < script src ="js/TitleBar.js "> </ script >
50+ < script src ="js/VerticalMediaContainer.js "> </ script >
51+ <!-- playback data -->
52+ < script src ="js/loadPlayback.js "> </ script >
53+ < style >
54+ html , body {
55+ margin : 0 ;
56+ height : 100% ;
57+ font-family : -apple-system, BlinkMacSystemFont, 'Segoe UI' , 'Roboto' , 'Oxygen' , 'Ubuntu' , 'Cantarell' , 'Fira Sans' , 'Droid Sans' , 'Helvetica Neue' , sans-serif;
58+ background-color : rgb (41 , 41 , 41 );
59+ color : lightgray;
60+ -webkit-font-smoothing : antialiased;
61+ -moz-osx-font-smoothing : grayscale;
62+ }
63+ </ style >
64+ </ head >
65+ < body >
66+ < script >
67+ //create an alias for an Ace type
68+ const AceRange = ace . require ( 'ace/range' ) . Range ;
69+
70+ window . addEventListener ( "DOMContentLoaded" , ( event ) => {
71+ //get the playback data and pass it to the app
72+ const playbackData = { } ;
73+ loadPlaybackData ( playbackData ) ;
74+
75+ //look to see if there is a mode in the querystring
76+ const urlSearchParams = new URLSearchParams ( window . location . search ) ;
77+ const mode = urlSearchParams . get ( 'mode' ) ;
78+
79+ //check if this is a small screen or an explicit request for blog mode
80+ let initialMode = 'code' ;
81+ if ( window . innerWidth < 800 || ( mode && mode === 'blog' ) ) {
82+ initialMode = 'blog' ;
83+ }
84+ const app = new App ( playbackData , initialMode ) ;
85+ document . body . appendChild ( app ) ;
86+ } ) ;
87+ </ script >
88+ </ body >
89+ </ html >
0 commit comments