newscoop/JS-Scoopwriter

<article
   class="main-article-container"
   id="main-article"
   ng-controller="ArticleCtrl"
   ng-class="[panes.articleClass, platform.current]"
   dropped-images-container
   >
  <div class="zen-buttons">
    <button
       class="btn btn-primary"
       ng-disabled="!articleService.modified"
       ng-click="save()"
       >
      {{ ::('aes.btn.save'|trans) }}
    </button>
    <button
       class="btn btn-sf-invisible zen-close"
       id="test-go-normal"
       ng-click="mode.goNormal()"
       >
      <span class="glyphicon glyphicon-remove"></span>
    </button>
  </div>
  <div
     ng-class="{'mobile-view': platform.current=='mobile', 'switch-article-view': true}"
     id="switch_article_view"
     >
    <ul class="switch-view-tabs">
      <li target-view="desktop"
          ng-click="platform.go.desktop()"
          ng-class="{'active-view': platform.current=='desktop'}"
          ></li>
      <li target-view="tablet"
          ng-click="platform.go.tablet()"
          ng-class="{'active-view': platform.current=='tablet'}"
          ></li>
      <li target-view="mobile"
          ng-click="platform.go.mobile()"
          ng-class="{'active-view': platform.current=='mobile'}"
          ></li>
    </ul>
  </div>
    <section
       class="article-full-text article-field {{field.name}}"
       ng-repeat="field in ::editableFields track by field.name"
       ng-switch on="field.name"
       >
      <header>
        <span class="edit-label">{{::(field.phrase || field.name)}}</span>
        <span ng-if="field.name !== 'mainImage'"
              class="edit-words-info">{{field.statsText}}</span>
      </header>
      <div
         ng-switch-when="title"
         class="article-editable-title clearfix"
         data-field-name="{{field.name}}"
         aloha
         data-aloha-content="article.title"
         >
      </div>
      <fixed-image-placeholder
         ng-switch-when="mainImage"
         ng-controller="FixedImagePlaceholderCtrl"
         >
      </fixed-image-placeholder>
      <div
         ng-switch-default
         class="clearfix"
         data-field-name="{{field.name}}"
         aloha
         data-aloha-content="article.fields[field.name]"
         sf-droppable
         >
      </div>
    </section>


    <section class="custom-fields">
      <div class="header">
        <span ng-click="showCustomFields = !showCustomFields">
          <i class="fa fa-chevron-{{showCustomFields ? 'down' : 'right'}}"></i>
          {{ ::('aes.label.customfields'|trans) }}
        </span>
      </div>

      <div class="wrapper" ng-show="showCustomFields">
        <ul class="fields">
          <li ng-repeat="field in ::nonContentFields track by field.name"
              ng-switch on="field.type">

              <label>{{::(field.phrase || field.name)}}</label>

              <input ng-switch-when="text"
                  type="text"
                  class="form-control"
                  placeholder="{{ ::placeholder }}"
                  ng-model="article.fields[field.name]"
                  ng-change="nonContentFieldChanged()"/>

              <textarea ng-switch-when="longtext"
                  class="form-control"
                  placeholder="{{ ::placeholder }}"
                  ng-model="article.fields[field.name]"
                  ng-change="nonContentFieldChanged()"></textarea>

              <div ng-switch-default>
                Unrecognized field type <em>{{::field.type}}</em>, cannot render
                input widget for the field <em>{{::field.name}}</em>.
              </div>
          </li>
        </ul>

        <div ng-show="nonContentFields.length < 1">
          {{ ::('aes.label.nofields'|trans) }}
        </div>
      </div>

    </section>

</article>