rails_medium_editor_insert_plugin 0.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (32) hide show
  1. checksums.yaml +7 -0
  2. data/.gitignore +11 -0
  3. data/.rspec +3 -0
  4. data/.travis.yml +5 -0
  5. data/CODE_OF_CONDUCT.md +74 -0
  6. data/Gemfile +6 -0
  7. data/Gemfile.lock +86 -0
  8. data/LICENSE.txt +21 -0
  9. data/README.md +139 -0
  10. data/Rakefile +6 -0
  11. data/app/assets/javascripts/medium-editor-js.js +1 -0
  12. data/app/assets/stylesheets/medium-editor-style.scss +3 -0
  13. data/bin/console +14 -0
  14. data/bin/setup +8 -0
  15. data/lib/rails_medium_editor_insert_plugin.rb +7 -0
  16. data/lib/rails_medium_editor_insert_plugin/version.rb +3 -0
  17. data/rails_medium_editor_insert_plugin.gemspec +31 -0
  18. data/vendor/assets/javascripts/medium_editor_js/handlebars.js +29 -0
  19. data/vendor/assets/javascripts/medium_editor_js/jquery-fileupload.js +1477 -0
  20. data/vendor/assets/javascripts/medium_editor_js/jquery-iframe-transport.js +217 -0
  21. data/vendor/assets/javascripts/medium_editor_js/jquery-sortable.js +693 -0
  22. data/vendor/assets/javascripts/medium_editor_js/jquery-ui-widget.js +572 -0
  23. data/vendor/assets/javascripts/medium_editor_js/medium-editor-insert-plugin.js +2091 -0
  24. data/vendor/assets/javascripts/medium_editor_js/medium-editor.js +7054 -0
  25. data/vendor/assets/javascripts/rails-medium-editor-insert-plugin.js +7 -0
  26. data/vendor/assets/stylesheets/medium-editor.scss +3 -0
  27. data/vendor/assets/stylesheets/medium_editor_style/_flat.scss +62 -0
  28. data/vendor/assets/stylesheets/medium_editor_style/_medium-editor.scss +182 -0
  29. data/vendor/assets/stylesheets/medium_editor_style/medium-editor-insert-plugin-frontend.scss +72 -0
  30. data/vendor/assets/stylesheets/medium_editor_style/medium-editor-insert-plugin.scss +209 -0
  31. data/vendor/assets/stylesheets/medium_editor_style/medium-editor-style.scss +4 -0
  32. metadata +130 -0
@@ -0,0 +1,7 @@
1
+ //= require medium_editor_js/handlebars
2
+ //= require medium_editor_js/medium-editor
3
+ //= require medium_editor_js/medium-editor-insert-plugin
4
+ //= require medium_editor_js/jquery-ui-widget
5
+ //= require medium_editor_js/jquery-sortable
6
+ //= require medium_editor_js/jquery-fileupload
7
+ //= require medium_editor_js/jquery-iframe-transport
@@ -0,0 +1,3 @@
1
+ /*
2
+ *= require medium_editor_style/medium-editor-style
3
+ */
@@ -0,0 +1,62 @@
1
+ .medium-toolbar-arrow-under:after {
2
+ top: 40px;
3
+ border-color: #dbdbdb transparent transparent transparent; }
4
+
5
+ .medium-toolbar-arrow-over:before {
6
+ top: -8px;
7
+ border-color: transparent transparent #118fe4 transparent; }
8
+
9
+ .medium-editor-toolbar {
10
+ background-color: #dbdbdb; }
11
+ .medium-editor-toolbar li {
12
+ padding: 0; }
13
+ .medium-editor-toolbar li button {
14
+ min-width: 40px;
15
+ height: 40px;
16
+ border: none;
17
+ border-right: 1px solid #e0e0e0;
18
+ background-color: transparent;
19
+ color: #888484;
20
+ transition: background-color .2s ease-in, color .2s ease-in; }
21
+ .medium-editor-toolbar li button:hover {
22
+ background-color: #959595;
23
+ color: #fff; }
24
+ .medium-editor-toolbar li .medium-editor-button-active {
25
+ background-color: #959595;
26
+ color: #fff; }
27
+ .medium-editor-toolbar li .medium-editor-button-last {
28
+ border-right: none; }
29
+
30
+ .medium-editor-toolbar-form .medium-editor-toolbar-input {
31
+ height: 40px;
32
+ background: #dbdbdb;
33
+ color: #000; }
34
+
35
+ .medium-editor-toolbar-form .medium-editor-toolbar-input::placeholder {
36
+ color: #fff;
37
+ color: rgba(255, 255, 255, 0.8); }
38
+
39
+
40
+ .medium-editor-toolbar-form a {
41
+ color: #fff; }
42
+
43
+ .medium-editor-toolbar-anchor-preview {
44
+ background: #118fe4;
45
+ color: #fff; }
46
+
47
+ .medium-editor-placeholder:after {
48
+ color: #ddd; }
49
+
50
+ blockquote {
51
+ background-color: #f5f5f5;
52
+ border-left: 5px solid #dbdbdb;
53
+ padding: 1.25em 1.5em;
54
+ }
55
+
56
+ .medium-editor-insert-plugin h2 {
57
+ font-size: 2.5rem;
58
+ }
59
+
60
+ .medium-editor-insert-plugin h3 {
61
+ font-size: 2rem;
62
+ }
@@ -0,0 +1,182 @@
1
+
2
+ @keyframes medium-editor-image-loading {
3
+ 0% { transform: scale(0); }
4
+ 100% { transform: scale(1); }
5
+ }
6
+
7
+ @keyframes medium-editor-pop-upwards {
8
+ 0% {
9
+ opacity: 0;
10
+ transform: matrix(0.97, 0, 0, 1, 0, 12); }
11
+ 20% {
12
+ opacity: .7;
13
+ transform: matrix(0.99, 0, 0, 1, 0, 2); }
14
+ 40% {
15
+ opacity: 1;
16
+ transform: matrix(1, 0, 0, 1, 0, -1); }
17
+ 100% {
18
+ transform: matrix(1, 0, 0, 1, 0, 0); }
19
+ }
20
+
21
+ .medium-editor-anchor-preview {
22
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
23
+ font-size: 16px;
24
+ left: 0;
25
+ line-height: 1.4;
26
+ max-width: 280px;
27
+ position: absolute;
28
+ text-align: center;
29
+ top: 0;
30
+ word-break: break-all;
31
+ word-wrap: break-word;
32
+ visibility: hidden;
33
+ z-index: 2000; }
34
+ .medium-editor-anchor-preview a {
35
+ color: #fff;
36
+ display: inline-block;
37
+ margin: 5px 5px 10px; }
38
+
39
+ .medium-editor-anchor-preview-active {
40
+ visibility: visible; }
41
+
42
+ .medium-editor-dragover {
43
+ background: #ddd; }
44
+
45
+ .medium-editor-image-loading {
46
+ animation: medium-editor-image-loading 1s infinite ease-in-out;
47
+ background-color: #333;
48
+ // @include border-radius(100%);
49
+ display: inline-block;
50
+ height: 40px;
51
+ width: 40px; }
52
+
53
+ .medium-editor-placeholder {
54
+ position: relative; }
55
+ .medium-editor-placeholder:after {
56
+ content: attr(data-placeholder) !important;
57
+ font-style: italic;
58
+ left: 0;
59
+ position: absolute;
60
+ top: 0;
61
+ white-space: pre;
62
+ padding: inherit;
63
+ margin: inherit; }
64
+
65
+ .medium-toolbar-arrow-under:after, .medium-toolbar-arrow-over:before {
66
+ border-style: solid;
67
+ content: '';
68
+ display: block;
69
+ height: 0;
70
+ left: 50%;
71
+ margin-left: -8px;
72
+ position: absolute;
73
+ width: 0; }
74
+
75
+ .medium-toolbar-arrow-under:after {
76
+ border-width: 8px 8px 0 8px; }
77
+
78
+ .medium-toolbar-arrow-over:before {
79
+ border-width: 0 8px 8px 8px;
80
+ top: -8px; }
81
+
82
+ .medium-editor-toolbar {
83
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
84
+ font-size: 16px;
85
+ left: 0;
86
+ position: absolute;
87
+ top: 0;
88
+ visibility: hidden;
89
+ z-index: 2000; }
90
+ .medium-editor-toolbar ul {
91
+ margin: 0;
92
+ padding: 0; }
93
+ .medium-editor-toolbar li {
94
+ float: left;
95
+ list-style: none;
96
+ margin: 0;
97
+ padding: 0; }
98
+ .medium-editor-toolbar li button {
99
+ box-sizing: border-box;
100
+ cursor: pointer;
101
+ display: block;
102
+ font-size: 14px;
103
+ line-height: 1.33;
104
+ margin: 0;
105
+ padding: 15px;
106
+ text-decoration: none; }
107
+ .medium-editor-toolbar li button:focus {
108
+ outline: none; }
109
+ .medium-editor-toolbar li .medium-editor-action-underline {
110
+ text-decoration: underline; }
111
+ .medium-editor-toolbar li .medium-editor-action-pre {
112
+ font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
113
+ font-size: 12px;
114
+ font-weight: 100;
115
+ padding: 15px 0; }
116
+
117
+ .medium-editor-toolbar-active {
118
+ visibility: visible; }
119
+
120
+ .medium-editor-sticky-toolbar {
121
+ position: fixed;
122
+ top: 1px; }
123
+
124
+ .medium-editor-relative-toolbar {
125
+ position: relative; }
126
+
127
+ .medium-editor-toolbar-active.medium-editor-stalker-toolbar {
128
+ animation: medium-editor-pop-upwards 160ms forwards linear; }
129
+
130
+ .medium-editor-action-bold {
131
+ font-weight: bolder; }
132
+
133
+ .medium-editor-action-italic {
134
+ font-style: italic; }
135
+
136
+ .medium-editor-toolbar-form {
137
+ display: none; }
138
+ .medium-editor-toolbar-form input,
139
+ .medium-editor-toolbar-form a {
140
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
141
+ .medium-editor-toolbar-form .medium-editor-toolbar-form-row {
142
+ line-height: 14px;
143
+ margin-left: 5px;
144
+ padding-bottom: 5px; }
145
+ .medium-editor-toolbar-form .medium-editor-toolbar-input,
146
+ .medium-editor-toolbar-form label {
147
+ border: none;
148
+ box-sizing: border-box;
149
+ font-size: 14px;
150
+ margin: 0;
151
+ padding: 6px;
152
+ width: 316px;
153
+ display: inline-block; }
154
+ .medium-editor-toolbar-form .medium-editor-toolbar-input:focus,
155
+ .medium-editor-toolbar-form label:focus {
156
+ appearance: none;
157
+ border: none;
158
+ box-shadow: none;
159
+ outline: 0; }
160
+ .medium-editor-toolbar-form a {
161
+ display: inline-block;
162
+ font-size: 24px;
163
+ font-weight: bolder;
164
+ margin: 0 10px;
165
+ text-decoration: none; }
166
+
167
+ .medium-editor-toolbar-actions:after {
168
+ clear: both;
169
+ content: "";
170
+ display: table; }
171
+
172
+ [data-medium-editor-element] img {
173
+ max-width: 100%; }
174
+
175
+ [data-medium-editor-element] sub {
176
+ vertical-align: sub; }
177
+
178
+ [data-medium-editor-element] sup {
179
+ vertical-align: super; }
180
+
181
+ .medium-editor-hidden {
182
+ display: none; }
@@ -0,0 +1,72 @@
1
+ /*!
2
+ * medium-editor-insert-plugin v2.2.2 - jQuery insert plugin for MediumEditor
3
+ *
4
+ * https://github.com/orthes/medium-editor-insert-plugin
5
+ *
6
+ * Copyright (c) 2014 Pavel Linkesch (http://linkesch.sk)
7
+ * Released under the MIT license
8
+ */
9
+
10
+ .medium-insert-images, .mediumInsert {
11
+ text-align: center; }
12
+ .medium-insert-images figure, .mediumInsert figure {
13
+ margin: 0;
14
+ display: block; }
15
+ .medium-insert-images figure img, .mediumInsert figure img {
16
+ max-width: 100%;
17
+ margin-top: 1em;
18
+ vertical-align: top; }
19
+ .medium-insert-images figure:first-child img, .mediumInsert figure:first-child img {
20
+ margin-top: 0; }
21
+ .medium-insert-images.medium-insert-images-left, .medium-insert-images-left.mediumInsert, .mediumInsert.small {
22
+ max-width: 33.33%;
23
+ float: left;
24
+ margin: 0 30px 20px 0; }
25
+ .medium-insert-images.medium-insert-images-right, .medium-insert-images-right.mediumInsert {
26
+ max-width: 33.33%;
27
+ float: right;
28
+ margin: 0 0 20px 30px; }
29
+ .medium-insert-images.medium-insert-images-grid, .medium-insert-images-grid.mediumInsert {
30
+ display: flex;
31
+ flex-wrap: wrap;
32
+ align-items: flex-start;
33
+ justify-content: center;
34
+ margin: 0.5em -0.5em; }
35
+ .medium-insert-images.medium-insert-images-grid figure, .medium-insert-images-grid.mediumInsert figure {
36
+ width: 33.33%;
37
+ display: inline-block; }
38
+ .medium-insert-images.medium-insert-images-grid figure img, .medium-insert-images-grid.mediumInsert figure img {
39
+ max-width: calc(100% - 1em);
40
+ margin: 0.5em; }
41
+
42
+ .medium-insert-embeds, .mediumInsert-embeds {
43
+ text-align: center;
44
+ margin: 1em 0;
45
+ position: relative; }
46
+ .medium-insert-embeds iframe, .mediumInsert-embeds iframe {
47
+ margin: 0 auto !important; }
48
+ .medium-insert-embeds div, .mediumInsert-embeds div {
49
+ margin: 0 auto !important; }
50
+ .medium-insert-embeds.medium-insert-embeds-left, .medium-insert-embeds-left.mediumInsert-embeds {
51
+ width: 33.33%;
52
+ float: left;
53
+ margin: 0 30px 20px 0; }
54
+ .medium-insert-embeds.medium-insert-embeds-right, .medium-insert-embeds-right.mediumInsert-embeds {
55
+ width: 33.33%;
56
+ float: right;
57
+ margin: 0 0 20px 30px; }
58
+
59
+ .medium-insert-images figure, .mediumInsert figure, .medium-insert-embeds figure, .mediumInsert-embeds figure {
60
+ position: relative; }
61
+ .medium-insert-images figure figcaption, .mediumInsert figure figcaption, .medium-insert-embeds figure figcaption, .mediumInsert-embeds figure figcaption {
62
+ position: relative;
63
+ z-index: 1;
64
+ display: block;
65
+ text-align: center;
66
+ margin: 10px 0;
67
+ color: #ccc;
68
+ font-size: 0.8em;
69
+ font-style: italic;
70
+ outline: 0 solid transparent; }
71
+ .medium-insert-images figure figcaption:focus, .mediumInsert figure figcaption:focus, .medium-insert-embeds figure figcaption:focus, .mediumInsert-embeds figure figcaption:focus {
72
+ outline: 0 solid transparent; }
@@ -0,0 +1,209 @@
1
+ /*!
2
+ * medium-editor-insert-plugin v2.2.2 - jQuery insert plugin for MediumEditor
3
+ *
4
+ * https://github.com/orthes/medium-editor-insert-plugin
5
+ *
6
+ * Copyright (c) 2014 Pavel Linkesch (http://linkesch.sk)
7
+ * Released under the MIT license
8
+ */
9
+
10
+ .medium-insert-images, .mediumInsert {
11
+ text-align: center; }
12
+ .medium-insert-images figure, .mediumInsert figure {
13
+ margin: 0;
14
+ display: block; }
15
+ .medium-insert-images figure img, .mediumInsert figure img {
16
+ max-width: 100%;
17
+ margin-top: 1em;
18
+ vertical-align: top; }
19
+ .medium-insert-images figure:first-child img, .mediumInsert figure:first-child img {
20
+ margin-top: 0; }
21
+ .medium-insert-images.medium-insert-images-left, .medium-insert-images-left.mediumInsert, .mediumInsert.small {
22
+ max-width: 33.33%;
23
+ float: left;
24
+ margin: 0 30px 20px 0; }
25
+ .medium-insert-images.medium-insert-images-right, .medium-insert-images-right.mediumInsert {
26
+ max-width: 33.33%;
27
+ float: right;
28
+ margin: 0 0 20px 30px; }
29
+ .medium-insert-images.medium-insert-images-grid, .medium-insert-images-grid.mediumInsert {
30
+ display: flex;
31
+ flex-wrap: wrap;
32
+ align-items: flex-start;
33
+ justify-content: center;
34
+ margin: 0.5em -0.5em; }
35
+ .medium-insert-images.medium-insert-images-grid figure, .medium-insert-images-grid.mediumInsert figure {
36
+ width: 33.33%;
37
+ display: inline-block; }
38
+ .medium-insert-images.medium-insert-images-grid figure img, .medium-insert-images-grid.mediumInsert figure img {
39
+ max-width: calc(100% - 1em);
40
+ margin: 0.5em; }
41
+
42
+ .medium-insert-embeds, .mediumInsert-embeds {
43
+ text-align: center;
44
+ margin: 1em 0;
45
+ position: relative; }
46
+ .medium-insert-embeds iframe, .mediumInsert-embeds iframe {
47
+ margin: 0 auto !important; }
48
+ .medium-insert-embeds div, .mediumInsert-embeds div {
49
+ margin: 0 auto !important; }
50
+ .medium-insert-embeds.medium-insert-embeds-left, .medium-insert-embeds-left.mediumInsert-embeds {
51
+ width: 33.33%;
52
+ float: left;
53
+ margin: 0 30px 20px 0; }
54
+ .medium-insert-embeds.medium-insert-embeds-right, .medium-insert-embeds-right.mediumInsert-embeds {
55
+ width: 33.33%;
56
+ float: right;
57
+ margin: 0 0 20px 30px; }
58
+
59
+ .medium-insert-images figure, .mediumInsert figure, .medium-insert-embeds figure, .mediumInsert-embeds figure {
60
+ position: relative; }
61
+ .medium-insert-images figure figcaption, .mediumInsert figure figcaption, .medium-insert-embeds figure figcaption, .mediumInsert-embeds figure figcaption {
62
+ position: relative;
63
+ z-index: 1;
64
+ display: block;
65
+ text-align: center;
66
+ margin: 10px 0;
67
+ color: #ccc;
68
+ font-size: 0.8em;
69
+ font-style: italic;
70
+ outline: 0 solid transparent; }
71
+ .medium-insert-images figure figcaption:focus, .mediumInsert figure figcaption:focus, .medium-insert-embeds figure figcaption:focus, .mediumInsert-embeds figure figcaption:focus {
72
+ outline: 0 solid transparent; }
73
+
74
+ .medium-editor-insert-plugin {
75
+ outline: 0 solid transparent; }
76
+ .medium-editor-insert-plugin:focus {
77
+ outline: 0 solid transparent; }
78
+ .medium-editor-insert-plugin .clearfix:before, .medium-editor-insert-plugin:before, .medium-editor-insert-plugin .clearfix:after, .medium-editor-insert-plugin:after {
79
+ content: " ";
80
+ display: table;
81
+ clear: both; }
82
+ .medium-editor-insert-plugin p {
83
+ margin: 1em 0; }
84
+ .medium-editor-insert-plugin progress {
85
+ display: block;
86
+ margin: 1em auto; }
87
+ .medium-editor-insert-plugin .hide {
88
+ display: none; }
89
+ .medium-editor-insert-plugin.medium-editor-placeholder:after {
90
+ padding: 1em 0; }
91
+ .medium-editor-insert-plugin .medium-insert-buttons {
92
+ position: absolute;
93
+ color: #ddd;
94
+ font-size: 0.9em; }
95
+ .medium-editor-insert-plugin .medium-insert-buttons a {
96
+ text-decoration: underline;
97
+ cursor: pointer; }
98
+ .medium-editor-insert-plugin .medium-insert-buttons .medium-insert-buttons-show {
99
+ box-sizing: border-box;
100
+ display: block;
101
+ width: 32px;
102
+ height: 32px;
103
+ margin-top: -5px;
104
+ border-radius: 20px;
105
+ border: 1px solid;
106
+ font-size: 25px;
107
+ line-height: 28px;
108
+ text-align: center;
109
+ text-decoration: none;
110
+ background: #fff;
111
+ transform: rotate(0);
112
+ transition: transform 100ms;
113
+ }
114
+ .medium-editor-insert-plugin .medium-insert-buttons .medium-insert-buttons-show.medium-insert-buttons-rotate {
115
+ transition: transform 250ms;
116
+ transform: rotate(45deg);
117
+ }
118
+ .medium-editor-insert-plugin .medium-insert-buttons .medium-insert-buttons-addons {
119
+ margin: 0;
120
+ padding: 0;
121
+ list-style: none;
122
+ display: none;
123
+ position: relative;
124
+ z-index: 2;
125
+ left: 55px;
126
+ top: -32px; }
127
+ .medium-editor-insert-plugin .medium-insert-buttons .medium-insert-buttons-addons li {
128
+ display: inline-block;
129
+ background-color: #fff; }
130
+ .medium-editor-insert-plugin .medium-insert-buttons .medium-insert-buttons-addons li a {
131
+ box-sizing: border-box;
132
+ display: inline-block;
133
+ margin: 0 5px;
134
+ width: 32px;
135
+ height: 32px;
136
+ border-radius: 20px;
137
+ border: 1px solid;
138
+ font-size: 20px;
139
+ line-height: 28px;
140
+ text-align: center; }
141
+ .medium-editor-insert-plugin .medium-insert-buttons .medium-insert-buttons-addons li a .fa {
142
+ font-size: 15px; }
143
+
144
+ .medium-insert-caption-placeholder {
145
+ position: relative; }
146
+ .medium-insert-caption-placeholder:after {
147
+ position: absolute;
148
+ top: 0;
149
+ left: 0;
150
+ width: 100%;
151
+ text-align: center;
152
+ content: attr(data-placeholder); }
153
+
154
+ .dragging {
155
+ cursor: move; }
156
+
157
+ .medium-insert-image-active {
158
+ outline: 2px solid #000; }
159
+
160
+ .medium-insert-images-toolbar {
161
+ display: none; }
162
+
163
+ .medium-insert-images, .mediumInsert {
164
+ margin: 1em 0; }
165
+ .medium-insert-images .dragged, .mediumInsert .dragged {
166
+ position: absolute;
167
+ top: 0;
168
+ opacity: .5;
169
+ z-index: 2000; }
170
+ .medium-insert-images .placeholder, .mediumInsert .placeholder {
171
+ position: relative;
172
+ margin: 0;
173
+ padding: 0;
174
+ border: none; }
175
+ .medium-insert-images .medium-insert-images-progress, .mediumInsert .medium-insert-images-progress {
176
+ position: absolute;
177
+ width: 100%;
178
+ height: 100%;
179
+ top: 0;
180
+ right: 0;
181
+ background: rgba(255, 255, 255, 0.4); }
182
+
183
+ .medium-insert-embeds-input {
184
+ position: relative;
185
+ color: #ccc;
186
+ z-index: 1;
187
+ text-align: left; }
188
+
189
+ .medium-insert-embeds-placeholder {
190
+ position: relative; }
191
+ .medium-insert-embeds-placeholder:after {
192
+ position: absolute;
193
+ top: 0;
194
+ left: 0;
195
+ content: attr(data-placeholder);
196
+ color: #ccc; }
197
+
198
+ .medium-insert-embeds-selected .medium-insert-embed {
199
+ outline: 2px solid #000; }
200
+
201
+ .medium-insert-embeds-toolbar {
202
+ display: none; }
203
+
204
+ .medium-insert-embeds .medium-insert-embeds-overlay, .mediumInsert-embeds .medium-insert-embeds-overlay {
205
+ position: absolute;
206
+ width: 100%;
207
+ height: 100%;
208
+ top: 0;
209
+ left: 0; }