dante-editor 0.1.0 → 0.1.1
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 +4 -4
- data/Gemfile.lock +1 -1
- data/app/assets/javascripts/dante/behaviors/image.js.coffee +2 -2
- data/app/assets/javascripts/dante/popover.js.coffee +17 -9
- data/bower.json +2 -2
- data/dist/js/dante-editor.js +20 -13
- data/lib/dante-editor/version.rb +1 -1
- data/source/api/suggest.json.erb +3 -3
- data/source/index.html.erb +1 -0
- data/source/partials/_readme.markdown +2 -2
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 12b6c008cc84a81f332ce2b097e0def68fbff62f
|
4
|
+
data.tar.gz: 3153ed57f204d5830ce368f354a4bde3ebb3661b
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: f2e0d936ebb9e121109f6b2eb59fd3aa69d0a7456e6d9ace4ba7e505104454d023680a8a469da200ecc4001cd04dfebe0655cd357145e1f3dda36cd869d43cd8
|
7
|
+
data.tar.gz: d833dea6b440331f16b254e3ab7835b0460a604fd0ce11ce592033bc9c0cfff66ce090061fb3dadc8eb3a1dec271710ca81ab8d0623d337bc1aca5632e2f07ee
|
data/Gemfile.lock
CHANGED
@@ -4,7 +4,7 @@ class Dante.View.Behavior.Image extends Dante.View.Behavior
|
|
4
4
|
|
5
5
|
events:
|
6
6
|
"click .graf--figure .aspectRatioPlaceholder" : "handleGrafFigureSelectImg"
|
7
|
-
"click .graf--figure figcaption"
|
7
|
+
"click .graf--figure figcaption" : "handleGrafFigureSelectCaption"
|
8
8
|
"keyup .graf--figure figcaption" : "handleGrafCaptionTyping"
|
9
9
|
|
10
10
|
# TODO: this is from embed! move this to embed behavior
|
@@ -25,7 +25,7 @@ class Dante.View.Behavior.Image extends Dante.View.Behavior
|
|
25
25
|
|
26
26
|
showAlignPopover: (ev)->
|
27
27
|
target = $(ev.currentTarget)
|
28
|
-
@editor.pop_over_align.positionPopOver(target)
|
28
|
+
@editor.pop_over_align.positionPopOver(target)
|
29
29
|
|
30
30
|
handleGrafFigureSelectCaption: (ev)->
|
31
31
|
utils.log "FIGCAPTION"
|
@@ -339,15 +339,21 @@ class Dante.Editor.ImageTooltip extends Dante.Editor.PopOver
|
|
339
339
|
@findSelectedImage().removeClass("graf--layoutOutsetLeft")
|
340
340
|
@repositionWithActiveImage()
|
341
341
|
|
342
|
-
|
342
|
+
handleActiveClass: ->
|
343
343
|
@findElement().find(".dante-menu-button").removeClass("active")
|
344
|
-
|
344
|
+
if @findSelectedImage().hasClass("graf--layoutOutsetLeft")
|
345
|
+
@findElement().find(".icon-image-left").parent().addClass("active")
|
346
|
+
else
|
347
|
+
@findElement().find(".icon-image-center").parent().addClass("active")
|
348
|
+
|
349
|
+
activateLink: (element)->
|
345
350
|
setTimeout =>
|
346
351
|
@repositionWithActiveImage()
|
347
352
|
, 20
|
348
353
|
|
349
354
|
repositionWithActiveImage: ->
|
350
|
-
|
355
|
+
# pass the same element that is passed from click event
|
356
|
+
@positionPopOver(@findSelectedImage().find("div") )
|
351
357
|
|
352
358
|
template: ()->
|
353
359
|
"<div class='dante-popover popover--Aligntooltip popover--top'>
|
@@ -363,11 +369,12 @@ class Dante.Editor.ImageTooltip extends Dante.Editor.PopOver
|
|
363
369
|
<li class='dante-menu-button align-wide hidden'>
|
364
370
|
<span class='tooltip-icon icon-image-wide'></span>
|
365
371
|
</li>
|
372
|
+
|
366
373
|
<li class='dante-menu-button align-fill hidden'>
|
367
374
|
<span class='tooltip-icon icon-image-fill'></span>
|
368
375
|
</li>
|
369
376
|
|
370
|
-
<li class='dante-menu-button align-center
|
377
|
+
<li class='dante-menu-button align-center'>
|
371
378
|
<span class='tooltip-icon icon-image-center'></span>
|
372
379
|
</li>
|
373
380
|
|
@@ -381,15 +388,16 @@ class Dante.Editor.ImageTooltip extends Dante.Editor.PopOver
|
|
381
388
|
|
382
389
|
positionPopOver: (target)->
|
383
390
|
target_offset = target.offset()
|
391
|
+
target_position = target.parent().position()
|
384
392
|
target_width = target.outerWidth()
|
385
393
|
target_height = target.outerHeight()
|
386
394
|
popover_width = @findElement().outerWidth()
|
387
395
|
|
388
396
|
# hacky hack
|
389
|
-
pad_top = if @findSelectedImage().hasClass("graf--layoutOutsetLeft") then
|
397
|
+
pad_top = if @findSelectedImage().hasClass("graf--layoutOutsetLeft") then 52 else 54
|
390
398
|
|
391
|
-
top_value
|
392
|
-
left_value
|
399
|
+
top_value = target_position.top - pad_top # target_positions.top + target_height
|
400
|
+
left_value = target_offset.left + (target_width/2) - (popover_width/2)
|
393
401
|
|
394
402
|
@findElement()
|
395
403
|
.css("top", top_value)
|
@@ -397,7 +405,7 @@ class Dante.Editor.ImageTooltip extends Dante.Editor.PopOver
|
|
397
405
|
.show()
|
398
406
|
.addClass("is-active")
|
399
407
|
|
400
|
-
|
408
|
+
@handleActiveClass()
|
401
409
|
|
402
410
|
hide: (ev)->
|
403
411
|
@cancelHide()
|
@@ -408,7 +416,7 @@ class Dante.Editor.ImageTooltip extends Dante.Editor.PopOver
|
|
408
416
|
, @settings.timeout
|
409
417
|
|
410
418
|
findSelectedImage: ->
|
411
|
-
$(".graf--figure
|
419
|
+
$(".graf--figure.is-mediaFocused")
|
412
420
|
|
413
421
|
render: ()->
|
414
422
|
$(@template()).insertAfter(@editor.$el)
|
data/bower.json
CHANGED
@@ -2,7 +2,7 @@
|
|
2
2
|
"name" : "dante",
|
3
3
|
"description": "Just another Medium editor clone.",
|
4
4
|
"homepage": "michelson.github.io/Dante/",
|
5
|
-
"version" : "0.
|
5
|
+
"version" : "0.1.1",
|
6
6
|
"keywords": [
|
7
7
|
"css",
|
8
8
|
"sass",
|
@@ -37,7 +37,7 @@
|
|
37
37
|
"source"
|
38
38
|
],
|
39
39
|
"dependencies": {
|
40
|
-
"jquery": "
|
40
|
+
"jquery": "2.1.1",
|
41
41
|
"underscore" : "*",
|
42
42
|
"sanitize.js" : "*"
|
43
43
|
}
|
data/dist/js/dante-editor.js
CHANGED
@@ -8,7 +8,7 @@
|
|
8
8
|
defaults: {
|
9
9
|
image_placeholder: '../images/dante/media-loading-placeholder.png'
|
10
10
|
},
|
11
|
-
version: "0.1.
|
11
|
+
version: "0.1.1"
|
12
12
|
};
|
13
13
|
|
14
14
|
}).call(this);
|
@@ -1975,9 +1975,7 @@
|
|
1975
1975
|
Image.prototype.showAlignPopover = function(ev) {
|
1976
1976
|
var target;
|
1977
1977
|
target = $(ev.currentTarget);
|
1978
|
-
|
1979
|
-
return this.editor.pop_over_align.positionPopOver(target);
|
1980
|
-
}
|
1978
|
+
return this.editor.pop_over_align.positionPopOver(target);
|
1981
1979
|
};
|
1982
1980
|
|
1983
1981
|
Image.prototype.handleGrafFigureSelectCaption = function(ev) {
|
@@ -3265,9 +3263,16 @@
|
|
3265
3263
|
return this.repositionWithActiveImage();
|
3266
3264
|
};
|
3267
3265
|
|
3268
|
-
ImageTooltip.prototype.
|
3266
|
+
ImageTooltip.prototype.handleActiveClass = function() {
|
3269
3267
|
this.findElement().find(".dante-menu-button").removeClass("active");
|
3270
|
-
|
3268
|
+
if (this.findSelectedImage().hasClass("graf--layoutOutsetLeft")) {
|
3269
|
+
return this.findElement().find(".icon-image-left").parent().addClass("active");
|
3270
|
+
} else {
|
3271
|
+
return this.findElement().find(".icon-image-center").parent().addClass("active");
|
3272
|
+
}
|
3273
|
+
};
|
3274
|
+
|
3275
|
+
ImageTooltip.prototype.activateLink = function(element) {
|
3271
3276
|
return setTimeout((function(_this) {
|
3272
3277
|
return function() {
|
3273
3278
|
return _this.repositionWithActiveImage();
|
@@ -3276,23 +3281,25 @@
|
|
3276
3281
|
};
|
3277
3282
|
|
3278
3283
|
ImageTooltip.prototype.repositionWithActiveImage = function() {
|
3279
|
-
return this.positionPopOver(this.findSelectedImage());
|
3284
|
+
return this.positionPopOver(this.findSelectedImage().find("div"));
|
3280
3285
|
};
|
3281
3286
|
|
3282
3287
|
ImageTooltip.prototype.template = function() {
|
3283
|
-
return "<div class='dante-popover popover--Aligntooltip popover--top'> <div class='popover-inner'> <ul class='dante-menu-buttons'> <li class='dante-menu-button align-left'> <span class='tooltip-icon icon-image-left'></span> </li> <li class='dante-menu-button align-wide hidden'> <span class='tooltip-icon icon-image-wide'></span> </li> <li class='dante-menu-button align-fill hidden'> <span class='tooltip-icon icon-image-fill'></span> </li> <li class='dante-menu-button align-center
|
3288
|
+
return "<div class='dante-popover popover--Aligntooltip popover--top'> <div class='popover-inner'> <ul class='dante-menu-buttons'> <li class='dante-menu-button align-left'> <span class='tooltip-icon icon-image-left'></span> </li> <li class='dante-menu-button align-wide hidden'> <span class='tooltip-icon icon-image-wide'></span> </li> <li class='dante-menu-button align-fill hidden'> <span class='tooltip-icon icon-image-fill'></span> </li> <li class='dante-menu-button align-center'> <span class='tooltip-icon icon-image-center'></span> </li> </ul> </div> <div class='popover-arrow'> </div> </div>";
|
3284
3289
|
};
|
3285
3290
|
|
3286
3291
|
ImageTooltip.prototype.positionPopOver = function(target) {
|
3287
|
-
var left_value, pad_top, popover_width, target_height, target_offset, target_width, top_value;
|
3292
|
+
var left_value, pad_top, popover_width, target_height, target_offset, target_position, target_width, top_value;
|
3288
3293
|
target_offset = target.offset();
|
3294
|
+
target_position = target.parent().position();
|
3289
3295
|
target_width = target.outerWidth();
|
3290
3296
|
target_height = target.outerHeight();
|
3291
3297
|
popover_width = this.findElement().outerWidth();
|
3292
|
-
pad_top = this.findSelectedImage().hasClass("graf--layoutOutsetLeft") ?
|
3293
|
-
top_value =
|
3298
|
+
pad_top = this.findSelectedImage().hasClass("graf--layoutOutsetLeft") ? 52 : 54;
|
3299
|
+
top_value = target_position.top - pad_top;
|
3294
3300
|
left_value = target_offset.left + (target_width / 2) - (popover_width / 2);
|
3295
|
-
|
3301
|
+
this.findElement().css("top", top_value).css("left", left_value).show().addClass("is-active");
|
3302
|
+
return this.handleActiveClass();
|
3296
3303
|
};
|
3297
3304
|
|
3298
3305
|
ImageTooltip.prototype.hide = function(ev) {
|
@@ -3305,7 +3312,7 @@
|
|
3305
3312
|
};
|
3306
3313
|
|
3307
3314
|
ImageTooltip.prototype.findSelectedImage = function() {
|
3308
|
-
return $(".graf--figure
|
3315
|
+
return $(".graf--figure.is-mediaFocused");
|
3309
3316
|
};
|
3310
3317
|
|
3311
3318
|
ImageTooltip.prototype.render = function() {
|
data/lib/dante-editor/version.rb
CHANGED
data/source/api/suggest.json.erb
CHANGED
@@ -3,20 +3,20 @@
|
|
3
3
|
"type": "user",
|
4
4
|
"text": "John Lennon",
|
5
5
|
"avatar": "https://s3.amazonaws.com/uifaces/faces/twitter/zeldman/128.jpg",
|
6
|
-
"href": "
|
6
|
+
"href": "api/resource.json",
|
7
7
|
"description": "@john"
|
8
8
|
}, {
|
9
9
|
"id": "2",
|
10
10
|
"type": "user",
|
11
11
|
"text": "Ringo Star",
|
12
12
|
"avatar": "https://s3.amazonaws.com/uifaces/faces/twitter/iannnnn/128.jpg",
|
13
|
-
"href": "
|
13
|
+
"href": "api/resource.json",
|
14
14
|
"description": "@ringo"
|
15
15
|
}, {
|
16
16
|
"id": "3",
|
17
17
|
"type": "user",
|
18
18
|
"text": "Paul McCartney",
|
19
19
|
"avatar": "https://s3.amazonaws.com/uifaces/faces/twitter/adellecharles/128.jpg",
|
20
|
-
"href": "
|
20
|
+
"href": "api/resource.json",
|
21
21
|
"description": "@paul"
|
22
22
|
}]
|
data/source/index.html.erb
CHANGED
@@ -18,7 +18,7 @@ We don't have any intention to target all browsers versions, really... if you li
|
|
18
18
|
|
19
19
|
### MAINTAINERS:
|
20
20
|
|
21
|
-
+ <a href="#" data-type="user" data-href="
|
22
|
-
+ <a href="#" data-type="user" data-href="
|
21
|
+
+ <a href="#" data-type="user" data-href="api/miguel.json" data-id="1" class="markup--user markup--p-user"> Miguel Michelson </a>
|
22
|
+
+ <a href="#" data-type="user" data-href="api/cristian.json" data-id="1" class="markup--user markup--p-user"> Cristian Ferrari </a>
|
23
23
|
|
24
24
|
[Licensed under MIT.](./license.md) 2014
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: dante-editor
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.1.
|
4
|
+
version: 0.1.1
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Miguel Michelson
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2016-06-
|
12
|
+
date: 2016-06-14 00:00:00.000000000 Z
|
13
13
|
dependencies: []
|
14
14
|
description: dante-editor yet another Medium editor clone.
|
15
15
|
email:
|