1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124
|
<html>
<head>
<meta http-equiv="Pragma" content="no-cache"/>
<meta http-equiv="Cache-Control" content="no-cache"/>
<meta http-equiv="Expires" content="-1" />
<title>Web Services - Sample 14: Multi-Origin with JavaScript API buffered commands</title>
<style><!--
a{text-decoration:none;
padding: 1px;
background-color: #dddddd}
--></style>
<script src="json2.js"></script>
<script src="pymol.js"></script>
<script type="text/javascript">
// This page assumes that PyMOL is running on localhost:8084
var pymol = new PyMOL('localhost', 8084, 'on'); // create PyMOL instance with buffering enabled
var cmd = pymol.cmd; // assign a global symbol for the PyMOL cmd API
function part2(list) {
for(var i=0;i<list.length;i++) {
cmd.color("auto","chain "+list[i]);
}
pymol.flush()
}
function part1() {
cmd.reinitialize();
cmd.load("$PYMOL_PATH/test/dat/1tii.pdb");
cmd.show_as("cartoon");
cmd.get_chains(part2, "polymer");
}
</script>
</head>
<body>
<h3>Web Services - Sample 14: Multi-Origin with JavaScript API buffered commands</h3>
<a href="http://localhost:8084/apply/_quit?href">quit pymol</a>
(FireFox only: <a href="javascript:void(0)" onclick="window.open('view-source:' + location.href)">view page source</a>)
<p>PyMOL should open up automatically when this page is loaded because
we have an hidden IFRAME referencing a PWG file which tells PyMOL
to launch and listen on port 8084.</p>
<p>As usual in the multi-origin scenario, the host and port of the
PyMOL server must be specified when creating the PyMOL object inside
JavaScript. However, to enable buffering, we also add a third
argument: 'on'.</p>
<pre>
var pymol = new PyMOL('localhost', 8084, 'on'); // create PyMOL object with buffering enabled
var cmd = pymol.cmd; // assign a global symbol for the PyMOL cmd API
</pre>
<p>Enabling buffering prevents the problem where all PyMOL requests
run in an <i>undefined</i> order (in certain browsers). However,
requests must still of course run asynchrously in order to work around
the same-origin policy.</p>
<p>The trick to using buffering in the multi-origin (cross-domain) scenario is to remember three things:</p>
<ol>
<li>PyMOL API calls are not actually invoked unless you provide a
callback function or call pymol.flush().</li>
<li>The value returned from the final method call is the argument
provided to the callback function.</li>
<li>Method invocation is asynchronous, but will be in-order and
completed by the time the callback is called.</li> </ol>
<p>So when you need to flush the buffer and force execution, you
simply provide a callback function, which will be called after all of
the prior requests have been evaluated. This enables us to simplify
the burdensome example from Sample 12 with its four cascading
functions into just two functions.</p>
<pre>
function part2(list) {
for(var i=0;i<list.length;i++) {
cmd.color("auto","chain "+list[i]);
}
pymol.flush()
}
function part1() {
cmd.reinitialize();
cmd.load("$PYMOL_PATH/test/dat/1tii.pdb");
cmd.show_as("cartoon");
cmd.get_chains(part2, "polymer");
}
Start the cascade with a call to <a href="javascript:part1()">part1()</a>
</pre>
<p>Note that we are considering adding a buffered mode to the PyMOL
JavaScript interface which would improve performance by reducing the
number of independent HTTP requests and provide an in-order-execution
guarantee for multiple requests even when running asynchronously
(under the multi-origin scenario).</p>
<p>Also, exceptions which occur in PyMOL are not presently returned to
the JavaScript layer (though this may change).</p>
<!-- the only purpose of this IFRAME is to launch PyMOL via the PWG
-- helper mechanism -->
<iframe src="start8084.pwg"
width="0" height="0" frameborder="0"
marginheight="0" marginwidth="0"
scrolling="auto"></iframe>
</body>
</html>
|