Archive for August, 2022

August 27th, 2022
10:12 am
Viewing JP2 image files in Windows 11

Posted under Knowledge Base & Web & Windows & Windows 11
Tags

I had some of these image files from some legacy clip art photos from an older version of Corel Draw.

Ideally I wanted to be able to preview them in windows explorer, as happens automatically with JPG files, however this would not work. I tried IrfanView, which is a separate image viewer, but this failed to view the files, as it could not locate jpeg2000.dll. I tried to locate and install the dll online, but was unable to prevent the error, so IrfanView would not work.

I tried another package, the FastStone Image Viewer, and this worked successfully. You can select folders in the left column in an explorer like fashion, and the jp2 images are shown as large icons on the right. Whilst I still could not preview them in explorer, FastStone worked perfectly well in being able to preview these legacy images. It can also view a number of other graphics formats such as WMF which I had used previously for the company logo.

An install kit for FastStone can be downloaded here.

Comments Off on Viewing JP2 image files in Windows 11

August 27th, 2022
9:31 am
Previewing and Installing Truetype Fonts

Posted under Knowledge Base & Windows & Windows 10 & Windows 11
Tags

This is straightforward. If you have a collection of font file to preview and install manually, this can all be done from Windows Explorer.

Just view the folder and select a view of medium, large, or extra large icons, and the actual font appearance is shown in the icons. Extra large gives the clearest and largest view of the fonts. The same view choices are available when viewing control panel/fonts.

To install, just select the fonts you wish to install in explorer, and the right click context menu gives you install options – either install for current user, or install for all users (the latter is my preference).

Comments Off on Previewing and Installing Truetype Fonts

August 20th, 2022
2:04 pm
Salient Soft Letter Head/Logo and Futura Font

Posted under Knowledge Base & MS Office & Powerpoint & Windows & Windows 11
Tags ,

I had trouble opening an old presentation which used the Futura font – I wanted to reuse the theme and layout for a new presentation. The presentation opened in read only mode but refused to save or edit without removing this font which it had embedded. I mistakenly thought this font came with an older version of office, but having reinstalled an older version on an old PC and searching around I found this was not the case. I also tried Mutools to extract the fonts from an old PDF saved from the presentation, but this failed with an indirection error.

In the end I recalled that I actually installed this from Coreldraw 3, which comes with a clipart CD containing a large number of fonts and clipart pieces – the above font was one of them. I used Coreldraw to create the original Salient Soft logo, which was originally used for my previous company, Digital Agility, and then kept and reused for the new company. Sadly I was unable to locate my original CDs for Coreldraw – they would not be compatible with the latest windows, but the clipart CD would have been useful.

Fortunately, I searched around and found I had archived all the font TTF files with the letterhead/logo files in a Salient Soft forms directory. Installing them in Windows 11 was trivial – I just selected them all, right clicked, and picked install for all users. My presentation then opened, except for a second font, AmerType DB. However, I had not actually used this font, so was able to strip it out and save a new copy of the presentation which was editable, to allow getting the theme and layout.

Comments Off on Salient Soft Letter Head/Logo and Futura Font

August 18th, 2022
4:16 pm
Creating a hyperlink to a powerpoint presentation that opens and shows automatically

Posted under Knowledge Base & MS Office & Powerpoint & Web
Tags , ,

The title says it all. This really shouldn’t be hard, but I searched a number of forums full of gripes from people with no answers, and even on a microsoft forum, a microsoft reply said basically “sorry you can’t do that”. I felt this was particularly poor misinformation given that as below, I persevered with looking further and found a perfectly good solution that does it easily.

This post here was a start – you can do a “file/save as” of a a presentation, and select “powerpoint show” i.e. PPSX file (there is also a macro-enabled show file but did not need to try that). This looked promising as it did start the show when clicked on as a local file, but still did not actually start the show when shared via a hyperlink.

Later I found this post here which gave a clue to the issue and tried just adding a query string parameter “action=embedview” to the link URL. This worked perfectly in exactly the way I wanted – the show started automatically via the embedded viewer but still showed in a browser tab. If you want full screen you can use f11 as normal to toggle it in the browser. I didn’t care for having a link which directly took you into full screen powerpoint showing, as this takes control away from those who might be unaware of what is going on. There is an ‘open in new window’ icon at the bottom right, and this does open the presentation in a new tab without showing it, but this is fine, if someone wants to play with it they can. It also means they can save a copy themselves, but I was happy with this as they are viewing it all anyway, and if it was a web page they could export to PDF so not much different.

One key point on this is that it only worked when the file was hosted on my company MS onedrive share which actually had the office licence. It did not work on a Zen hosted file (it just downloaded it), and when I tried on a free MS onedrive share, it opened the presentation without running it directly, even when the above query string parameter was added. I am not sure of the reason for this, and may look into this further at some point, but it was not an issue anyway – I just needed to host the file on the correct share, and create a read only onedrive hyperlink with onedrive, and then add the query string parameter to the url, and it all worked fine.

This meant I could easily prepare simple powerpoint presentations to share for viewing, more easily than trying to put web pages together to do a similar thing – after all, the kind of presentation I wanted is exactly what powerpoint is for, and it does it easily. It was just a shame that the solution does not appear to be documented well online, but I was thankful for a good solution in the end.

Comments Off on Creating a hyperlink to a powerpoint presentation that opens and shows automatically

August 8th, 2022
3:43 pm
Batch file exits after running npm command

Posted under Knowledge Base & Windows & Windows 10 & Windows 11 & Windows 7
Tags ,

I created a simple batch file to run a number of npm build commands in succession.

However, the file exited after running the first npm command. This appears to be a side effect of the way npm runs – when you run npm, you actually end up running npm.cmd, which exits after completing. This is detailed on StackOverflow here.

A simple workaround as per the post is to prefix the npm commands with call – I did this and everything worked fine and all the builds were executed.

Comments Off on Batch file exits after running npm command

August 5th, 2022
3:36 pm
PrimeNG V13 Picklist Component does not scroll on touch device when drag drop enabled

Posted under Angular & PrimeNG & Uncategorized
Tags , ,

In V6 or PrimeNG, you could enable drag drop reordering on the picklist and still scroll on a touch device, e.g. on a mobile phone. This was handled nicely by using a click and hold to select an item for drag drop, and a swipe to do scrolling.

In V13 this is now broken – touching on an item instantly selects it for dragging, without using the previous click and hold, so that it is not possible to scroll by swiping the source or target list any more. I have confirmed that it used to work on my old V6 microapps version which used a standard PrimeNG V6.1.3 picklist, and also have checked the current PrimeNG showcase online – the current showcase is broken in exactly the same way when trying to scroll via touch on mobile. Whilst scroll bars are present on the RHS of the list, they are very small for Mobile. I did try to enlarge the scroll bars for mobile, using some webkit specific styling, but this proved problematic as it is not fully supported for Firefox – they cannot be resized on firefox. Even when I did get it working, selecting the scroll thumbtrack for mobile proved intermittent and tricky – not a nice interaction at all.

My simple workaround for this is to disabled dragdrop for the picklist for a touch device by setting dragdrop=false (i.e. dragdrop=!touchDevice). I already have a config property in the fabric to detect a touch device, and have replicated that as a global config parameter which is visible to all the microapps. The picklist can then use this. This is actually better than it sounds – whilst you cannot reorder items within a list any more, you can move between source and target using the buttons, and drag/drop is tricky on a mobile anyway as the source and target lists appear one above the other with typically only one of them visible so dragging between them is tricky as again scrolling is involved.

For reference, changing the scrollbar styling via the webkit styles is documented here and here.

Applying the webkit styles is very picky per the posts above – spacing etc. matters – there must not be a space between the element/class name and for example ::-webkit-scrollbar or it won’t work. In the end this SCSS styling worked for me, and fortunately I was able to get it working with a classname rather than just e.g. a ul element which is the one I wanted to hit:

.p-component.p-picklist {
.p-picklist-header {
background: $ss-widget-header;
color: $ss-widget-header-text;
}

.p-picklist-list {
&::-webkit-scrollbar {
width: 50px;
height: 50px;
}
&::-webkit-scrollbar-thumb {
width: 50px;
height: 50px;
background: #a8a8a8;
border-radius: 4px;
}

As above I dumped this approach anyway, as even with a very large scrollbar and thumb track, it was difficult to consistently scroll on mobile, and anyway  the source and target for drag/drop were not both in view simultaneously anyway.

 

Comments Off on PrimeNG V13 Picklist Component does not scroll on touch device when drag drop enabled

August 4th, 2022
2:38 pm
Caching of old microapp scripts breaks new version

Posted under Angular & Uncategorized & Webpack
Tags , ,

An old chestnut this – when upgrading from an old version on my hosted environment, my chrome based dev desktop worked fine, mainly due to my habit of hitting ctrl/f5 which clears the cache before loading.

However, on my android mobile, this needs an explicit cache clear before loading the page e.g. via the settings/history etc., which I was not in the habit of doing. Therefore when testing the new version on mobile, it failed. The new version was a production build which did not have source maps. The old version was a dev one with source maps. The console errors indicated an inability to find and load the source maps, which were not present in the latest prod deployment, but were still being requested by the cached scripts on the mobile. An explicit cache clear solved the problem. 

When I tried this again on the desktop without the cache clear, i.e. with a straight refresh, I was able to duplicate the error seen on the android chrome.

Note that the problem only applies to the fabric deployment as all the others have a timestamp (ts=) querystring parameter added to the scripts when loading, which prevents caching. I normally disable the output hashing on all microapps including the fabric for convenience, to avoid editing the app config to change the names of all the dynamically loaded scripts, even for a prod build.

Doing this on the Fabric is unnecessary as the scripts are not loaded dynamically by my code, so if I left the hashing on for the fabric, this would solve the problem, as the timestamp querystring would sort the issue for all the others.

Going forward, I intend to improve automation of the build process for hosted deployments by providing e.g. an NPM script to build all the microapps into a single zipped deployment which can be just uploaded and unzipped – at present I am having to do each one individually and copy up the dist directory. Whilst all this is only a POC application, I am doing it often enough to make this worthwhile so as not to waste time or make mistakes with it.

Doing this would also allow the possibility of using my own timestamps on all the filenames for every script, and dynamically modifying the config to incorporate the timestamps in the build script. This would allow caching to be left enabled for the code scripts (but not for the config), which would actually be a benefit as it would improve startup times and lessen bandwidth usage – especially relevant for mobiles. I could add a fabric config parameter to indicate whether the querystring timestamps should be added or not when loading scripts, so that the feature can still be used when needed. Perhaps I could leave this enabled for dev mode and not bother with timestamps on the actual filenames for example.

Using my own timestamps on the names would simplify and standardise the names, as I could use an identical timestamp on all scripts for every microapp done as part of a given build, to simplify naming and build automation – I would only need to pass around one single timestamp parameter which would be used for all generated script files and in the config.

 

Comments Off on Caching of old microapp scripts breaks new version