phrasing_plus 0.0.4 → 0.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 325ffaefd9b627bc76ab0a6996826b43c503822b
4
- data.tar.gz: 33bea4c01013ca073e8190d4c972428c5dbf25f9
3
+ metadata.gz: 0c37aa5fc15cfa361d73fdd69ca1c3c9714c5b56
4
+ data.tar.gz: 8db7d447611199cbf48d9838c12a8c54409db6c5
5
5
  SHA512:
6
- metadata.gz: 11618d56c62b024549bf72710269adfd50bd487d3995f04e0947318ec5c748d91329e12dfdb536244b5963512a06dcf2c786c43b73c900fb74bb7a8a6ace385f
7
- data.tar.gz: ed303b7017a46fd50ebb1841e922214dbf79721b999b909a872d218ab52a7b81b36b8e394cb843a9ec127000738c111f2b10a7894a6906e34c7c0c5e608178c5
6
+ metadata.gz: c0f3b416895eccca8d6ed9b717002f5c9b84c29f2c5ef66b5af282fc2a1490762daa581de76dfb587d8cb90313df02826cd2d3ada33b2c40fa421b53a8b9f06e
7
+ data.tar.gz: fd05c06feaed51b7d4270f65f36ac677ecd83f6c07ffc837ff353c959f2527ca2b2b476b0122645d19ec14770f5227b5607897f1f7708bf7c05fb38601e86501
@@ -7,11 +7,23 @@ function PhrasingImageWidget(options){
7
7
  var $form = options.$form;
8
8
  var $submitButton = options.$submitButton;
9
9
 
10
+ var showSaveDiscardButtons = function() {
11
+ $fileInputLabel.hide();
12
+ $discardChangeLabel.css('display', 'block');
13
+ $submitButton.css('display', 'block');
14
+ };
15
+
16
+ var hideSaveDiscardButtons = function() {
17
+ $fileInputLabel.css('display', 'block');
18
+ $discardChangeLabel.hide();
19
+ $submitButton.hide();
20
+ };
21
+
10
22
  var getImageSrc = function(){
11
23
  if($image.size() !== 0){
12
- $image.attr('src');
24
+ return $image.attr('src');
13
25
  }else{
14
- $wrapper.css('background-image');
26
+ return $wrapper.css('background-image');
15
27
  }
16
28
  };
17
29
 
@@ -26,9 +38,7 @@ function PhrasingImageWidget(options){
26
38
  var showChosenImage = function(){
27
39
  rememberOriginalImage();
28
40
  setChosenImageAsSource();
29
- $fileInputLabel.hide();
30
- $discardChangeLabel.show();
31
- $submitButton.show();
41
+ showSaveDiscardButtons();
32
42
  };
33
43
 
34
44
  var setChosenImageAsSource = function(){
@@ -51,10 +61,8 @@ function PhrasingImageWidget(options){
51
61
 
52
62
  var discardChosenImage = function(){
53
63
  revertImageToOriginal();
54
- $form[0].reset();
55
- $fileInputLabel.show();
56
- $discardChangeLabel.hide();
57
- $submitButton.hide();
64
+ $form.get(0).reset();
65
+ hideSaveDiscardButtons();
58
66
  };
59
67
 
60
68
  var revertImageToOriginal = function(){
@@ -64,27 +72,24 @@ function PhrasingImageWidget(options){
64
72
 
65
73
  var uploadChosenImage = function(){
66
74
  $.ajax({
67
- type: "PUT",
75
+ type: 'PUT',
68
76
  url: $form.attr('action'),
69
77
  data: new FormData( $form[0] ),
70
78
  processData: false,
71
79
  contentType: false,
72
- success: function(data)
73
- {
80
+ success: function(data) {
74
81
  handleSuccessfullUpload(data);
75
82
  },
76
- error: function(data){
83
+ error: function(data) {
77
84
  handleFailedUpload(data);
78
85
  }
79
86
  });
80
87
  };
81
88
 
82
89
  var handleSuccessfullUpload = function(data){
83
- $form[0].reset();
90
+ $form.get(0).reset();
84
91
  addNewSrcToImage(data.image.url);
85
- $fileInputLabel.show();
86
- $discardChangeLabel.hide();
87
- $submitButton.hide();
92
+ hideSaveDiscardButtons();
88
93
  showSuccessNotification(data);
89
94
  };
90
95
 
@@ -102,11 +107,9 @@ function PhrasingImageWidget(options){
102
107
  };
103
108
 
104
109
  var handleFailedUpload = function(data){
105
- $form[0].reset();
110
+ $form.get(0).reset();
106
111
  revertImageToOriginal();
107
- $fileInputLabel.show();
108
- $discardChangeLabel.hide();
109
- $submitButton.hide();
112
+ hideSaveDiscardButtons();
110
113
  showFailureNotification(data);
111
114
  };
112
115
 
@@ -1,92 +1,106 @@
1
- .phrasing-image-holder{
2
- form.phrasing-image-edit-form {
1
+ $phrasing-image-font-family: "icomoon";
2
+ $phrasing-image-font-size: 13px;
3
+ $phrasing-image-font-weight: 200;
4
+
5
+ $phrasing-image-btn-color: #FFFFFF;
6
+
7
+ $phrasing-image-btn-width: 180px;
8
+ $phrasing-image-line-height: 35px;
9
+
10
+ $phrasing-image-border-width: 2px;
11
+ $phrasing-image-border-color: #FFFFFF;
12
+ $phrasing-image-btn-border-radius: 35px;
13
+
14
+ $phrasing-image-btn-edit-background: #898989;
15
+ $phrasing-image-btn-discard-chage-background: #F1A515;
16
+ $phrasing-image-btn-submit-background: #56AE45;
17
+
18
+ %phrasing-image-button-style {
19
+ padding: 0;
20
+ margin-bottom: 10px;
21
+
22
+ cursor: pointer;
23
+
24
+ display: block;
25
+
26
+ font: {
27
+ family: $phrasing-image-font-family;
28
+ size: $phrasing-image-font-size;
29
+ weight: $phrasing-image-font-weight;
30
+ }
31
+
32
+ text-align: center;
33
+ color: $phrasing-image-btn-color;
34
+
35
+ width: $phrasing-image-btn-width;
36
+ line-height: $phrasing-image-line-height;
37
+
38
+ border: {
39
+ width: $phrasing-image-border-width;
40
+ style: solid;
41
+ color: $phrasing-image-border-color;
42
+ }
43
+ -webkit-border-radius: $phrasing-image-btn-border-radius;
44
+ -moz-border-radius: $phrasing-image-btn-border-radius;
45
+ border-radius: $phrasing-image-btn-border-radius;
46
+ }
47
+
48
+ %phrasing-image-holder{
49
+
50
+ &.phrasable-on .phrasing-image-edit-form{
51
+ display: block;
52
+ }
53
+
54
+ .phrasing-image-edit-form {
3
55
  display: none;
4
56
  position: absolute;
5
57
  top: 0;
6
58
  right: 0;
7
59
 
8
- label{
9
- font-family: "icomoon";
10
- font-size: 13px;
11
- font-weight: 200;
12
-
13
- position: absolute;
14
- right: 20px;
60
+ padding: 20px;
15
61
 
16
- width: 180px;
17
- padding: 12px 0;
62
+ .phrasing-image-file-input {
63
+ display: none;
64
+ }
18
65
 
19
- text-align: center;
66
+ .phrasing-image-edit-label {
67
+ @extend %phrasing-image-button-style;
20
68
 
21
- color: white;
22
- border: 2px solid white;
23
- -webkit-border-radius: 35px;
24
- -moz-border-radius: 35px;
25
- border-radius: 35px;
69
+ background-color: $phrasing-image-btn-edit-background;
26
70
  }
27
71
 
28
- label.phrasing-image-edit-label {
29
- top: 20px;
30
- background: #898989;
31
- }
72
+ .phrasing-image-discard-change-label{
73
+ @extend %phrasing-image-button-style;
32
74
 
33
- label.phrasing-image-discard-change-label{
34
- top: 65px;
35
- background: #F1A515;
36
75
  display: none;
37
- }
38
76
 
39
- .phrasing-image-file-input {
40
- display: none;
77
+ background-color: $phrasing-image-btn-discard-chage-background;
41
78
  }
42
79
 
43
80
  .phrasing-image-submit-button {
44
- font-family: "icomoon";
45
- font-size: 13px;
46
- font-weight: 200;
47
-
48
- position: absolute;
49
- top: 20px;
50
- right: 20px;
81
+ @extend %phrasing-image-button-style;
51
82
 
52
83
  display: none;
53
84
 
54
- width: 181px;
55
- height: 42px;
56
-
57
- color: white;
58
- border: 2px solid white;
59
- -webkit-border-radius: 35px;
60
- -moz-border-radius: 35px;
61
- border-radius: 35px;
62
- background: #56AE45;
63
- }
64
- }
65
-
66
- &.phrasable-on{
67
- .phrasing-image-edit-form{
68
- display: block;
85
+ background-color: $phrasing-image-btn-submit-background;
69
86
  }
70
87
  }
71
88
  }
72
89
 
73
- span.phrasable-image-wrapper{
74
- @extend .phrasing-image-holder;
75
- position: relative;
90
+ .phrasable-image-wrapper{
91
+ @extend %phrasing-image-holder;
76
92
  display: inline-block;
77
93
 
78
94
  .phrasable-image {
79
95
  position: relative;
80
96
  }
81
-
82
- &.phrasable-on {
83
- .phrasable-image {
84
- opacity: .8;
85
- }
86
- }
87
97
  }
88
98
 
89
99
  .phrasable-background-image{
90
- @extend .phrasing-image-holder;
100
+ @extend %phrasing-image-holder;
101
+ }
102
+
103
+ .phrasing-image-form-container {
91
104
  position: relative;
105
+ z-index: 255;
92
106
  }
@@ -1,4 +1,4 @@
1
1
  %span{ widget.wrapper_options }
2
- = image_tag(widget.image_url, widget.options)
3
2
  - if can_edit_phrases?
4
3
  = render 'phrasing_plus/form', widget: widget
4
+ = image_tag(widget.image_url, widget.options)
@@ -1,5 +1,6 @@
1
- = form_for(widget, html: { class: 'phrasing-image-edit-form'}) do |f|
2
- = f.label(:image, 'Click to edit image', class: 'phrasing-image-edit-label', for: "phrasing_image_image_#{widget.id}")
3
- = f.file_field(:image, class: 'phrasing-image-file-input', id: "phrasing_image_image_#{widget.id}")
4
- = f.label(:discard_change, class: 'phrasing-image-discard-change-label')
5
- = f.button('Save image', class: 'phrasing-image-submit-button')
1
+ .phrasing-image-form-container
2
+ = form_for(widget, html: { class: 'phrasing-image-edit-form'}) do |f|
3
+ = f.label(:image, 'Click to edit image', class: 'phrasing-image-edit-label', for: "phrasing_image_image_#{widget.id}")
4
+ = f.file_field(:image, class: 'phrasing-image-file-input', id: "phrasing_image_image_#{widget.id}")
5
+ = f.button('Save image', class: 'phrasing-image-submit-button')
6
+ = f.label(:discard_change, class: 'phrasing-image-discard-change-label')
@@ -1,3 +1,3 @@
1
1
  module PhrasingPlus
2
- VERSION = "0.0.4"
2
+ VERSION = "0.0.5"
3
3
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: phrasing_plus
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.4
4
+ version: 0.0.5
5
5
  platform: ruby
6
6
  authors:
7
7
  - Damir Svrtan