﻿<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
    <xsl:import href="WizardButtons.xslt"/>

    <xsl:template match ="/">
        <xsl:variable name="TemplatePathURL" select="normalize-space(LifeSpaces/TemplateURL)"/>
        <xsl:variable name="HostName" select="normalize-space(LifeSpaces/HostName)"></xsl:variable>

        <div id="divVisionLayout" style="width: 100%;">
            <div id="divGetStartedButtons" style="margin-top: 10px; margin-bottom: 10px;">
                <xsl:call-template name="WizardButtons">
                    <xsl:with-param name="TemplatePathURL" select="normalize-space(LifeSpaces/TemplateURL)"></xsl:with-param>
                    <xsl:with-param name="Source" >
                        <xsl:text>vision</xsl:text>
                    </xsl:with-param>
                    <xsl:with-param name="HostName" select="$HostName"></xsl:with-param>
                </xsl:call-template>
            </div>
            <div style="color: #376092; margin-top: 20px; margin-bottom: 10px;">
                <table class="tableMaster" cellpadding="0" cellspacing="0" border="0">
                    <tr>
                        <td align="top">
                            <span class="labelSize14">Step 1 of 4 - Your Vision For Your Future.</span>
                        </td>
                        <td align="top" valign="top" rowspan="2">
                            <img src="{$TemplatePathURL}Web/Images/AdPerson_Left.jpg" title="AdPerson" BORDER="0"></img>
                        </td>
                    </tr>
                    <tr>
                        <td align="top">
                            <span class="labelSize13">
                                "OK great!  Let's get started.  LifeSpace provides inspiration, templates,
                                communities and content in each of these key areas but it is up to you to
                                decide what is important in your own life.  Please tell me what you would
                                like to accomplish in each area over the next 3-5 years."
                            </span>
                        </td>

                    </tr>
                </table>
            </div>
            <div>
                <table class="tableMaster">
                    <xsl:for-each select="LifeSpaces/LifeSpace">
                        <xsl:choose>
                            <xsl:when test="normalize-space(checked) = 1">
                                <tr id="row_LifeSpace_{position()}">
                                    <td style="vertical-align: middle;">
                                        <div>
                                            <xsl:if test="position() = 1">
                                                <img id="img_LifeSpace_{position()}_ArrowUP" src="{$TemplatePathURL}Web/Images/Arrow_Up.jpg"
                                                     title="Arrow_Up" BORDER="0" style="display:none;"
                                                     onClick='vision_setLifeSpacesSortOrder("img_LifeSpace_{position()}",-1, "row_LifeSpace_{position()}", "{normalize-space(ItemID)}");'></img>
                                            </xsl:if>
                                            <xsl:if test="position() &gt; 1">
                                                <img id="img_LifeSpace_{position()}_ArrowUP" src="{$TemplatePathURL}Web/Images/Arrow_Up.jpg"
                                                     title="Arrow_Up" BORDER="0"
                                                     onClick='vision_setLifeSpacesSortOrder("img_LifeSpace_{position()}",-1, "row_LifeSpace_{position()}", "{normalize-space(ItemID)}");'></img>
                                            </xsl:if>
                                        </div>
                                        <div>
                                            <input status="{normalize-space(checked)}" id="chk_LifeSpace_{position()}" lifeSpaceID="{ItemID}"
                                                     type="checkbox" checked="true"
                                                     onClick='updateCheckBoxLifeSpaceStatus("chk_LifeSpace_{position()}",
                                                            "cell_img_LifeSpace_{position()}", "cell_lbl_LifeSpace_{position()}",
                                                            "cell_txt_LifeSpace_{position()}","{normalize-space(ItemID)}");'></input>
                                        </div>
                                        <div>
                                            <xsl:if test="position() &lt; count(../LifeSpace)">
                                                <img id="img_LifeSpace_{position()}_ArrowDown" src="{$TemplatePathURL}Web/Images/Arrow_Down.jpg"
                                                     title="Arrow_Down" BORDER="0"
                                                     onClick='vision_setLifeSpacesSortOrder("img_LifeSpace_{position()}",1, "row_LifeSpace_{position()}", "{normalize-space(ItemID)}");'></img>
                                            </xsl:if>
                                            <xsl:if test="position() = count(../LifeSpace)">
                                                <img id="img_LifeSpace_{position()}_ArrowDown" src="{$TemplatePathURL}Web/Images/Arrow_Down.jpg"
                                                     title="Arrow_Down" BORDER="0" style="display:none;"
                                                     onClick='vision_setLifeSpacesSortOrder("img_LifeSpace_{position()}",1, "row_LifeSpace_{position()}", "{normalize-space(ItemID)}");'></img>
                                            </xsl:if>
                                        </div>
                                    </td>
                                    <td width="39" id="cell_img_LifeSpace_{position()}"
                                        style="text-align: center; vertical-align: middle;">
                                        <xsl:choose>
                                            <xsl:when test="ItemID > 6">
                                                <img id="img_LifeSpace_{position()}" src="{$TemplatePathURL}Web/Images/LifeSpace LLC.jpg"
                                                        upperSiblingID ="img_LifeSpace_{position()-1}"
                                                        lowerSiblingID ="img_LifeSpace_{position()+1}"
                                                        width="39" height="52" sortorder="{SortOrder}" BORDER="0"></img>
                                            </xsl:when>
                                            <xsl:otherwise>
                                                <img id="img_LifeSpace_{position()}" src="{$TemplatePathURL}Web/Images/{LifeSpaceImage}.jpg"
                                                        upperSiblingID ="img_LifeSpace_{position()-1}"
                                                        lowerSiblingID ="img_LifeSpace_{position()+1}"
                                                        width="39" height="52" sortorder="{SortOrder}" BORDER="0"></img>
                                            </xsl:otherwise>
                                        </xsl:choose>
                                    </td>
                                    <td style="text-align: center; vertical-align: middle;" id="cell_lbl_LifeSpace_{position()}">
                                        <span class="labelBold" style="color: #376092;">
                                            <xsl:value-of select="Item"/>
                                        </span>
                                    </td>
                                    <td width="70%" id="cell_txt_LifeSpace_{position()}">
                                        <div>
                                            <textarea id="txt_LifeSpace_{position()}" rows="4" class="textAreaBox"
                                                      style="border: 2px solid black;"
                                                      onBlur='return Vision_updateLifespaceDescription("txt_LifeSpace_{position()}", "{normalize-space(ItemID)}");'>
                                                <xsl:value-of select="Description"/>
                                            </textarea>
                                        </div>
                                        <xsl:choose>
                                            <xsl:when test="normalize-space(ItemID) &lt;= 6">
                                                <xsl:choose>
                                                    <xsl:when test="Item = 'Finance'">
                                                        <div id="divPopup_{Item}" class="divPopup_MyPlan"
                                                             style="padding-top: 10px; padding-left: 10px; padding-right: 10px;"
                                                             onmouseover="myPlan_ViewExamples('divPopup_{Item}');"
                                                             onmouseout="myPlan_CloseViewExamples('divPopup_{Item}')">
                                                            <span class="label">In the next few years, I would like to get a better job, save much more for my retirement and buy a home.</span>
                                                        </div>
                                                    </xsl:when>
                                                    <xsl:when test="Item = 'Fitness'">
                                                        <div id="divPopup_{Item}" class="divPopup_MyPlan"
                                                             style="padding-top: 10px; padding-left: 10px; padding-right: 10px;"
                                                             onmouseover="myPlan_ViewExamples('divPopup_{Item}');"
                                                             onmouseout="myPlan_CloseViewExamples('divPopup_{Item}')">
                                                            <span class="label">This year I will lose 10lbs, eat better and run a half-marathon</span>
                                                        </div>
                                                    </xsl:when>
                                                    <xsl:when test="Item = 'Family'">
                                                        <div id="divPopup_{Item}" class="divPopup_MyPlan"
                                                             style="padding-top: 10px; padding-left: 10px; padding-right: 10px;"
                                                             onmouseover="myPlan_ViewExamples('divPopup_{Item}');"
                                                             onmouseout="myPlan_CloseViewExamples('divPopup_{Item}')">
                                                            <span class="label">
                                                                In the next year, I would like to spend more quality time with the kids doing fun and educational events.
                                                                Also plan to redecorate the house and completely clean out the garage.
                                                            </span>
                                                        </div>
                                                    </xsl:when>
                                                    <xsl:when test="Item = 'Fun'">
                                                        <div id="divPopup_{Item}" class="divPopup_MyPlan"
                                                             style="padding-top: 10px; padding-left: 10px; padding-right: 10px;"
                                                             onmouseover="myPlan_ViewExamples('divPopup_{Item}');"
                                                             onmouseout="myPlan_CloseViewExamples('divPopup_{Item}')">
                                                            <span class="label">I want to travel to Paris this year.  Also, will try to spend more quality time with my friends.</span>
                                                        </div>
                                                    </xsl:when>
                                                    <xsl:when test="Item = 'Faith'">
                                                        <div id="divPopup_{Item}" class="divPopup_MyPlan"
                                                             style="padding-top: 10px; padding-left: 10px; padding-right: 10px;"
                                                             onmouseover="myPlan_ViewExamples('divPopup_{Item}');"
                                                             onmouseout="myPlan_CloseViewExamples('divPopup_{Item}')">
                                                            <span class="label">I would like to increase my spirituality this year.  In addition, I will contribute more to charity and participate in more local causes.</span>
                                                        </div>
                                                    </xsl:when>
                                                </xsl:choose>

                                                <div id="div_Examples_{Item}">
                                                    <span class="labelComment" style="text-decoration: underline; cursor: pointer;"
                                                     onmouseover="myPlan_ViewExamples('divPopup_{Item}');"
                                                     onmouseout="myPlan_CloseViewExamples('divPopup_{Item}')">View Examples</span>
                                                </div>
                                            </xsl:when>
                                            <xsl:otherwise>
                                                <div id="div_Examples_{Item}">
                                                    <span class="labelComment" style="text-decoration: underline; cursor: pointer;">View Examples</span>
                                                </div>
                                            </xsl:otherwise>
                                        </xsl:choose>
                                    </td>
                                </tr>
                            </xsl:when>
                            <xsl:otherwise>
                                <tr id="row_LifeSpace_{position()}">
                                    <td style="vertical-align: middle;">
                                        <div>
                                            <xsl:if test="position() = 1">
                                                <!--<img id="img_LifeSpace_{position()}_ArrowUP"  src="{$TemplatePathURL}Web/Images/Arrow_Up.jpg"
                                                      title="Arrow_Up" BORDER="0" style="display:none;"
                                                      onClick="swapLifeSpacesSortOrder('img_LifeSpace_{position()}', -1, 'row_LifeSpace_{position()}');"></img>-->
                                                <img id="img_LifeSpace_{position()}_ArrowUP"  src="{$TemplatePathURL}Web/Images/Arrow_Up.jpg"
                                                      title="Arrow_Up" BORDER="0" style="display:none;"
                                                      onClick='vision_setLifeSpacesSortOrder("img_LifeSpace_{position()}",-1, "row_LifeSpace_{position()}", "{normalize-space(ItemID)}");'></img>
                                            </xsl:if>
                                            <xsl:if test="position() &gt; 1">
                                                <!--<img id="img_LifeSpace_{position()}_ArrowUP"  src="{$TemplatePathURL}Web/Images/Arrow_Up.jpg"
                                                      title="Arrow_Up" BORDER="0"
                                                      onClick="swapLifeSpacesSortOrder('img_LifeSpace_{position()}', -1, 'row_LifeSpace_{position()}');"></img>-->
                                                <img id="img_LifeSpace_{position()}_ArrowUP"  src="{$TemplatePathURL}Web/Images/Arrow_Up.jpg"
                                                      title="Arrow_Up" BORDER="0"
                                                     onClick='vision_setLifeSpacesSortOrder("img_LifeSpace_{position()}",-1, "row_LifeSpace_{position()}", "{normalize-space(ItemID)}");'></img>
                                            </xsl:if>
                                        </div>
                                        <div>
                                            <!--<input id="chk_LifeSpace_{position()}" lifeSpaceID="{ItemID}"
                                                    type="checkbox"
                                                   onClick="selectDeselectLifeSpace('chk_LifeSpace_{position()}', 
                                                            'cell_img_LifeSpace_{position()}', 'cell_lbl_LifeSpace_{position()}', 
                                                            'cell_txt_LifeSpace_{position()}');"></input>-->
                                            <input status="{normalize-space(checked)}" id="chk_LifeSpace_{position()}" lifeSpaceID="{ItemID}"
                                                    type="checkbox"
                                                    onClick='updateCheckBoxLifeSpaceStatus("chk_LifeSpace_{position()}",
                                                            "cell_img_LifeSpace_{position()}", "cell_lbl_LifeSpace_{position()}",
                                                            "cell_txt_LifeSpace_{position()}","{normalize-space(ItemID)}");'></input>
                                        </div>
                                        <div>
                                            <xsl:if test="position() = count(../LifeSpace)">
                                                <!--<img id="img_LifeSpace_{position()}_ArrowDown" src="{$TemplatePathURL}Web/Images/Arrow_Down.jpg"
                                                      title="Arrow_Down" BORDER="0" style="display:none;"
                                                    onClick="swapLifeSpacesSortOrder('img_LifeSpace_{position()}', 1, 'row_LifeSpace_{position()}');">
                                                </img>-->
                                                <img id="img_LifeSpace_{position()}_ArrowDown" src="{$TemplatePathURL}Web/Images/Arrow_Down.jpg"
                                                      title="Arrow_Down" BORDER="0" style="display:none;"
                                                    onClick='vision_setLifeSpacesSortOrder("img_LifeSpace_{position()}",1, "row_LifeSpace_{position()}", "{normalize-space(ItemID)}");'></img>
                                            </xsl:if>
                                            <xsl:if test="position() &lt; count(../LifeSpace)">
                                                <!--<img id="img_LifeSpace_{position()}_ArrowDown"  src="{$TemplatePathURL}Web/Images/Arrow_Down.jpg"
                                                      title="Arrow_Down" BORDER="0"
                                                      onClick="swapLifeSpacesSortOrder('img_LifeSpace_{position()}', 1, 'row_LifeSpace_{position()}');"></img>-->
                                                <img id="img_LifeSpace_{position()}_ArrowDown"  src="{$TemplatePathURL}Web/Images/Arrow_Down.jpg"
                                                      title="Arrow_Down" BORDER="0"
                                                      onClick='vision_setLifeSpacesSortOrder("img_LifeSpace_{position()}",1, "row_LifeSpace_{position()}", "{normalize-space(ItemID)}");'></img>
                                            </xsl:if>
                                        </div>
                                    </td>
                                    <td class="disabledImage" width="39" id="cell_img_LifeSpace_{position()}"
                                        style="text-align: center; vertical-align: middle;">
                                        <xsl:choose>
                                            <xsl:when test="ItemID > 6">
                                                <img id="img_LifeSpace_{position()}"
                                                    upperSiblingID ="img_LifeSpace_{position()-1}"
                                                    lowerSiblingID ="img_LifeSpace_{position()+1}"
                                                    src="{$TemplatePathURL}Web/Images/LifeSpace LLC.jpg"
                                                    width="39" height="52" sortorder="{SortOrder}" BORDER="0"></img>
                                            </xsl:when>
                                            <xsl:otherwise>
                                                <img id="img_LifeSpace_{position()}"
                                                    upperSiblingID ="img_LifeSpace_{position()-1}"
                                                    lowerSiblingID ="img_LifeSpace_{position()+1}"
                                                    src="{$TemplatePathURL}Web/Images/{LifeSpaceImage}.jpg"
                                                    width="39" height="52" sortorder="{SortOrder}" BORDER="0"></img>
                                            </xsl:otherwise>
                                        </xsl:choose>
                                    </td>
                                    <td class="disabledImage" style="text-align: center; vertical-align: middle;" id="cell_lbl_LifeSpace_{position()}">
                                        <span class="labelBold" style="color: #376092;">
                                            <xsl:value-of select="Item"/>
                                        </span>
                                    </td>
                                    <td class="disabledImage" width="70%" id="cell_txt_LifeSpace_{position()}">
                                        <div>
                                            <textarea id="txt_LifeSpace_{position()}" rows="4" class="textAreaBox"  style="border: 2px solid black;"
                                                      onBlur='return Vision_updateLifespaceDescription("txt_LifeSpace_{position()}", "{normalize-space(ItemID)}");'>
                                                <xsl:value-of select="Description"/>
                                            </textarea>
                                        </div>
                                        <xsl:choose>
                                            <xsl:when test="normalize-space(ItemID) &lt;= 6">
                                                <xsl:choose>
                                                    <xsl:when test="Item = 'Finance'">
                                                        <div id="divPopup_{Item}" class="divPopup_MyPlan"
                                                             style="padding-top: 10px; padding-left: 10px; padding-right: 10px;"
                                                             onmouseover="myPlan_ViewExamples('divPopup_{Item}');"
                                                             onmouseout="myPlan_CloseViewExamples('divPopup_{Item}')">
                                                            <span class="label">In the next few years, I would like to get a better job, save much more for my retirement and buy a home.</span>
                                                        </div>
                                                    </xsl:when>
                                                    <xsl:when test="Item = 'Fitness'">
                                                        <div id="divPopup_{Item}" class="divPopup_MyPlan"
                                                             style="padding-top: 10px; padding-left: 10px; padding-right: 10px;"
                                                             onmouseover="myPlan_ViewExamples('divPopup_{Item}');"
                                                             onmouseout="myPlan_CloseViewExamples('divPopup_{Item}')">
                                                            <span class="label">This year I will lose 10lbs, eat better and run a half-marathon</span>
                                                        </div>
                                                    </xsl:when>
                                                    <xsl:when test="Item = 'Family'">
                                                        <div id="divPopup_{Item}" class="divPopup_MyPlan"
                                                             style="padding-top: 10px; padding-left: 10px; padding-right: 10px;"
                                                             onmouseover="myPlan_ViewExamples('divPopup_{Item}');"
                                                             onmouseout="myPlan_CloseViewExamples('divPopup_{Item}')">
                                                            <span class="label">
                                                                In the next year, I would like to spend more quality time with the kids doing fun and educational events.
                                                                Also plan to redecorate the house and completely clean out the garage.
                                                            </span>
                                                        </div>
                                                    </xsl:when>
                                                    <xsl:when test="Item = 'Fun'">
                                                        <div id="divPopup_{Item}" class="divPopup_MyPlan"
                                                             style="padding-top: 10px; padding-left: 10px; padding-right: 10px;"
                                                             onmouseover="myPlan_ViewExamples('divPopup_{Item}');"
                                                             onmouseout="myPlan_CloseViewExamples('divPopup_{Item}')">
                                                            <span class="label">I want to travel to Paris this year.  Also, will try to spend more quality time with my friends.</span>
                                                        </div>
                                                    </xsl:when>
                                                    <xsl:when test="Item = 'Faith'">
                                                        <div id="divPopup_{Item}" class="divPopup_MyPlan"
                                                             style="padding-top: 10px; padding-left: 10px; padding-right: 10px;"
                                                             onmouseover="myPlan_ViewExamples('divPopup_{Item}');"
                                                             onmouseout="myPlan_CloseViewExamples('divPopup_{Item}')">
                                                            <span class="label">I would like to increase my spirituality this year.  In addition, I will contribute more to charity and participate in more local causes.</span>
                                                        </div>
                                                    </xsl:when>
                                                </xsl:choose>

                                                <div id="div_Examples_{Item}">
                                                    <span class="labelComment" style="text-decoration: underline; cursor: pointer;"
                                                     onmouseover="myPlan_ViewExamples('divPopup_{Item}');"
                                                     onmouseout="myPlan_CloseViewExamples('divPopup_{Item}')">View Examples</span>
                                                </div>
                                            </xsl:when>
                                            <xsl:otherwise>
                                                <div id="div_Examples_{Item}">
                                                    <span class="labelComment" style="text-decoration: underline; cursor: pointer;">View Examples</span>
                                                </div>
                                            </xsl:otherwise>
                                        </xsl:choose>
                                    </td>
                                </tr>
                            </xsl:otherwise>
                        </xsl:choose>
                    </xsl:for-each>
                </table>
            </div>
            <div align="right">
                <a href="http://{$HostName}/Plan.aspx" class="link">
                    <img src="{$TemplatePathURL}Web/Images/BtnContinue.png" title="ContinueButton" style="cursor: pointer;" BORDER="0"></img>
                    <!--<img src="{$TemplatePathURL}Web/Images/BtnContinue.png" title="ContinueButton" style="cursor: pointer;"
                      onClick="vision_Save('chk_LifeSpace','img_LifeSpace', 'txt_LifeSpace',{count(LifeSpaces/LifeSpace)} );"></img>-->
                </a>
            </div>
        </div>
    </xsl:template>
</xsl:stylesheet>
