5 <meta http-equiv="X-UA-Compatible" content="IE=edge">
6 <meta name="viewport" content="width=device-width, initial-scale=1.0">
8 <title>Tizen Image Configurator</title>
10 <link rel="shortcut icon" href="/image/tizen.ico">
11 <link rel="stylesheet" href="/lib/bootstrap/css/bootstrap.css">
12 <link rel="stylesheet" href="/lib/bootstrap-treeview/bootstrap-treeview.min.css">
13 <link rel="stylesheet" href="/lib/components-font-awesome/css/font-awesome.min.css">
14 <link rel="stylesheet" href="/css/style.css">
15 <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
16 <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
18 <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
19 <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
23 <body data-spy="scroll" data-target=".navbar-fixed-top">
25 <nav class="navbar navbar-inverse navbar-fixed-top">
26 <div class="container">
27 <div class="navbar-header">
28 <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
29 <span class="sr-only">Toggle navigation</span>
30 <span class="icon-bar"></span>
31 <span class="icon-bar"></span>
32 <span class="icon-bar"></span>
34 <a class="navbar-brand tic-page-scroll" href="#tic-package-section"><img id="tic-brand-img" src="image/tizen_32.png"/> Tizen Image Configurator</a>
37 <!-- Collect the nav links, forms, and other content for toggling -->
38 <div id="navbar" class="collapse navbar-collapse">
39 <ul class="nav navbar-nav">
41 <a class="tic-page-scroll" href="#tic-package-section">Package</a>
44 <a class="tic-page-scroll"href="#tic-image-section">Image</a>
47 <a class="tic-page-scroll"href="#tic-settings-section">Settings</a>
50 </div><!--/.nav-collapse -->
51 </div><!-- /.container -->
55 <!-- Package Section -->
56 <section id="tic-package-section">
57 <div class="container">
59 <!-- Package Left Column -->
60 <div class="col-md-6">
61 <div class="panel panel-primary">
62 <div class="panel-body">
63 <!-- Profile Toolbar -->
64 <div class="btn-group btn-group-justified">
65 <div class="btn-group">
66 <button type="button" class="btn btn-primary">All</button>
68 <div class="btn-group">
69 <button type="button" class="btn btn-primary">Common</button>
71 <div class="btn-group">
72 <button type="button" class="btn btn-primary">Mobile</button>
74 <div class="btn-group">
75 <button type="button" class="btn btn-primary">Wearable</button>
77 <div class="btn-group">
78 <button type="button" class="btn btn-primary">TV</button>
81 <!-- Package Tree Toolbar -->
82 <div id="tic-package-left-col-tree-toolbar">
83 <div class="input-group">
84 <input type="text" class="form-control" placeholder="Start typing to filter list of packages" id="tic-package-left-col-tree-toolbar-filter"/>
85 <div class="input-group-btn">
86 <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
87 <span class="glyphicon glyphicon-menu-hamburger"></span>
89 <ul class="dropdown-menu dropdown-menu-right">
90 <li><a href="#">Action</a></li>
91 <li><a href="#">Another action</a></li>
92 <li><a href="#">Something else here</a></li>
93 <li role="separator" class="divider"></li>
94 <li><a href="#">Separated link</a></li>
97 <button type="button" class="btn btn-default" id="tic-package-left-col-tree-toolbar-collapse-all">
98 <span class="glyphicon glyphicon-minus" aria-hidden="true"/>
100 <button type="button" class="btn btn-default" id="tic-package-left-col-tree-toolbar-expand-all">
101 <span class="glyphicon glyphicon-plus" aria-hidden="true"/>
106 <!-- Package Tree -->
107 <div id="tic-package-left-col-tree">
111 </div><!-- /End Package Left Column -->
113 <!-- Package Right Column -->
114 <div class="col-md-6">
115 <!-- Package Information -->
116 <div class="panel panel-primary">
117 <div class="panel-heading">Package Information</div>
118 <div class="panel-body">
119 <table id="tic-package-info-table" class="table table-condensed">
121 <tr><td>Name</td><td id="tic-package-info-text"></td></tr>
122 <tr><td>Version</td><td id="tic-package-info-version"></td></tr>
123 <tr><td>Architecture</td><td id="tic-package-info-arch"></td></tr>
124 <tr><td>Size</td><td id="tic-package-info-size"></td></tr>
125 <tr><td>Installed Size</td><td id="tic-package-info-installed-size"></td></tr>
126 <tr><td>Summary</td><td id="tic-package-info-summary"></td></tr>
127 <tr><td>Description</td><td id="tic-package-info-description"></td></tr>
128 <tr><td>Dependency</td><td id="tic-package-info-dependency"></td></tr>
133 <!-- Package Summary -->
134 <div class="panel panel-primary">
135 <div class="panel-heading">Summary</div>
136 <div class="panel-body">
137 <table id="tic-package-summary" class="table table-condensed">
139 <tr><td>Image Size</td><td id="tic-package-image-size"></td></tr>
140 <tr><td>Image Installed Size</td><td id="tic-package-image-installed-size"></td></tr>
141 <tr><td>Number of Packages</td><td id="tic-package-count"></td></tr>
142 <tr><td>Package List</td><td id="tic-package-list"></td></tr>
146 <div class="panel-footer">
147 <a type="button" id="tic-package-create" class="btn btn-primary disabled" href="#tic-image-section">Create Image</a>
150 </div><!-- /End Package Right Column -->
152 </div><!-- /.container -->
156 <!-- Image Section -->
157 <section id="tic-image-section">
158 <div class="container">
160 <!-- Image Column -->
161 <div class="col-md-6">
162 <div class="panel panel-primary">
163 <div class="panel-heading">Image</div>
164 <div class="panel-body">
165 <table id="tic-image-summary" class="table table-condensed">
167 <tr><td>Image Size</td><td id="tic-image-image-size"></td></tr>
168 <tr><td>Image Installed Size</td><td id="tic-image-image-installed-size"></td></tr>
169 <tr><td>Number of Packages</td><td id="tic-image-package-count"></td></tr>
170 <tr><td>Package List</td><td id="tic-image-package-list"></td></tr>
174 <div class="panel-footer">
175 <button type="button" id="tic-image-create" class="btn btn-primary">Create Image</button>
178 </div><!-- /End Image Column -->
180 <!-- Image List Column -->
181 <div class="col-md-6">
182 <div class="panel panel-primary">
183 <div class="panel-heading">Image List</div>
184 <div class="panel-body">
185 <h1>Image list and download</h1>
186 <table id="tic-image-list"></table>
189 </div><!-- /End Image List Column -->
191 </div><!-- /.container -->
194 <!-- Settings Section -->
195 <section id="tic-settings-section">
196 <div class="container">
198 <!-- Settings Column -->
199 <div class="col-md-12">
200 <div class="panel panel-primary">
201 <div class="panel-body">
202 <!-- Settings Toolbar -->
203 <div id="tic-repository-toolbar">
204 <button type="button" id="tic-repository-recipe-import" class="btn btn-default"><i class="fa fa-download"></i> Recipe Import</button>
205 <button type="button" id="tic-repository-recipe-export" class="btn btn-default"><i class="fa fa-upload"></i> Recipe Export</button>
208 <!-- Repository Column -->
209 <div class="panel panel-primary">
210 <div class="panel-heading">Repository</div>
211 <div class="panel-body">
212 <div class="input-group">
213 <input id="tic-repository-input" type="text" class="form-control" placeholder="Enter repository URL">
214 <span class="input-group-btn">
215 <button type="button" id="tic-repository-add"class="btn btn-default">Add Repository</button>
218 <ol id="tic-repository-list" class="list-group"></ol>
223 <div class="panel-footer">
224 <a id="tic-repository-apply" type="button" class="btn btn-primary" href="#tic-package-section">Apply</a>
227 </div><!-- /End Settings Column -->
229 </div><!-- /.container -->
233 <!-- Loading Dialog -->
234 <div class="modal fade" id="tic-load-dialog" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static">
235 <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
236 </div><!-- /End Loading Dialog -->
238 <!-- Alert Dialog -->
239 <div class="modal fade" id="tic-alert-dialog" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static">
240 <div class="modal-dialog modal-sm">
241 <div class="modal-content">
242 <div class="modal-body">
243 <p id="tic-alert-content"></p>
245 <div class="modal-footer">
246 <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
250 </div>><!-- /End Alert Dialog -->
253 <!-- library loading -->
254 <script src="/socket.io/socket.io.js"></script>
255 <script src="/lib/jquery/jquery.js"></script>
256 <script src="/lib/jquery-sortable/jquery-sortable.js"></script>
257 <script src="/lib/bootstrap/js/bootstrap.js"></script>
258 <script src="/lib/bootstrap-treeview/bootstrap-treeview.min.js"></script>
259 <script src="/lib/lodash/lodash.js"></script>
260 <script src="/js/config.js"></script>
261 <script src="/lib/requirejs/require.js" data-main="js/main"></script>