- url ||= reports_path
= form_for report, :url => url, :html => { :multipart => true } do |f|

  - if report.errors.any?
    #error_explanation
      %h3= t('e.there_are_errors')

      %ul
        - report.errors.full_messages.each do |msg|
          %li= msg
  .row
    .col-md-6
      .field
        = f.label :"Name & Name SEO"
        = f.text_field :name, :class=> 'form-control', :placeholder => "name of report", :type => "text"
        = f.text_field :name_seo, :class=> 'form-control', :placeholder => "name seo", :type => "text"

    .col-md-6
      .field
        = f.label :subhead
        = f.text_area :subhead, :class => 'form-control', :rows => "5", :style=> "resize: vertical;"

  .field
    = f.label :Description
    = f.text_area :descr, :class => 'tinymce'

  %br/

  .row
    .col-md-6
      / Single button
      %label{} City
      = select :report, :city_id, @cities_list, :class=>"btn"




    .col-md-6
      .field
        = f.label :Coordinates
        .panel.panel-default
          .panel-body
            .col-md-6
              .form-group
                %label{} X-coordinate
                = f.text_field :x, :placeholder => "x", :type => "text", :class=>"form-control"

            .col-md-6
              .form-group
                %label{} Y-coordinate
                = f.text_field :y, :placeholder => "y", :type => "text", :class=>"form-control"



  .row
    .col-md-6
      / Single button
      %label{} Sites
      .btn-group{:style => "width:100%"}
        = select :report, :site_id, @sites_list


    .col-md-6
      %label{} Tags
      = select :report, :tag_id, @tags_list, :value=>"select a tag"

  .panel.panel-default
    .panel-heading
      %h3.panel-title Upload File
    .panel-body
      .row
        .col-md-6.col-md-offset-3
          %button.btn.btn-primary.btn-lg.btn-block{:type => "button", :onClick => "upload()"} Upload File
      = file_field_tag :photo, :style => "display:none", :id=>"photo"
      .div.center
        %img#thumbnail_image_boy.img-thumbnail{:alt => "uploaded image", :width=>"200px"}/


  :javascript

      $( document ).ready(function() {
      $(".caret").html("");
       });

      function upload(){
          document.getElementById("photo").click();
        }

        function handleFileSelect(evt) {
          var files = evt.target.files;

          // Loop through the FileList and render image files as thumbnails.
          for (var i = 0, f; f = files[i]; i++) {
            // Only process image files.
            if (f.type.match('image.*')) {
              var reader = new FileReader();

              reader.onload = function (e) {
                  // get loaded data and render thumbnail.
                  document.getElementById("thumbnail_image_boy").src = e.target.result;
              };

              // read the image file as a data URL.
              reader.readAsDataURL(f);
            }else{
              $("#photo").val("");
              alert("Only images accepted.");
            }
          }
        }
        document.getElementById('photo').addEventListener('change', handleFileSelect, false);



  .wrapper{:style => "text-align: center;"}
    %p.center
      = f.check_box :is_public
      = f.label :is_public
    %button.btn.btn-success{:type => "submit"} submit