Sha256: e83360a9c203352f362060182132ee376ea7a7b01cb500b33a76786f7e97ef33

Contents?: true

Size: 1.97 KB

Versions: 1

Compression:

Stored size: 1.97 KB

Contents

<script type="text/ng-template" id="promethee/write/component/image">
  <div
    ng-controller="ImageController"
    class="promethee-editor__component promethee-editor__component--image"
    ng-click="edit($event);"
  >
    <div class="promethee-editor__component-selected" ng-class="{'promethee-editor__component-selected--visible': inspected.component === component}">
      <div class="promethee-editor__toolbar">
        Image
        <ng-include src="'promethee/write/toolbar'"></ng-include>
      </div>

      <figure ng-show="component.attributes.src">
        <img ng-src="{{component.attributes.src}}" class="img-responsive">
        <figcaption ng-show="component.attributes.caption" ng-bind-html="component.attributes.caption | htmlSafe"></figcaption>
      </figure>

      <div ng-hide="component.attributes.src">
        <p ng-hide="editing" class="text-center">Click to set the image</p>
      </div>
    </div>
  </div>
</script>

<script>
  angular.injector(['ng', 'Promethee']).get('definitions').push({
    name: 'Image',
    thumb: 'http://via.placeholder.com/300x200',
    data: {
      type: 'image',
      attributes: {
        src: 'https://picsum.photos/1920/1080/?random',
        alt: '',
        caption: ''
      }
    }
  });

  promethee.controller('ImageController', ['$scope', 'inspected', function($scope, inspected) {
    Object.defineProperty($scope, 'editing', {
      get: function() {
        return inspected.component == $scope.component;
      }
    });

    $scope.edit = function(event) {
      event.stopPropagation();
      inspected.component = $scope.component;
    };

    $scope.complete = function() {
      inspected.component = null;
    };

    $scope.toggleEdit = function() {
      $scope[$scope.editing ? 'complete' : 'edit']();
    };

    $scope.options = {
      toolbar: [
        ['headline', ['style']],
        ['style', ['bold', 'italic']],
        ['alignment', ['ul', 'ol', 'paragraph']],
        ['code', ['codeview']]
      ]
    };
  }]);
</script>

Version data entries

1 entries across 1 versions & 1 rubygems

Version Path
promethee-1.0.20 app/views/promethee/edit/write/component/_image.html.erb