User Tools

Site Tools


plugins:own_javascript_plugin

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

plugins:own_javascript_plugin [2015/07/08 09:00]
octazid add zip file
plugins:own_javascript_plugin [2019/09/17 15:35]
Line 1: Line 1:
-======Create you own pure Javascript plugins====== 
-=====(Tutorial)===== 
- 
-=====Introduction===== 
- 
-===Here is the announcement from Dave, developer of DroidScript:=== 
-(posted in the DroidScript-Beta-Testers google-group) 
- 
-//Hi Guys, 
-For those of you that would like to have a go at creating pure JavaScript plugins for DroidScript, I have attached a sample* plugin zip file to this post.// 
-//You simply need to drop this zip file into a folder called /sdcard/DroidScript/Plugins on your device and DroidScript will import it into the plugins list along with the sample documentation. 
-When you come to renaming and making your own plugins, please make sure you use the same format and case for file names as those shown in this sample. 
-Let us know how you get on :) 
- 
-(Note: You can make sub folders in the zip file for your documentation images etc if you like)// 
- 
-*(The Sample is a simple **Zip-File** with 4 files. You can find this files below. All you have to do is to Download the files. Put them in one folder and zip this folder.) 
- 
----- 
- 
-=====Usage of the Example=====  
- 
-====First Step:==== 
- 
-Download the following 4 Files: 
- 
-  * **File 1: The html-page for the Documentation** 
- 
-<code html MyPlugin.html> 
- 
-<!DOCTYPE html>  
-<html> 
- 
-<head> 
- <title>MyPlugin</title>  
- <meta name="viewport" content="width=device-width, initial-scale=1">  
-        <style type="text/css"> 
-        </style> 
-</head>  
- 
-<body>  
- 
-<div data-role="page" data-theme="a"> 
- 
- <div data-role="header" data-position="fixed"> 
- <a href='#' class='ui-btn-left' data-icon='arrow-l' data-theme="c" onclick="history.back(); return false">Back</a>  
- <h1>MyPlugin</h1> 
- </div><!-- /header --> 
- 
- <div data-role="content">  
-  
- <p> Todo: Documentation for MyPlugin</p> 
-  
- <p>In order to use MyPlugin, you must first load the plugin at the top of your script  
- using the <b>LoadPlugin</b> method like this:</p> 
-  
- <div class="samp">&nbsp;app.LoadPlugin( "MyPlugin" );</div> 
-  
- <p>Then you can create an instance of the plugin object when you need it like this:</p> 
-  
- <div class="samp">&nbsp;plg = app.CreateObject( "MyPlugin" );</div> 
-    
- <br> 
- <p>Examples:</p> 
-  
- <div data-role="collapsible" data-collapsed="true"  data-mini="true" data-theme="a" data-content-theme="b"> 
- <h3>Example - Get Version</h3> 
- <div id="examp1" style="font-size:70%"> 
- app.LoadPlugin( "MyPlugin" );<br> 
- <br> 
- function OnStart()<br> 
- {<br> 
- &nbsp;&nbsp;lay = app.CreateLayout( "Linear", "VCenter,FillXY" );<br><br> 
- &nbsp;&nbsp;btn = app.CreateButton( "Press Me" );<br>  
- &nbsp;&nbsp;btn.SetOnTouch( CallPlugin );<br> 
- &nbsp;&nbsp;lay.AddChild( btn );<br><br> 
- <b id="snip1"  style="font-size:100%"> 
- &nbsp;&nbsp;plg = app.CreateObject( "MyPlugin" );<br> 
- </b><br> 
- &nbsp;&nbsp;app.AddLayout( lay );<br> 
- }<br> 
- <br> 
- function CallPlugin()<br> 
- {<br> 
- &nbsp;&nbsp;alert( plg.GetVersion() );<br> 
- }<br><br> 
-  
- </div> 
- <div name="divCopy" align="right"> 
- <a href="#" data-role="button" data-mini="true" data-inline="true" onclick="copy(snip1)">&nbsp;&nbsp;Copy&nbsp;&nbsp;</a> 
- <a href="#" data-role="button" data-mini="true" data-inline="true" onclick="copy(examp1)">Copy All</a> 
- <a href="#" data-role="button" data-mini="true" data-inline="true" onclick="demo(examp1)">&nbsp;&nbsp;&nbsp;Run&nbsp;&nbsp;&nbsp;</a> 
- </div> 
- </div> 
-  
-  
- <div data-role="collapsible" data-collapsed="true"  data-mini="true" data-theme="a" data-content-theme="b"> 
- <h3>Example - Test Callback</h3> 
- <div id="examp2" style="font-size:70%"> 
- app.LoadPlugin( "MyPlugin" );<br> 
- <br> 
- function OnStart()<br> 
- {<br> 
- &nbsp;&nbsp;lay = app.CreateLayout( "Linear", "VCenter,FillXY" );<br><br> 
- &nbsp;&nbsp;btn = app.CreateButton( "Press Me" );<br>  
- &nbsp;&nbsp;btn.SetOnTouch( CallPlugin );<br> 
- &nbsp;&nbsp;lay.AddChild( btn );<br><br> 
- <b id="snip2"  style="font-size:100%"> 
- &nbsp;&nbsp;plg = app.CreateObject( "MyPlugin" );<br> 
- &nbsp;&nbsp;plg.SetOnMyReply( OnMyReply );<br> 
- </b><br> 
- &nbsp;&nbsp;app.AddLayout( lay );<br> 
- }<br> 
- <br> 
- function CallPlugin()<br> 
- {<br> 
- &nbsp;&nbsp;plg.MyFunc( "hello", 21, true );<br> 
- }<br><br> 
- function OnMyReply( txt, num, bool )<br> 
- {<br> 
- &nbsp;&nbsp;alert( "txt=" + txt + " num=" + num + " bool=" + bool );<br> 
- }<br> 
- </div> 
- <div name="divCopy" align="right"> 
- <a href="#" data-role="button" data-mini="true" data-inline="true" onclick="copy(snip2)">&nbsp;&nbsp;Copy&nbsp;&nbsp;</a> 
- <a href="#" data-role="button" data-mini="true" data-inline="true" onclick="copy(examp2)">Copy All</a> 
- <a href="#" data-role="button" data-mini="true" data-inline="true" onclick="demo(examp2)">&nbsp;&nbsp;&nbsp;Run&nbsp;&nbsp;&nbsp;</a> 
- </div> 
- </div> 
-  
- </div><!-- /content --> 
-  
-</div><!-- /page --> 
- 
-</body> 
-</html> 
-</code> 
- 
-  * **File 2: The inc-file with the Plugin-code (Javascript)** 
- 
-<code Javascript MyPlugin.inc> 
- 
-function MyPlugin() 
-{ 
- this.callback = null; 
-  
- this.GetVersion = function( num, txt )  
- 
- return 1.0;  
- } 
-  
-    this.MyFunc = function( txt, num, bool )  
-    {  
- this.callback( txt + " World!!", num+20, !bool );  
- } 
-  
-    this.SetOnMyReply = function( cb )  
-    {  
- this.callback = cb;  
- } 
-} 
-</code> 
- 
-  * **File 3: The text-file with the Versionnumber** 
- 
-<code text Version.txt> 
-1.00 
-</code> 
- 
-  * **File 4: A blanc jar-file without any text** 
- 
-<code Java MyPlugin.jar> 
- 
-</code> 
- 
- 
----- 
- 
- 
-====Second Step:==== 
- 
-Create a Zip-folder called "MyPlugin.zip" and copy this folder to the right path on your android-device: 
- 
-  * Select the 4 Files and use a tool on a Windows Desktop-PC like [[http://www.7-zip.org/|7-Zip]] to create the Zip-File. If you Use Android you can use [[https://play.google.com/store/apps/details?id=com.estrongs.android.pop&hl=en|ES File Explorer]] to create the file. 
-  * after this process you should have a file with the following structure: 
- 
-    MyPlugin.zip 
-       MyPlugin.html 
-       MyPlugin.inc 
-       MyPlugin.jar 
-       Version.txt 
- 
-  * Now you go on your Android Device to the folder **/sdcard/DroidScript** and create a new folder called "**Plugins**" within the folder **Droidscript** 
-  * Copy the zip-file in this folder and start Droidscript 
-  * DroidScript imports the Plugin now in the Droidscript-Pluginfolder in the systempath 
-  * Now you can see your plugin if you press the left "Docs"-button and than the "Plugins"-button 
-  * The folder **/sdcard/DroidScript/Plugins** is blank after this process 
- 
-=====Notes===== 
- 
-  * If your Plugin had another name like "TestPlugin" you have to rename all the "MyPlugin"-words in all files! 
-  * When you come to renaming and making your own plugins, please make sure you use the same format and case for file names as those shown in this sample! 
-  * You can make sub folders in the zip file for your documentation images etc 
- 
-=====How can uninstall your plugin?===== 
- 
- 
----- 
- 
-===== Zip file with all 4 files ===== 
-You can find the Zip-file with all 4 files here: {{:wiki:myplugin.zip|MyPlugin.zip}} 
- 
- 
- 
- 
- 
- 
  
plugins/own_javascript_plugin.txt ยท Last modified: 2019/09/17 15:35 (external edit)