igorlino / angular-annotorious Goto Github PK

Hi,

I want to know if we could disable edit button based on dynamic condition,
Any pointers on that?

In the colorbox demo, annotorious work only once after the image is re-rendered,

Should work everytime.

I use annotoriousService.addHandler inside a controller but every time this controller is initialized a new handler is created.
So, for the same event (i.e onAnnotationCreated) there are multiple "same" handlers.

Is there any suggestions on how to avoid that side effect ?

Any chance of getting 1.0.4 pushed to npm as well? I need to use the setProperties function for an existing app that I am transitioning from Bower to npm for the front-end, yet only 1.0.1 is available on npm. If it could get pushed, that would be greatly appreciated!

Thanks!

Hi Igor,

can you explain one small example of your annotorious library with TypeScript + Angular?

New to angular and need to implement some image annotation feature for image.

view code for turn js
<div ng-repeat="page in pagesData" style="background-image:url({{constant.bookImageUrlMed}}{{page.page_image}})"></div>

view code for turn js with annotorious
<div ng-repeat="page in pagesData" style="background-image:url({{constant.bookImageUrlMed}}{{page.page_image}})"><img class="aaaaaaaa_{{$index}}" id="aaaaaaaa_{{$index}}" style="" src="{{constant.bookImageUrlMed}}{{page.page_image}}"/></div>

Controller
```
for(var i=0;i<$scope.pagesData.length;i++){
var photo = angular.element(document).find(".aaaaaaaa_"+i)[0];
annotoriousService.makeAnnotatable(photo);
annotoriousService.setProperties({
outline: '#00f',
stroke: '#ff0000',
fill: 'rgba(255, 0, 0, 0.3)',
'hi_stroke': '#00ff00',
'hi_fill': 'rgba(0, 255, 0, 0.3)'
});
)

but it only works for 1st page.

hi can u help me how to add custom comment box not text area,i want to add different text boxes

Hello.

Could you please switch dependencies in package.json file to peerDependencies? This allows for flat dependency graph when this module is installed using npm.

Hmm. Sorry, I think I'm misunderstanding how npm@3 resolves dependencies. Normal dependencies also allow for flat tree.

Could you still bump angular version to cap version, please?

Thanks!

Haven't got a sight at any usage here. And we can include jquery from CDN for test. Right?
Thanks.

Hi,

Can we move an annotation which is already saved?,
Any pointers on that?

library is exactly what I'm looking for, does it have latest angular (the new angular framework) port ?

eg.:

<div annotorious-annotate on-save="saveFunction()">
</div>

in the controller:

$scope.saveFunction = function() {console.log('saving!')}

This would be useful for linking the annotations to a back-end, for example.

I am using the function but I do not get it to work. In the original library works. What about you can give an example?

Best regards

Hi Igorlino !

Thank you so much for your great job, I really appreciate the quality of your code. It really helps me with my issue : I'd like to integrate Annotorius in Conedakor database ([https://github.com/coneda/kor]). The new version of the database will use angular JS. I try to use Annotorius in my view, but it doesn't work. I can see the icon "click and drag to annotate" top left on my image but I can't annotate, what's frustrating ... I try to integrate your library angular-annotorius and put the name of the directive in the img element but it also doesn't work.

My angular js directive kor-anno :

kor.directive "korAnno", [
  "$http",
  (http) ->
    directive = {
      link: (scope, element, attrs) ->
        myImage = jQuery(element)
        myImage.bind 'load', ->   
          console.log('loaded')
          scope.$apply -> 
            anno.makeAnnotatable(element[0])
        #myImage.on "mouseover", (event) ->
        #  #event.preventDefault()
        #  console.log "qsdf"
        if myImage 
          console.log("img picked up")
          console.log(myImage)
        window.e = element    
      priority: 100
    }
]

the code about the view :

  <div ng-show="checked">
    <div class="section_panel">
        <div class="header">
         <a href="#" ng-click="toggle_checked($event)" style="font-weight:bold">Quit annotation</a><br/>
         <p>Nam vitae bibendum nunc. Pellentesque a aliquet orci, eget dictum ligula. Donec non molestie arcu. Morbi dignissim, libero non semper lobortis, neque elit fermentum risus, ac congue nibh sem quis ex. Fusce in fermentum orci, non pellentesque urna. In ac mauris et urna aliquet tincidunt. </p>
            <!-- link to medium -->
              <img alt="Image" class="-annotationlayer kor_medium" ng-src="{{entity.medium.url | image_size:'screen'}}" style="width:100%" kor-anno="myImage">
          <div class="title" ng-bind="entity.display_name" ></div>
        </div>
      </div>
  </div>

I presume it's not a timing issue, images are loaded before the directive. I put priority level 100 for kor-anno and ng-src is level 99. I also check the networks tab and Annotorious has loaded. I'm getting lost ...