Skip to content

Commit 1ad0ece

Browse files
tbrkollartbrkollar
authored
Update the main page (#863)
1 parent 268ac00 commit 1ad0ece

File tree

7 files changed

+142
-56
lines changed

7 files changed

+142
-56
lines changed

‎src/components/InitialContent.vue‎

Lines changed: 116 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -16,57 +16,128 @@ limitations under the License.
1616

1717
<template>
1818
<div>
19-
<h3 id="zcl-advanced-platform">ZCL Advanced Platform</h3>
20-
<p><img src="https://github.com/project-chip/zap/workflows/Generation%20and%20back-end%20tests/badge.svg" alt="Generation and back-end tests">
21-
<img src="https://github.com/project-chip/zap/workflows/Cypress%20UI%20tests/badge.svg" alt="Cypress UI tests">
22-
<img src="https://github.com/project-chip/zap/workflows/SonarCloud/badge.svg" alt="SonarCloud scan">
23-
<img src="https://github.com/project-chip/zap/workflows/Build%20&amp;%20Release/badge.svg" alt="Build and release"></p>
24-
<h4 id="what-is-zap-">What is ZAP?</h4>
25-
<p>ZAP is a generic generation engine and user interface for applications and libraries based on <a href="https://zigbeealliance.org/developer_resources/zigbee-cluster-library/">Zigbee Cluster Library</a>, the specification developed by the <a href="https://zigbeealliance.org/">Zigbee Alliance</a>.</p>
26-
<p>ZAP allows you to perform the following:</p>
27-
<ul>
28-
<li>perform SDK-specific customized generation of all global artifacts (constants, types, IDs, etc) based on the ZCL specification</li>
29-
<li>provide UI for the end-user to select specific application configuration (clusters, attributes, commands, etc.)</li>
30-
<li>perform SDK-specific customized generation of all user selected configuration artifacts (application configuration, endpoint configuration, etc) based on ZCL specification and customer-provided application configuration.</li>
31-
</ul>
32-
<p>ZAP is a generic templating engine. Examples are provided for how to generate artifacts for the C language environment, but one could easily add new templates for other language environments, such as C++, java, node.js, python or any other.</p>
33-
<h2 id="quick-instructions">Quick instructions</h2>
34-
<p>This is a node.js application. In order to run it, you need to have <a href="https://www.npmjs.com/">npm</a> installed. The best way is to simply download latest install of <a href="https://nodejs.org/en/download/">node</a> and you will get npm. If you have an older version of node installed on your workstation, it may give you trouble, particularly if it&#39;s very old. So make sure you have decently recent (v12.x or v14.x should work as of 2021) version of node available. Run <code>node --version</code> to check what version is picked up.</p>
35-
<p>Once you have a desired version of node, you can run:</p>
36-
<pre><code><span class="hljs-built_in">npm</span> ci
37-
</code></pre><p>which will download install all the project dependencies. It is not uncommon to run into native library compilation problems at this point.
38-
There are various <code>src-script/install-*</code> scripts for different platforms. Please refer to <a href="docs/faq.md">FAQ</a> for additional details of which script to run on different platforms and then rerun <code>npm ci</code>.</p>
39-
<p>Then run:</p>
40-
<pre><code>npm <span class="hljs-keyword">run</span><span class="bash"> zap</span>
41-
</code></pre><p>Refer to <a href="docs/instructions.md">more detailed instructions</a> for more details.</p>
42-
<h2 id="license">License</h2>
43-
<p>This software is licensed under <a href="LICENSE.txt">Apache 2.0 license</a>.</p>
44-
<h2 id="detailed-documentation">Detailed Documentation</h2>
45-
<ul>
46-
<li><a href="docs/design.md">Design</a></li>
47-
<li><a href="docs/template-tutorial.md">Template tutorial</a></li>
48-
<li><a href="docs/sdk-integration.md">SDK integration guideline</a></li>
49-
<li><a href="docs/access.md">Access control features</a></li>
50-
<li><a href="docs/custom-zcl.md">Custom ZCL entities design</a></li>
51-
<li><a href="docs/instructions.md">Instructions</a></li>
52-
<li><a href="docs/coding-standard.md">Coding standard</a></li>
53-
<li><a href="docs/api.md">API</a></li>
54-
<li><a href="docs/releasenotes.md">Release notes</a></li>
55-
<li><a href="docs/faq.md">FAQ</a></li>
56-
</ul>
57-
</div>
19+
<div v-if="uiTheme === 'matter'">
20+
<h3 id="zcl-advanced-platform">Welcome to Matter</h3>
21+
</div>
22+
<div v-else-if="uiTheme === 'zigbee'">
23+
<h3 id="zcl-advanced-platform">Welcome to Zigbee</h3>
24+
</div>
25+
<div v-else>
26+
<h3 id="zcl-advanced-platform">Oops, Something went wrong.</h3>
27+
<p>
28+
<img
29+
src="https://github.com/project-chip/zap/workflows/Generation%20and%20back-end%20tests/badge.svg"
30+
alt="Generation and back-end tests"
31+
/>
32+
<img
33+
src="https://github.com/project-chip/zap/workflows/Cypress%20UI%20tests/badge.svg"
34+
alt="Cypress UI tests"
35+
/>
36+
<img
37+
src="https://github.com/project-chip/zap/workflows/SonarCloud/badge.svg"
38+
alt="SonarCloud scan"
39+
/>
40+
<img
41+
src="https://github.com/project-chip/zap/workflows/Build%20&amp;%20Release/badge.svg"
42+
alt="Build and release"
43+
/>
44+
</p>
45+
<h4 id="what-is-zap-">What is ZAP?</h4>
46+
<p>
47+
ZAP is a generic generation engine and user interface for applications
48+
and libraries based on
49+
<a
50+
href="https://zigbeealliance.org/developer_resources/zigbee-cluster-library/"
51+
>Zigbee Cluster Library</a
52+
>, the specification developed by the
53+
<a href="https://zigbeealliance.org/">Zigbee Alliance</a>.
54+
</p>
55+
<p>ZAP allows you to perform the following:</p>
56+
<ul>
57+
<li>
58+
perform SDK-specific customized generation of all global artifacts
59+
(constants, types, IDs, etc) based on the ZCL specification
60+
</li>
61+
<li>
62+
provide UI for the end-user to select specific application
63+
configuration (clusters, attributes, commands, etc.)
64+
</li>
65+
<li>
66+
perform SDK-specific customized generation of all user selected
67+
configuration artifacts (application configuration, endpoint
68+
configuration, etc) based on ZCL specification and customer-provided
69+
application configuration.
70+
</li>
71+
</ul>
72+
<p>
73+
ZAP is a generic templating engine. Examples are provided for how to
74+
generate artifacts for the C language environment, but one could easily
75+
add new templates for other language environments, such as C++, java,
76+
node.js, python or any other.
77+
</p>
78+
<h2 id="quick-instructions">Quick instructions</h2>
79+
<p>
80+
This is a node.js application. In order to run it, you need to have
81+
<a href="https://www.npmjs.com/">npm</a> installed. The best way is to
82+
simply download latest install of
83+
<a href="https://nodejs.org/en/download/">node</a> and you will get npm.
84+
If you have an older version of node installed on your workstation, it
85+
may give you trouble, particularly if it&#39;s very old. So make sure
86+
you have decently recent (v12.x or v14.x should work as of 2021) version
87+
of node available. Run <code>node --version</code> to check what version
88+
is picked up.
89+
</p>
90+
<p>Once you have a desired version of node, you can run:</p>
91+
<pre><code><span class="hljs-built_in">npm</span> ci
92+
</code></pre>
93+
<p>
94+
which will download install all the project dependencies. It is not
95+
uncommon to run into native library compilation problems at this point.
96+
There are various <code>src-script/install-*</code> scripts for
97+
different platforms. Please refer to <a href="docs/faq.md">FAQ</a> for
98+
additional details of which script to run on different platforms and
99+
then rerun <code>npm ci</code>.
100+
</p>
101+
<p>Then run:</p>
102+
<pre><code>npm <span class="hljs-keyword">run</span><span class="bash"> zap</span>
103+
</code></pre>
104+
<p>
105+
Refer to
106+
<a href="docs/instructions.md">more detailed instructions</a> for more
107+
details.
108+
</p>
109+
<h2 id="license">License</h2>
110+
<p>
111+
This software is licensed under
112+
<a href="LICENSE.txt">Apache 2.0 license</a>.
113+
</p>
114+
<h2 id="detailed-documentation">Detailed Documentation</h2>
115+
<ul>
116+
<li><a href="docs/design.md">Design</a></li>
117+
<li><a href="docs/template-tutorial.md">Template tutorial</a></li>
118+
<li><a href="docs/sdk-integration.md">SDK integration guideline</a></li>
119+
<li><a href="docs/access.md">Access control features</a></li>
120+
<li><a href="docs/custom-zcl.md">Custom ZCL entities design</a></li>
121+
<li><a href="docs/instructions.md">Instructions</a></li>
122+
<li><a href="docs/coding-standard.md">Coding standard</a></li>
123+
<li><a href="docs/api.md">API</a></li>
124+
<li><a href="docs/releasenotes.md">Release notes</a></li>
125+
<li><a href="docs/faq.md">FAQ</a></li>
126+
</ul>
127+
</div>
128+
</div>
58129
</template>
59130
<script>
60131
//imports
61132
62133
export default {
63134
name: 'InitialContent',
64-
65-
mounted() {},
66-
watch: {},
67-
computed: {},
68-
methods: {},
69-
components: {},
135+
props: {
136+
uiTheme: {
137+
type: String,
138+
default: '',
139+
},
140+
},
70141
}
71142
</script>
72143

‎src/layouts/ZclConfiguratorLayout.vue‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -112,7 +112,10 @@ limitations under the License.
112112
</q-drawer>
113113
<q-page-container>
114114
<q-scroll-area style="height: 75vh; max-width: 200vh">
115-
<initial-content v-if="isSelectedEndpoint" />
115+
<initial-content
116+
v-if="isSelectedEndpoint"
117+
:ui-theme="uiThemeCategory"
118+
/>
116119
<zcl-cluster-manager />
117120
</q-scroll-area>
118121
</q-page-container>
@@ -234,6 +237,11 @@ export default {
234237
this.$store.dispatch('zap/setLeftDrawerState', newLeftDrawerOpenState)
235238
},
236239
},
240+
uiThemeCategory: {
241+
get() {
242+
return this.$store.state.zap.selectedZapConfig?.zclProperties.category
243+
},
244+
},
237245
miniState: {
238246
get() {
239247
return this.$store.state.zap.miniState

‎src/pages/ZapConfig.vue‎

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -293,22 +293,32 @@ export default {
293293
}
294294
this.$serverPost(restApi.uri.initializeSession, data).then(
295295
(result) => {
296-
this.$store.commit('zap/selectZapConfig', true)
296+
this.$store.commit('zap/selectZapConfig', {
297+
zclProperties: this.selectedZclPropertiesData,
298+
genTemplate: this.selectedZclGenData,
299+
})
297300
}
298301
)
299302
}
300303
} else if (this.customConfig === 'passthrough') {
301304
let data = {
302305
newConfiguration: true,
303306
}
307+
304308
this.$serverPost(restApi.uri.initializeSession, data).then((result) => {
305-
this.$store.commit('zap/selectZapConfig', true)
309+
this.$store.commit('zap/selectZapConfig', {
310+
zclProperties: this.selectedZclPropertiesData,
311+
genTemplate: this.selectedZclGenData,
312+
})
306313
})
307314
} else {
308315
this.$serverPost(restApi.uri.reloadSession, {
309316
sessionId: this.selectedZclSessionData.id,
310317
}).then((result) => {
311-
this.$store.commit('zap/selectZapConfig', true)
318+
this.$store.commit('zap/selectZapConfig', {
319+
sessionId: this.selectedZclSessionData.id,
320+
zclProperties: this.selectedZclSessionData.zclProperty,
321+
})
312322
})
313323
}
314324
},
@@ -354,5 +364,3 @@ export default {
354364
},
355365
}
356366
</script>
357-
358-
<style scoped></style>

‎src/pages/ZclSettings.vue‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,6 @@ limitations under the License.
2828
<script>
2929
export default {
3030
name: 'ZclSettings',
31-
components: {},
3231
methods: {
3332
fileUpload(test) {
3433
console.log(test)

‎src/store/zap/mutations.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -526,7 +526,7 @@ export function loadZclClusterToUcComponentDependencyMap(state, map) {
526526
}
527527

528528
export function selectZapConfig(state, val) {
529-
state.isZapConfigSelected = val
529+
state.selectedZapConfig = val
530530
}
531531

532532
export function setAllEndpointsData(state, value) {

‎src/store/zap/state.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ const restApi = require('../../../src-shared/rest-api.js')
1818

1919
export default function () {
2020
return {
21-
isZapConfigSelected: false,
21+
selectedZapConfig: null,
2222
isProfileIdShown: null,
2323
clusterDataForTutorial: [],
2424
isTutorialRunning: false,

‎src/util/common-mixin.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,8 @@ export default {
2626
computed: {
2727
isZapConfigSelected: {
2828
get() {
29-
return this.$store.state.zap.isZapConfigSelected
30-
}
29+
return this.$store.state.zap.selectedZapConfig !== null
30+
},
3131
},
3232
selectedEndpointTypeId: {
3333
get() {

0 commit comments

Comments
 (0)