tag:blogger.com,1999:blog-360794722024-03-12T23:09:31.355-07:00 Sandip Chitale's BlogUnknownnoreply@blogger.comBlogger169125tag:blogger.com,1999:blog-36079472.post-49133350776503253752019-03-04T21:34:00.000-08:002019-03-05T11:37:01.105-08:00Open .java file for .class file<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="height: 0px; text-align: left;">
<br /></div>
<div>
<a href="https://www.eclipse.org/m2e/index.html" target="_blank">M2Eclispe</a> supports resolution of dependencies from Workspace projects. With this you can click on a method from dependency owned class, M2Eclipse will automatically load the .java file for that .class file from. This is fine and dandy as long as your projects are Maven based. No fear...I wrote a simple Eclipse plugin to do just that - Open .java file for .class file.<br />
<br /></div>
<h3 style="text-align: left;">
</h3>
<h3 style="text-align: left;">
How it works</h3>
<div>
<br /></div>
<div>
Monitors the opening of a .class editor. Then uses the JDT Java search mechanism to locate the corresponding .java file in any of the Java projects in the Eclipse workspace. It also tries to move the caret to the same offset in .java file. By default closes the .class file, however by setting a preference you can opt-in to not close the .class file. The association of source folder with the .jar file containing the .class file is required for this to work.</div>
<h4 style="text-align: left;">
</h4>
<h4 style="text-align: left;">
Preferences</h4>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdMQiDdjb_sgcKGhM5d_rHtXkoKH_6_QLE_si7fvm3e-3YMWj1uUXwnsacthyht9CilKA6NrYgDcnqW10BbVh97Io8aBbFcqhyphenhyphene12Wm7Nxy_lnj9wiKQeJPM6_DAsQtJkRz54t/s1600/preferences.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="228" data-original-width="768" height="190" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdMQiDdjb_sgcKGhM5d_rHtXkoKH_6_QLE_si7fvm3e-3YMWj1uUXwnsacthyht9CilKA6NrYgDcnqW10BbVh97Io8aBbFcqhyphenhyphene12Wm7Nxy_lnj9wiKQeJPM6_DAsQtJkRz54t/s640/preferences.png" width="640" /></a></div>
<div>
<br /></div>
<h4 style="text-align: left;">
Github</h4>
<div>
https://github.com/sandipchitale/odjfdc<br />
<br /></div>
<h4 style="text-align: left;">
Update site</h4>
<div>
<span style="background-color: white; color: #24292e; font-family: , "blinkmacsystemfont" , "segoe ui" , "helvetica" , "arial" , sans-serif , "apple color emoji" , "segoe ui emoji" , "segoe ui symbol"; font-size: 16px;">https://sandipchitale.github.io/odjfdc/OpenDotJavaForDotClassUpdateSite/site.xml</span><br />
<span style="background-color: white; color: #24292e; font-family: , "blinkmacsystemfont" , "segoe ui" , "helvetica" , "arial" , sans-serif , "apple color emoji" , "segoe ui emoji" , "segoe ui symbol"; font-size: 16px;"><br /></span>
<span style="background-color: white; color: #24292e; font-family: , "blinkmacsystemfont" , "segoe ui" , "helvetica" , "arial" , sans-serif , "apple color emoji" , "segoe ui emoji" , "segoe ui symbol"; font-size: 16px;"></span><br />
<h4 style="text-align: left;">
Eclipse Marketplace</h4>
</div>
<div>
<span style="background-color: white; color: #24292e;">https://marketplace.eclipse.org/content/open-java-file-class-file</span></div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-66507905293960918972019-02-27T01:04:00.002-08:002019-03-19T15:22:09.424-07:00Devtools App (Angular)<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="text-align: left;">
<br />
UPDATE: Release 1.0.8 Load devtools code ignoring cache by CTRL+SHIFT+Clicking when launching devtools.<br />
<br />
UPDATE: Release 1.0.7 also allows using the Chrome devtools master branch as your devtools frontend.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtLY2ioxDyy0gEMYMAvU0SRh8M7aWUmJxZEeH7S5SpbFC46QWm2ukaDNjl6np1f7XNwUXbDiDkYsGJRy4johmgV7UWPeI1nMBXAtzixBXOzN_n9_PW5s7RuwxcekgeczeadFmA/s1600/devtoolsappng1.0.7.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="700" data-original-width="1000" height="448" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtLY2ioxDyy0gEMYMAvU0SRh8M7aWUmJxZEeH7S5SpbFC46QWm2ukaDNjl6np1f7XNwUXbDiDkYsGJRy4johmgV7UWPeI1nMBXAtzixBXOzN_n9_PW5s7RuwxcekgeczeadFmA/s640/devtoolsappng1.0.7.png" width="640" /></a></div>
<br />
<br />
UPDATE: <b>Go to members all files</b> will go to source mapped location when available. Also builds a cache (WeakMap) first time so subsequent invocations are very fast.<br />
<br />
UPDATE: Version 1.0.6 is released. Download from Github <a href="https://github.com/sandipchitale/DevtoolsAppNG/releases" target="_blank">releases</a> page.<br />
<br />
I have implemented a <a href="https://angular.io/" target="_blank">Angular</a> based Devtools App using <a href="https://electronjs.org/" target="_blank">Electron framework</a>. It allows you to use any hosted Chrome Devtools instance as your devtools frontend. For example, by default it will load my <a href="https://github.com/sandipchitale/gotomemberallfiles" target="_blank">enhanced</a> Chrome Devtools which implements the <b>Go to members all files </b>( Ctrl+Shift+8 on windows, Command+Shift+8 on mac) action. With this you can find and navigate to classes, functions and properties in all the loaded scripts not only in active source script editor.<br />
<br />
If you are debugging an app written in Typescript e.g. Angular app, make sure to <b>Enable JavaScript source maps </b>in Settings to take full advantage of <b>Go to members all files </b>functionality.</div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<b>Screenshot</b></div>
<div style="text-align: left;">
<b><br /></b>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifz0dneTn8Z82PhQs0dlK9eCRrAKSaiVASw3ku747cAfM2nXuDcu2ujnxa5u3nDVgMteuCE0oAzFMvyfr8H6vjhqYVF6e1xso38m50QA5kSYwsCbQO30ZLl3Fgci8k_IfbdJfZ/s1600/devtoolsappng.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="700" data-original-width="1000" height="448" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifz0dneTn8Z82PhQs0dlK9eCRrAKSaiVASw3ku747cAfM2nXuDcu2ujnxa5u3nDVgMteuCE0oAzFMvyfr8H6vjhqYVF6e1xso38m50QA5kSYwsCbQO30ZLl3Fgci8k_IfbdJfZ/s640/devtoolsappng.png" width="640" /></a></div>
<b><br /></b></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div style="text-align: left;">
<b><br /></b></div>
<div style="text-align: left;">
<b><a href="https://github.com/sandipchitale/DevtoolsAppNG" target="_blank">Github repository for Devtools App (Angular)</a> </b>The README in the repository explains how to use it.</div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<a href="https://github.com/sandipchitale/DevtoolsAppNG/tree/master/distribution" target="_blank">Download</a> the distribution zip.</div>
<div style="text-align: left;">
<br /></div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-33500829285426667632018-01-01T12:38:00.001-08:002018-01-01T12:40:08.596-08:00Moving to MediumI have decided to publish on Medium.com. You can follow my posts <a href="https://medium.com/@sandipchitale">there</a>.
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-1698301966935126252016-12-22T20:03:00.002-08:002016-12-22T20:04:19.441-08:00Charcoal<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_IltAqywK-LvEQUgv-XXH2EiuxFUp7yK_VRf_Q0LBUXwrEfhvtR-oSc22SFZVn3KLvH3cZTxXaEk1T8TK4E8YPlRw6ghlLa_0md0YPENATCl57OsNZ3saHvHXug-Nw-ibKMFB/s1600/charcoal2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_IltAqywK-LvEQUgv-XXH2EiuxFUp7yK_VRf_Q0LBUXwrEfhvtR-oSc22SFZVn3KLvH3cZTxXaEk1T8TK4E8YPlRw6ghlLa_0md0YPENATCl57OsNZ3saHvHXug-Nw-ibKMFB/s400/charcoal2.jpg" style="border: 60px solid black;" width="400" /></a></div>
<div style="text-align: center;">
<br /></div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-48960153548411707892016-12-22T12:21:00.000-08:002016-12-22T20:04:41.433-08:00Lady in a hat II<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-v_jyuc0h5W8ikoLjmF1id-KN3C-1eLWvhD7kQ7MvlBPfGMMPjEei-DBJ2W1p_oazssnc0umnsqnLQyUdmPOnBX8opaD7o8KMTQ_2n0qyHoiooaPf95c187s1QpYfHTRlkv6B/s1600/ladyinahat4painted.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-v_jyuc0h5W8ikoLjmF1id-KN3C-1eLWvhD7kQ7MvlBPfGMMPjEei-DBJ2W1p_oazssnc0umnsqnLQyUdmPOnBX8opaD7o8KMTQ_2n0qyHoiooaPf95c187s1QpYfHTRlkv6B/s320/ladyinahat4painted.png" style="border: 60px solid black;" width="317" /></a></div>
<br /></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-1325641747888681462016-12-22T12:19:00.003-08:002016-12-22T20:04:55.237-08:00Lady in a hat I<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQegfcFWZxkJU9HayBii13esw2VoBwaGnGVqiJXzdUEH6wb0Pxo0QERuMMQXvOtULvOv9loS-_8hlTUH_5EtQ1YyrnsHwST2xV9gPscadybOr6SmaqRsfJCI7Psu9gp4VaWLfM/s1600/ladyinahat2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="317" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQegfcFWZxkJU9HayBii13esw2VoBwaGnGVqiJXzdUEH6wb0Pxo0QERuMMQXvOtULvOv9loS-_8hlTUH_5EtQ1YyrnsHwST2xV9gPscadybOr6SmaqRsfJCI7Psu9gp4VaWLfM/s320/ladyinahat2.png" style="border: 60px solid black;" width="320" /></a></div>
<br /></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-71059085732873154642016-12-22T12:17:00.001-08:002016-12-22T20:05:09.914-08:00Dogwood<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="text-align: center;">
<nobr>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhl10KWJxe3SvQ6v0ccC0oHmwsZAB-GB_InAQQ8RQIHGInDKb2EkTcLX7zW72LsvpR4DfY3ybUEvdjTAYKFdXky2dlRb9dy-O99xrWW8x9PnG2sCvUEqkzsyvswCMu_tXkKqz5G/s1600/dogwoodc.png" imageanchor="1"><img border="0" height="199" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhl10KWJxe3SvQ6v0ccC0oHmwsZAB-GB_InAQQ8RQIHGInDKb2EkTcLX7zW72LsvpR4DfY3ybUEvdjTAYKFdXky2dlRb9dy-O99xrWW8x9PnG2sCvUEqkzsyvswCMu_tXkKqz5G/s200/dogwoodc.png" width="200" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPNvzVE20qWVaNA2rNUXSiRLtYn3cLpGGFA6fP5XEwkZxX8wM4s2AJjhNE58ECMHNN0sALbTtGTkRIo3atgO9fm2HWpxyMtRfevSMVUU8s6D6g3OtF2ox0tNnkn4LNMFbRdDHH/s1600/dogwoodb.png" imageanchor="1"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPNvzVE20qWVaNA2rNUXSiRLtYn3cLpGGFA6fP5XEwkZxX8wM4s2AJjhNE58ECMHNN0sALbTtGTkRIo3atgO9fm2HWpxyMtRfevSMVUU8s6D6g3OtF2ox0tNnkn4LNMFbRdDHH/s200/dogwoodb.png" width="200" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCAxvGbe_RKIQExsWOi2KBzNtkwPM1xEn3Nw9Pw-sDqx8PaFztIl_df6uAuIUcQlyhZN_hu1CcMTW_tueRniVZ5mVNf6Ego3kLi5hhRYRpW1zqgDRhT7Z6Dq-24dm6QRvnTdIM/s1600/dogwooda.png" imageanchor="1"><img border="0" height="196" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCAxvGbe_RKIQExsWOi2KBzNtkwPM1xEn3Nw9Pw-sDqx8PaFztIl_df6uAuIUcQlyhZN_hu1CcMTW_tueRniVZ5mVNf6Ego3kLi5hhRYRpW1zqgDRhT7Z6Dq-24dm6QRvnTdIM/s200/dogwooda.png" width="200" /></a>
</nobr>
</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-7165019003082624182016-12-22T12:06:00.003-08:002016-12-22T20:05:27.484-08:00Sculpture from tree root from side yard<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_-O6_9wJYepP1wLYhkKz5mnwo6Z6qjTsH4kwYuoQq-yCP8ZUZ0QFYnOzY4i-QUN75inM2vQuaAA6R7nyjYG4V5RAExUA2-8hP9s2hACunMeEngFHQ-2smgRyZiPpLsWLHSHlY/s1600/sculpture.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_-O6_9wJYepP1wLYhkKz5mnwo6Z6qjTsH4kwYuoQq-yCP8ZUZ0QFYnOzY4i-QUN75inM2vQuaAA6R7nyjYG4V5RAExUA2-8hP9s2hACunMeEngFHQ-2smgRyZiPpLsWLHSHlY/s1600/sculpture.png" style="border: 60px solid black;" /></a></div>
<div style="text-align: center;">
<br /></div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-2753532230902371832016-09-27T23:43:00.001-07:002016-10-02T16:36:26.059-07:00Light Cone Animation<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
I generated this animation of Past and Future <a href="https://en.wikipedia.org/wiki/Light_cone" target="_blank">Light Cone</a>s of a stationary point object with vertical line as it's world line using Mathematica. As such the each light cone should sweep a (pencil-like cylendrical) shape as time passes, but I am showing the light cones at any given moment only. Also the cones extend to + ve and -ve infinite time as such.</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSPMRG0NDyKfTLhy8Vp11VANj8q1kjuw1yvYdT5fweO92Bgswam8Vb58ppkM8oCsVObhTPf0FDrRI5sQp3QAFDL-_Q8Q5QcEVXok5x2vmTVDdGvCzj2n9ZHMLqcJUkWzhtJx5h/s1600/LightCones.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSPMRG0NDyKfTLhy8Vp11VANj8q1kjuw1yvYdT5fweO92Bgswam8Vb58ppkM8oCsVObhTPf0FDrRI5sQp3QAFDL-_Q8Q5QcEVXok5x2vmTVDdGvCzj2n9ZHMLqcJUkWzhtJx5h/s1600/LightCones.gif" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
The vertical axis is time axis with unit t seconds.</div>
<div class="separator" style="clear: both; text-align: center;">
The z=0 is the <b>NOW</b> plane showing two (not three) dimensional space. The normalized unit for space axes is ct, where c is the speed of light. Thus distance of 1 in x or y direction is the distance travelled by light in 1 second.</div>
<div class="separator" style="clear: both; text-align: center;">
That gives us 45 degree sloped light cones.</div>
<div class="separator" style="clear: both; text-align: center;">
The downward moving planes are future moments, becoming NOW and then the past moments.</div>
<div class="separator" style="clear: both; text-align: center;">
The top cone is the Future cone.</div>
<div class="separator" style="clear: both; text-align: center;">
The bottom cone is past cone.</div>
<div class="separator" style="clear: both; text-align: center;">
The vertical line is the world line of a stationary point object.</div>
<br /></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-79799407166338755132016-09-25T17:51:00.001-07:002016-09-26T21:08:21.638-07:00Mathematica<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkIf9LAbSBeEshbugBpah83AeJ2cCMhDrSb2RJzRXSiwtcL7ldBP1MrcAZ6mgRCk-mgGtZgRrH9m4AkiUIx2L8ENUHtWkOjccJv0tk43S0cujHaEb3nohPlRd9gvgGlmFcqnrq/s1600/CosSin.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkIf9LAbSBeEshbugBpah83AeJ2cCMhDrSb2RJzRXSiwtcL7ldBP1MrcAZ6mgRCk-mgGtZgRrH9m4AkiUIx2L8ENUHtWkOjccJv0tk43S0cujHaEb3nohPlRd9gvgGlmFcqnrq/s1600/CosSin.png" /></a></div>
<br />
I started playing with Mathematica this weekend. Here is a simple widget to plot Cos and Sin functions on Unit circle. You may have to force evaluate the cell by clicking on <b>Gear > Evaluate Cell</b>.<br />
<iframe frameborder="0" height="900" src="https://www.wolframcloud.com/objects/02c9321f-212e-4a30-a629-b51818b795a0?_view=EMBED" width="600"></iframe>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-40721826139384525032016-08-20T14:53:00.002-07:002016-08-20T14:53:54.182-07:00Console magic<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; padding: 0px; vertical-align: baseline;">
You can detect duplicate ids by evaluating this Javascript expresssion in Chrome devtools console:</div>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; padding: 0px; vertical-align: baseline;">
<br /></div>
<pre style="background-color: white; border: 0px; color: #494848; font-size: 13px; line-height: 19.5px; overflow-x: auto; padding: 0px; vertical-align: baseline;">([].slice.call(document.querySelectorAll("[id]")))
.map(function(ele){ return ele.id;})
.sort()
.reduce(function(countMap, word) {countMap[word] = ++countMap[word] || 1;return countMap}, {})
</pre>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; min-height: 8pt; padding: 0px; vertical-align: baseline;">
<br /></div>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; padding: 0px; vertical-align: baseline;">
<span style="border: 0px; font-family: inherit; font-size: 13.3333px; font-style: inherit; font-weight: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">Boom! You will get:</span></div>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; padding: 0px; vertical-align: baseline;">
<span style="border: 0px; font-family: inherit; font-size: 13.3333px; font-style: inherit; font-weight: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><br /></span></div>
<pre style="background-color: white; border: 0px; color: #494848; font-size: 13px; line-height: 19.5px; overflow-x: auto; padding: 0px; vertical-align: baseline;">> Object {
id1: 1, </pre>
<pre style="background-color: white; border: 0px; color: #494848; font-size: 13px; line-height: 19.5px; overflow-x: auto; padding: 0px; vertical-align: baseline;"> id2: 1,
some-other-id: 1,
duplicate-id: 2
…
}
</pre>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; padding: 0px; vertical-align: baseline;">
<strong style="border: 0px; font-family: inherit; font-style: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><br /></strong></div>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; padding: 0px; vertical-align: baseline;">
<strong style="border: 0px; font-family: inherit; font-style: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">What is going on here:</strong></div>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; min-height: 8pt; padding: 0px; vertical-align: baseline;">
<br /></div>
<ul style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; margin: 0px; padding: 0px 0px 0px 30px; vertical-align: baseline;">
<li style="border: 0px; font-family: inherit; font-style: inherit; font-weight: inherit; list-style-type: inherit; margin: 0.5ex 0px; padding: 0px; vertical-align: baseline;">document.querySelectorAll() returns the NodeList of elements that have <strong style="border: 0px; font-family: inherit; font-style: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">id </strong>attribute</li>
<li style="border: 0px; font-family: inherit; font-style: inherit; font-weight: inherit; list-style-type: inherit; margin: 0.5ex 0px; padding: 0px; vertical-align: baseline;">slice() - converts a NodeList to a JavaScript Array</li>
<li style="border: 0px; font-family: inherit; font-style: inherit; font-weight: inherit; list-style-type: inherit; margin: 0.5ex 0px; padding: 0px; vertical-align: baseline;">map() - converts elements array to array of id strings</li>
<li style="border: 0px; font-family: inherit; font-style: inherit; font-weight: inherit; list-style-type: inherit; margin: 0.5ex 0px; padding: 0px; vertical-align: baseline;">sort() - sorts the array. If you evaluate only up to here you will get the sorted list of ids (with duplicates)</li>
<li style="border: 0px; font-family: inherit; font-style: inherit; font-weight: inherit; list-style-type: inherit; margin: 0.5ex 0px; padding: 0px; vertical-align: baseline;">reduce() - creates an object with id value as key and number of occurrences as value</li>
</ul>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; min-height: 8pt; padding: 0px; vertical-align: baseline;">
<br /></div>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; padding: 0px; vertical-align: baseline;">
Additionally, if you add Object.keys(resultFromAbove).sort() you will get a sorted list of <strong style="border: 0px; font-family: inherit; font-style: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">unique</strong> ids.</div>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; min-height: 8pt; padding: 0px; vertical-align: baseline;">
<br /></div>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; padding: 0px; vertical-align: baseline;">
Also an example of Map-Reduce <span aria-label="Happy" class="emoticon-inline emoticon_happy" style="background: url("../images/emoticons/happy.png") no-repeat; border: 0px; display: inline-block; font-family: inherit; font-style: inherit; font-weight: inherit; height: 16px; margin: 0px; padding: 0px; vertical-align: baseline; width: 16px;"></span></div>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; min-height: 8pt; padding: 0px; vertical-align: baseline;">
<br /></div>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; padding: 0px; vertical-align: baseline;">
BTW you can use similar, slightly modified selector expression to list the CSS classes that are used on the page and also mow many times.</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-40565650392685360432016-08-15T00:54:00.001-07:002016-08-16T07:20:09.070-07:00Appear on hover<div dir="ltr" style="text-align: left;" trbidi="on">
Recently I needed a way to have controls for resizing appear on hover using pure CSS. I wanted allow progressive discovery of the feature to collapse the panels but did not want have a clutter of controls. I also wanted that once the user learns about the new feature they can directly access it by moving their mouse there and clicking.<br />
<br />
I did it using <span style="font-family: Courier New, Courier, monospace;">:nth-child(1)</span>, :<span style="font-family: Courier New, Courier, monospace;">nth-child(2)</span>, and <span style="font-family: Courier New, Courier, monospace;">:hover</span> pseudo classes. For the pair on left hand side, <b><span style="color: red;">the key idea is that</span></b>, I had to use <span style="font-family: Courier New, Courier, monospace;">display:inline-block;</span> on the container span and <span style="font-family: Courier New, Courier, monospace;">float: left;</span> style on :<span style="font-family: Courier New, Courier, monospace;">nth-child(2)</span>to get around the CSS limitation of not being able to use a following sibling in markup order to affect the style of preceding sibling.<br />
<br />
Do you have better suggestions?<br />
<iframe allowfullscreen="allowfullscreen" frameborder="0" height="360" src="//jsfiddle.net/sandipchitale/3tb0d6g9/32/embedded/result/" width="100%"></iframe></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-12432453340448995632016-08-13T14:50:00.002-07:002016-08-13T15:14:46.215-07:00A simple gradle plugin to print the task execution graph of a gradle build.<div dir="ltr" style="text-align: left;" trbidi="on">
Here is a <a href="https://gist.github.com/sandipchitale/fc68e2d2f6eeb411900125263165043e" target="_blank">gist</a> for a simple gradle plugin implementation that can generate an HTML report of your gradle build's Task Execution Graph.<br />
<br />
Here is a sample output for a simple project:<br />
<br />
<pre>↦ :clean - Deletes the build directory.
↦ :build - Assembles and tests this project.
┖ :assemble - Assembles the outputs of this project.
┖ :jar - Assembles a jar archive containing the main classes.
┖ :classes - Assembles main classes.
┖ :compileJava - Compiles main Java source. ⊣
┖ :processResources - Processes main resources. ⊣
┖ :check - Runs all checks.
┖ :test - Runs the unit tests.
┖ :classes - Assembles main classes. ↑
┖ :testClasses - Assembles test classes.
┖ :compileTestJava - Compiles test Java source.
┖ :classes - Assembles main classes. ↑
┖ :processTestResources - Processes test resources. ⊣
</pre>
<br />
To use it simply apply it in your build.gradle like so:<br />
<br />
<pre>:
:
apply from: 'build-task-graph.gradle'
:
:
</pre>
<br />
And then run any build like this;<br />
<br />
<pre>> .\gradlew -m clean build</pre>
<br />
and find the output report in:<br />
<br />
<pre>build/reports/printteg.html
</pre>
<pre>
</pre>
<pre></pre>
It should be a simple exercise to generate hyperlinked output or alternatively emit a .dot file graph or even generate SVG.<br />
<br />
I use this to determine which tasks I should exclude using the -x flag and only (carefully) run the ones I need. Of course you have to know what you are doing. The idea is similar to my <a href="https://marketplace.eclipse.org/content/maven-phases-and-goals" target="_blank">Maven Phases and Goals</a> plugin.<br />
<br />
Feedback welcome!<br />
<div>
</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-74229541525466578462016-08-09T16:20:00.001-07:002016-08-09T16:28:23.807-07:00Angular 2 - template reference variable shadows the component property<div dir="ltr" style="text-align: left;" trbidi="on">
<div dir="ltr" style="text-align: left;" trbidi="on">
Given the Angular 2 component:<br />
<br />
<span style="font-family: "courier new" , "courier" , monospace;">import { Component } from '@angular/core';</span><br />
<br />
<span style="font-family: "courier new" , "courier" , monospace;">@Component({</span><br />
<span style="font-family: "courier new" , "courier" , monospace;"> moduleId: module.id,</span><br />
<span style="font-family: "courier new" , "courier" , monospace;"> selector: 'app-root',</span><br />
<div style="-webkit-text-stroke-width: 0px; color: black; font-family: "Times New Roman"; font-size: medium; font-style: normal; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: normal; letter-spacing: normal; line-height: normal; margin: 0px; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px;">
<span style="font-family: "courier new" , "courier" , monospace;"> template: '<div ref-<span style="background-color: yellow;">title</span>></span><span style="font-family: "courier new" , "courier" , monospace;">{{<span style="background-color: yellow;">title</span>}}</span><span style="font-family: "courier new" , "courier" , monospace;"><</span><span style="font-family: "courier new" , "courier" , monospace;">/div></span><span style="font-family: "courier new" , "courier" , monospace;">',</span></div>
</div>
<span style="font-family: "courier new" , "courier" , monospace;"> styleUrls: ['app.component.css']</span><br />
<span style="font-family: "courier new" , "courier" , monospace;">})</span><br />
<span style="font-family: "courier new" , "courier" , monospace;">export class AppComponent {</span><br />
<span style="font-family: "courier new" , "courier" , monospace;"> <span style="background-color: #ea9999;">title</span> = 'app works!';</span><br />
<span style="font-family: "courier new" , "courier" , monospace;">}</span><br />
<br />
you get this on the webpage:<br />
<br />
[object HTMLDivElement]<br />
<br />
The reason is that <a href="https://angular.io/docs/ts/latest/guide/template-syntax.html#!#ref-vars" target="_blank">Template Reference Variable</a> <span style="font-family: "courier new" , "courier" , monospace;">ref-title </span>shadows the <span style="font-family: "courier new" , "courier" , monospace;">title</span><span style="font-family: "courier new" , "courier" , monospace;"> </span>of <span style="font-family: "courier new" , "courier" , monospace;">AppComponent</span><span style="font-family: "courier new" , "courier" , monospace;"> </span>when evaluating <span style="font-family: "courier new" , "courier" , monospace;">{{title}}.</span><br />
<span style="font-family: "courier new" , "courier" , monospace;"><br /></span>
I guess this is sort of like the loop variables inside an<br />
<br />
<span style="font-family: "courier new" , "courier" , monospace;"><li *ngFor="let <span style="background-color: yellow;">title</span> in titles">{{<span style="background-color: yellow;">title</span>}}</li></span><br />
<br />
But something does not feel right about TRV.</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-17263107991985559992016-08-07T22:23:00.000-07:002016-08-07T22:24:01.317-07:00A simple Weather App using Angular 2, Angular Material 2 and Electron<div dir="ltr" style="text-align: left;" trbidi="on">
Working on a simple Weather App using<br />
<br />
<ul style="text-align: left;">
<li><a href="http://electron.atom.io/" target="_blank">Electron</a></li>
<li><a href="https://angular.io/" target="_blank">Angular 2</a></li>
<li><a href="https://material.angular.io/" target="_blank">Angular Material 2</a></li>
</ul>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLjLXAtLD4Wch3nvkWWRuFr-3GNeqc_MYD1_uzD_MiXwvomh7IzEHqz7Of1euPZHZLI3K2WQZjrNw3sz8SorPsVm4lVS8Dqz95myhgyzpC2kUXVxVfv667isSlyGqFiYslNUq0/s1600/WeatherApp.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLjLXAtLD4Wch3nvkWWRuFr-3GNeqc_MYD1_uzD_MiXwvomh7IzEHqz7Of1euPZHZLI3K2WQZjrNw3sz8SorPsVm4lVS8Dqz95myhgyzpC2kUXVxVfv667isSlyGqFiYslNUq0/s640/WeatherApp.png" width="451" /></a></div>
<div>
Also runs as a standard web app.</div>
<div>
<br /></div>
<div>
Built using</div>
<div>
<br /></div>
<div>
<ul style="text-align: left;">
<li><a href="https://cli.angular.io/" target="_blank">Angular CLI</a></li>
</ul>
</div>
<div>
<br /></div>
<div>
<a href="https://github.com/sandipchitale/WeatherApp" target="_blank">GitHub</a></div>
<div>
<br /></div>
<div>
Will document the details soon!</div>
<br />
<br />
<br /></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-44979641665987388272016-06-05T18:49:00.001-07:002016-06-05T18:49:29.798-07:00Weekend Hack<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="background-color: white; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px;">I recently acquired a tripod with Bluetooth remote for my smart phone. The tripod is only up to 10 inches tall and works very well indoors when you have something to perch it on.</span><br />
<span style="background-color: white; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px;"><br /></span>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsNhXWcgyve4lTNsVLzXwumCgKU8TrKJcD6tQISxgCTF9hl5SsnwvY806h3oPUIEnzMHr5pLXGe4jLrTvDLYhgjfM3btV26Lu6E8nQGXdNpeDupopW48ER5TeNUNbrfAKUFCSa/s1600/monpod.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsNhXWcgyve4lTNsVLzXwumCgKU8TrKJcD6tQISxgCTF9hl5SsnwvY806h3oPUIEnzMHr5pLXGe4jLrTvDLYhgjfM3btV26Lu6E8nQGXdNpeDupopW48ER5TeNUNbrfAKUFCSa/s1600/monpod.jpg" /></a></div>
<span style="background-color: white; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px;"><br /></span>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; padding: 0px; vertical-align: baseline;">
However I wanted to a taller, up to 5 feet tall monopod, which I can use to video record my son's <a class="jive-link-external-small" href="http://cdn.rawgit.com/sandipchitale/nusic/1.20/site/index.html#/music" rel="nofollow" style="border: 0px; color: #0077aa; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; padding: 0px calc(12px + 0.35ex) 0px 0px; text-decoration: none; vertical-align: baseline;">outdoor or theater concerts</a>. I hacked it with some material that I could find in the garage:</div>
<div style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; min-height: 8pt; padding: 0px; vertical-align: baseline;">
<br /></div>
<ul style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; margin: 0px; padding: 0px 0px 0px 30px; vertical-align: baseline;">
<li style="border: 0px; font-family: inherit; font-style: inherit; font-weight: inherit; list-style-type: inherit; margin: 0.5ex 0px; padding: 0px; vertical-align: baseline;"><span style="border: 0px; font-family: inherit; font-size: 10pt; font-style: inherit; font-weight: inherit; line-height: 1.5em; margin: 0px; padding: 0px; vertical-align: baseline;">L bracket as the base</span></li>
<li style="border: 0px; font-family: inherit; font-style: inherit; font-weight: inherit; list-style-type: inherit; margin: 0.5ex 0px; padding: 0px; vertical-align: baseline;"><span style="border: 0px; font-family: inherit; font-size: 10pt; font-style: inherit; font-weight: inherit; line-height: 1.5em; margin: 0px; padding: 0px; vertical-align: baseline;">a </span><span style="border: 0px; font-family: inherit; font-size: 10pt; font-style: inherit; font-weight: inherit; line-height: 1.5em; margin: 0px; padding: 0px; vertical-align: baseline;">conduit clip and knob to hold the PVC pipe</span></li>
</ul>
<div>
<span style="color: #494848; font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 13.3333px; line-height: 20px;"><br /></span></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgl6ufvGHbCqKTm5vq1DAkyIjnJ72czjYlQa1sR1Gsim5NPUEbuxmR-6n-tC0xdzjLRA0eRlmBaREJ5hTeavgg8oV_sZltwsUb8k0gZWRYlAmD_GlFdx4crlDac1i8zM4PISkWX/s1600/LBracket.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="348" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgl6ufvGHbCqKTm5vq1DAkyIjnJ72czjYlQa1sR1Gsim5NPUEbuxmR-6n-tC0xdzjLRA0eRlmBaREJ5hTeavgg8oV_sZltwsUb8k0gZWRYlAmD_GlFdx4crlDac1i8zM4PISkWX/s400/LBracket.jpg" width="400" /></a></div>
<div>
<span style="color: #494848; font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 13.3333px; line-height: 20px;"><br /></span></span></div>
<ul style="background-color: white; border: 0px; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px; margin: 0px; padding: 0px 0px 0px 30px; vertical-align: baseline;">
<li style="border: 0px; font-family: inherit; font-style: inherit; font-weight: inherit; list-style-type: inherit; margin: 0.5ex 0px; padding: 0px; vertical-align: baseline;"><span style="border: 0px; font-family: inherit; font-size: 10pt; font-style: inherit; font-weight: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">PVC pipe</span></li>
<li style="border: 0px; font-family: inherit; font-style: inherit; font-weight: inherit; list-style-type: inherit; margin: 0.5ex 0px; padding: 0px; vertical-align: baseline;">velcro to firmly hold the tripod</li>
<li style="border: 0px; font-family: inherit; font-style: inherit; font-weight: inherit; list-style-type: inherit; margin: 0.5ex 0px; padding: 0px; vertical-align: baseline;"><br /></li>
</ul>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh37H0_-XVG50MCjuWGGiXH_4kDjmnUf4b3vKODwEj6w8k0XstNXqsYBZSQEBj6wJoe-GTmhuLdsjPBwMy41kDe4D85vbWV0SXEbV-HkOxsgAZNB3pK0LFql2bHJODj5pA9vUvU/s1600/Velcro.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh37H0_-XVG50MCjuWGGiXH_4kDjmnUf4b3vKODwEj6w8k0XstNXqsYBZSQEBj6wJoe-GTmhuLdsjPBwMy41kDe4D85vbWV0SXEbV-HkOxsgAZNB3pK0LFql2bHJODj5pA9vUvU/s1600/Velcro.jpg" /></a></div>
<div>
<span style="color: #494848; font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 13px; line-height: 19.5px;"><br /></span></span></div>
<div>
<span style="color: #494848; font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 13px; line-height: 19.5px;"><br /></span></span></div>
<div>
<span style="background-color: white; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px;">Here is the result</span></div>
<div>
<span style="background-color: white; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px;"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9vbbmy8W8mktOgbTnrqHsHw2WB6_bkvP7-691P3O7zU8a77Y0zIWEzE131_ENV_2wzPYUnVjGhjFho3-Kfsl7HZflQvzyLi1F0r5oyq6AzaxIK4nGDAxbcwZMs6qJwJVPjZeM/s1600/monpodhack.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9vbbmy8W8mktOgbTnrqHsHw2WB6_bkvP7-691P3O7zU8a77Y0zIWEzE131_ENV_2wzPYUnVjGhjFho3-Kfsl7HZflQvzyLi1F0r5oyq6AzaxIK4nGDAxbcwZMs6qJwJVPjZeM/s1600/monpodhack.jpg" /></a></div>
<div>
<span style="background-color: white; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px;"><br /></span></div>
<div>
<span style="background-color: white; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px;"><br /></span></div>
<div>
<span style="background-color: white; color: #494848; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 19.5px;">Do you have any hacking ideas you would like to share?</span></div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-70397604841176419392016-06-02T22:45:00.003-07:002016-06-02T22:45:51.641-07:00Try this repeatedly in your browser console...<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="font-family: Courier New, Courier, monospace;">var party = Math.random(), country = Math.random(), what = (party >= country ? 64783292855 : 2569542479746150); 'party=' + party + ' country = ' + country + ' party/county = ' + what.toString(36);</span></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-56278298087311547642016-05-06T17:50:00.000-07:002016-05-06T17:50:01.295-07:00Try this in your browser console...<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="background-color: #fefefe; color: #212121; font-size: 14px; line-height: 20px; white-space: pre-wrap;"><span style="font-family: Courier New, Courier, monospace;">var party = 64783292855, country = 1; alert((party/country).toString(36));</span></span></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-91491488416985470762016-05-06T07:59:00.001-07:002016-05-06T09:07:12.947-07:00Thinking.oO { Party/Country != Patriotism , Party/Country == Treason }<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="font-family: "courier new" , "courier" , monospace;">var party = 0;</span><br />
<span style="font-family: "courier new" , "courier" , monospace;">var country = 1;</span><br />
<span style="font-family: "courier new" , "courier" , monospace;">var result = [ 'Treason', 'Patriotism' ];</span><br />
<span style="font-family: "courier new" , "courier" , monospace;"><br /></span>
<script>
function computePartyOverCountry() {
var party = 0;
var country = 1;
var result = [ 'Treason', 'Patriotism' ];
alert(result[party/country]);
return false;
}
</script>
<span style="font-family: "courier new" , "courier" , monospace;">party/county = <button onclick="computePartyOverCountry();">?</button></span></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-10985209404394084342016-04-25T22:29:00.001-07:002016-04-26T19:09:51.296-07:00Electronic eyes<div dir="ltr" style="text-align: left;" trbidi="on">
<div id="face">
<svg height="50" width="100">
<circle cx="25" cy="25" fill="white" r="20" stroke-width="4" stroke="black"></circle>
<circle cx="25" cy="25" fill="black" id="lefteye" r="4" stroke-width="0"></circle>
<circle cx="75" cy="25" fill="white" r="20" stroke-width="4" stroke="black"></circle>
<circle cx="75" cy="25" fill="black" id="righteye" r="4" stroke-width="0"></circle>
</svg>
</div>
<script>
function load() {
function getOffset( el ) {
var _x = 0;
var _y = 0;
while( el && !isNaN( el.offsetLeft ) && !isNaN( el.offsetTop ) ) {
_x += el.offsetLeft - el.scrollLeft;
_y += el.offsetTop - el.scrollTop;
// chrome/safari
el = el.parentNode;
}
return { top: _y, left: _x };
}
const face = document.querySelector('#face');
const lefteye = document.querySelector('#lefteye');
const righteye = document.querySelector('#righteye');
let lastCp = {x: null, y: null};
let lastWp = [null, null];
document.onmousemove = function(event) {
let wpTL = getOffset(face);
let wp = [wpTL.left, wpTL.top];
let cp = {x: event.screenX, y: event.screenY};
if (cp.x === lastCp.x && cp.y === lastCp.y && wp[0] === lastWp[0] && wp[1] === lastWp[1]) {
return;
}
lastCp = cp;
lastWp = wp;
let deltaX = cp.x - (wp[0] + 25);
let deltaY = -(cp.y - (wp[1] + 25));
let theta = Math.atan2(deltaY, deltaX);
deltaX = Math.cos(theta)*10;
deltaY = Math.sin(theta)*10;
let lefteyeX = 25 + deltaX;
let lefteyeY = 25 - deltaY;
deltaX = cp.x - (wp[0] + 75);
deltaY = -(cp.y - (wp[1] + 25));
theta = Math.atan2(deltaY, deltaX);
deltaX = Math.cos(theta)*10;
deltaY = Math.sin(theta)*10;
let righteyeX = 75 + deltaX;
let righteyeY = 25 - deltaY;
lefteye.setAttribute ('cx', lefteyeX);
lefteye.setAttribute ('cy', lefteyeY);
righteye.setAttribute('cx', righteyeX);
righteye.setAttribute('cy', righteyeY);
};
}
window.onload = load;
</script>
<div style="text-align: center;">
<br />
<a href="https://github.com/electron/electron" target="_blank">Electron</a>ic <a href="https://github.com/sandipchitale/eyes" target="_blank">eyes</a><br />
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
Fun!</div>
</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-87663938855269780362016-04-24T14:52:00.001-07:002016-04-25T23:23:31.263-07:00Electron based POM360<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQERbSzJatjRd9ehnK9s5JaWtjegtpjUBs_ceGOXOv8NEezDHIAE4k0aMZh-rKs50htJ77d6Gj-q36GbP4omGQqfmVYxKpyqqU1szJMrcRw41urk2wAZ50vq6lXx1IbAFCO0TI/s1600/pom360.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="448" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQERbSzJatjRd9ehnK9s5JaWtjegtpjUBs_ceGOXOv8NEezDHIAE4k0aMZh-rKs50htJ77d6Gj-q36GbP4omGQqfmVYxKpyqqU1szJMrcRw41urk2wAZ50vq6lXx1IbAFCO0TI/s640/pom360.png" width="640" /></a></div>
<br />
<span style="background-color: white; color: #666666; font-family: "trebuchet ms" , "trebuchet" , "verdana" , sans-serif; font-size: 13.2px; line-height: 18.48px;">A simple </span><a href="https://github.com/sandipchitale/ePOM360" style="background-color: white; color: #888888; font-family: 'Trebuchet MS', Trebuchet, Verdana, sans-serif; font-size: 13.2px; line-height: 18.48px; text-decoration: none;" target="_blank">POM360</a> <span style="background-color: white; color: #666666; font-family: "trebuchet ms" , "trebuchet" , "verdana" , sans-serif; font-size: 13.2px; line-height: 18.48px;">tool to get a 360 view of Maven POM. It is developed using </span><a href="https://github.com/electron/electron" style="background-color: white; color: #888888; font-family: 'Trebuchet MS', Trebuchet, Verdana, sans-serif; font-size: 13.2px; line-height: 18.48px; text-decoration: none;" target="_blank">Electron</a><span style="background-color: white; color: #666666; font-family: "trebuchet ms" , "trebuchet" , "verdana" , sans-serif; font-size: 13.2px; line-height: 18.48px;"> framework. It uses </span><span style="background-color: white; color: #666666; font-family: "courier new" , "courier" , monospace; font-size: 13.2px; line-height: 18.48px;">mvn </span><span style="background-color: white; color: #666666; font-family: "trebuchet ms" , "trebuchet" , "verdana" , sans-serif; font-size: 13.2px; line-height: 18.48px;">command.</span></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-12147532902621945742016-04-23T23:31:00.000-07:002016-04-25T23:24:00.492-07:00Electron based Portmon tool<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK_745iYDs9RYCGfLoGKq29WM65QBPsxlNz3_oV0l79Q0-Mhq_rPotASWdiwbjS0xqW2Lzgi36fhqpSFbmtPWrZ_7H5fSzUd54gJXVIL1ptPmKt6TH0-D9ghzJf6Zl_02AsQ2J/s1600/portmon.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="480" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK_745iYDs9RYCGfLoGKq29WM65QBPsxlNz3_oV0l79Q0-Mhq_rPotASWdiwbjS0xqW2Lzgi36fhqpSFbmtPWrZ_7H5fSzUd54gJXVIL1ptPmKt6TH0-D9ghzJf6Zl_02AsQ2J/s640/portmon.png" width="640" /></a></div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
A simple <a href="https://github.com/sandipchitale/eportmon" target="_blank">Portmon </a>tool to monitor listening TCP ports and associated PIDs. It is developed using <a href="https://github.com/electron/electron" target="_blank">Electron</a> framework. It uses <span style="font-family: "courier new" , "courier" , monospace;">netstat</span>.<br />
<br />
NOTE: Works on windows only at the moment.<br />
<div>
<ul style="text-align: left;">
</ul>
</div>
<div>
<br /></div>
<br />
<br /></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-6499760419727760352016-04-19T15:55:00.001-07:002016-04-19T15:55:17.912-07:00Brilliant rendition of Feeling Good by Neel Chitale<div dir="ltr" style="text-align: left;" trbidi="on">
<iframe allowfullscreen="" frameborder="0" height="360" src="https://lh3.googleusercontent.com/KYTsJfJlwr579QAOTin0npnGiOIAHtza5hozcVvsYRDJxOO8wKEnDj76nPLY8sj2rOFzz_s0jG8866IkQdWhGqm90wbov66CXPvjYMCwR0eDc6pY6zOVwtKlH_zsQJx4cxplPMKxhq-m4zG_f-guYkWM5IsfE3tjFE3Ci6fhTB44DjOhWiJYerJ8Kze6lBnaLYefVXKLArEnhf0-mHbxe48sJl0Si5RqgEPxT1EZ-NQB4Vqqk2ueGaa623NEw9ZzG8w47-v4Os1_vLJzZjzR-nZ4vss6AQsSg9SYPltlzgqmiiaBR4WMgTcJ-rhGelcR8IVBLXOdD68kmPirHZaIXERfJCYSG_kwTHl0S17K1S-_od1TRNz3WIlsPjJCPJSMt12GmRvWXtgC_bgtskSZMLA4e2CnLk9kdw_iRGcS-iaMkScwohyQzrQvRJvlwVXjJ_FzvZgK43MWCpSettg7_DM63fkxOoIs4K24weL4Wp644Ed4-p3c6HXCnkPMM4c5EAytHMxK80zBSV0kBoYhUhoFbaQjZpmV1KDkoHB2yYBU2508GCcPAM8_von209XOK8eS=m22?cpn=G31ovPA7ftb6qsxW&c=WEB&cver=1.20160414" width="640"></iframe>
</div>
Unknownnoreply@blogger.com1tag:blogger.com,1999:blog-36079472.post-10418982679570318902016-03-20T13:36:00.000-07:002016-03-20T13:36:00.199-07:00Roots<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAOcimIxTEfpjXH6HHU1947VfbRXjSVOViaHmwsJeZQu2ZqvAwlZENa97XDFVMvrmSn1au7ptQsBQqDMpWaXcAdM4fApncxJ0RFBguJ2MZsrZhtNiJekRdcQMM95r4qghF_oYb/s1600/roo1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAOcimIxTEfpjXH6HHU1947VfbRXjSVOViaHmwsJeZQu2ZqvAwlZENa97XDFVMvrmSn1au7ptQsBQqDMpWaXcAdM4fApncxJ0RFBguJ2MZsrZhtNiJekRdcQMM95r4qghF_oYb/s400/roo1.jpg" style="border: 30px solid black;" width="225" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigy3UkaD2273OTKo7hrKtBroTxJomy2rY_m7DCXdrUToF_9pbNTDXsgVwissgPupHQYd8IpOsi_eRMJ7QFyWPvK7-SJZopw2lUJt6T_KLIvUSFTpiJ37sXxFhYdnYCy64m-3_c/s1600/20160320_103846.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigy3UkaD2273OTKo7hrKtBroTxJomy2rY_m7DCXdrUToF_9pbNTDXsgVwissgPupHQYd8IpOsi_eRMJ7QFyWPvK7-SJZopw2lUJt6T_KLIvUSFTpiJ37sXxFhYdnYCy64m-3_c/s400/20160320_103846.jpg" style="border: 30px solid black;" width="226" /></a></div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-36079472.post-7668692092362074072016-03-13T13:38:00.003-07:002016-03-13T13:41:06.973-07:00Orange<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0cOc54YhL1kqy5PA-_C1Rk7pGP6L1SFOqtM__OrSV4D0BzyV1NlT7aUX_6xMmTbVg6d0T-PXNiM6PprKUeDWjrJE0gGnEd13va8N9_wxIEcZhEN3n1q6pNDJDqjsnaMzkGxZi/s1600/orange1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0cOc54YhL1kqy5PA-_C1Rk7pGP6L1SFOqtM__OrSV4D0BzyV1NlT7aUX_6xMmTbVg6d0T-PXNiM6PprKUeDWjrJE0gGnEd13va8N9_wxIEcZhEN3n1q6pNDJDqjsnaMzkGxZi/s400/orange1.jpg" style="border: 20px solid black;" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW0J9Cyn2CYaJdbJsk3Yyy6O3nufcSnrrELx4Y264fahts-JWs_3ZXVe_zVrotxRzY__IrYxnGV-RHpYESnT_mulJ9cX4mhQk2OU-Uk5NfbFcp6tpC_l3FM3257FPHUPoPOdCu/s1600/orange2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW0J9Cyn2CYaJdbJsk3Yyy6O3nufcSnrrELx4Y264fahts-JWs_3ZXVe_zVrotxRzY__IrYxnGV-RHpYESnT_mulJ9cX4mhQk2OU-Uk5NfbFcp6tpC_l3FM3257FPHUPoPOdCu/s400/orange2.jpg" style="border: 20px solid black;" width="400" /></a></div>
<br /></div>
Unknownnoreply@blogger.com0