 SPA_ARTICLE_CODE.zip
 SPA_ARTICLE_CODE
- ChainOfPluginsCompositionSample
- ComplexProductNavigationTest
- CompositionAndNavigationSample
- HierarchicalSPAWithNavigation
- ParameterizedPluginSample
- ParamNavigationTest
- SilverlightPluginSample
- SimpleCompositionSample
- SimpleProductNavigationTest
- SPA_POSTingObjectToServer
- SPAComplexObjectGetter
- SPAServerStringCommunications
- TwoPageOrdinaryHTMLApp
- TwoPageSPA
- TwoPageSPAWithNavigation
- TwoPageSPAWithTabs
- BPF.zip
- BPF
|
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<div style="font-size:30px;color:red">This is the main Module</div>
<img id="busyIndicator" src="../Images/busy_indicator.gif" style="vertical-align:central;margin-left:50%" />
<!-- plugin will get into this div below -->
<div id="APluginContainer1"></div>
<!-- call plugin's function to change its color to 'blue' for the plugin above -->
<button id="changePluginColorButton1">Change 1st Plugin Text to Blue</button>
<!-- plugin will get into this div below -->
<div id="APluginContainer2" style="margin-top:40px"></div>
<!-- call plugin's function to change its color to 'blue' for the plugin above -->
<button id="changePluginColorButton2">Change 2nd Plugin Text to Blue</button>
</body>
</html>
<script src="../Scripts/jquery-1.8.3.min.js"></script>
<script src="../Scripts/BPF/bpf.js"></script>
<script>
$(document).ready(function () {
// this event will fire after all the plugins and their
// descendent plugins are loaded
var compositionReady = new bpf.utils.EventBarrier();
// the composition ready event fires after everything all the plugins
// and their descendents have been loaded into the main module.
compositionReady.addSimpleEventHandler(function (success) {
$("#busyIndicator").hide();
$("#changePluginColorButton1").click(function () {
// after changePluginColorButton1 is clicked, the
// the function changeColorBackToBlue defined within the plugin
// will be called and will only affect APluginContainer1
bpf.control("#APluginContainer1").call("changeColorToBlue");
});
// after changePluginColorButton2 is clicked, the
// the function changeColorBackToBlue defined within the plugin
// will be called and will only affect APluginContainer2
$("#changePluginColorButton2").click(function () {
bpf.control("#APluginContainer2").call("changeColorToBlue");
})
});
// gets the plugin from file APlugin.html and inserts it into the
// element pointed to by the selector "#APluginContainer1"
bpf.cmpst.getPlugin("APlugin.html", null, "#APluginContainer1", compositionReady);
// gets the plugin from file APlugin.html and inserts it into the
// element pointed to by the selector "#APluginContainer2"
bpf.cmpst.getPlugin("APlugin.html", null, "#APluginContainer2", compositionReady);
});
</script>
|
By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.
If a file you wish to view isn't highlighted, and is a text file (not binary), please
let us know and we'll add colourisation support for it.
I am a software architect and a developer with great passion for new engineering solutions and finding and applying design patterns.
I am passionate about learning new ways of building software and sharing my knowledge with others.
I worked with many various languages including C#, Java and C++.
I fell in love with WPF (and later Silverlight) at first sight. After Microsoft killed Silverlight, I was distraught until I found Avalonia - a great multiplatform package for building UI on Windows, Linux, Mac as well as within browsers (using WASM) and for mobile platforms.
I have my Ph.D. from RPI.
here is my linkedin profile
Submit an article or tip