cobuild-angular-stack/modules/coupleAccount/views/auth.wedding.html

Base stack angular sass jade gulp

<div id="auth-wedding" class="container-fluid">
  <div class="row">
    <aside class="nav col-md-2 sidebar couple">
      <ul style="margin-top: -50px">
        <li ui-sref-active-eq="active"><a ui-sref="homeUser">{{'see-cover' | translate}} </a></li>
        <li ui-sref-active-eq="active"><a ui-sref="registry">{{'see-table' | translate}} </a>
        </li>
        <li ui-sref-active-eq="active"><a ui-sref="products">{{'add-catalog' | translate}} </a>
        </li>
        <li ui-sref-active-eq="active"><a href="javascript:void(0)">{{'import-tables' | translate}} </a></li>
        <li ui-sref-active-eq="active"><a ui-sref="products.new">{{'create-gift' | translate}}</a></li>
        <li>
            <a ng-disabled="!url" href="javascript:void(0)" ui-zeroclip zeroclip-copied="copied=true"
               zeroclip-model="url">
                {{'share-with-guests' | translate}}
            </a>
        </li>
      </ul>
    </aside>
    <div class="col-md-10 col-md-offset-2">
      <div class="row">
          <header class="col-sm-12"
                  ng-style="{backgroundImage:newCover ? 'url('+newCover+')':account.weddingData.coverPhoto?'url('+account.weddingData.coverPhoto+')':null}">
              <div class="main-header">
                  <div class="col-md-offset-1 text-right editable-container editable-right">
                      <span editable-text="account.weddingData.nameP1">
                          {{account.weddingData.nameP1 || 'Nombre y Apellido'}}
                          <i class="glyphicon glyphicon-pencil" aria-hidden="true"></i>
                      </span>
                  </div>
                  <div class="profile-photo">
                      <div class="photo drop-zone"
                           ng-style="{backgroundImage:account.weddingData.profilePhoto?'url('+account.weddingData.profilePhoto+')':null}">
                          <div class="placeholder">
                              <button style="margin-top: 10px" class="btn btn-sm btn-primary">{{'click-here' | translate}}
                              </button>
                          </div>
                          <button type="file" class="input-uploader" ng-click="editPhoto()"/>
                      </div>
                  </div>
                  <div class="text-left editable-container editable-left">
                      <span editable-text="account.weddingData.nameP2">
                          {{account.weddingData.nameP2 || 'Nombre y Apellido'}}
                          <i class="glyphicon glyphicon-pencil" aria-hidden="true"></i>
                      </span>
                  </div>
              </div>
              <div class="row">
                  <div class="col-xs-4 col-xs-offset-4 col-md-2 col-md-offset-5 text-center">
                      <div class="input-group">
                          <input type="date" class="form-control date-select" placeholder="{{'date-day' | translate}} &#183; {{'date-month' | translate}} &#183; {{'date-year' | translate}}"
                                 uib-datepicker-popup="{{'dd / MM / yyyy'}}" ng-model="date"
                                 is-open="popup1.opened" datepicker-options="dateOptions" ng-required="true"
                                 mousewheel="false"
                                 close-text="Close"/>
                    <span class="input-group-btn">
                      <button type="button" class="btn btn-default" ng-click="popup1.opened = true"><i
                              class="glyphicon glyphicon-calendar"></i></button>
                    </span>
                      </div>
                  </div>
              </div>
              <div class="float-button">
                  <a class="edit-profile" ng-click="editBanner()">{{'edit-cover-photo' | translate}}<i
                          class="glyphicon glyphicon-pencil" aria-hidden="true"></i></a>
              </div>
          </header>
        </div>
        <div class="row">
            <div class="main-wedding col-sm-12 col-sm-offset-0 col-md-6 col-md-offset-3">
                <div class="row">
                    <div class="wellcome-message">
               <!--  <span class="message" editable-textarea="account.weddingData.welcomeMessage" e-rows="7" e-cols="40">
                    {{account.weddingData.welcomeMessage || 'Escribe tu mensaje de bienvenida aqui...'}}
                    <i class="glyphicon glyphicon-pencil" aria-hidden="true"></i>
                </span> -->
                      <div id="textarea" class="textarea" blur="submit" buttons="no"
                           editable-textarea="account.weddingData.welcomeMessage"
                           e-placeholder="{{'welcome-message' | translate}}"
                           e-form="welcomeMessageTextarea">
                      </div>
                    </div>
                </div>
                <a class="btn btn-default btn-registry" ui-sref="registry">{{'see-gifts-table' | translate}}</a>
            </div>
        </div>
        <div ng-show="!editableWeddingData" class="row">
            <div class="col-sm-12 col-md-6" style="position: relative">
                <ui-gmap-google-map
                        center="map.center"
                        zoom="map.zoom"
                        dragging="map.dragging"
                        bounds="map.bounds"
                        events="map.events"
                        options="map.options"
                        pan="true"
                        control="map.control"
                >

                    <ui-gmap-search-box template="searchbox.template" events="searchbox.events"
                                        parentdiv="'searchBoxParent'"></ui-gmap-search-box>
                    <ui-gmap-markers idkey="map.idkey" models="map.markers" coords="'self'" icon="'icon'"
                                     click="'onClicked'"></ui-gmap-markers>
                    <ui-gmap-window show="window.show" coords="window.coords" idkey="window.place_id"
                                    templateurl="window.templateurl"
                                    templateparameter="window.templateparameter" options="window.options"
                                    closeClick='window.closeClick()' ng-cloak>

                    </ui-gmap-window>
                </ui-gmap-google-map>
                <div class="row map-description">
                    <div class="col-sm-6 ">
                        <h4>¿Donde?</h4>
                        <div class="map-block">
                            <i class="fa fa-map-marker"></i>
                            <div class="text">
                                <span class="place-name">{{weddingData.placeName}}</span>
                                <p class="" ng-bind-html="weddingData.gpsaddress.templateparameter.adr_address">
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-6 ">
                        <h4>¿Cuando?</h4>
                        <div class="map-block">
                            <i class="fa fa-clock-o"></i>
                            <div class="text">
                                <span class="date">{{date|date:'MMMM dd yyyy'}}</span>
                                <br/>
                                <span class="time">{{date|date:'hh:mm a'}}</span>
                            </div>
                        </div>
                    </div>
                </div>
                <div ng-show="!weddingData.isSetted" ng-click="editableWeddingData=true"
                     style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,.8)">
                    <h4 style="position: absolute; top:50%; left: 50%; margin-top: -12px; margin-left: -150px;">
                       {{'add-wedding-details' | translate}}</h4>
                </div>
            </div>
          <div class="col-xs-10 col-xs-offset-1 col-sm-8 col-sm-offset-2 col-md-6 col-md-offset-0"
               style="background: #E8E8E8; padding: 20px 50px; position: relative">
            <b style="position: absolute; right: 15px; top: -30px"><a ng-click="exportRSVP()" style="color: #000">{{'export-answers' | translate}} <i class="fa fa-download" aria-hidden="true"></i></a></b>
              <br/>
              <p>{{'confirm-attend' | translate}}</p>
              <br/>
              <form name="rsvp" ng-submit="false">
                  <div class="form-group">
                      <label class="sr-only" for="guest-name">{{'name' | translate}}</label>
                      <input disabled type="text" class="form-control" id="guest-name"
                             placeholder="{{'name' | translate}}">
                  </div>
                  <br/>
                  <div class="form-group">
                      <label class="sr-only" for="guest-email">{{'email' | translate}}</label>
                      <input disabled type="email" class="form-control" id="guest-email" placeholder="{{'email' | translate}}">
                  </div>
                  <br/>
                  <div class="form-group">
                      <div class="col-xs-4">
                          <div class="radio">
                              <input disabled type="radio" name="asistencia" id="guest-si-asiste" checked
                                     value="no">
                              <label for="guest-si-asiste">
                                  {{'attend' | translate}}
                              </label>
                          </div>
                      </div>
                      <div class="col-xs-8">
                          <div class="radio">
                              <input disabled type="radio" name="asistencia" id="guest-no-asiste" value="no">
                              <label for="guest-no-asiste">
                                  {{'not-attend' | translate}}
                              </label>
                          </div>
                      </div>
                  </div>
                  <br/>
                  <br/>
                  <br/>
                  <div class="form-group">
                      <label class="sr-only" for="guest-adds">{{'additional-people' | translate}}</label>
                      <input disabled type="number" class="form-control" id="guest-adds" min="0"
                             placeholder="{{'additional-people' | translate}}">
                  </div>
                  <div class="text-center">
                      <button disabled type="submit" class="btn btn-info btn-lg">{{'send' | translate}}</button>
                  </div>
              </form>
          </div>
        </div>
        <div ng-show="editableWeddingData" class="row">
            <div class="col-sm-12 col-md-6 col-md-offset-3" style="background: #E8E8E8; padding: 20px">
                <div class="form-group">
                    <input class="form-control" ng-model="weddingData.placeName"
                           ng-model-options="{ updateOn: 'blur' }" placeholder="{{'local-name' | translate}}">
                </div>
                <div class="form-group" ng-show="!searchActive">
                    <button type="button" class="form-control google-search-map" ng-click="searchActive = true"
                            ng-bind-html="weddingData.gpsaddress.templateparameter.adr_address"></button>
                </div>
                <div class="form-group" id="searchBoxParent" ng-show="searchActive">
                    <script type="text/ng-template" id="searchbox.tpl.html">
                        <input class="form-control google-search-map" type="text" ng-model="address"
                               placeholder="{{'enter-address-place' | translate}}" required/>
                    </script>
                </div>
                <div class="row">
                    <div class="col-sm-6" style="margin-top: 17px">
                        <div class="form-group">
                            <div class="input-group">
                                <input type="date" class="form-control" placeholder="{{'wedding-date' | translate}}"
                                       uib-datepicker-popup="{{'dd / MM / yyyy'}}" ng-model="weddingData.date"
                                       is-open="popup2.opened"
                                       mousewheel="false"
                                       datepicker-options="dateOptions" ng-required="true" close-text="Close"/>
                <span class="input-group-btn">
                    <button type="button" class="btn btn-default" ng-click="popup2.opened = true">
                        <i class="glyphicon glyphicon-calendar"></i>
                    </button>
                </span>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-6" style="margin-top: -17px">
                        <div class="form-group">
                            <uib-timepicker ng-model="weddingData.date" hour-step="1" mousewheel="false"
                                            minute-step="30"
                                            show-meridian="true">
                            </uib-timepicker>
                        </div>
                    </div>
                </div>
                <div class="row text-center">
                    <a ng-click="editableWeddingData = false" class="btn btn-primary">{{'save-change' | translate}}</a>
                </div>
            </div>
        </div>
        <br/>
        <br/>
    </div>
  </div>
</div>