Skip to content
This repository has been archived by the owner on Jun 24, 2020. It is now read-only.

Worksheet summary graph js #377

Open
wants to merge 6 commits into
base: master
Choose a base branch
from
Open

Worksheet summary graph js #377

Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
a757393
placeholder markup for the graph using item length
cfarm Mar 7, 2015
3bc31a1
Merge branch 'master' into worksheet-summary-graph-js
cfarm Mar 7, 2015
7068acb
graph loops
cfarm Mar 7, 2015
639894e
clean up comments
cfarm Mar 7, 2015
49c53e1
Merge branch 'master' into worksheet-summary-graph-js
cfarm Aug 28, 2015
9d26c6d
fix(prepare worksheets): fix missing closing if tag
cfarm Aug 28, 2015
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
89 changes: 59 additions & 30 deletions src/static/js/templates/prepare-worksheets/page-summary.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,31 +3,57 @@
<p class="lead">Buying a home is more complicated than simply trading a rent payment for a mortgage payment. Owning a home is a long-term financial commitment that carries costs, risks, and benefits. Examine your summary below to decide whether or not you are ready to continue working towards buying a home.</p>
<hr>
<div class="content-l content-l__main">

<section class="summary-chart">

<!-- goals -->

{{#if goalsError }}
<div class="box1 first">
<div class="box-goals "></div>
<div class="box-goals"></div>
<div class="box-goals"></div>
<div class="box-goals"></div>
<div class="box-goals"></div>
<div class="box-goals"></div>
<div class="box-goals"></div>
<div class="box-goals goals-low"></div>
<div class="box-goals goals-high"></div>
<div class="box-goals goals-high"></div>
{{#each this.goals.[2].[items]}}
<!-- low priority goal -->
<div class="box-goals goals-low"></div>
{{/each}} <!-- light green -->

{{#each this.goals.[1].[items]}}
<!-- medium priority goal -->
<div class="box-goals goals-medium"></div>
{{/each}} <!-- medium green -->

{{#each this.goals.[0].[items]}}
<!-- high priority goal -->
<div class="box-goals goals-high"></div>
{{/each}} <!-- dark green -->
</div>
<div class="box1 ">
<div class="box-goals flags-medium"></div>
<div class="box-goals flags-medium"></div>
<div class="box-goals flags-high"></div>
<div class="box-goals flags-high"></div>

<!-- red flags -->
<div class="box1">
{{#each this.flags.[1].[items]}}
<!-- somewhat likely flag -->
<div class="box-goals flags-medium"></div>
{{/each}} <!-- light red -->


{{#each this.flags.[0].[items]}}
<!-- likely flag -->
<div class="box-goals flags-high"></div>
{{/each}} <!-- dark red -->
</div>
<div class="box1 ">
<div class="box-goals risks-medium"></div>
<div class="box-goals risks-medium"></div>
<div class="box-goals risks-high"></div>
<div class="box-goals risks-high"></div>

<!-- risks -->
<div class="box1">
{{#each this.risks.[1].[items]}}
<!-- maybe ready risk -->
<div class="box-goals risks-medium"></div>
{{/each}} <!-- light yellow -->

{{#each this.risks.[2].[items]}}
<!-- not ready risk -->
<div class="box-goals risks-high"></div>
{{/each}} <!-- dark yellow -->
</div>
{{/if}}

<br>
<div class="box2">
<h5>Goals</h5>
Expand All @@ -41,8 +67,11 @@

</section>
</div>

<hr>

<br>

<div class="content-l content-l__main">
<div class="content-l_col content-l_col-1-2">

Expand All @@ -59,7 +88,8 @@
{{/if}}
</section>

</div>
</div><!-- .content-l_col -->

<div class="content-l_col content-l_col-1-2 worksheet worksheet-summary worksheet-flags-summary">

<section class="worksheet worksheet-summary worksheet-flags-summary">
Expand All @@ -86,11 +116,11 @@
{{/if}}
</section>

</div>
</div>
</div>
</div><!-- .content-l_col -->
</div><!-- .content-l_main -->
</div><!-- .summary -->

<div class="block__border-top block__padded-top">
<div class="block block__border-top block__padded-top">
<div class="summary content-l content-l__main">
<div class="content-l_col content-l_col-1-2">
<section class="summary-callout">
Expand All @@ -99,15 +129,14 @@
The next step is to explore how much it will cost to buy a home that meets your goals, and whether buying makes sense financially. For most people, owning a home will end up being more expensive than their current rental. Before you start house shopping in earnest, it’s a good idea to get a clear sense for how much buying will cost, so you can decide for yourself if the benefits are worth the cost.
</p>
</section>
</div>
</div><!-- .content-l_col -->
<div class="content-l_col content-l_col-1-2 content-l_col__before-divider">
<section class="summary-callout">
<h4>Not ready to buy?</h4>
<p class="short-desc">
Are there red flags in your situation, or risks you’re not ready to accept? That’s ok. Sometimes, the smartest home buying decision is deciding not to buy – at least not right now. Consider pursuing the alternatives you identified, so that you can meet some of your goals right away. Or, consider working to build a larger financial cushion so you will be better able to accept the risks of homeownership when the time is right for you.
</p>
</section>
</div>
</div>

</div>
</div><!-- .content-l_col -->
</div><!-- .summary -->
</div><!-- .block -->