1-item-template.html

<!-- I'm not sure if these data properties would continue to be need -->
<div class="material_list_item" data-material_id="{item.id}" data-material_name="{item.name}" id="{item.domId}">
<div class="main-part">
<div class="material_icon">
</div>
 
<div>
<div style="overflow:hidden">
<table width="100%">
<tbody><tr>
<td></td>
<td>
<span class="material_header">
<span class="material_meta_data">
<!-- conditionallize all of this based on item properties -->
<span class="NoJavaRequirement">
Runs in browser
</span>
<span class="is_official">Official</span>
</span>
<br>
<a href="{item.browseUrl}">{item.name}</a>
<span class="superTiny" rt-if="item.settingsActionUrl"><a href="{item.settingsActionUrl}">(portal&nbsp;settings)</a></span>
<span class="superTiny" rt-if-"item.iframeEditActionUrl"><a href="{item.iframeEditActionUrl}" target="_blank">(edit&nbsp;in&nbsp;iframe)</a></span>
</span>
<div>
<span style="font-weight:bold">
By {item.authorFullName}
</span>
</div>
</td>
<td width="90px" rt-if="item.previewActionUrl">
<div style="float:right">
<a href="{item.previewActionUrl}" class="button" target="_blank">Preview</a>
 
</div>
</td>
<td width="60px" rt-if="item.editActionUrl">
<div style="float:right">
<a href="{item.editActionUrl}" class="button" target="_blank">Edit</a>
</div>
</td>
<td width="65px" rt-if="item.copyActionUrl">
<div style="float:right">
<a href="{item.copyActionUrl}" class="button" target="_blank">Copy</a>
</div>
</td>

<td width="130px" rt-if="item.assignToClass()">
<div style="float:right">
<!-- this needs to be changed perhaps the item can somehow provide the onclick hander, and the rt-if
     just determines if this handler exists -->
<a href="javascript:void(0)" class="button" onclick="get_Assign_To_Class_Popup(13,'ExternalActivity')">Assign to a Class</a>
</div>
<div style="float:right;text-align: right; margin-top: 3px;">
</div>
</td>

</tr>
<tr>
<td colspan="3">
</td>
</tr>
</tbody></table>
</div>
</div>
<div class="material_body">
<div>
<i>
Used in {item.numberOfClassesUsedIn} classes.
</i>
</div>
</div>
</div>
<div class="toggle-details">
<i class="toggle-details-icon fa fa-chevron-down" style="display: inline-block;"></i>
<i class="toggle-details-icon fa fa-chevron-up" style="display: none;"></i>
<div class="material-details" style="display: none;">
<div class="material-description two-cols">
<h3>Description</h3>
<p>{item.description}</p>
</div>
<div class="material-activities">
<h3>Activities</h3>
<ul>
<li rt-repaeat="activity in item.activites()">{activity.name}</li>
</ul>
</div>
</div>
</div>
</div>

2-item-snippet.html

<div class="material_list_item" data-material_id="13" data-material_name="v1 (2013-2014) Will the air be clean enough to breathe?" id="search_external_activity_13">
<div class="main-part">
<div class="material_icon">
</div>

<div>
<div style="overflow:hidden">
<table width="100%">
<tbody><tr>
<td></td>
<td>
<span class="material_header">
<span class="material_meta_data">
<span class="NoJavaRequirement">
Runs in browser
</span>
<span class="is_official">Official</span>
</span>
<br>
<a href="https://learn.staging.concord.org/browse/eresources/13">v1 (2013-2014) Will the air be clean enough to breathe?</a>
<span class="superTiny"><a href="https://learn.staging.concord.org/eresources/13/edit">(portal&nbsp;settings)</a></span>
<span class="superTiny"><a href="https://learn.staging.concord.org/eresources/13/matedit?iFrame=true" target="_blank">(edit&nbsp;in&nbsp;iframe)</a></span>
</span>
<div>
<span style="font-weight:bold">
By Aaron Unger
</span>
</div>
</td>
<td width="90px">
<div style="float:right">
<a href="https://learn.staging.concord.org/eresources/13.run_resource_html" class="button" target="_blank">Preview</a>

</div>
</td>
<td width="60px">
<div style="float:right">
<a href="https://learn.staging.concord.org/eresources/13/matedit?iFrame=false" class="button" target="_blank">Edit</a>
</div>
</td>
<td width="65px">
<div style="float:right">
<a href="https://learn.staging.concord.org/eresources/13/copy" class="button" target="_blank">Copy</a>
</div>
</td>
<td width="130px">
<div style="float:right">
<a href="javascript:void(0)" class="button" onclick="get_Assign_To_Class_Popup(13,'ExternalActivity')">Assign to a Class</a>
</div>
<div style="float:right;text-align: right; margin-top: 3px;">

</div>
</td>
</tr>
<tr>
<td colspan="3">
</td>
</tr>
</tbody></table>
</div>
</div>
<div class="material_body">
<div>
<i>
Used in 11 classes.
</i>
</div>
</div>
</div>
<div class="toggle-details">
<i class="toggle-details-icon fa fa-chevron-down" style="display: inline-block;"></i>
<i class="toggle-details-icon fa fa-chevron-up" style="display: none;"></i>
<div class="material-details" style="display: none;">
<div class="material-description two-cols">
<h3>Description</h3>
<p>This is the High-Adventure Science air quality unit.</p><p>This file was last changed on October 31, 2013. &nbsp;All image requests have been made to National Geographic.&nbsp; All models are now on the faster server.<br></p>
</div>
<div class="material-activities">
<h3>Activities</h3>
<ul>
<li>Measuring air quality</li>
<li>Movement of pollutants</li>
<li>Visible and invisible pollutants</li>
<li>Pollutants making more pollutants</li>
<li>Preventing bad air days</li>
</ul>
</div>
</div>
</div>
</div>