PHRAS-450 - fix captured images dimension issue

Admin - allow input value change for sliders
fix misc css issues
update jquery checked attr into prop

resources/locales/messages.en.xlf

@@ -6149,7 +6149,7 @@
       </trans-unit>
       <trans-unit id="194aa1c37cc9c71f78e4ef648743beec42783329" resname="Subdef name" approved="yes">
         <source>Subdef name</source>
-        <target state="translated">Subview mane</target>
+        <target state="translated">Subview name</target>
         <jms:reference-file line="181">web/admin/subdefs.html.twig</jms:reference-file>
       </trans-unit>
       <trans-unit id="8017bd7de9961cf42f59abc587d0495a9d25c2a9" resname="Substitute" approved="yes">

resources/www/common/js/jquery.tooltip.js

@@ -685,6 +685,8 @@ function unfix_tooltip() {
 
 
 $(document).bind('keydown', function (event) {
+    if( $.tooltip === undefined ) return;
+
     if (event.keyCode == 27 && $.tooltip.blocked === true) {
         unfix_tooltip();
     }

resources/www/prod/skins/ui-components/_buttons.scss

@@ -7,10 +7,6 @@
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
   @include buttonBackground($btnBackground, $btnBackgroundHighlight, $btnColor, $btnTextShadow);
 }
-.btn.btn-inverse {
-  @include buttonBackground($btnInverseBackground, $btnInverseBackgroundHighlight, $btnInverseColor, $btnInverseTextShadow);
-}
-
 // @TODO .btn-primary
 
 .ui-dialog .btn, .ui-widget-content .btn {
@@ -20,55 +16,10 @@
   color: $btnColor;
 }
 
+.btn.btn-inverse {
+  @include buttonBackground($btnInverseBackground, $btnInverseBackgroundHighlight, $btnInverseColor, $btnInverseTextShadow);
+}
 
 .input-append button.btn {
   border-left: 1px solid $btnGrpSeparatorColor;
 }
-
-
-
-// not used:
-/*.history-collection {
-  background-image: url('#{$iconsPath}chgcoll_history.png');
-}
-
-.history-status {
-  background-image: url('#{$iconsPath}chgstatus_history.png');
-}
-
-.history-print {
-  background-image: url('#{$iconsPath}print_history.png');
-}
-
-.history-substit, .history-publish {
-  background-image: url('#{$iconsPath}imgtools_history.png');
-}
-
-.history-download, .history-mail, .history-ftp {
-  background-image: url('#{$iconsPath}disktt_history.png');
-}
-.history-edit {
-  background-image: url('#{$iconsPath}ppen_history.png');
-}
-
-.history-validate, .history-push {
-  background-image: url('#{$iconsPath}push16.png');
-}
-
-.history-collection, .history-status, .history-print, .history-substit, .history-publish, .history-download, .history-mail, .history-ftp, .history-edit, .history-validate, .history-push {
-  background-repeat: no-repeat;
-  background-position: center left;
-  background-size: 16px 16px;
-  padding-left: 24px;
-  min-height: 16px;
-}
-
-@media	only screen and (-webkit-min-device-pixel-ratio: 1.3),
-only screen and (-o-min-device-pixel-ratio: 13/10),
-only screen and (min-resolution: 120dpi)
-{
-  .history-collection, .history-status, .history-print, .history-substit, .history-publish, .history-download, .history-mail, .history-ftp, .history-edit, .history-validate, .history-push {
-    background-size: 16px 16px;
-  }
-}
-*/

resources/www/prod/skins/ui-components/_thumb-extractor.scss

@@ -109,7 +109,7 @@
     img {
       display: inline-block;
       width: 80px;
-      height: 60px;
+      height: auto;
       margin-left: 5px;
       margin-right: 5px;
       &.selected {
@@ -125,7 +125,7 @@
     left: 10px;
     text-align: center;
   }
-  #thumb_validate_button {
+  .thumb_submit_action {
     cursor: pointer;
     height: 30px;
     width: 80px;
@@ -146,6 +146,10 @@
       padding: 5px;
       text-align: center;
       vertical-align: middle;
+      img.selected {
+        width: 160px;
+        height: auto;
+      }
     }
   }
 }

resources/www/prod/skins/ui-components/_upload.scss

@@ -114,7 +114,6 @@
       height: 40px;
     }
     .error, .success{
-      height: 55px;
       padding-top: 2px;
       padding-bottom: 3px;
       display: none;

resources/www/vendors/jquery-test-paths/jquery.test-paths.js

@@ -17,7 +17,7 @@
 
                     $this.after('<img class="loader" style="visibility:hidden;" src="/assets/common/images/icons/loader-black.gif"/>');
                     $this.after('<img class="reload" src="/assets/common/images/icons/reload.png"/>');
-                    $this.after('<img class="status" src="/assets/common/images/icons/delete.png"/>');
+                    $this.after('<img class="status btn-img" src="/assets/common/images/icons/delete.png" width="16"/>');
 
 
                     $this.bind('keyup blur', function () {

templates/web/admin/databox/databox.html.twig

@@ -251,7 +251,7 @@
                         $("#viewname").html(data.viewname);
                     }
 
-                    $("#is_indexable").attr('checked', data.indexable);
+                    $("#is_indexable").prop('checked', data.indexable);
                     $("#records").text(data.counts.records);
 
                     if (data.counts.records > 0) {

templates/web/admin/publications/list.html.twig

@@ -111,7 +111,7 @@
       }
     });
     $('#add_pub_public').bind('change', function(){
-      if($(this).attr('checked'))
+      if($(this).prop('checked'))
       {
         $('#add_pub_base_id').val('');
       }
@@ -119,7 +119,7 @@
     $('#add_pub_base_id').bind('change', function(){
       if($(this).val() != '')
       {
-        $('#add_pub_public').attr('checked', false);
+        $('#add_pub_public').prop('checked', false);
       }
     });
   });

templates/web/admin/subdefs.html.twig

@@ -292,7 +292,9 @@
                                 {% if option.getType() == constant('\\Alchemy\\Phrasea\\Media\\Subdef\\OptionType\\OptionType::TYPE_RANGE') %}
                                     <div style="width:250px;" id="slider{{subdefgroup}}{{subdefname}}{{subdefType.getType()}}{{ option.getName() }}"></div>
                                     <script type="text/javascript">
-                                    $('#slider{{subdefgroup}}{{subdefname}}{{subdefType.getType()}}{{ option.getName() }}').slider({
+
+                                        $('#slider{{subdefgroup}}{{subdefname}}{{subdefType.getType()}}{{ option.getName() }}')
+                                                .slider({
                                             value:{{ option.getValue }},
                                             min: {{ option.getMinValue() }},
                                             max: {{ option.getMaxValue() }},
@@ -305,6 +307,12 @@
                                                 $("a.ui-slider-handle", event.target).addClass("no-ajax");
                                             }
                                         });
+
+                                        $('#slidervalue{{subdefgroup}}{{subdefname}}{{subdefType.getType()}}{{ option.getName() }}').on('change', function(){
+                                            var $this = $(this);
+                                            $('#slider{{subdefgroup}}{{subdefname}}{{subdefType.getType()}}{{ option.getName() }}').slider( "option", "value", $this.val() );
+                                        })
+
                                     </script>
                                 {% elseif option.getType() == constant('\\Alchemy\\Phrasea\\Media\\Subdef\\OptionType\\OptionType::TYPE_ENUM') %}
                                     <select name="{{varname}}">
@@ -326,7 +334,7 @@
                             </td>
                             <td>
                                 {% if option.type == constant('\\Alchemy\\Phrasea\\Media\\Subdef\\OptionType\\OptionType::TYPE_RANGE') %}
-                                    <input style="width:35px;" readonly value="{{option.value}}" id="slidervalue{{subdefgroup}}{{subdefname}}{{subdefType.getType()}}{{ option.getName() }}" name="{{varname}}" />
+                                    <input style="width:35px;" value="{{option.value}}" id="slidervalue{{subdefgroup}}{{subdefname}}{{subdefType.getType()}}{{ option.getName() }}" name="{{varname}}" />
                                 {% endif %}
                             </td>
                         </tr>

templates/web/admin/task-manager/task-editor/subdefs.html.twig

@@ -102,7 +102,7 @@
             for(i=0; i < $databoxes.length; i++) {
                 var sbid = $($databoxes[i]).attr('value');
 
-                $($databoxes[i]).attr('checked', (xml.find("sbas").filter(function(){return $(this).text()==sbid}).length > 0));
+                $($databoxes[i]).prop('checked', (xml.find("sbas").filter(function(){return $(this).text()==sbid}).length > 0));
             }
         }
     }

templates/web/common/dialog_export.html.twig

@@ -643,7 +643,7 @@
                 $('input[name="obj[]"]', $('#download')).each(function(){
                     var total_el = $('#download input[name=download_'+$(this).val()+']');
                     var count_el = $('#download input[name=count_'+$(this).val()+']');
-                    if($(this).attr('checked'))
+                    if($(this).prop('checked'))
                     {
                         total += parseInt($(total_el).val());
                         count += parseInt($(count_el).val());
@@ -664,7 +664,7 @@
                 if(count>1 && total/1024/1024 > {{max_download}}) {
                     if(confirm("{{alert_too_big_one|e('js') ~ "\\n" ~ alert_too_big_two|e('js') ~ "\\n" ~ alert_too_big_three|e('js')}}")) {
                         $('input[name="obj[]"]:checked', $('#download')).each(function(i,n){
-                        $('input[name="obj[]"][value="'+$(n).val()+'"]', $('#sendmail')).attr('checked', true);
+                        $('input[name="obj[]"][value="'+$(n).val()+'"]', $('#sendmail')).prop('checked', true);
                         });
                         $('input[name="destmail"]', $('#sendmail')).val("{{app.getAuthenticatedUser().getEmail()}}");
 

templates/web/prod/WorkZone/Browser/Browser.html.twig

@@ -299,9 +299,9 @@
       name = input.attr('name');
 
       var inputs = $('input[name="' + $(this).prev('input').attr('name') + '"]', $container);
-      inputs.removeAttr('checked').next('label').removeClass('selected');
+      inputs.prop('checked', false).next('label').removeClass('selected');
 
-      input.attr('checked', 'checked').next('label').addClass('selected');
+      input.prop('checked', true).next('label').addClass('selected');
       $('form[name="BasketBrowser"]', $container).trigger('submit')
     });
 

templates/web/prod/actions/Bridge/index.html.twig

@@ -234,7 +234,7 @@ $(function() {
 
         if(event.selector_all)
         {
-          $this.attr('checked', $(".bridge_all_selector", $panel).is(':checked'));
+          $this.prop('checked', $(".bridge_all_selector", $panel).is(':checked'));
         }
 
         $('form[name="bridge_selection"] input[name="elements_list"]', $panel).val(
@@ -251,7 +251,7 @@ $(function() {
         if(!event.selector_all)
         {
           var bool = !($(".bridge_element_selector:checked", $panel).length !== $(".bridge_element_selector", $panel).length);
-          $(".bridge_all_selector", $panel).attr('checked', bool);
+          $(".bridge_all_selector", $panel).prop('checked', bool);
         }
         else
         {

templates/web/prod/actions/Tools/confirm.html.twig

@@ -3,7 +3,7 @@
   <tbody>
     <tr>
       <td>
-        <img class='selected' style="width:160px; height:105px;"src="{{image}}"/>
+        <img class="selected" src="{{image}}"/>
       </td>
       <td>
         <img style=" width:50px;height:80px;"src="/assets/prod/images/ThumbExtractor/question_mark.png"/>

templates/web/prod/actions/Tools/index.html.twig

@@ -121,7 +121,7 @@
 
               {% set technical_info = record.get_technical_infos %}
               {% set width = technical_info[dataW].value %}
-              {% set height = technical_infos[dataH].value %}
+              {% set height = technical_info[dataH].value %}
 
               {% if width and height %}
                 {% set ratio = (width / height)|number_format(2, '.') %}
@@ -164,10 +164,11 @@
               <div id="thumb_wrapper">
               </div>
             </div>
-            <div id="thumb_validate_button" class="PNB">
+            <div class="thumb_submit_action PNB">
               <input type="hidden" value='{{record.get_sbas_id()}}' name='sbas_id'>
               <input type="hidden" value='{{record.get_record_id()}}' name='record_id'>
-              <img src="/assets/prod/images/ThumbExtractor/validate_button.png" alt="{{ 'take a screenshot' | trans }}" />
+                <button  id="thumb_validate_button" class="btn btn-inverse" type="button">{{ "validate" | trans }}</button>
+
             </div>
           </div>
         {% endif %}
@@ -349,11 +350,11 @@
 <script type="text/javascript">
 
 $(document).ready(function(){
-    var scope = $("#prod-tool-box");
+    var $scope = $("#prod-tool-box");
-    var tabs = $("#tool-tabs", scope).tabs();
+    var tabs = $("#tool-tabs", $scope).tabs();
     var width = 0;
 
-    $(".iframe_submiter", scope).bind("click", function(){
+    $(".iframe_submiter", $scope).bind("click", function(){
         var form = $(this).closest("form");
         form.submit();
         form.find('.load').empty().html(language.loading + ' ...');
@@ -365,7 +366,7 @@ $(document).ready(function(){
         });
     });
 
-    $(".action_submiter", scope).bind("click", function(){
+    $(".action_submiter", $scope).bind("click", function(){
         var $this = $(this);
         var form = $(this).closest("form");
 
@@ -393,7 +394,7 @@ $(document).ready(function(){
         return false;
     });
 
-    $(".action_cancel", scope).bind("click", function(){
+    $(".action_cancel", $scope).bind("click", function(){
         var dialog = p4.Dialog.get(1);
         dialog.Close();
 
@@ -408,10 +409,22 @@ $(document).ready(function(){
 
     if(ThumbEditor.isSupported()) {
 
-        var sliderWrapper = $("#thumb_wrapper", scope);
+        var $sliderWrapper = $("#thumb_wrapper", $scope);
 
-        $("#thumb_delete_button", scope).bind("click", function(){
+        $sliderWrapper.on('click', 'img', function(){
-            var img = sliderWrapper.find(".selected");
+            $('.selected', $sliderWrapper).removeClass('selected');
+            $(this).addClass('selected');
+
+            var $self = this;
+            var selectedScreenId = $self.getAttribute("id").split("_").pop();
+            var screenshots = ThumbEditor.store.get(selectedScreenId);
+
+            ThumbEditor.copy(screenshots.getDataURI(), screenshots.getAltScreenShots());
+        });
+
+
+        $scope.on('click', '#thumb_delete_button', function(){
+            var img = $sliderWrapper.find(".selected");
             var id = img.attr("id").split("_").pop();
             var previous = img.prev();
             var next = img.next();
@@ -427,7 +440,7 @@ $(document).ready(function(){
             else
             {
                 $(this).hide();
-                $("#thumb_info", scope).show();
+                $("#thumb_info", $scope).show();
                 ThumbEditor.resetCanva();
             }
 
@@ -435,38 +448,27 @@ $(document).ready(function(){
             ThumbEditor.store.remove(id);
         });
 
-        $(".close_action_frame", scope).bind("click", function(){
+        $scope.on('click', '.close_action_frame', function(){
             $(this).closest(".action_frame").hide();
         });
 
 
-        $("img", sliderWrapper).on("click", function(){
+        $scope.on('click', '#thumb_camera_button', function(){
-            $('.selected', sliderWrapper).removeClass('selected');
+            $("#thumb_info", $scope).hide();
-            $(this).addClass('selected');
+            $("#thumb_delete_button", $scope).show();
-
-            var $self = this;
-            var selectedScreenId = $self.getAttribute("id").split("_").pop();
-            var screenshots = ThumbEditor.store.get(selectedScreenId);
-
-            ThumbEditor.copy(screenshots.getDataURI(), screenshots.getAltScreenShots());
-        });
-
-        $("#thumb_camera_button", scope).bind("click", function(){
-            $("#thumb_info", scope).hide();
-            $("#thumb_delete_button", scope).show();
 
             var screenshot = ThumbEditor.screenshot();
             var img = $("<img />");
-            $('.selected', sliderWrapper).removeClass('selected');
+            $('.selected', $sliderWrapper).removeClass('selected');
             img.addClass('selected')
             .attr('id', 'working_'+ screenshot.getId())
             .attr('src', screenshot.getDataURI())
             .attr("alt", screenshot.getVideoTime())
-            .appendTo(sliderWrapper);
+            .appendTo($sliderWrapper);
         });
 
         $("#thumb_canvas").on('tool_event', function(){
-            var thumbnail = $('.selected', sliderWrapper);
+            var thumbnail = $('.selected', $sliderWrapper);
 
             if(thumbnail.length === 0)
             {
@@ -478,9 +480,8 @@ $(document).ready(function(){
             thumbnail.attr('src', ThumbEditor.getCanvaImage());
 
         });
-
+        $scope.on('click', '#thumb_validate_button', function(){
-        $("#thumb_validate_button", scope).bind("click", function(){
+            var thumbnail = $('.selected', $sliderWrapper);
-            var thumbnail = $('.selected', sliderWrapper);
 
             if(thumbnail.length === 0)
             {
@@ -591,7 +592,7 @@ $(document).ready(function(){
             }, 2);
 
             var datas = {
-                image: $('.selected', sliderWrapper).attr("src"),
+                image: $('.selected', $sliderWrapper).attr("src"),
                 sbas_id: sbas_id,
                 record_id: record_id
             };

templates/web/prod/templates/upload.html.twig

@@ -17,7 +17,7 @@
         <div class="caption">
             <p class="name-doc"><%= name %></p>
             <p class="infos-doc"><%= size %>, <%= type %></p>
-            <button type="button" class="remove-element btn btn-inverse btn-mini"><%= language.cancel %></button>
+            <button type="button" class="remove-element btn btn-mini"><%= language.cancel %></button>
             <input type="hidden" name="uploadIndex" value="<%= uploadIndex %>"/>
         </div>
     </div>

templates/web/report/listColumn.html.twig

@@ -34,10 +34,10 @@
   </div>
             <script type="text/javascript">
                 $('a#on').click(function(){
-                    $(this).closest('#dialog').find(':checkbox').attr('checked', true);
+                    $(this).closest('#dialog').find(':checkbox').prop('checked', true);
                 });
                 $('a#off').click(function(){
-                    $(this).closest('#dialog').find(':checkbox').attr('checked', false);
+                    $(this).closest('#dialog').find(':checkbox').prop('checked', false);
                 });
             </script>
 {% endblock %}