<form id="search-form" class="search-form" data-custom-modal-search-value="" data-page="outputs-impactMetrics" data-module="" data-search-id="" data-gui-title="" data-gui-id="" data-gui-columns='[]' data-options='{  }' data-show-status="true" data-create-parent="true"
    data-actions='[  ]'>
    <div class="search-panel card">
        <ul class="filter-options" style="display: none">
        </ul>

        <div class="card-section">
            <div class="card-inner">
                <h3 class="card-heading card-title">
                    <div class="text">Searching Metrics</div>

                    <div class="save-search">
                        <button type="button" class="btn btn-link js-btn-load-search js-btn-modal" data-modal="load-search">
							<span class="fa fa-folder-open-o"></span>
							<span class="link link-strong">My Searches</span>
						</button>
                        <button type="button" class="btn btn-link js-btn-save-search js-btn-modal" data-modal="save-search">
							<span class="fa fa-floppy-o"></span>
							<span class="link link-strong">Save Search</span>
						</button>
                    </div>
                </h3>

                <div class="search-subheading">
                    <h4 class="card-subheading" data-col="12">
                        <span data-span="10">Search Fields</span>
                        <span class="subheading-right" data-span="2">Add / Remove</span>
                    </h4>
                    <p class="card-note">Use the 'Lookup' function to complete relevant fields</p>
                </div>

                <div class="form-container">
                    <div class="create-filters">
                    </div>
                </div>

                <button class="btn btn-default btn-submit"><span>Show</span> Records</button>
            </div>
        </div>
    </div>
</form>

<div class="modal modal-advanced-search js-modal js-modal-exit -nav-padded -with-overlay" data-modal="advanced-search">
    <div class="modal-inner inner">
        <div class="modal-panel advanced-search-container">
            <div class="modal-header">
                <button type="button" class="btn btn-default btn-modal-exit js-modal-exit svg-wrap" aria-label="Exit Modal">
					<span class="fa fa-times"></span>
				</button>
                <h3 class="modal-title">
                    <span class="text">Advanced Lookup</span>
                </h3>
            </div>
            <div class="modal-section advanced-search-form modal-advanced-form">
                <div data-col="6">
                    <div class="form-field advanced-search-field" data-flex="4" data-col="4" data-required="true" data-min-length="2">
                        <label class="advanced-search-label" data-flex="1" for="SearchValue"></label>
                        <input data-flex="3" name="SearchValue" class="advanced-search-input"></input>
                    </div>

                    <div class="criteria-text form-field advanced-search-field" data-col="6" data-flex="2">
                        <div data-flex="2"></div>
                        <label class="advanced-search-label" data-flex="2" for="SearchValue"></label>
                        <input data-flex="2" name="SearchValue" class="advanced-search-input"></input>
                    </div>
                </div>
                <div class="advanced-search-criteria" data-col="6">
                    <div class="criteria-dropdown form-field advanced-search-field" data-col="6" data-flex="6"></div>
                    <div class="criteria-checkbox form-field advanced-search-field" data-col="3" data-flex="3"></div>

                    <div class="btn-container" data-flex="3">
                        <a class="btn btn-create-record js-parent-create-record">
							<span class="fa fa-plus-circle"></span>
							<span class="link link-strong">Create a new record</span>
						</a>

                        <button type="button" class="btn btn-default btn-update-advanced js-btn-update-advanced">
							<div class="text">Show Records</div>
						</button>
                    </div>
                </div>
            </div>

            <div class="modal-section modal-results advanced-search-results">

            </div>
        </div>
    </div>
</div>
<div class="modal -with-overlay -nav-padded js-modal js-modal-exit" data-modal="save-search">
    <div class="modal-inner inner">
        <div class="modal-panel">
            <div class="modal-header">
                <button type="button" class="btn btn-default btn-modal-exit js-modal-exit svg-wrap" aria-label="Exit Modal">
					<span class="fa fa-times"></span>
				</button>
                <h3 class="modal-title">
                    <span class="text">Save search</span>
                </h3>
            </div>

            <div class="modal-section modal-form">
                <div class="form-field save-field" data-col="6" data-required="true" data-min-length="5">
                    <label for="save-search-title" data-flex="1">Save As</label>
                    <input name="save-search-title" placeholder="&hellip;">

                    <button type="button" class="btn svg-wrap btn-save-as js-save-as" aria-label="Save as existing search">
						<svg viewBox="0 0 25 25">
							<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-arrow-down"></use>
						</svg>
					</button>
                </div>
            </div>

            <div class="modal-section modal-results">
            </div>

            <div class="modal-section modal-buttons">
                <button class="btn btn-default js-save-search js-modal-submit" type="button">
					<span class="text">Save this search</span>
				</button>

                <button class="btn btn-default js-modal-exit" type="button">
					<span class="text">Cancel</span>
				</button>
            </div>
        </div>
    </div>
</div>
<div class="modal modal-load-search -with-overlay -nav-padded js-modal js-modal-exit" data-modal="load-search">
    <div class="modal-inner inner">
        <div class="modal-panel">
            <div class="modal-header">
                <button type="button" class="btn btn-default btn-modal-exit js-modal-exit svg-wrap" aria-label="Exit Modal">
					<span class="fa fa-times"></span>
				</button>
                <h3 class="modal-title">
                    <span class="text">My saved searches</span>
                </h3>
            </div>

            <div class="modal-section modal-results">
            </div>

            <div class="modal-section modal-buttons">
                <button class="btn btn-default js-load-search js-modal-exit js-modal-submit" type="button">
					<span class="text">Load search</span>
				</button>

                <button class="btn btn-default js-modal-exit" type="button">
					<span class="text">Cancel</span>
				</button>
            </div>
        </div>
    </div>
</div>
<div class="modal modal-gui-new -with-overlay -nav-padded js-modal js-modal-exit" data-modal="gui-new">
    <div class="modal-inner inner">
        <div class="modal-panel">
            <div class="modal-header">
                <button type="button" class="btn btn-default btn-modal-exit js-modal-exit svg-wrap" aria-label="Exit Modal">
					<span class="fa fa-times"></span>
				</button>
                <h3 class="modal-title">
                    <span class="text">Create new custom GUI</span>
                </h3>
            </div>

            <div class="modal-section modal-form">
                <div class="form-field save-field" data-col="6" data-required="true" data-min-length="5">
                    <label for="new-gui-title" data-flex="1">GUI name</label>
                    <input name="new-gui-title" placeholder="&hellip;">
                </div>
            </div>

            <div class="modal-section modal-results">
            </div>

            <div class="modal-section modal-buttons">
                <button class="btn btn-default js-gui-new js-modal-submit" type="button">
					<span class="text">Create GUI</span>
				</button>

                <button class="btn btn-default js-modal-exit" type="button">
					<span class="text">Cancel</span>
				</button>
            </div>
        </div>
    </div>
</div>
<div class="modal modal-gui-select -with-overlay -nav-padded js-modal js-modal-exit" data-modal="gui-select">
    <div class="modal-inner inner">
        <div class="modal-panel">
            <div class="modal-header">
                <button type="button" class="btn btn-default btn-modal-exit js-modal-exit svg-wrap" aria-label="Exit Modal">
					<span class="fa fa-times"></span>
				</button>
                <h3 class="modal-title">
                    <span class="text">My custom GUI</span>
                </h3>
            </div>

            <div class="modal-section modal-results">
            </div>

            <div class="modal-section modal-buttons">
                <button class="btn btn-default js-load-gui js-modal-exit js-modal-submit" type="button">
					<span class="text">Load GUI</span>
				</button>

                <button class="btn btn-default js-modal-exit" type="button">
					<span class="text">Cancel</span>
				</button>
            </div>
        </div>
    </div>
</div>
<div class="modal modal-gui-update -with-overlay -nav-padded js-modal js-modal-exit" data-modal="gui-update">
    <div class="modal-inner inner">
        <div class="modal-panel">
            <div class="modal-header">
                <button type="button" class="btn btn-default btn-modal-exit js-modal-exit svg-wrap" aria-label="Exit Modal">
					<span class="fa fa-times"></span>
				</button>
                <h3 class="modal-title">
                    <span class="text">Update current GUI</span>
                </h3>
            </div>

            <div class="modal-section modal-form">
                <div class="form-field save-field" data-col="6" data-required="true" data-min-length="5">
                    <label for="new-gui-title" data-flex="1">GUI name</label>
                    <input name="new-gui-title" placeholder="&hellip;" disabled>
                </div>
            </div>

            <div class="modal-section modal-results">
            </div>

            <div class="modal-section modal-buttons">
                <button class="btn btn-default js-gui-new js-modal-submit" type="button">
					<span class="text">Update GUI</span>
				</button>

                <button class="btn btn-default js-modal-exit" type="button">
					<span class="text">Cancel</span>
				</button>
            </div>
        </div>
    </div>
</div>
<div class="search-results-container"></div>
{{> @search-panel }}

<div class="search-results-container"></div>
{
  "pageTitle": "Metrics",
  "pageClass": "outputs-impact",
  "dataFormat": "expanded",
  "dataChart": "pie",
  "width": 238,
  "fontSize": 47.6,
  "projects": [
    {
      "title": "Breeding wheat strains to reduce the incidence macular degeneration",
      "remaining": 435000,
      "awarded": 445000,
      "total": 580000,
      "status": "on hold",
      "notes": "<a href='' title='View Meeting'>Assigned to Meeting</a>"
    },
    {
      "title": "Assisted vision technologies",
      "remaining": 90000,
      "awarded": 340000,
      "total": 430000,
      "status": "active",
      "notes": "no roadblocks"
    },
    {
      "title": "Minimizing Carbon Emissions and Maximizing Carbon Sequestration and Storage by Seagrasses, Tidal Marshes, Mangroves",
      "remaining": 130000,
      "awarded": 155000,
      "total": 285000,
      "status": "active",
      "notes": "no roadblocks"
    },
    {
      "title": "Mitochondrial Turnover",
      "remaining": 60000,
      "awarded": 95000,
      "total": 125000,
      "status": "pending",
      "notes": "<a href='' title='View Meeting'>Assigned to Meeting</a>"
    },
    {
      "title": "Crop resilience from complex genomes",
      "remaining": 90000,
      "awarded": 105000,
      "total": 125000,
      "status": "on hold",
      "notes": "<a href='' title='View Meeting'>Assigned to Meeting</a>"
    }
  ],
  "other": 225000,
  "dataTotal": 2000000,
  "baseTitle": "Outputs & Impact",
  "pageSections": [
    {
      "title": "Outputs",
      "slug": "outputs"
    },
    {
      "title": "Impact",
      "slug": "impact"
    },
    {
      "title": "Metrics",
      "slug": "metrics"
    }
  ]
}

There are no notes for this item.