List of public pages created with Protopage

Untitled 3

Rich sticky notes

Welcome to 24hoursperday's Protopage.

This is my protopage to do some prototype :P


  trace("ekn8 :: " + SGui.HelloWorld);

Contents(+3)  :-
Crumb Trail.
Work Product State Machine.
Internet Explorer 7
Vertical Bargraph.
Element Listing.
Refactor Class.


January 2006
    Prototype crumbtrail history.

February 2006
    Prototype crumbtrail history.
    Research about IE7 for flash default context menu.
    Workproduct state machine!!

March 2006
    My prototype's lost T_T. Let's do it again.
    WPSM : understand it and fixed issues.
    Research IE7
  Vertical Bar chart
    Element Listing
Edit prototype follow requirement

April 2006
    Edit prototype  
    Clean code, Refractor code analysis, popUp enhancement analysis

May 2006
    Refractor class
    PopUp enhancement

Untitled 4

Rich sticky notes


2006-01-19 :
add 1st problem, add 2nd problem, add progress

2006-01-20 :
add progress.

2006-01-23 :
add more detail in progress panel.

2006-01-24 :
add problem ! and progress.

2006-01-25 :
add problem ! and progress.

2006-01-26 :
add progress.

2006-01-27 and 30 :

2006-01-31 :

please see next page >>>>

The problem 01

1. How can I detect crumb menu item ??

            I can't find the solution to detect it. As for now I modified anything from
            This means that any menu items was defined already and it is Static items.
            So it can be detected, for example, by use "if(oEvent.menuitem.attributes.instancename = PanelOptionsItemType.MAXIMIZE)".

            But for this case any menu items is Dynamic items because it'll be redefined everytime after clicked at "Triangle sign" to show the last trails.


~ C R U M B T R A I L ~

This page is written for 'CrumbTrail' prototype.

Progress & Solution I

2006-01-19 :

  After discuss with RK
            Keep object in array, for example, var m_keep_trails = new Array(); then m_keep_trails.push(obj);
            After try this solution I can detect any attributes of  menu item but  I can not show crumbtrail string.  (Because join operation can be used with string only not for object.)
2006-01-20 :

push Object in m_keep_trail then can show list of last trails and can detect menu item also but...Now link properties is not go along with trail list.
2006-01-23 :

Now Last trails can be used basically
- Keep last trail then show after click last trail menu.
- Navigate to any page in last trail.
2006-01-24 :

            PASSED :: Now I can delete duplicate link but still face with some problem. That is array does not push last item in array but for next time to show trail It'll be back ?!?
2006-01-25 :

            PASSED :: There are some problem about REFRESH thing. It like problem above ^  but now it happen especially for refresh by crumbtrail.onPress

I try to set flag to check for REFRESH operation from trail item.
:: Add condition to check If have no last trail list (in first page :: Home page), Crumbtrail history should not show anything but now it show dot.
2006-01-26 :

          Try to 'makeShortenedTrail' to show in history. but....
           PASSED :: Clone from
'makeShortenedTrail' to create new function 'makeShortenedTrailBeforeJoin' then it's work!!
           PASSED :: After resize IE window, Trails will be refreshed. So I have to find out...who call refresh in trail class?!?   >> ตอนนี้เกือบสำเร็จแระ แต่...ต้องหาวิธีกำจัด undefined id ที่มากับ trail หลังจากปรับหน้าต่างไปแล้วน่ะ // ไม่สำเร็จแระ มันส่งผลกระทบไปอีกหลายๆอย่างเรย ท่าทางต้องหาวิธีใหม่ซะแร้วว :(

2006-01-27 :
          ลบตัวสุดท้ายไปแร้วแต่ทำไมมันไม่หายไปฟระ ?!? (เริ่มเซง)
          ตอนนี้มันหายไปได้แร้ว ทำไมมันกลับมาอีกฟระ ?!? (เซงมากขึ้น!)
          For this case it should be POP before collect in array. Because after i try to detect  last item in array then pop it. for next time it will come back again.

2006-01-30 :
Restart with new solution!!.....Still can not find the solution.  Y_Y
          I rearrange my code (so clean). oh! commenting also.
          Finally i can find it out. The solution is very easy. (นั่งโง่อยู่ตั้งนาน...เซง)  That is  move  position of  this.keepLastTrails( ); Former call it in setSize so if resize IE window. It sure that setSize will be called. So bug happen.  As for now move it to addItem( ) .Thus it won't be call again after resize IE window. :)
2006-01-31 :

Yesterday, After move this.keepLastTrails( ); to addItem( ). It make some bug happen about refresh by crumb trail.
          The solution is add new condition about refresh by crumb trail. if(this.m_click_refresh == true) to check and then set crumb_value; If it is not refresh by crumb trail, don't care about it.
          Library session ::
เพิ่มเติมรายละเอียด : - ถ้าเราเข้าใช้งานใน Library ใดใดแร้ว
   - จากนั้น เราไปเข้า package ที่เป็นของ Library อื่นๆ
   - ที่นี้ กลับไปเข้าหน้า My Libraries อีกครั้ง
   - เลือก crumb trail history ที่เป็น package ของ Library อื่นเมื่อกี้นี้อ่ะ
   - มันจะกลายป็นว่า ทีนี้ไปเข้า Library นั้นแทนเรย.....หยั่งงี้ถูกอ๊ะป่าวหว่า?!? << ซึ่งคงต้องรอ requirement อ่ะนะ

          After debug it i found that :: These trails have same id.
My Libraries > Optimistic > padapuppa(from One fine day) 
016a86fcc0a8016d8054ace42c73c5d3  C  016a86fcc0a8016d1fbb1ab22d000a14  C  screen_12

My Libraries > One fine day > padapuppa

016a86fcc0a8016d8054ace42c73c5d3  C  016a86fcc0a8016d1fbb1ab22d000a14  C  screen_12

ตอนนี้มีบั้กเกี่ยวกะอันนี้อยู่อันนึงน๊ะ คือถ้าทำตาม step ที่เขียนไว้ข้างบนแร้ว มันจะเกิด link ที่มี trail string แต่ trail id เป็น undefined อ่ะ

2006-02-01 :

            ตอนนี้ไม่ call this.compareTrail( ); แล้ว เหลือไว้แค่ this.compareProperties( ); อันเดียว
            โดยการ POP ค่าสุดท้ายใน array นั้น จะเปรียบเทียบจาก Trails id เอาแล้ว POP ค่ามันออก โดย POP ค่าของทั้งสอง array เลยน๊ะ >> m_keep_property_trails.pop(); และ m_last_trails.pop();

            พักทำ performance testing...ของ element catalog

2006-02-02 :

          Try to do BACK and NEXT... ไม่ต้องทำอันนี้แร้ว เย่เย่เย่

          ทีนี้ต้องมาปรับ crumbTail ก่อนน๊ะ ให้เวลากดแร้ว History เหลือแค่อันก่อนหน้าก้อพอ ไม่เอาอันอื่นๆแร้วอ่ะ << ยากวุ้ย !!

2006-02-03 :

Summary of yesterday :: Add condition and function to check selected item then pop other item ::
1. Detect and keep ID of selected item. (From both history menu and crumb trail)
2. At the bottom of  trailToShow function will call traceBack function
3. traceBack function is compare loop (compare ID from selected item with item in array. Then pop above items.)

          Make "Unit test case" for history trail prototype.

2006-02-06 :

Fixed HierarchicalMenu bug... For LC, LPD, Package diagram in main menu will increase one more item in trail history.
The solution
:: Add _global.PMUI.trail.setShift(true); for these 3 case.

          Fixed show DOT after click trail history icon in first page which trail history doesn't show anything.
The solution :: Add condition in showCrumbTrailsMenu to check item in array then HIDE or SHOW trail history.

2006-02-07 :

          Let's try onRollOver crumbTrail.
          Now i can use setInterval to do this thing. But sometimes i face with bug about infinity loop to show trail history. - -"

          SetInterval  is not the solution. Because of onMouseOver will show trail history after mouse over crumb trail. Even just over then out, but it will wait for awhile then show.

2006-02-14 :
Change new method but finally it looks like SetInterval   - -".
So.. failed again Y_Y.

2006-02-20-21-22 :
After fix #5935, There are something changed about updating. So Let's check prototype again.
         Trail history should be update after processPackage's name is updated.
          I'm still find the solution of this bug. (-..-)

I've changed something about POP method >> Using SPLICE instead of POP operation so it'll keep updated data instead of old data.

2006-02-23-24 :

Enhance trail history. So confuse (-"-)?

2006-03-13 :

          Start implementing for lost things Y_Y.
1. Change new method to update trail history after processPackage's name is updated.

2006-03-14 :

1. TraceBack from MENU.
2. TraceBack from Context MENU.
3. TraceBack from CrumbTrail.

Fixed show DOT after click trail history icon in first page which trail history doesn't show anything.
The solution :: Add condition in showCrumbTrailsMenu to check item in array then HIDE or SHOW trail history.
if(m_keep_trails.length <= 1) HIDE else SHOW

Very well function
It is compareIDforTraceBack.

2006-03-15 :

1. delete link from discipline detail page.

2006-03-17 :

1. fixed show DOT on hamepage.
Now  i'd tested every functions for my prototype .

Relate files+
PMUI.fla (Library)

The problem 02

2. How can I navigate that menu item??

          After 1st problem, If i want to navigate to any pages it will use Intellinavigate( ).
          This function use lots of properties of NavObj :- LibraryId, LibraryName, accessRightType, lockedBy.


Progress & solution II

2006-03-21 :

          Edit prototype follow new requirement.
1. Add icon !!!
2006-03-21-24 :

          4 days that i spend about basic attchMovieClip -*- . Now i understand about attachMovieclip, but for CellRenderer i understand just basic thing. And i think Movieclip will work more cellrenderer.


Recent trails can be shown. (just show)

long time ago till now
2006-04-11 I'm lazy to update this log. - -"
but today i want to update because this is second prototype after change all algorythm - -"

          As for now the progress of prototype is 50%. For the 50% left, I have to wait for requirement otherwise i will sad again - -"

These are ready implementing :-
         - show
         - hide
         - selectable
         - hilight
         - BG color
         - border color
         - tooltip

Detail :-

1. addItem( ) :  
    - call getInfoTrail( )
                - looping to keep properties in object tmpObj
                - define icon
                - push in array m_keep_caption_trails
            - edit seperator in last item from ">" to " "
                - unshift in array  m_add_trails

Now prototype is done :
          1. Can show icon in front of caption in crumb trail menu.
          2. BACK and FORWARD operation can be used. (but
algorithm might be changed follow requirement again. TT )

How's it work?
Get information from crumb trail.
          Use array to keep all information about trail (ex :- caption, saparator, link, libraryID, packageID,  ID, libraryName, packageName,  packageType, lockBy, accessRightType, toolTip). Keep them in object (tmpObj)
          Then indicate icon by check "link.location" and "packageType"
          These information that mentioned above is 1 trail for current page. It means Library name > Package name > Diagram name (ex :- now open [workflow diagram] of package [imaginarist] of [Optimistic] library, It will keep all information of Optimistic, imaginarist and workflow daigram.
          After that keep everything in array (m_keep_caption_trails)

          Now we got 1 row for crumb trail menu.
          Set seperator for last item in this row. (from ">" to "blank")
          Set tooltip for this row.
          Since got 1 row already, so keep it in crumb trail menu array
          Keep it in array for crumb trail menu (m_add_trails)
         Check ID : check that new ID in array (current page) is already exist in crumb trail menu array?
If yes > do nothing / If no > splice array
อันนี้เป็นการใช้ในกรณีที่เข้าหน้าใหม่โดยที่มันไม่ได้มีข้อมูลเก็บไว้ใน array ฉะนั้นมันจะทำการ ตัดฝั่ง FORWARD ออกให้หมด
       Set index :
check that new ID in array (current page) is already exist in crumb trail menu array?
If yes > set index / If no > do nothing.
อันนี้เป็นการเซตค่า index เอาไว้เพื่อแบ่งข้อมูลใน array ออกเป็น 2 ส่วน เพื่อไว้แสดงในส่วนของ BACK และ FORWARD น่ะ

       All mentioned above are the method that keep information from trail.
         Later are the method to show crumb trail menu after click BACK or FORWARD icon.

         @ BACK icon, after click on it.
          It will call "showBackTrailMenu" function. This function will draw crumb trail menu. by use information that we prepare already in frist section 
It will draw each row of menu by start from "index+1" to "m_add_trails.length" (b cos using UNSHIFT operation to keep information in m_add_trails)

        Firstly it will draw icon then draw caption then draw separator and continue draw if still have information. After draw already we will get 1 row for crumb trail item. So we can set properties for this row.

        Setting properties wil use properties from last item in this row, B cos last item is key to go to new page.

        Then draw background for this row. and set function for this row :- onRelease, onRollOver, onRollOut

        Finally draw border of crumb trail menu and trail area to check if click out of crumb trail menu area.

@ FORWARD icon, after click on it.
Use the same algorithm as BACK icon.
       But  loop will start from "index-1" to "0" and use decrease loop also.

PS.see picture.


The problem 03

*   Show last 10 trails in trail menu.

*   Duplicate trails :- Trails which use the same link or When refresh by current trail, It'll always make one more trail.

*   Shortened trails.

*   The first page (Home page) :- trail history should not be shown.

*   After Resize IE windows Trails will be refreshed, So It increase one moer trails history.

*   There sre some problem about Library session.(waiting for requirement would better)

Just my option :: How can i do with NEXT and BACK operation. (Like a Firefox's button). :: I think I should wait for REQUIREMENT before do this thing, otherwise it will make me mad. :P

*   Detect item that click on last 10 trails then pop item above out.

*   Go to these pages by main menu :- LPD, LC, Package diagram. It will increase trail in history. (Try to compare & pop with that link.)

*    onMouseOver about 3 seconds then show trail history.

*   #5935 effect to my prototype. แก้แร้วแต่..ยังมีปันหาบางอย่างที่ต้องถามจาก requirement

Question 01+

There are some Question?? ::

1.) In trail history, It should be updated or not? after processPackage's name updated. I mean previous trail string, not new trail string.

2.) If user click on other crumb (not last crumb) What happen with trail?

3.) - ถ้าเราเข้าไดอะแกรมใดใดไปเรื่อยๆ จนใน history มีครบทุกไดอะแกรมเรย

     - จากนั้นเลือกเข้าไดอะแกรมที่เคยเข้ามาแร้ว  กรณีนี้.. ใน history จะเป็นยังงัย 
             > traceback ไปยัง link  นั้น  (ตอนนี้ Prototype ทำแบบนี้อยู่) หรือ
             > Add เข้าไปใหม่ แต่ detect ได้ว่ามีแร้วจึง pop ออก

4.) ที่หน้า discipline detail ต้องเอามาเก็บไว้ใน history หรือไม่

5.) ใน Trail history นั้นสามารถแสดง trail ล่าสุดได้ 10 บรรทัด ถ้ามันเกินแร้วล่ะ จะต้องทำอย่างไรกับมัน
             > ลบ
             > เก็บไว้ก่อน แร้วค่อยโชว์อีกทีตอนที่ trail ถูก traceBack ไปจนเหลือไม่เกิน 10 บรรทัด

The problem 04

Question 02+


Crumb Trail Menu Array

Untitled 5

Rich sticky notes

Work product state machine.

Relate files+




2006-02-28 - 2006-03-03
ศึกษา files ต่างๆ ที่เกี่ยวข้อง..

#3200 replicate it.

             - View page : now i use dummy value. still wait for real XML format to test my implement.
             - State element : make it smooth by increase stroke to 2. and decrease alpha to 50.

             - Ask Yos about files that he didn't commit.
             - Yos already send me some files.
           After apply source files from Yos. (add new format for XML >> ! [ CDATA [    ] ]   ). The special characters from issue description ( & < > \ ) don't make IRIS Error again. but for \ character it have some bug.
          Another bug (comma , character) we will wait for UI team before. To change to XML format.

To Do +

- View page for WPSM. (Wait for real XML format.)
          - Check allowable state ว่า effect มั้ย??
          - #5534 คุยกะยศว่า commit อะไรไปบ้างรึป่าว
          - เก็บส่วน Show circle นั้นเอาไว้ก่อนนะ
          - ศึกษา XML ที่รับมาตอน first load และตอนถูก sent ไป

          - #5534
remind RK to talk with RM about this scenario on Monday (2006-03-13).

Untitled 6


Relate link

Rich sticky notes

ex for IE6

<script language="JavaScript1.3">
//    alert('here: '+document.location.protocol+'//';
//alert('removed codebase');
document.write ('<OBJECT onMouseDown=removeContextMenu() classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" '
+' ID="PMUI" WIDTH="100%" HEIGHT="100%" ALIGN=""> <PARAM NAME=movie VALUE="PMUI.swf?urlTxt='+document.location.protocol+'//''">'
+'<PARAM NAME=quality VALUE=high><PARAM NAME="wmode" VALUE="opaque"><PARAM NAME="menu" VALUE="false"><PARAM NAME=bgcolor VALUE=#E4E6E8>'
+'<EMBED src="PMUI.swf?urlTxt='+document.location.protocol+'//''" '
+'quality=high wmode=opaque menu=false bgcolor=#E4E6E8  WIDTH="100%" HEIGHT="100%" swLiveConnect="true"  NAME="PMUI" ALIGN="" '
+'TYPE="application/x-shockwave-flash" PLUGINSPAGE="'+document.location.protocol+'//" ></EMBED></OBJECT>')

I E 7+

R & D

2006-02-08 :

          Try to find that why IE7 show flash default context menu.Then handle it.
          (Don't forget to send email to all Develope in BKK and CC to p'Dao and p'Ann also.)

2006-02-09 :

2006-02-15 :


           After replace this line IE7 will not show flash default context menu. but I face with JAVA error.'dummy.htm');

 Error : Object doesn't support this property or method.
 URL : http://obtkeerapat:8002/IRIS/process/PMUI/PMUI.jsp


2006-02-16 :

Rakesh says:
hows it going?
K e e :: let it flow~ says:
I still have no idea
Rakesh says:
hmm...maybe u should try to search information in javascript document model used in IE7

After MSN with RK, i do research about javascript document model used in IE7. but there are no information about this much.

ex for IE6

function removeContextMenu() {
    if(event.button == 2) {
        window.document.PMUI.SetVariable("RightClickedPosition", event.x + "," + event.y);
        parent.parent.frames.location.replace('javascript: parent.dummy1');

Untitled 7

Rich sticky notes

vertical bargraph

Relate files+


To DO+

Untitled 8

Rich sticky notes

Relate files+

Element Listing+


TO Do+

Untitled 9

Rich sticky notes

Dot Net

Relate files+


To Do+

Untitled 10

Rich sticky notes

Relate files+

R e f a c t o r C l a s s +


Split class to 4 classes :-

    1. Infrastructure class
    2. Container class
    3. Event function class
    4. Helper class

การแบ่งนั้นจะแบ่งตาม meaning ของแต่ละ class เพื่อให้เป็นไปตามหลักของ OO

แต่ทว่าหลังจากที่แบ่งเรียบร้อยแล้ว ถ้ายังมีการ exceed byte code ล่ะก็ ให้ทำการแบ่งอีกทีนึง โดยการโยกย้าย logic ของบางฟังก์ชั่นไปยัง helper class.


To Do+

- analyze class
- Waiting for reviewing
- implement refactor class
- unit test
- integration test

Untitled 11

Rich sticky notes

Commenting and Cleaning Code



- - - - - - -



Relate files+

4. Files in PackageContents Folder

To Do+