mirror of
https://github.com/element-hq/element-web.git
synced 2024-12-05 05:38:41 +03:00
Initial app icon tiles
This commit is contained in:
parent
e8353edb06
commit
f6f660fa9a
5 changed files with 96 additions and 14 deletions
28
src/components/structures/AppWidget.js
Normal file
28
src/components/structures/AppWidget.js
Normal file
|
@ -0,0 +1,28 @@
|
|||
/*
|
||||
Copyright 2015, 2016 OpenMarket Ltd
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
*/
|
||||
import ModularWidgets from 'ModularWidgets';
|
||||
|
||||
class AppWidget {
|
||||
constructor(type, url, options) {
|
||||
if(!ModularWidgets.widgetTypes.includes(type) || url === "") {
|
||||
return null;
|
||||
}
|
||||
this.type = type;
|
||||
this.url = url;
|
||||
this.options = options || {};
|
||||
}
|
||||
}
|
||||
export default AppWidget;
|
13
src/components/structures/ModularWidgets.js
Normal file
13
src/components/structures/ModularWidgets.js
Normal file
|
@ -0,0 +1,13 @@
|
|||
class ModularWidgets {
|
||||
static widgetTypes = [
|
||||
{
|
||||
type: 'etherpad',
|
||||
icon: '',
|
||||
},
|
||||
{
|
||||
type: 'grafana',
|
||||
icon: '',
|
||||
},
|
||||
];
|
||||
}
|
||||
export default ModularWidgets;
|
|
@ -53,22 +53,22 @@ export default React.createClass({
|
|||
return (
|
||||
<BaseDialog className="mx_AddAppDialog"
|
||||
onFinished={this.props.onFinished}
|
||||
title="App URL"
|
||||
title="Add an app Widget"
|
||||
>
|
||||
<div className="mx_Dialog_content">
|
||||
Please enter the URL of the app / widget to add.
|
||||
</div>
|
||||
|
||||
{/* <hr/>
|
||||
<form onSubmit={this.onFormSubmit}>
|
||||
<div className="mx_Dialog_content">
|
||||
<div>Or enter the URL of the widget to add.</div>
|
||||
<input type="text" ref="input_value" value={this.state.value}
|
||||
autoFocus={true} onChange={this.onValueChange} size="30"
|
||||
className="mx_SetAppURLDialog_input"
|
||||
/>
|
||||
</div>
|
||||
<div className="mx_Dialog_buttons">
|
||||
<input className="mx_Dialog_primary" type="submit" value="Set" />
|
||||
</div>
|
||||
</form>
|
||||
<div className="mx_Dialog_buttons">
|
||||
<input className="mx_Dialog_primary" type="submit" value="Add" />
|
||||
</div> */}
|
||||
</div>
|
||||
</BaseDialog>
|
||||
);
|
||||
},
|
||||
|
|
41
src/components/views/elements/AppIconTile.js
Normal file
41
src/components/views/elements/AppIconTile.js
Normal file
|
@ -0,0 +1,41 @@
|
|||
/*
|
||||
Copyright 2015, 2016 OpenMarket Ltd
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
import React from 'react';
|
||||
|
||||
class AppIconTile extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="mx_AppIconTile">
|
||||
<img src={this.props.icon} alt={this.props.name} className="mx_AppIconTile_image"/>
|
||||
<div className="mx_AppIconTile_content">
|
||||
<h4><b>{this.props.name}</b></h4>
|
||||
<p>{this.props.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
AppIconTile.propTypes = {
|
||||
type: React.PropTypes.string.isRequired,
|
||||
icon: React.PropTypes.string.isRequired,
|
||||
name: React.PropTypes.string.isRequired,
|
||||
description: React.PropTypes.string.isRequired,
|
||||
};
|
||||
|
||||
export default AppIconTile;
|
|
@ -32,7 +32,7 @@ const roomWidgetConfig = {
|
|||
},
|
||||
{
|
||||
id: "recipie",
|
||||
url: "http://10.9.64.88:8000/recepie.html",
|
||||
url: "http://10.9.64.55:8000/recepie.html",
|
||||
name: "Ingredients - Boeuf Bourguignon",
|
||||
},
|
||||
],
|
||||
|
@ -40,7 +40,7 @@ const roomWidgetConfig = {
|
|||
'!JWeMRscvtWqfNuzmSf:matrix.org': [
|
||||
{
|
||||
id: "grafana",
|
||||
url: "http://10.9.64.88:8000/grafana.html",
|
||||
url: "http://10.9.64.55:8000/grafana.html",
|
||||
name: "Monitoring our Single-Point-Of-Failure DB",
|
||||
},
|
||||
],
|
||||
|
@ -53,7 +53,7 @@ const roomWidgetConfig = {
|
|||
},
|
||||
{
|
||||
id: "thermometer",
|
||||
url: "http://10.9.64.88:8000/index.html",
|
||||
url: "http://10.9.64.55:8000/index.html",
|
||||
name: "Tip Me!!! -- Send me cash $$$",
|
||||
},
|
||||
],
|
||||
|
@ -66,7 +66,7 @@ const roomWidgetConfig = {
|
|||
},
|
||||
{
|
||||
id: "thermometer",
|
||||
url: "http://10.9.64.88:8000/index.html",
|
||||
url: "http://10.9.64.55:8000/index.html",
|
||||
name: "Tip Me!!! -- Send me cash $$$",
|
||||
},
|
||||
],
|
||||
|
@ -74,7 +74,7 @@ const roomWidgetConfig = {
|
|||
'!BLQjREzUgbtIsgrvRn:matrix.org': [
|
||||
{
|
||||
id: "etherpad",
|
||||
url: "http://10.9.64.88:8000/etherpad.html",
|
||||
url: "http://10.9.64.55:8000/etherpad.html",
|
||||
name: "Etherpad",
|
||||
},
|
||||
],
|
||||
|
|
Loading…
Reference in a new issue