Plasma for web developers

YES! That’s right. Even if you don’t know C++ or even Ruby or Python, you can still write plasmoids. After writing my atheist plasmoid I thought I’d add a tutorial on techbase to help other people write their own web plasmoids too so here it goes.

If, like me, you’re too lazy to click, what you need to do is first:

mkdir -p hello-web/contents/code

In the hello-web directory create a file called metadata.desktop and open it in your text editor. Copy the following code into metadata.desktop.

[Desktop Entry]
Encoding=UTF-8
Name=Hello Web
Name[nl]=Hallo Web
Type=Service
ServiceTypes=Plasma/Applet
Icon=chronometer
X-Plasma-API=webkit
X-Plasma-MainScript=code/main.html
X-KDE-PluginInfo-Author=Patrick Aljord
X-KDE-PluginInfo- Email=patcito@gmail.com
X-KDE-PluginInfo-Name=hello-web
X-KDE-PluginInfo-Version=1.0
X-KDE-PluginInfo-Website=http://plasma.kde.org/
X-KDE-PluginInfo-Category=Examples
X-KDE-PluginInfo-Depends=
X-KDE-PluginInfo-License=GPL
X-KDE-PluginInfo-EnabledByDefault=true

Now create a file in the contents/code directory called main.html, open it up in your text editor and put this code in it and save it.

<!-- <Copyright and license information goes here.> -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8 />
<meta name="viewport" content="width=620" />
<title>Hello World</title>
</head>
<body>
Hello World!
</body>
</html>

Plasma applets can be packaged in zip files and installed using the plasmapkg command line tool. The directory structure which we have used for our project matches that need in the zip file. All we have to do is zip it update. Run the following command from inside the hello-web directory.

zip -r ../hello-web.zip .

This will create the hello-web.zip file in the directory just above the hello-web directory. Go to this directory in the shell and run this plasmapkg command to install our little hello-web applet.

plasmapkg -i hello-web.zip

This installs the applet into your home directory. Now we can run it. When developing applets it is more convenient to use the plasmoidviewer. This is a little utility which displays an applet in a window instead of you having to use your desktop. This command below will run our applet.

plasmoidviewer hello-web

You should now be able to see the fruits of your labor.

You can also open the main.html directly with your webkit browser (rekonq, konqueror+webkit, arora, chrome etc).

If you want to make your plasmoid available to the whole world, upload it to http://opendesktop.org.

Oh, and happy new year again to all of you who celebrate it!

Posted on 2009-12-31 23:35:30 UTC

29 comments

Tags foss, kde, plasma, plasmoid, webkit, tutorial, web, html5

Aaron Seigo said on 2010-01-01 03:47:44 UTC:

very cool, thanks for the techbase tutorial! :) i spiffied up one or two tiny things in it, but it looked good already!

btw, did you know that you can access DataEngines from JavaScript in the Web Plasmoids? pretty nifty :)

patcito said on 2010-01-01 07:56:41 UTC:

Hey Aaron I am really glad you liked that tutorial I added to techbase. I was trying to port my plasmoid to vista and os x widget and by doing so, I realized how awesome plasma was and how simple it is in plasma to do a plasmoid compared to those closed platforms :)

Using DataEngines from Javascript in the Web Plasmoid sounds awesome, do you have any docs about it? If you give me some hints I could blog about it and/or add it to techbase, anyway, thanks for plasma :)

(I'm kinda drunk right now for the new year, I hope all this sounds reasonable xD)

barraponto said on 2010-01-01 15:50:48 UTC:

supports html5, fantastic. css3? javascript (jquery)? thanks for your fantastic piece of code!

WP Themes said on 2010-01-17 15:56:25 UTC:

Amiable post and this post helped me alot in my college assignement. Say thank you you for your information.

Vigrx Plus said on 2010-01-20 21:51:38 UTC:

Easily I acquiesce in but I about the collection should acquire more info then it has.

Vigrx Plus said on 2010-01-21 07:51:12 UTC:

Opulently I acquiesce in but I think the collection should prepare more info then it has.

WP Themes said on 2010-04-01 16:58:13 UTC:

Amiable dispatch and this mail helped me alot in my college assignement. Thank you on your information.

lebron james dunks said on 2010-04-24 23:03:09 UTC:

I searched for something completely different, but found your website! And have to say thanks. Nice read. Will come back.

jordan shoes said on 2010-04-26 14:13:13 UTC:

Hello everyone thanks for

good information.

wholesale slippers said on 2010-04-26 22:48:07 UTC:

After reading you site, Your site is very useful for me .I bookmarked your site!

contents insurance said on 2010-04-27 16:18:56 UTC:

One again, your idea is very

good.thank you!very much.

atlanta cheap tickets said on 2010-04-28 18:47:13 UTC:

Great article, i

hope can know much information About it!

discount mbt shoes said on 2010-04-29 12:12:22 UTC:

Really nice and impressive blog i found today.

Hermes birkin bag said on 2010-05-10 17:28:50 UTC:

Wonderful journey and experience!

Best Registry Cleaner said on 2010-05-10 21:00:39 UTC:

Nice content. Thank you for your information.

Forex Marketiva said on 2010-05-12 17:08:49 UTC:

Great article, i

hope can know much information About it!

ChristianLouboutinShoes said on 2010-06-02 06:12:28 UTC:

good share, great article, very usefull for us...thank you

Christian Louboutin said on 2010-06-04 02:58:39 UTC:

Thanks for sharing this.

sunglasses shop said on 2010-06-05 13:01:52 UTC:

great experience, dude! thanks for this great post wow... it's very wonderful report.

best Electronic Cigarette said on 2010-06-07 08:01:45 UTC:

Thank you for Posting &amp; I got to read nice information on your site.

Christian Louboutin Shoes said on 2010-06-08 21:49:54 UTC:

I will make sure and bookmark this page and be back to follow you more.

Cheap Insurance Quotes said on 2010-06-16 12:14:58 UTC:

The lighter colored area on the edges of the welds are actually just where I cleaned up the metal with a grinder. Another good thing to note when TIG welding is that the metal needs to be spotlessly clean. As soon as you think its clean enough, clean it once more. If you don’t, the welds look horrific.

Christian Louboutin Sale said on 2010-06-23 03:59:53 UTC:

Thanks for your post,I have subscribe the newsletter,do these articles have copyright limit? can I post them in my blog?

Christian Louboutin Sale said on 2010-06-23 20:24:32 UTC:

I locate this article from google,it's extraordinarily salutary in spite of me,I honest collect these infomation.I have subscribe the newsletter,do these articles have copyright limit? can I post them in my blog?

MBT Men Shoes said on 2010-07-09 20:59:08 UTC:

your site is good!

cheap mbt shoes said on 2010-07-10 05:14:10 UTC:

After reading you site, Your site is very useful for me .I bookmarked your site!

Sanchopahcerqq said on 2010-07-21 04:02:38 UTC:

I'm sure viagra is one of the betst pills for men

bad credit loan said on 2010-07-28 16:57:51 UTC:

Thanks for

your sharing, it's very useful

bad credit loan said on 2010-07-29 04:03:11 UTC:

great information you write it very clean. I am very lucky to get this tips from you.

Your name or OpenID (required to post links):

rel="nofollow" is added to all links so no need to spam here ;)