platypush/platypush-home
2
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Finalized landing page content

Browse source
This commit is contained in:
Fabio Manganiello 2021-02-05 23:12:58 +01:00
parent 57e269a85f
commit ce50ab1fd9
10 changed files with 266 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
www/css/application.css
View file

@ -114,6 +114,18 @@ main {
line-height: 1.5em;
color: rgb(75, 75, 75);
text-rendering: optimizelegibility;
margin-top: .2em;
}
main a {
color: initial;
opacity: .5;
text-decoration: none;
border-bottom: 1px dotted #444;
}
main a:hover {
opacity: .25;
}
main section {
@ -168,11 +180,20 @@ main section img {
font-family: 'Fira Code', monospace;
padding: 1em;
border-radius: .5em;
white-space: pre;
}
.code .string {
color: #e47;
}
.code .comment {
color: #999;
}
.code .keyword {
color: #3a5;
}
/* *********** */
/* Mobile menu */
/* *********** */

BIN
www/img/blog.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 533 KiB

BIN
www/img/dashboard.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 727 KiB

BIN
www/img/extension.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 61 KiB

BIN
www/img/grafana.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 464 KiB

BIN
www/img/media-screenshot.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 146 KiB

BIN
www/img/ml.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 59 KiB

BIN
www/img/telegram-bot.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 128 KiB

BIN
www/img/zwave-screenshot.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 71 KiB

247
www/index.html
View file

@ -112,8 +112,251 @@
</div>
<div class="right">
<div class="code">
pip install <span class="string">'platypush[http,mqtt]'</span>
<div class="code">pip install <span class="string">'platypush[http,mqtt]'</span></div>
</div>
</section>
<section>
<div class="left">
<div class="code"><span class="comment"># Enable the Z-Wave monitor</span>
<span class="keyword">backend.zwave</span>:
<span class="keyword">- device</span>: /dev/ttyUSB0
<span class="comment"># Enable the Z-Wave actions plugin</span>
<span class="keyword">zwave</span>:
<span class="keyword">- enabled</span>: <span class="string">True</span>
<span class="comment"># Enable the Philips Hue plugin</span>
<span class="keyword">light.hue</span>:
<span class="comment"># Enable the Hue lights plugin</span>
<span class="keyword">- enabled</span>: <span class="string">True</span>
</div>
</div>
<div class="right">
<div class="title">
Easily configure your integrations.
</div>
Configuring an integration is as simple as defining its attributes in
<tt>~/.config/platypush/config.yaml</tt>. The attributes of each integration are the same as their
documented constructors, and an
<a href="https://git.platypush.tech/platypush/platypush/-/blob/master/examples/conf/config.yaml">example configuration</a>
is also provided.
</div>
</section>
<section>
<div class="left">
<div class="title">
Create hooks that connect events to actions.
</div>
<p>
It's very easy to create pieces of logic that run some custom actions when an event is triggered.
Just drop a Python script into <tt>~/.config/platypush/scripts</tt>, or create a YAML snippet into
your <tt>config.yaml</tt>.
</p>
<p>The interface of the available events is also provided on the documentation, as well as the
methods exposed by each plugin and its parameters.</p>
</div>
<div class="right">
<div class="code"><span class="keyword">from</span> platypush.event.hook <span class="keyword">import</span> hook
<span class="keyword">from</span> platypush.utils <span class="keyword">import</span> run
<span class="keyword">from </span>platypush.message.event.zwave <span class="keyword">ZwaveValueChangedEvent</span>
<span class="keyword">@hook</span>(ZwaveValueChangedEvent)
<span class="keyword">def</span> on_zwave_value(event, **context):
<span class="keyword">if</span> event.value['label'] == <span class="string">'Motion Sensor'</span>:
<span class="comment"># Turn on the lights when motion is detected</span>
<span class="keyword">if</span> event.value['data'] is <span class="string">True</span>:
run(<span class="string">'light.hue.on'</span>)
<span class="comment"># Turn off the lights when motion is not detected</span>
<span class="keyword">elif</span> event.value['data'] is <span class="string">False</span>:
run(<span class="string">'light.hue.off'</span>)
</div>
</div>
</section>
<section>
<div class="left">
<img src="img/zwave-screenshot.png" alt="Web panel screenshot">
</div>
<div class="right">
<div class="title">
Easily control all of your devices and integrations from a single interface.
</div>
<div class="content">
<tt>backend.http</tt> also provides a web panel that will allow you to easily control all of your
integrations from a single place, on top of exposing a simple JSON-RPC API that allows you to
control your integrations from any place and any script.
</div>
</div>
</section>
<section>
<div class="left">
<div class="title">
Get inspired with periodic blog articles.
</div>
<div class="content">
The <a href="https://blog.platypush.tech">blog</a> is a useful resource with many articles on how to
set up IoT device, how to create your own and how to use Platypush to glue everything together -
from voice assistants, to calendars, to robots, to media centers, and so on.
</div>
</div>
<div class="right">
<img src="img/blog.png" alt="Blog screenshot">
</div>
</section>
<section>
<div class="left">
<img src="img/extension.png" alt="Web extension">
</div>
<div class="right">
<div class="title">
Use the web extension to debug your remote instances and run actions directly from your browser.
</div>
<div class="content">
<tt>backend.http</tt> also provides a web panel that will allow you to easily control all of your
integrations from a single place, on top of exposing a powerful API request editor that allows you
to control your integrations from any place and any script. The extension is available for
<a href="https://chrome.google.com/webstore/detail/platypush/aphldjclndofhflbbdnmpejbjgomkbie" target="_blank">Chrome</a>
and <a href="https://addons.mozilla.org/en-US/firefox/addon/platypush/" target="_blank">Firefox</a>,
and the <a href="https://git.platypush.tech/platypush/platypush-webext" target="_blank">source
code</a> is publicly available.
</div>
</div>
</section>
<section>
<div class="left">
<div class="title">
Create your own dashboards.
</div>
<div class="content">
Create your own all-screen dashboards with custom widgets to always keep an eye on e.g. calendar
events, media status, weather, sensors, news or your own pictures carousel.
</div>
</div>
<div class="right">
<img src="img/dashboard.png" alt="Dashboard screenshot">
</div>
</section>
<section>
<div class="left">
<img src="img/grafana.png" alt="Grafana screenshot">
</div>
<div class="right">
<div class="title">
Use Platypush to glue devices, databases and user interfaces.
</div>
<div class="content">
Platypush can be the bridge that connects your sensors, mobile and IoT devices to databases and
message queues and to Grafana to create
<a href="https://blog.platypush.tech/article/How-to-build-your-personal-infrastructure-for-data-collection-and-visualization">advanced visualizations of your data</a>.
Be the owner of your data again, and visualize it wherever you like, however you like.
</div>
</div>
</section>
<section>
<div class="left">
<div class="title">
Control all of your devices and services over chat bots and voice.
</div>
<div class="content">
Use the available
<a href="https://blog.platypush.tech/article/Build-custom-voice-assistants">voice assistant</a>
or
<a href="https://blog.platypush.tech/article/Build-a-bot-to-communicate-with-your-smart-home-over-Telegram">chat bot</a>
integrations to interact with your smart devices and services over voice (all you need is a USB
microphone) or chat bots (all you need is a messaging account).
</div>
</div>
<div class="right">
<img src="img/telegram-bot.png" alt="Telegram bot screenshot" style="width: auto; height: 70%">
</div>
</section>
<section>
<div class="left">
<img src="img/media-screenshot.png" alt="Media screenshot">
</div>
<div class="right">
<div class="title">
All of your media devices and sources in one place.
</div>
<div class="content">
With its numerous media integrations and a comprehensive web control panel, Platypush can turn a
device as powerful as a Raspberry Pi 4 into the ultimate media center and streaming center.
</div>
</div>
</section>
<section>
<div class="left">
<div class="title">
IoT-powered, events-oriented and self-hosted machine learning.
</div>
<div class="content">
Set up pipelines to automatically gather data from your events and dynamically train machine learning
models to e.g.
<a href="https://blog.platypush.tech/article/Detect-people-with-a-RaspberryPi-a-thermal-camera-Platypush-and-a-pinch-of-machine-learning">detect the presence of people</a> or
<a href="https://blog.platypush.tech/article/Create-your-smart-baby-monitor-with-Platypush-and-Tensorflow">recognize specific sounds</a>.
</div>
</div>
<div class="right">
<img src="img/ml.png" alt="ML model screenshot" style="width: 80%">
</div>
</section>
<section>
<div class="left">
<div class="content">
<p>
Platypush is and will always remain free, open-source and on-prem.
If you have questions, suggestions, issues or want to contribute to the project:
</p>
<ul>
<li>Open a <a href="https://git.platypush.tech/platypush/platypush/-/issues" target="_blank">
Gitlab issue</a>.</li>
<li>Reach out on <a href="https://www.reddit.com/r/platypush/" target="_blank">
Reddit</a>.</li>
<li>Open a <a href="https://git.platypush.tech/platypush/platypush/-/merge_requests" target="_blank">
merge request</a>.</li>
<li><a href="mailto:admin@platypush.tech" target="_blank">Contact us</a>.</li>
<li>Donations to cover the costs for hosting the infrastructure <a
href="https://paypal.me/fabiomanganiello" target="_blank">are also welcome</a>!
</li>
</ul>
</div>
</div>
<div class="right">
<div class="title">
Contact us or contribute.
</div>
</div>
</section>