benotman's blog

MDN 7/8/2015

I have tested the recent code I have done regarding having displayed and hidden diagrams. Every thing works fine. Testing was based on the two diagrams I already have and both of them are displayed. Selecting diagrams to be displayed or hidden will be in the diagram browser which I intend to do next along with some CSS work and further learning (especially CSS layout). I will need that to display diagrams nicely.

MDN 7/7/2015

I am still working on element hover and selection; what is new is the incorporation of the possibility of having displayed and hidden diagrams. In a site with multiple diagrams (e.g. more than two), a simple diagram browser is needed. Users can select the diagrams to be displayed on the page hiding the other diagrams. Adding this feature, I had to change some code in mouse_hover and mouse_click events. I am done with changing the code, I am testing all possibilities.

MDN 7/5/2015

I have finished coding svg click event (element selection); I am testing it now. In addition, I tried to make the code more readable by creating functions for repeated snippets of code.

MDN 7/3/2015

I am still working on element selection. I should have been done by now if I had not an error that consumed all my energy for today. for all the svg elements in one diagram, all click and mouseover events fire twice!! I did work around this issue in mouseMove but there was no way I can do that for mouseClick. I had to know the reason. I spent some time reading about event capturing and bubbling and tracing events in my widget.

MDN 7/2/2105

I worked less hours today as I was busy with family paperwork. I am still working on element selection. I thought I can save the original style of each diagram element in its dom element but that does not seem to work; both jQuery and regular dom methods return errors. I think that is because of the custom attribute I am adding to the svg. Now I am changing to passing a list of all diagram elements with their styles from php to javascript.

MDN 7/1/2015

Fixed the element hover bug, it works fine now. I am working on element selection (click). I will probably be done by Friday.

MDN 6.30.2015

I fixed the namespace error which turned out not to be related to svg namespaces. I finished element hover code (mouseover and mouseout events). In the beginning I used the code I made before which utilized ajax to retrieve connections from the database. I found out it is a little bit slow and unresponsive. I read about the issue of whether to use aj_ax to retrieve data frequently or load all or part of the data ahead of time. I like the latter option, so I changed the code to load connections in page loading time (using drupal add js settings). It is faster now as connections are saved in memory. The element hover works in one diagram but works partially on the other. The code does not unhighlight the elements in the mouseOut event. I am trying to find out why. I also submitted my evaluation form yesterday.

MDN 6.28.2015

Today I was thinking about the algorithm and the implementation for two main operations; the first one is element selection (mouse click) which is the event when a user selects a diagram element and related elements in other diagrams are highlighted. The second operation is element hover (when a user hover the mouse over an element) which also highlights related elements in other diagrams. The difference between the two operations is that hover effect is short and terminated when mouse_out happens while selection persist until the use unselect elements.

I researched the possibility of using CSS classes to change element styles (color). I found out that only CSS3 has support to 'initial' class which changes back an element style to its original style. Because I need this feature (to unhighlight elements) I decided to use my own mechanism to save element styles before changing them so I can change them back. The mechanism will probably include using Javascript variables and arrays and also saving data in the svg elements (in the DOM) for simplicity.

Finally, in the last hour, I am having an error in chrome only (no error in IE) related to namespaces. I will try to find out the cause for that.

MDN 6/26/2015

I added some code to the svg loader to cover the case of no uploaded diagrams. I also tested the loader with few examples. Having the loader prepare svg in the back-end made front-end coding easier; the code that hides svg elements was easy and straight forward. Basic mouse hover functionality (highlighting elements in other diagrams) should also be straight forward as I have experimented with this before.

MDN 6/25/2015

I finished id assignment to SVG files and SVG elements. I started coding this yesterday and I used direct database access using db_query and sql statements. Today I changed the code to use a Drupal generic function 'EntityFieldQuery'. Also I used to add javascript to svg files using string manipulation; I changed that to use DOM in php since it is cleaner and I am already using DOM to manipulate the SVG content. The new version of loading svg files and id assignment is complete and working; further testing will be be done tomorrow.

Syndicate content