%script{ :src => 'http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js', :type => 'text/javascript', :charset => 'utf-8' }
%h3{:style => "text-align:center;"}
  %a{:href => "/"} GroupDocs Ruby SDK Samples
  \- Sample11
.samplecontent{:style => "padding:10px;"}
  %i This sample will show how programmatically create and post an annotation into document. How to delete the annotation using Ruby SDK
  %br/
  %br/
  %p
    You entered:
  %p
    UserId = #{(defined? userId) ? userId : ""}
  %p
    PrivateKey = #{(defined? privateKey) ? privateKey : ""}
  %p
    FileId = #{(defined? fileId) ? fileId : ""}
  %p
    Annotation ID = #{(defined? annotationId) ? annotationId : ""}
  %p
    Annotation Type = #{(defined? annotationType) ? annotationType : ""}
  %p
    Annotation Text = #{(defined? annotationText) ? annotationText : ""}
  %p
    %font{:color => "red"} #{(defined? err) ? err : ""}
  %br/

  #requestForm{:style => "padding:20px; border:1px solid black;"}
    %form{:action => "/sample11", :method => "post"}
      %input{:type => 'hidden', :name => 'annotationId', :value => (defined? annotationId) ? annotationId : ""}
      %p Enter data for request and press "Make request" button

      %label{:for => "client_id"} GroupDocs ClientID
      %br/
      %input{:type=>"text", :name=>"client_id", :value => (defined? userId) ? userId : ""}
      %br/
      %label{:for => "private_key"} GroupDocs PrivateKey
      %br/
      %input{:type=>"text", :name=>"private_key", :value => (defined? privateKey) ? privateKey : ""}
      %br/
      %label{:for => "file_id"} GroupDocs FileID
      %br/
      %input{:type=>"text", :name=>"fileId", :value => (defined? fileId) ? fileId : ""}
      %br/
      Annotation Type
      %br/
      %select{:name => 'annotation_type', :id => 'annotation_type'}
        %option{:value => 'text'}Text
        %option{:value => 'area'}Area
        %option{:value => 'point', :selected => "selected"}Point
      %br/
      %br/

      %fieldset
        %legend Parameters (all are required)
        %div
          %span Box X
          %input{:type=>"text", :name=>"box_x", :placeholder => "double"}
        %div
          %span Box Y
          %input{:type=>"text", :name=>"box_y", :placeholder => "double"}

        %div{:style => "display:none", :id => "box-params"}
          %div
            %span Box Width
            %input{:type=>"text", :name=>"box_width", :placeholder => "double"}
          %div
            %span Box Height
            %input{:type=>"text", :name=>"box_height", :placeholder => "double"}

        %div{:style => "display:none", :id => "annotation-position"}
          %div
            %span Annotation Position X
            %input{:type=>"text", :name=>"annotationPosition_x", :placeholder => "double"}
          %div
            %span Annotation Position Y
            %input{:type=>"text", :name=>"annotationPosition_y", :placeholder => "double"}

        %div
          %span Text
          %input{:type=>"text", :name=>"text", :placeholder => "text"}


      %input{:type => "submit", :value => "Make request"}/

%div{:style => "padding:10px;"}
  Choose another one sample:
  %ul
    %li
      %a{:href => "/sample1"} Sample1 - How to login to GroupDocs using the API
    %li
      %a{:href => "/sample2"} Sample2 - How to list files within GroupDocs Storage using the Storage API
    %li
      %a{:href => "/sample3"} Sample3 - How to upload a file to GroupDocs using the Storage API
    %li
      %a{:href => "/sample4"} Sample4 - How to download a file from GroupDocs Storage using the Storage API
    %li
      %a{:href => "/sample5"} Sample5 - How to copy / move a file using the GroupDocs Storage API
    %li
      %a{:href => "/sample6"} Sample6 - How to add a Signature to a document in GroupDocs Signature
    %li
      %a{:href => "/sample7"} Sample7 - How to create a list of thumbnails for a document
    %li
      %a{:href => "/sample8"} Sample8 - How to return a URL representing a single page of a Document
    %li
      %a{:href => "/sample9"} Sample9 - How to generate an embedded Viewer URL for a Document
    %li
      %a{:href => "/sample10"} Sample10 - How to share a document to other users
    %li
      %a{:href => "/sample11"}Sample11 - How programmatically create and post an annotation into document. How to delete the annotation
    %li
      %a{:href => "/sample12"}Sample12 - How to list all annotations from document
    %li
      %a{:href => "/sample13"}Sample13 - How to add collaborator to doc with annotations
    %li
      %a{:href => "/sample14"}Sample14 - How to check the list of shares for a folder
    %li
      %a{:href => "/sample15"}Sample15 - How to check the number of document's views
    %li
      %a{:href => "/sample16"}Sample16 - How to insert Assembly questionary into webpage
    %li
      %a{:href => "/sample17"}Sample17 - How to upload a file into the storage and compress it into zip archive
    %li
      %a{:href => "/sample18"}Sample18 - How to convert Doc to Docx, Docx to Doc, Docx to PDF, PPT to PDF

:javascript
  $(function() {
      $('select[name="annotation_type"]').change(function() {
          var obj = $(this);

          if (obj.val() == "text") {
              $('#text-params, #annotation-position, #box-params').show();
          }
          else if (obj.val() == "area") {
              $('#box-params').show();
              $('#annotation-position').hide();
          }
          else if (obj.val() == "point") {
              $('#annotation-position, #box-params').hide();
          }
      });
  });