Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#73 2020-05-13 11:35:07

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,448
Website GitHub

Re: [feedback] Image upload directly in the write tab

On the heels of the add button state remembering commit there’s a subtle issue with the arrow alongside the link.

If the state is closed when the page loads, all’s well. It toggles fine.

If the state is open, however, the plugin markup adds the down arrow, then JavaScript takes over and adds the ‘expanded’ class and opens up the sub-pane. But the arrow doesn’t alter and remains in the ‘down’ position. This means each time you toggle, the arrow is pointing the opposite direction to the one it should.

Since I’m hijacking the core method to handle the toggle state, I don’t have the luxury of intercepting it so I can add the correct state via JS in the plugin. Or, at least, if I can do that, the route is not clear to me (anyone know if I can?)

As an alternative, I wonder if I can use our available icons inside some CSS content rule instead. Hive seems to do this:

.txp-summary a:after {
    content:"↓";
}
.txp-summary.expanded a:after {
    content:"↑"
}

But how do I translate that to use the thickstop-s and thickstop-n icons? I don’t appear to be able to copy n paste the icons from the design-patterns page as they’re SVG data elements (I think). Is there an equivalent unicode character in a font, like fontawesome offers? Or some way to get hold of a representation of the icon and use it in CSS?

Bit baffled how I get those symbols into the plugin’s CSS block so I can toggle the arrow state based on the existence (or not) of the .expanded class.

Or is there another way to approach this?


The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#74 2020-05-13 12:10:02

phiw13
Plugin Author
From: Japan
Registered: 2004-02-27
Posts: 3,194
Website

Re: [feedback] Image upload directly in the write tab

@ Bloke

this pattern should work, I think

::after {
   content: url("data:image/svg+xml, ");
   display: inline-block;
   width:…
   height: …
}

alternative:

::after {
    content: '';
    display: inline-block;
    background: url("data:image/svg+xml, ") no-repeat;
    background-size: cover;
    width: …
}

Last edited by phiw13 (2020-05-13 12:15:28)


Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern

Offline

#75 2020-05-13 12:31:37

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,448
Website GitHub

Re: [feedback] Image upload directly in the write tab

phiw13 wrote #322969:

this pattern should work, I think

Genius. Thank you.


The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#76 2020-05-13 13:41:47

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,448
Website GitHub

Re: [feedback] Image upload directly in the write tab

@Pat64

I like the cursor pointer and the padding/margin fixes. I’ll do that thank you.

But the other stuff was there for a reason: the z-index and opacity is a trick to allow clicking the dropzone to trigger browsing your computer, so hiding it with z=index: -1 prevents this feature from working.

EDIT: Ah, I see you removed your post :)

Last edited by Bloke (2020-05-13 13:42:20)


The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#77 2020-05-13 14:13:33

Pat64
Plugin Author
From: France
Registered: 2005-12-12
Posts: 1,634
GitHub Twitter

Re: [feedback] Image upload directly in the write tab

😋

I was looking for an other solution, sorry.

<div class="txp-form-field-value">
	<button id="article-file-reset" class="destroy">
		<span class="ui-icon ui-icon-close">Supprimer</span>
	</button>
	<label for="article-file-input" class="drop">Click or drop files on this zone
		<input id="article-file-input" type="file" name="article_file[]" multiple="multiple" accept="image/*" onchange="comArticleImagePreview(this);">
	</label>
</div>

And here is the corresponding style changes:

#article-file-input {
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%
}

label.drop{
	display: block;
	width: 100%;
	text-align: center;
	line-height: 4em;
	cursor: pointer
}

Patrick.

Github | CodePen | Codier | Simplr theme | Wait Me: a maintenance theme | [\a mi.ni.ma]: a “Low Tech” simple Blog theme.

Offline

#78 2020-05-14 12:07:42

Pat64
Plugin Author
From: France
Registered: 2005-12-12
Posts: 1,634
GitHub Twitter

Re: [feedback] Image upload directly in the write tab

Stef.
Could you try this version where a <label> is used instead of the <span> to display the string:

# Name: com_article_image v0.1.0 (compressed)
# Type: Admin/AJAX plugin
# Article image helper on the Textpattern Write panel
# Author: Textpattern Community
# URL: https://github.com/textpattern
# Recommended load order: 5

# .....................................................................
# This is a plugin for Textpattern CMS - http://textpattern.com/
# To install: textpattern > admin > plugins
# Paste the following text into the 'Install plugin' box:
# .....................................................................

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
AAA=

One more little thing: if you inject the SVG icon into the markup, you coul take advantage of the “Dark Mode” by heritance (fill="currentColor") of the link color:

<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 16 16"><path fill="currentColor" d="M4 12h8v2H4zm4-1l5-5h-3V2H6v4H3z"></path></svg>


Patrick.

Github | CodePen | Codier | Simplr theme | Wait Me: a maintenance theme | [\a mi.ni.ma]: a “Low Tech” simple Blog theme.

Offline

#79 2020-05-14 13:32:09

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,448
Website GitHub

Re: [feedback] Image upload directly in the write tab

Sorry, Patrick. I can’t get the dropzone to work if I use your changes. In FF (Mac) I can click to browse, but dropping a file on the zone just loads the entire image in the tab. Am I missing something obvious?


The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#80 2020-05-15 01:24:32

phiw13
Plugin Author
From: Japan
Registered: 2004-02-27
Posts: 3,194
Website

Re: [feedback] Image upload directly in the write tab

Bloke wrote #322979:

Sorry, Patrick. I can’t get the dropzone to work if I use your changes.

I tried Patricks version as well – in Safari and Firefox – with the same results. clicking works, drag and drop does not. I could not see a quick fix, might be somewhere deep in the JS though.

Hmm, further checking, on macOS, dragging a file on a default upload widget (input[type=file]) works as expected since macOS 10.2 or so, but doing the same on the <label /> for that widget does not, it displays the file (e.g image) or the thing/file just bounces back. That is actually the behaviour we are seeing here.

(That is a bit sad – conceptually, semantically and accessibility-wise that construction is actually nice)

BTW#article-file-drop p specifies cursor: pointer. This does absolutely nothing, nada! You see a pointer cursor (pointy finger) in Hive because that theme specifies it on the input[type=file]… No such luck with Sandspace theme (I am consider adding a fix for this particular situation in the theme).

The file input widget actually covers the #article-file-drop p, which is as it should be else the system would not work.


Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern

Offline

#81 2020-05-15 02:35:39

Pat64
Plugin Author
From: France
Registered: 2005-12-12
Posts: 1,634
GitHub Twitter

Re: [feedback] Image upload directly in the write tab

Yep. You’re right: I tried only the plugin “click” feature for upload….


Patrick.

Github | CodePen | Codier | Simplr theme | Wait Me: a maintenance theme | [\a mi.ni.ma]: a “Low Tech” simple Blog theme.

Offline

#82 2020-05-20 06:08:03

phiw13
Plugin Author
From: Japan
Registered: 2004-02-27
Posts: 3,194
Website

Re: [feedback] Image upload directly in the write tab

Is this: #main_content {position:sticky;top:0} really needed?

The article editing experience (working in the body textarea) is less than stellar (ahem…) with Sandspace and with Hive –without the textarea auto-expand script. It gives, accidentally, some semi OK experience on small screens when smd_textile_bar is installed though.


Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern

Offline

#83 2020-05-20 08:03:17

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,448
Website GitHub

Re: [feedback] Image upload directly in the write tab

phiw13 wrote #323048:

Is this: #main_content {position:sticky;top:0} really needed?

Oleg assured me it was when I wondered why the page was doing some odd pausing/scrolling thing. He gave a compelling argument, but I’ve not tried it without.

If you find any better way to make it work, then by all means make suggestions.


The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#84 2020-05-20 08:24:59

phiw13
Plugin Author
From: Japan
Registered: 2004-02-27
Posts: 3,194
Website

Re: [feedback] Image upload directly in the write tab

Bloke wrote #323049:

Oleg assured me it was when I wondered why the page was doing some odd pausing/scrolling thing. He gave a compelling argument, but I’ve not tried it without.

If you find any better way to make it work, then by all means make suggestions.

which argument is that ? If I understand what the problem you are trying to solve with it, I might have an idea; right now it is not clear at all.


Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern

Offline

Board footer

Powered by FluxBB