Skip to Content

Wiki source code of 01 Get Started

Last modified by Joe on 2024/06/07 15:09
Show last authors
1 {{velocity output="false"}}
2 #set ($docextras = [])
3
4 #set ($videoCards = [ {
5 'title': $services.localization.render('1.Software Download&Install'),
6 'topics': [
7 $services.localization.render('This video is showing you how to download and install the PIStudio.')
8 ],
9 'url': 'https://www.youtube.com/embed/7FNI4uuVL4c',
10 'duration': '3 min'
11 }, {
12 'title': $services.localization.render('2.Create New Project'),
13 'topics': [
14 $services.localization.render('This video is showing you how to create new project in the PIStudio.')
15 ],
16 'url': 'https://www.youtube.com/embed/0FpmDZe_8U8',
17 'duration': '2 min'
18 }, {
19 'title': $services.localization.render('3.Tool: Simulator'),
20 'topics': [
21 $services.localization.render('This video is showing you how to use the simulator in PIStudio.'),
22 $services.localization.render('There are mainly two types for simulator: online and offline.')
23 ],
24 'url': 'https://www.youtube.com/embed/CFABfWN_470',
25 'duration': '4 min'
26 }, {
27 'title': $services.localization.render('4.Download Project'),
28 'topics': [
29 $services.localization.render('This video is showing you how to download project into PI HMI')
30 ],
31 'url': 'https://www.youtube.com/embed/UXKeMGPsTag',
32 'duration': '7 min'
33 }, {
34 'title': $services.localization.render('5.Tool: Decompile'),
35 'topics': [
36 $services.localization.render('Decompile tool is for users can upload the project file from PI HMI.')
37 ],
38 'url': 'https://www.youtube.com/embed/slaVqLKpQno',
39 'duration': '2 min'
40 }, {
41 'title': $services.localization.render('6.ig HMI setting in V-NET Client'),
42 'topics': [
43 $services.localization.render('How to access the VNET platform for ig series HMI')
44 ],
45 'url': 'https://www.youtube.com/embed/iWmjyYNlq5c',
46 'duration': '4 min'
47 }, {
48 'title': $services.localization.render('7.LAN Monitoring'),
49 'topics': [
50 $services.localization.render('How to monitoring HMI screen on LAN network')
51 ],
52 'url': 'https://www.youtube.com/embed/2yzIPcqIeJ4',
53 'duration': '4 min'
54 }, {
55 'title': $services.localization.render('8.PISuite Toolkit'),
56 'topics': [
57 $services.localization.render('New PIStudio version already integrated all tools into PIStuite. So this video is an overview of all tools from PIStudio')
58 ],
59 'url': 'https://www.youtube.com/embed/WKRoxKOfifg',
60 'duration': '8 min'
61 }])
62
63 #macro (helpVideoCard $data)
64 <div class="videoCard">
65 <iframe src="$data.url" allowfullscreen title="$escapetool.xml($data.title)" role="presentation" ></iframe>
66 <div class="videoCard-body">
67 <div class="videoCard-title">
68 $escapetool.xml($data.title)
69 </div>
70 <ul>
71 #foreach ($topic in $data.topics)
72 <li>$topic</li>
73 #end
74 </ul>
75 </div>
76 <div class="videoCard-footer">
77 $services.icon.renderHTML('play')
78 <a href="$data.url">$services.localization.render('help.videos.watch')</a>
79 <span class="videoCard-duration">
80 $escapetool.xml($data.duration)
81 </span>
82 </div>
83 </div>
84 #end
85 {{/velocity}}
86
87 {{velocity}}
88 {{html clean="false"}}
89 #set ($discard = $xwiki.ssx.use('Help.Videos.WebHome'))
90 <div class="row">
91 #foreach ($card in $videoCards)
92 ## See http://getbootstrap.com/css/#grid-responsive-resets .
93 #if ($foreach.index > 0 && $foreach.index % 2 == 0)
94 <div class="clearfix visible-sm-block "></div>
95 #end
96 #if ($foreach.index > 0 && $foreach.index % 3 == 0)
97 <div class="clearfix visible-md-block visible-lg-block"></div>
98 #end
99 <div class="col-xs-12 col-sm-6 col-md-4">
100 #helpVideoCard($card)
101 </div>
102 #end
103 </div>
104 {{/html}}
105
106 [[$services.localization.render('help.videos.more')>>https://www.youtube.com/playlist?list=PLhe7KI1rstRQeLSHxcTozZ0HJSk-mIYzt]]
107 {{/velocity}}