sequenceDiagram.php
Go to the documentation of this file.00001 <?php
00002 $strPageItem = "Sequence";
00003 require_once( "header.php" );
00004 require_once( "../public/codetodiagram.php" );
00005 $strXml = CorujaArrayManipulation::getArrayField( $_REQUEST , "xml" , "" );
00006 $booPost = ( $strXml != "" );
00007 if( $strXml == "" )
00008 {
00009 $strXml = file_get_contents ( '../examples/xmls/mvc.xml' );
00010 }
00011 $strXml = html_entity_decode( $strXml );
00012 $strXml = stripslashes( $strXml );
00013 $objXmlSequence = @UmlSequenceDiagramFactoryFromXml::getInstance()->setXml( $strXml )->perform();
00014 if( count( $objXmlSequence->getActors() ) > 0 )
00015 {
00016 $strTitle = CorujaArrayManipulation::getArrayField( $_REQUEST, "title" , 'Sequence Diagram' );
00017 $intFont = (integer)CorujaArrayManipulation::getArrayField( $_REQUEST , "font" , 60 );
00018 $intZoom = (integer)CorujaArrayManipulation::getArrayField( $_REQUEST , "zoom" , 60 );
00019 $booDetails = (boolean)CorujaArrayManipulation::getArrayField( $_REQUEST , "detais" , false );
00020
00021 UmlSequenceDiagramPrinterToHtml::getInstance()->
00022 getConfiguration()->
00023 setZoom( $intZoom )->
00024 setPercentFont( $intFont )->
00025 setShowDetails( $booDetails )->
00026 setEmbeded( true );
00027
00028 }
00029 else
00030 {
00031 $objXmlSequence = null;
00032 }
00033 ?>
00034 <div id="content">
00035 <div class="post">
00036 <h2 class="title"><a href="#">Sequence Diagram Web Editor</a></h2>
00037 <p class="meta">
00038 <span class="subtopic">Proposal</span>
00039 <span class="topic">Sequence Diagram Web Editor</span>
00040 </p>
00041 <div style="clear: both;"> </div>
00042 <div class="entry">
00043 <p>
00044 This tool can be used to create new Sequence Diagram without existing code
00045 as well to bring more richness and personalize diagrams created by a code execution
00046 or by some XML File,
00047 append to them notes of comments, colors, changing layout, or even to create a
00048 new sequence diagram based on some existing one.
00049 </p>
00050 <p>
00051 XML of Sequence Diagrams can be created by some different tool, into a different language. The
00052 Sequence Diagram Editor will receive the XML file by a POST and return the created diagram without any problems.
00053 The XML used it is much more simple of the XML of the UML XMI.
00054 </p>
00055 </div>
00056 <p class="meta">
00057 <span class="subtopic"> Design Pattern </span>
00058 <span class="topic">Sequence Diagram Web Editor</span>
00059 </p>
00060 <div style="clear: both;"> </div>
00061 <div class="entry">
00062 <div>
00063 <div class="comColunas">
00064 <div class="duasColunas">
00065 <p>
00066 The pattern used here was the factorys and printers.
00067 There is many factorys what builds UML sequence
00068 diagram objects and many options of printers what
00069 create a different result based on the UML sequence
00070 diagram object received.
00071 </p>
00072 </div>
00073 <div class="duasColunas">
00074 <img src="./images/flow_codetodiagram.png" id="flow_codetodiagram" />
00075 </div>
00076 </div>
00077 <p>
00078 If you have some special case, when any of the
00079 avaliable printers and factorys
00080 solve your problem, everthing it is extremly well
00081 <a href="http://www.thiagomata.com/codetodiagram/doc/dox/html/">doc</a>
00082 to help
00083 to you create new classes and append new features.
00084 </p>
00085 </div>
00086 </div>
00087 <p class="meta">
00088 <span class="subtopic"><a href="classDiagram.php#Class Diagram Web Editor">Comming Soon Features</a></span>
00089 <span class="topic">Sequence Diagram Web Editor</span>
00090 </p>
00091 <div style="clear: both;"> </div>
00092 <div class="entry">
00093 <p>
00094 As a web tool it has no plataform restriction and new features of colaborative edition using google wave and
00095 become a google application are into the planned features.
00096 </p>
00097 <p>
00098 The Sequence Diagram Web Tool is undergoing a complete rewrite phase,
00099 leaving to generate a static HTML output to generate an output on
00100 Javascript Canvas Web Tool, using CanvasBox where the diagram can be changed,
00101 saved, exported, etc. The HTML output can be one type of export output.
00102 </p>
00103 <p>
00104 As said above, <strong>The Sequence Diagram generation still is in working progress</strong>, some necessary features are missing,
00105 new features are append each day. You can help to accelerate this development making a <a href="#donation">donation</a>.
00106 </p>
00107 <p>
00108 Future features:
00109 </p>
00110 <ul>
00111 <li>
00112 Change the output from HTML to CanvasBox
00113 </li>
00114 <li>
00115 Rename Actors
00116 </li>
00117 <li>
00118 Move Actors and Messages
00119 </li>
00120 <li>
00121 Append Actors
00122 </li>
00123 <li>
00124 Append Messages
00125 </li>
00126 <li>
00127 Append Comments
00128 </li>
00129 <li>
00130 Zoom in / out
00131 </li>
00132 <li>
00133 Write XML File
00134 </li>
00135 <li>
00136 Read XML File
00137 </li>
00138 </ul>
00139 </div>
00140 <p class="meta">
00141 <span class="subtopic"><a href="classDiagram.php#Class Diagram Web Editor">What is already done?</a></span>
00142 <span class="topic">Sequence Diagram Web Editor</span>
00143 </p>
00144 <div style="clear: both;"> </div>
00145 <div class="entry">
00146 <p>w
00147 This is the actual version of the Sequence Diagram Web Editor what will
00148 be deprecated with the new canvas version. This actual version make possible
00149 read some XML file and created, based on it, a HTML page with the Sequence
00150 Diagram. This Sequence Diagram can not be edited except changing the XML
00151 File and recreating all the diagram.
00152 </p>
00153 <p>
00154 Actual implemented features:
00155 </p>
00156 <ul>
00157 <li>
00158 Read XML File
00159 </li>
00160 <li>
00161 Html Diagram Export
00162 </li>
00163 <li>
00164 Show Actors
00165 </li>
00166 <li>
00167 Show Messages
00168 </li>
00169 <li>
00170 Show Comments
00171 </li>
00172 <li>
00173 Show Messages Return
00174 </li>
00175 <li>
00176 Show Messages Parameters
00177 </li>
00178 <li>
00179 Code Instrumentation XML Sequence Diagram Generation
00180 </li>
00181 </ul>
00182 <div class="comColunas">
00183 <div class="duasColunas">
00184 <p>
00185 in a short preview <a href="https://www.assembla.com/code/codetodiagram/subversion/nodes/examples/ThreeLittlePigs/threeLittlePigs.php?rev=193">this code</a>:
00186 </p>
00187 <div class="php">
00188 <p class="line">
00189 <span class="tag"><?php</span>
00190 </p>
00191 <p class="line"><span
00192 class="function">require_once</span><span
00193 class="parenthesis">(</span><a
00194 href="https://www.assembla.com/code/codetodiagram/subversion/nodes/public/codetodiagram.php"><span
00195 class="string">'../../public/codetodiagram.php'</span></a><span
00196 class="parenthesis">)</span><span
00197 class="semicolon">;</span>
00198 </p>
00199 <p class="line"><span
00200 class="php_class">CodeToDiagram</span><span
00201 class="static_operator">::</span><span
00202 class="method">getInstance</span><span
00203 class="parenthesis">()</span><span
00204 class="caller">-></span><span
00205 class="method">start</span><span
00206 class="parenthesis">()</span><span
00207 class="semicolon">;</span>
00208 </p>
00209 <p class="line"><span
00210 class="function">require_once</span><span
00211 class="parenthesis">(</span><a
00212 href="https://www.assembla.com/code/codetodiagram/subversion/nodes/examples/ThreeLittlePigs/Wolf.class.php"><span
00213 class="string">'Wolf.class.php'</span></a><span
00214 class="parenthesis">)</span><span
00215 class="semicolon">;</span>
00216 </p>
00217 <p class="line"><span
00218 class="function">require_once</span><span
00219 class="parenthesis">(</span><a
00220 href="https://www.assembla.com/code/codetodiagram/subversion/nodes/examples/ThreeLittlePigs/House.class.php"><span
00221 class="string">'House.class.php'</span></a><span
00222 class="parenthesis">)</span><span
00223 class="semicolon">;</span>
00224 </p>
00225 <p class="line"><span
00226 class="function">require_once</span><span
00227 class="parenthesis">(</span><a
00228 href="https://www.assembla.com/code/codetodiagram/subversion/nodes/examples/ThreeLittlePigs/Pig.class.php"><span
00229 class="string">'Pig.class.php'</span></a><span
00230 class="parenthesis">)</span><span
00231 class="semicolon">;</span>
00232 </p>
00233 <p class="line"><span
00234 class="function">require_once</span><span
00235 class="parenthesis">(</span><a
00236 href="https://www.assembla.com/code/codetodiagram/subversion/nodes/examples/ThreeLittlePigs/History.class.php"><span
00237 class="string">'History.class.php'</span></a><span
00238 class="parenthesis">)</span><span
00239 class="semicolon">;</span>
00240 </p>
00241 <p class="line"><span
00242 class="new">new</span><span
00243 class="space"> </span><span
00244 class="object">History</span><span
00245 class="parenthesis">()</span><span
00246 class="semicolon">;</span>
00247 </p>
00248 <p class="line"><span
00249 class="tag">?></span>
00250 </p>
00251 </div>
00252 </div>
00253 <div class="duasColunas">
00254 <div>
00255 <p>
00256 Will bring to you this:
00257 </p>
00258 <p>
00259 <a style="border-style:none;" href="../examples/ThreeLittlePigs/threeLittlePigs.php">
00260 <img
00261 id="pig_small"
00262 src="./images/pigs_small.png"
00263 alt="three little pigs diagram automatically generated"
00264 longdesc="./images/pigs_small.txt"
00265 />
00266 </a>
00267 </p>
00268 </div>
00269 </div>
00270 </div>
00271 <div class="comColunas">
00272 <div class="duasColunas">
00273 <p>
00274 And this xml (click on xml to edit it):
00275 </p>
00276 <a name="draw"><span> </span></a>
00277 <div class="myXml" onclick="editXml()">
00278 <div id="myHightLightXml" title="click me to edit">
00279 <?php CorujaDebug::printXmlCode(
00280 ($strXml )
00281 );?>
00282 </div>
00283 <div id="editXml" title="tab to save">
00284 <form id="refreshXml" action="sequenceDiagram.php#draw" method="post" target="_self">
00285 <textarea id="textAreaXml"
00286 name="xml"
00287 onchange="refreshXml()"
00288 onblur="backToHightLight()"
00289 ><?php print $strXml; ?></textarea>
00290 </form>
00291 </div>
00292 </div>
00293 <script>
00294 function refreshXml()
00295 {
00296 document.getElementById( "refreshXml" ).target = "_self";
00297 document.getElementById( "refreshXml" ).submit();
00298 }
00299
00300 function editXml()
00301 {
00302 objHXml = document.getElementById( "myHightLightXml" );
00303 objEXml = document.getElementById( "editXml" );
00304 objHXml.style.display = "none";
00305 objEXml.style.display = "block";
00306 }
00307 function backToHightLight()
00308 {
00309 objHXml = document.getElementById( "myHightLightXml" );
00310 objEXml = document.getElementById( "editXml" );
00311 objHXml.style.display = "block";
00312 objEXml.style.display = "none";
00313 }
00314 function fullscreenMode()
00315 {
00316 document.getElementById( "refreshXml" ).action = "sequenceDiagramFullScreen.php";
00317 document.getElementById( "refreshXml" ).target = "_blank";
00318 document.getElementById( "refreshXml" ).submit();
00319 }
00320 </script>
00321 </div>
00322 <div style="width:100%;float:left">
00323 <p>
00324 Will bring to you this:
00325 </p>
00326 <div class="nostyle" id="sequendeDraw" onclick="fullscreenMode()" title="click to see in full screen">
00327 <?php
00328 if( $objXmlSequence != null )
00329 {
00330 print ( UmlSequenceDiagramPrinterToHtml::getInstance()->perform( $objXmlSequence ) );
00331 }
00332 else
00333 {
00334 ?>
00335 <strong> Invalid XML received </strong>
00336 <?php
00337 }
00338 ?>
00339 </div>
00340 </div>
00341 </div>
00342 </div>
00343 </div>
00344 <div class="post">
00345 <h2 class="title"><a href="#">Limitations</a></h2>
00346 <p class="meta">
00347 <span class="subtopic">Internet Explorer Output</span>
00348 <span class="topic">Limitations</span>
00349 </p>
00350 <div style="clear: both;"> </div>
00351 <div class="entry">
00352 <p>
00353 While still not fully working on <a href="http://www.findmebyip.com/litmus#target-selector">Internet Explorer</a>,
00354 the generator already makes life easier for those
00355 responsible in maintaining this kind of diagrams.
00356 We welcome anyone with the patience and desire to make the
00357 CSS changes need for it to work on Internet Explorer.
00358 </p>
00359 <p>
00360 The Sequence Diagram should migrate from HTML with CSS to Canvas Box
00361 what the <a href="classDiagram.php">Class Diagram</a> already is using. This should make more easy
00362 interaction events as drag and drop, save as image, etc. So big changes
00363 are comming to the Sequence Diagram Web Editor.
00364 </p>
00365 </div>
00366 <p class="meta">
00367 <span class="subtopic">Under Development</span>
00368 <span class="topic">Limitations</span>
00369 </p>
00370 <div style="clear: both;"> </div>
00371 <div class="entry">
00372 <p>
00373 Also, fully compliance with UML 2.0 is still under development.
00374 Anyone interested in working in these fields is more than welcome to join the team.
00375 And if you have a patch on add-on to send, feel free to do so.
00376 Just send an e-mail to me <a href="mailto:thiago.henrique.mata@gmail.com">thiago.henrique.mata@gmail.com</a> .
00377 And remember, this is free software, in development, and as such, I can give you no warranty.
00378 Use it at your own risk. It's not for the faint of heart.
00379 Tag names can and should change. New tags can be add anytime. Stay tunned for more news.
00380 </p>
00381 </div>
00382 </div>
00383 <div style="clear: both;"> </div>
00384 </div>
00385 <?php require_once( "footer.php" ); ?>
