Commit 7e1d09df authored by Romain Courteaud's avatar Romain Courteaud

Drop previous implementation.

parent 5f4f924e
...@@ -67,10 +67,10 @@ lib/jio/complex_queries.js: ...@@ -67,10 +67,10 @@ lib/jio/complex_queries.js:
$(RENDERJS_MIN): $(RENDERJS) $(RENDERJS_MIN): $(RENDERJS)
$(UGLIFY_CMD) "$<" > "$@" $(UGLIFY_CMD) "$<" > "$@"
${BUILDDIR}/$(RENDERJS).lint: $(RENDERJS) test/renderjs_test2.js ${BUILDDIR}/$(RENDERJS).lint: $(RENDERJS) test/renderjs_test.js
@mkdir -p $(@D) @mkdir -p $(@D)
$(LINT_CMD) "$(RENDERJS)" $(LINT_CMD) "$(RENDERJS)"
$(LINT_CMD) "test/renderjs_test2.js" $(LINT_CMD) "test/renderjs_test.js"
touch $@ touch $@
${BUILDDIR}/index.html.ok: test/index.html ${BUILDDIR}/index.html.ok: test/index.html
......
<html>
<head>
<script data-main="../../require-renderjs.js"
type="text/javascript"
src="../../lib/require/require.js"></script>
<head>
<body>
<div id="say-hello"
data-gadget="say-hello.html"
data-gadget-cacheable="0"
data-gadget-cache-id="say-hello"></div>
</body>
</html>
\ No newline at end of file
<html>
<head></head>
<body>
Hello from the gadget!
</body>
</html>
\ No newline at end of file
<html>
<head>
<script data-main="../../require-renderjs.js"
type="text/javascript"
src="../../lib/require/require.js"></script>
<head>
<body>
<div id="init-gadget"
data-gadget="init-gadget.html"
data-gadget-cacheable="0"
data-gadget-cache-id="init-gadget"
data-gadget-property="{&quot;name&quot;: &quot;Ivan&quot;}"></div>
</body>
</html>
\ No newline at end of file
<html>
<head></head>
<body>
<p>Hello to <span id="name"></span> from the gadget which can be initialized via data-gadget-property attribute from parent gadget!</p>
<script type="text/javascript" language="javascript">
//<![CDATA[
name = RenderJs.GadgetIndex.getGadgetById("init-gadget").name;
$("#name").html(name);
//]]>
</script>
</body>
</html>
\ No newline at end of file
<div>
A (gadget)
<button onclick="RenderJs.GadgetIndex.getGadgetById('A').jsCall1()">A.jsCall1 -> B.jsCall1</button>
<button onclick="$('#A').trigger('htmlEvent1')">HTML event 1</button>
<button onclick="$('#A').trigger('htmlEvent2')">HTML event 2</button>
<button onclick="$('#main-interactor').trigger('htmlEvent3')">
A.htmlEvent3 -> InteractionGadget.htmlEvent3 -> A.htmlEvent3 AND B.htmlEvent3
</button>
<p id="hide" style="display:none;"> hidden text on myownHTMlEvent1</p>
</div>
<script type="text/javascript" language="javascript">
//<![CDATA[
$(document).ready(function() {
gadget = RenderJs.GadgetIndex.getGadgetById("A");
gadget.jsCall1 = function (){alert("A.jscall1");};
gadget.jsCall2 = function (){alert("A.jscall2");};
gadget.htmlEvent3 = function (){alert("A.htmlEvent3");};
gadget.myOwnHtmlEvent1 = function (){
$("#hide").toggle();
alert("A.myOwnHtmlEvent1");
};
});
//]]>
</script>
\ No newline at end of file
<div>
B (gadget)
<button onclick="RenderJs.GadgetIndex.getGadgetById('B').jsCall2();">B.jsCall2 -> A.jsCall2</button>
</div>
<script type="text/javascript" language="javascript">
//<![CDATA[
$(document).ready(function() {
gadget = RenderJs.GadgetIndex.getGadgetById("B");
gadget.jsCall1 = function (){alert("B.jscall1");};
gadget.jsCall2 = function (){alert("B.jscall2");};
gadget.htmlEvent1 = function (){alert("B.htmlEvent1");};
gadget.htmlEvent2 = function (){alert("B.htmlEvent2");};
gadget.htmlEvent3 = function (){alert("B.htmlEvent3");};
});
//]]>
</script>
\ No newline at end of file
<html>
<head>
<script data-main="../../require-renderjs.js"
type="text/javascript"
src="../../lib/require/require.js"></script>
<head>
<body>
<div id="A"
data-gadget="A.html"
data-gadget-cacheable="0"
data-gadget-cache-id="A"></div>
<div id="B"
data-gadget="B.html"
data-gadget-cacheable="0"
data-gadget-cache-id="B"></div>
<div data-gadget=""
id="main-interactor"
data-gadget-connection="[
{&quot;source&quot;: &quot;A.jsCall1&quot;, &quot;destination&quot;: &quot;B.jsCall1&quot;},
{&quot;source&quot;: &quot;A.htmlEvent1&quot;, &quot;destination&quot;: &quot;B.htmlEvent1&quot;},
{&quot;source&quot;: &quot;A.htmlEvent1&quot;, &quot;destination&quot;: &quot;A.myOwnHtmlEvent1&quot;},
{&quot;source&quot;: &quot;A.htmlEvent2&quot;, &quot;destination&quot;: &quot;B.htmlEvent2&quot;},
{&quot;source&quot;: &quot;B.jsCall2&quot;, &quot;destination&quot;: &quot;A.jsCall2&quot;},
{&quot;source&quot;: &quot;main-interactor.htmlEvent3&quot;, &quot;destination&quot;: &quot;A.htmlEvent3&quot;},
{&quot;source&quot;: &quot;main-interactor.htmlEvent3&quot;, &quot;destination&quot;: &quot;B.htmlEvent3&quot;}]">
</div>
</body>
</html>
<html>
<head></head>
<body>
<div data-role="page">
<div data-role="header">
<h1>Jquery mobile and RenderJs test</h1>
</div>
<div data-role="content">
<h2>Some documentation for this gadget.</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0-rc.1/jquery.mobile-1.3.0-rc.1.min.css" />
<link rel="stylesheet" href="jqm-gadget.css" />
<script data-main="require-renderjs_jqm.js"
type="text/javascript"
src="../../lib/require/require.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header">
<h1>Jquery mobile and RenderJs test</h1>
</div>
<div data-role="content">
<div id="jqm-gadget"
data-gadget="jqm-gadget.html"></div>
<div id="jqm-details-gadget"
data-gadget="jqm-details-gadget.html"></div>
<div id="jqm-doc-gadget"
data-gadget="jqm-doc-gadget.html"></div>
</div>
</div>
</body>
</html>
<html>
<head></head>
<body>
Country of origin:<span id="country"> ...</span>
<script type="text/javascript" language="javascript">
//<![CDATA[
$(document).ready(function() {
gadget = RenderJs.GadgetIndex.getGadgetById("jqm-details-gadget");
gadget.updateCountry = function (country) {
$("#country").html(country);
};
});
//]]>
</script>
</body>
</html>
<html>
<head></head>
<body>
<ul data-role="listview" data-inset="true" data-filter="false">
<li><a href="documentation.html" class="ui-link-inherit">Link</a></li>
</ul>
</body>
</html>
#jqm-gadget,
#jqm-details-gadget{
width:45%;
float:left;
margin-left:10px;
}
#country{
font-weight: bold;
}
#jqm-doc-gadget{
width:100%;
float:left;
}
\ No newline at end of file
<html>
<head></head>
<body>
<ul data-role="listview" data-inset="true" data-filter="true" id="mylist">
<li onclick="RenderJs.GadgetIndex.getGadgetById('jqm-details-gadget').updateCountry('Germany');"><a href="#">Audi</a></li>
<li onclick="RenderJs.GadgetIndex.getGadgetById('jqm-details-gadget').updateCountry('USA');"><a href="#">Cadillac</a></li>
<li onclick="RenderJs.GadgetIndex.getGadgetById('jqm-details-gadget').updateCountry('Italy');"><a href="#">Ferrari</a></li>
<li onclick="RenderJs.GadgetIndex.getGadgetById('jqm-details-gadget').updateCountry('Japan');"><a href="#">Toyota</a></li>
<li onclick="RenderJs.GadgetIndex.getGadgetById('jqm-details-gadget').updateCountry('Russia');"><a href="#">Moskvich</a></li>
<li onclick="RenderJs.GadgetIndex.getGadgetById('jqm-details-gadget').updateCountry('Bulgaria');"><a href="#">Moskvich Aleko</a></li>
</ul>
</body>
</html>
// JavaScript file that is used to load RenderJs depenencies
require.config({
baseUrl: "../..",
paths: {
jqm: "lib/jqm/jquery.mobile-1.3.1.js"
},
});
require([ "require-renderjs", "renderjs", "jqm" ], function(domReady) {
// when all gadgets are loaded make sure JQM renders them
RenderJs.bindReady(
function () {
$("[data-gadget]").trigger('create');
}
);
});
<html>
<head>
<script data-main="require-renderjs.js"
type="text/javascript"
src="../../lib/require/require.js"></script>
<head>
<body>
<p>Contained below gadget will get some JSON data from server and update it on page.</p>
<p>It will also load an additional library (using requirejs) that will be used by this gadget.</p>
<div id="json-gadget"
data-gadget=""
data-gadget-source = "json_file.json"
data-gadget-handler="parseJSONAndUpdateDOM"
data-gadget-cacheable="0"
data-gadget-cache-id="json-gadget">
First name: <div id="first_name"></div>
Last name: <div id="last_name"></div>
</div>
</body>
</html>
\ No newline at end of file
{"first_name": "John",
"last_name": "Doh"}
\ No newline at end of file
function parseJSONAndUpdateDOM(result) {
$("#first_name").text(result['first_name']);
$("#last_name").text(result['last_name']);
}
\ No newline at end of file
// JavaScript file that is used to load RenderJs depenencies
require(["../../lib/jquery/jquery.js",
"../../renderjs.js",
"json_gadget.js"
],
function (domReady) {
// Place code to be executed when libraries are loaded
// impliticly call RenderJs bootstrap
RenderJs.init();
});
<html>
<head>
<script data-main="../../require-renderjs.js"
type="text/javascript"
src="../../lib/require/require.js"></script>
<head>
<body>
<div id="recursive"
data-gadget="recursive.html"
data-gadget-cacheable="0"
data-gadget-cache-id="recursive"></div>
</body>
</html>
\ No newline at end of file
<html>
<head></head>
<body>
<p>
Hello from the recursive contained gadget!
</p>
</body>
</html>
<html>
<head></head>
<body>
<p>
Hello from the recursive gadget!
Below a new gadget will be loaded
</p>
<div data-gadget="recursive-contained.html"
data-gadget-cacheable="0"
data-gadget-cache-id="recursive-contained"></div>
</body>
</html>
\ No newline at end of file
<html>
<head>
<script data-main="../../require-renderjs.js"
type="text/javascript"
src="../../lib/require/require.js"></script>
<head>
<body>
<div id="requirejs-gadget"
data-gadget="requirejs-gadget.html"
data-gadget-cacheable="0"
data-gadget-cache-id="requirejs-gadget"></div>
</body>
</html>
\ No newline at end of file
// This module contains gagdets JavaScript implementation code
function setLoaded() {
$("#loading").text('Loaded now using requirejs.');
}
\ No newline at end of file
// This file defines all required javascript files for this gadget
require(["require-gadget-implementation.js"],
function (domReady) {
// required by this gadget code is loaded so we can use it
setLoaded();
});
<html>
<head>
<script type="text/javascript"
src="require-gadget.js"></script>
</head>
<body>
<p>This gadget uses requirejs to load its dependency.</p>
<div id="loading">Loading ....</div>
</body>
</html>
\ No newline at end of file
.list-item {
text-decoration: none;
display: block;
width: 2em;
}
\ No newline at end of file
<html>
<head>
<link type="text/css" href="gadget-color-picker.css" rel="stylesheet">
</head>
<body>
<h2> Color picker</h2>
<div class="body">
<ul style="list-style: none;">
<li><a href="#/color/0/0/0/" class="list-item" style="background-color:rgb(0,0,0);">&nbsp;</a></li>
<li><a href="#/color/0/0/150/" class="list-item" style="background-color:rgb(0,0,150);">&nbsp;</a></li>
<li><a href="#/color/0/150/0/" class="list-item" style="background-color:rgb(0,150,0);">&nbsp;</a></li>
<li><a href="#/color/0/150/150/" class="list-item" style="background-color:rgb(0,150,150);">&nbsp;</a></li>
<li><a href="#/color/150/0/0/" class="list-item" style="background-color:rgb(150,0,0);">&nbsp;</a></li>
<li><a href="#/color/150/0/150/" class="list-item" style="background-color:rgb(150,0,150);">&nbsp;</a></li>
<li><a href="#/color/150/150/0/" class="list-item" style="background-color:rgb(150,150,0);">&nbsp;</a></li>
<li><a href="#/color/150/150/150/" class="list-item" style="background-color:rgb(150,150,150);">&nbsp;</a></li>
<li style="text-align: center;"><a href="#/color/X/X/X" style="text-decoration: none; display: block; width: 2em;">XXX</a></li>
</ul>
<div class="select-color" style="display: block;"></div>
</div>
<script type="text/javascript" language="javascript">
//<![CDATA[
$(document).ready(function() {
gadget = RenderJs.getSelfGadget();
gadget.redirect = function () {
// Default route. Redirect to color subapp
$.url.redirect('/color/');
};
gadget.selectColorMessage = function () {
$('.select-color').text("Please select a color");
};
gadget.updateColor = function (red, green, blue) {
$('.select-color').html(
"<div style='background-color:rgb(" + red + "," + green + "," + blue + ");'>&nbsp;<\/div>" +
"<p>Color (" + red + "," + green + "," + blue + ") selected at " + new Date() + "<\/p>");
};
gadget.initRoutes = function () {
// XXX: improve this part so we can declare in RouteGadget
RenderJs.RouteGadget.go($.url.getPath(),
function () {
$('.select-color').html("Unknown color (" + $.url.getPath() + ")");},
2);
};
});
//]]>
</script>
</body>
</html>
<html>
<head></head>
<body>
<h1> This is footer loaded asynchronously at startup</h1>
<div class="route-select">
<ul>
<li><a href="#/footer_gadget_1/">Footer Gadget 1</a></li>
<li><a href="#/footer_gadget_2/">Footer Gadget 2</a></li>
<li><a href="#/footer_gadget_3/">Footer Gadget 3</a></li>
<li><a href="#/footer_gadget_4/">Footer Gadget 4</a></li>
<li><a href="#/footer_gadget_5/">Footer Gadget 5</a></li>
</ul>
</div>
<div id="footer-container">
<div data-gadget-source="" data-gadget-handler="" data-gadget="gadget-three.html" id="footer_gadget_1"></div>
<div data-gadget-source="" data-gadget-handler="" data-gadget="gadget-three.html" id="footer_gadget_2"></div>
<div data-gadget-source="" data-gadget-handler="" data-gadget="gadget-three.html" id="footer_gadget_3"></div>
<div data-gadget-source="" data-gadget-handler="" data-gadget="gadget-three.html" id="footer_gadget_4"></div>
<div data-gadget-source="" data-gadget-handler="" data-gadget="gadget-three.html" id="footer_gadget_5"></div>
<div data-gadget=""
id="footer-router"
data-gadget-route="[
{&quot;source&quot;: &quot;/footer_gadget_1/&quot;, &quot;destination&quot;: &quot;footer_gadget_1.render&quot;},
{&quot;source&quot;: &quot;/footer_gadget_2/&quot;, &quot;destination&quot;: &quot;footer_gadget_2.render&quot;},
{&quot;source&quot;: &quot;/footer_gadget_3/&quot;, &quot;destination&quot;: &quot;footer_gadget_3.render&quot;},
{&quot;source&quot;: &quot;/footer_gadget_4/&quot;, &quot;destination&quot;: &quot;footer_gadget_4.render&quot;},
{&quot;source&quot;: &quot;/footer_gadget_5/&quot;, &quot;destination&quot;: &quot;footer_gadget_5.render&quot;}]">
</div>
</div>
</body>
</html>
<html>
<head></head>
<body>
<script type="text/javascript" language="javascript">
//<![CDATA[
$(document).ready(function() {
gadget = RenderJs.GadgetIndex.getGadgetById("gadget-one");
gadget.render = function (){
$("#gadget-one").html("<h2>Gadget 1</h2><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>");
$("#gadget-two").empty(); // XXX: this will become redundant if we use Tabbular gadget
};
});
//]]>
</script>
</body>
</html>
<html>
<head></head>
<body>
<script type="text/javascript" language="javascript">
//<![CDATA[
$(document).ready(function() {
gadget = RenderJs.getSelfGadget();
gadget.showMessage = function (msg){
$("#portal-status-message").html(msg);
window.setTimeout(function () {
$("#portal-status-message").empty();
}, 2000);
};
});
//]]>
</script>
</body>
</html>
<html>
<head></head>
<body>
<div class="gadget-id-viewer" style="display:none;">
</div>
<script type="text/javascript" language="javascript">
//<![CDATA[
$(document).ready(function() {
gadget = RenderJs.getSelfGadget();
$(gadget.getDom()).find(".gadget-id-viewer").html("This is " + gadget.getId())
gadget.render = function (){
gadget = RenderJs.getSelfGadget();
$(gadget.getDom().find(".gadget-id-viewer")).toggle();
};
});
//]]>
</script>
</body>
</html>
<html>
<head></head>
<body>
<script type="text/javascript" language="javascript">
//<![CDATA[
$(document).ready(function() {
gadget = RenderJs.GadgetIndex.getGadgetById("gadget-two");
gadget.render = function (){
$("#gadget-one").empty(); // XXX: this will become redundant if we use Tabbular gadget
$("#gadget-two").html("<h2>Gadget 2</h2><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>");
};
});
//]]>
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script data-main="require-renderjs_route.js"
type="text/javascript"
src="../../lib/require/require.js"></script>
</head>
<body>
<div id="portal-status-message"
data-gadget="gadget-portal-status-message.html"></div>
<div data-gadget=""
id="main-router"
data-gadget-route="[
{&quot;source&quot;: &quot;&quot;, &quot;destination&quot;: &quot;gadget-color-picker.redirect&quot;},
{&quot;source&quot;: &quot;/color<path:params>&quot;, &quot;destination&quot;: &quot;gadget-color-picker.initRoutes&quot;},
{&quot;source&quot;: &quot;/color/&quot;,
&quot;destination&quot;: &quot;gadget-color-picker.selectColorMessage&quot;,
&quot;priority&quot;:2},
{&quot;source&quot;: &quot;/color/<int:red>/<int:green>/<int:blue>/&quot;,
&quot;destination&quot;: &quot;gadget-color-picker.updateColor&quot;,
&quot;priority&quot;:2},
{&quot;source&quot;: &quot;/gadget-one/&quot;, &quot;destination&quot;: &quot;main-router.gadget_one&quot;},
{&quot;source&quot;: &quot;/gadget-two/&quot;, &quot;destination&quot;: &quot;main-router.gadget_two&quot;}]">
</div>
<a href="#unknown">Wrong route</a>
<div id="gadget-color-picker"
data-gadget="gadget-color-picker.html"></div>
<a href="#/gadget-one/">Gadget 1</a>&nbsp;
<a href="#/gadget-two/">Gadget 2</a>
<div id="gadget-one"
data-gadget="gadget-one.html"></div>
<div id="gadget-two"
data-gadget="gadget-two.html"></div>
<div id="gadget-footer"
data-gadget="gadget-footer.html"></div>
<div data-gadget=""
id="main-interactor"
data-gadget-connection="[
{&quot;source&quot;: &quot;main-router.gadget_one&quot;, &quot;destination&quot;: &quot;gadget-one.render&quot;},
{&quot;source&quot;: &quot;main-router.gadget_two&quot;, &quot;destination&quot;: &quot;gadget-two.render&quot;}]">
</div>
<noscript>
Please enable Javascript
</noscript>
</body>
</html>
// JavaScript file that is used to load RenderJs depenencies
require.config({
baseUrl: "../..",
paths: {
route: "lib/route/route",
url: "lib/route/url",
jquery: "lib/jquery/jquery",
renderjs: "renderjs",
},
shim: {
url: [ "renderjs" ]
}
});
require([ "renderjs", "require-renderjs", "jquery", "route", "url" ], function(domReady) {
RenderJs.bindReady(function (){
// XXX: try to encapsulate this in router gadget
gadget = RenderJs.GadgetIndex.getGadgetById("main-router");
gadget.gadget_one = function (){
// we use interactionGadget which will call proper gadgets' function
};
gadget.gadget_two = function (){
// we use interactionGadget which will call proper gadgets' function
};
// we have to re-bind (force) interaction gadget as main-route API implemantation changed
RenderJs.InteractionGadget.init(force=1);
$.url.onhashchange(function () {
RenderJs.RouteGadget.go($.url.getPath(),
function () {
// Method to display error to the user
gadget = RenderJs.GadgetIndex.getGadgetById("portal-status-message");
gadget.showMessage(
"<p>Oups, seems the route '<b>" + $.url.getPath() + "<\/b>' doesn't exist!<\/p>" +
"<a href='" + $.url.generateUrl("") + "'>Go back to home<\/a>");
// All routes have been deleted by fail.
// So recreate the default routes using RouteGadget
$("div[data-gadget-route]").each(function (index, element) {
RenderJs.RouteGadget.route($(element));
});
});
});
});
});
This diff is collapsed.
// JavaScript file that is used to load RenderJs depenencies
require.config({
paths: {
jquery: "lib/jquery/jquery",
"jquery.json": "lib/json/jquery.json.min",
davstorage: "lib/jio/davstorage",
md5: "lib/jio/md5",
jio: "lib/jio/jio",
renderjs: "renderjs"
},
shim: {
"jquery.json": [ "jquery" ],
jio: ["md5"],
davstorage: ["jio"],
renderjs: [ "jquery", "jquery.json", "jio", "md5", "davstorage" ]
}
});
require([ "renderjs" ], function(domReady) {
RenderJs.init();
});
\ No newline at end of file
{
"gadget_list":[ {"title": "HTML WYSIWYG",
"description": "A simple HTML editor",
"url": "http://example.com/html-editor.html",
"service_list": ["edit_html", "view_html"]},
{"title": "SVG WYSIWYG",
"description": "A simple SVG editor",
"url": "http://example.com/svg-editor.html",
"service_list": ["edit_svg", "view_svg"]}
]
}
\ No newline at end of file
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
<script src="../sinon-qunit.js" type="text/javascript"></script> <script src="../sinon-qunit.js" type="text/javascript"></script>
<script src="../../lib/jschannel/jschannel.js" type="text/javascript"></script> <script src="../../lib/jschannel/jschannel.js" type="text/javascript"></script>
<script src="../renderjs.js" type="text/javascript"></script> <script src="../renderjs.js" type="text/javascript"></script>
<script src="renderjs_test2.js" type="text/javascript"></script> <script src="renderjs_test.js" type="text/javascript"></script>
</head> </head>
<body> <body>
<h1 id="qunit-header">QUnit renderJS test suite</h1> <h1 id="qunit-header">QUnit renderJS test suite</h1>
......
<div>A (gadget)</div>
<script type="text/javascript" language="javascript">
//<![CDATA[
$(document).ready(function() {
gadget = RenderJs.GadgetIndex.getGadgetById("A");
gadget.inc = function (){counter = counter +1;};
gadget.inc2 = function (){counter = counter +2;};
});
//]]>
</script>
\ No newline at end of file
<div> B (gadget) </div>
<script type="text/javascript" language="javascript">
//<![CDATA[
$(document).ready(function() {
gadget = RenderJs.GadgetIndex.getGadgetById("B");
gadget.inc = function (){counter = counter + 1; };
gadget.htmlEvent1 = function (){counter = counter + 1;};
gadget.inc2 = function (){counter = counter + 2; };
});
//]]>
</script>
\ No newline at end of file
<div id="A"
data-gadget="interactions/A.html"
data-gadget-cacheable="0"
data-gadget-cache-id="A"></div>
<div id="B"
data-gadget="interactions/B.html"
data-gadget-cacheable="0"
data-gadget-cache-id="B"></div>
<div data-gadget=""
id="main-interactor"
data-gadget-connection="[
{&quot;source&quot;: &quot;A.inc&quot;, &quot;destination&quot;: &quot;B.inc&quot;},
{&quot;source&quot;: &quot;A.htmlEvent1&quot;, &quot;destination&quot;: &quot;B.htmlEvent1&quot;},
{&quot;source&quot;: &quot;main-interactor.multiEvent&quot;, &quot;destination&quot;: &quot;A.inc&quot;},
{&quot;source&quot;: &quot;main-interactor.multiEvent&quot;, &quot;destination&quot;: &quot;B.inc&quot;}]"></div>
<div data-gadget=""
id="supplimentary-interactor"
data-gadget-connection="[
{&quot;source&quot;: &quot;A.inc2&quot;, &quot;destination&quot;: &quot;B.inc2&quot;}]"></div>
{"first_name": "John",
"last_name": "Doh"}
\ No newline at end of file
test!!!
\ No newline at end of file
<div id="A"
data-gadget="loading/A.html"></div>
<div id="B"
data-gadget="loading/A.html"></div>
\ No newline at end of file
test!!!
\ No newline at end of file
This diff is collapsed.
This diff is collapsed.
// JavaScript file that is used to load RenderJs depenencies
require.config({
baseUrl: "..",
paths: {
route: "lib/route/route",
url: "lib/route/url",
jquery: "lib/jquery/jquery",
renderjs: "renderjs",
},
shim: {
"test/renderjs_test": [ "renderjs" ],
"url": ["renderjs"],
"route": ["url"]
}
});
require([ "require-renderjs", "test/renderjs_test", "url", "route" ], function(domReady) {
setupRenderJSTest();
});
<html>
<head></head>
<body>
<script type="text/javascript" language="javascript">
//<![CDATA[
$(document).ready(function() {
gadget = RenderJs.GadgetIndex.getGadgetById("gadget-one");
gadget.gadget_one = function () {
route_changed=1; // so we can test this method was actually called from qunit
};
gadget.gadget_two = function () {
route_changed=2; // so we can test this method was actually called from qunit
};
gadget.gadget_three = function () {
route_changed=3; // so we can test this method was actually called from qunit
};
});
//]]>
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<div data-gadget=""
id="main-router"
data-gadget-route="[
{&quot;source&quot;: &quot;/gadget-one/&quot;, &quot;destination&quot;: &quot;gadget-one.gadget_one&quot;},
{&quot;source&quot;: &quot;/gadget-two/&quot;, &quot;destination&quot;: &quot;gadget-one.gadget_two&quot;}]">
</div>
<div data-gadget=""
id="suplimentary-router"
data-gadget-route="[
{&quot;source&quot;: &quot;/gadget-three/&quot;, &quot;destination&quot;: &quot;gadget-one.gadget_three&quot;}]">
</div>
<div id="gadget-one"
data-gadget="route/gadget-one.html"></div>
</body>
</html>
\ No newline at end of file
<script type="text/javascript" language="javascript">
//<![CDATA[
$(document).ready(function() {
gadget = RenderJs.getSelfGadget();
gadget.instance_id = gadget.getId();
});
//]]>
</script>
\ No newline at end of file
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment