<head>
  <link rel="import" href="class_ref.html">
  <link rel="import" href="code_ref.html">
  <link rel="import" href="function_ref.html">
  <link rel="import" href="library_ref.html">
  <link rel="import" href="observatory_element.html">
  <link rel="import" href="nav_bar.html">
  <link rel="import" href="script_inset.html">
  <link rel="import" href="script_ref.html">
</head>
<polymer-element name="function-view" extends="observatory-element">
  <template>
    <link rel="stylesheet" href="css/shared.css">
    <nav-bar>
      <top-nav-menu></top-nav-menu>
      <isolate-nav-menu isolate="{{ function.isolate }}"></isolate-nav-menu>
      <template if="{{ function['owner'].serviceType == 'Class' }}">
        <!-- TODO(turnidge): Add library nav menu here. -->
        <class-nav-menu cls="{{ function['owner'] }}"></class-nav-menu>
      </template>
      <template if="{{ function['owner'].serviceType == 'Library' }}">
        <library-nav-menu library="{{ function['owner'] }}"></library-nav-menu>
      </template>
      <nav-menu link="{{ function.hashLink }}" anchor="{{ function.name }}" last="{{ true }}"></nav-menu>
      <nav-refresh callback="{{ refresh }}"></nav-refresh>
    </nav-bar>

    <div class="content">
      <h1>function {{ qualifiedName }}</h1>

      <div class="memberList">
        <div class="memberItem">
          <div class="memberName">kind</div>
          <div class="memberValue">
            <template if="{{ function['is_static'] }}">static</template>
            <template if="{{ function['is_const'] }}">const</template>
            {{ kind }}
          </div>
        </div>
        <template if="{{ function['parent'] != null }}">
          <div class="memberItem">
            <div class="memberName">parent function</div>
            <div class="memberValue">
              <function-ref ref="{{ function['parent'] }}"></function-ref>
            </div>
          </div>
        </template>
        <div class="memberItem">
          <div class="memberName">owner</div>
          <div class="memberValue">
            <template if="{{ function['owner'].serviceType == 'Class' }}">
              <class-ref ref="{{ function['owner'] }}"></class-ref>
            </template>
            <template if="{{ function['owner'].serviceType != 'Class' }}">
              <library-ref ref="{{ function['owner'] }}"></library-ref>
            </template>
          </div>
        </div>
        <div class="memberItem">
          <div class="memberName">script</div>
          <div class="memberValue">
            <script-ref ref="{{ function['script'] }}"
                        pos="{{ function['tokenPos'] }}">
            </script-ref>
          </div>
        </div>

        <div class="memberItem">&nbsp;</div>

        <template if="{{ function['code'] != null }}">
          <div class="memberItem">
            <div class="memberName">optimized code</div>
            <div class="memberValue">
              <code-ref ref="{{ function['code'] }}"></code-ref>
            </div>
          </div>
        </template>
        <template if="{{ function['unoptimized_code'] != null }}">
          <div class="memberItem">
            <div class="memberName">unoptimized code</div>
            <div class="memberValue">
              <code-ref ref="{{ function['unoptimized_code'] }}"></code-ref>
            </div>
              <div class="memberValue">
                <span title="This count is used to determine when a function will be optimized.  It is a combination of call counts and other factors.">
                  (usage count: {{ function['usage_counter'] }})
                </span>
             </div>
           </div>
         </template>
         <div class="memberItem">
           <div class="memberName">deoptimizations</div>
           <div class="memberValue">{{ function['deoptimizations'] }}</div>
         </div>
         <div class="memberItem">
           <div class="memberName">optimizable</div>
           <div class="memberValue">{{ function['is_optimizable'] }}</div>
         </div>
         <div class="memberItem">
           <div class="memberName">inlinable</div>
           <div class="memberValue">{{ function['is_inlinable'] }}</div>
         </div>
         <template if="{{ function.name != function.vmName }}">
           <div class="memberItem">
             <div class="memberName">vm name</div>
             <div class="memberValue">{{ function.vmName }}</div>
           </div>
         </template>
       </div>
    </div>

    <hr>
    <script-inset script="{{ function['script'] }}" pos="{{ function['tokenPos'] }}" endPos="{{ function['endTokenPos'] }}">
    </script-inset>

    <br>
  </template>
  <script type="application/dart" src="function_view.dart"></script>
</polymer-element>