The Trick of Target Selector

The Trick of Target Selector

June 19,2021 by MAhmadZ

The Trick of Target Selector

One of the selectors introduced in CSS 3 was the :target pseudo-class selector. But what is a pseudo-class? A pseudo-class represents a state of a selector like :hover, :active, :first-child and their name starts with a single colon(:). So :target will also represent a state of a selector or an element.

Now we know that URLs can have a section focused using the # character mostly using an anchor link. For :target, the element being linked to it is the target element. Or let me rephrase it for a simpler explanation. The :target selector can be used to style the current active target element mention in the URL by the # character.

The following example might help better. Suppose we have a website URL step4wd.com/dummy.html and the following tag in our HTML code:

<div id="example">Example</div>

Plus the following CSS code:

div:target {
  color: blue;
}

The div will have the default colour for the text. But if we change the URL to step4wd.com/dummy.html#example, the text of the div will change to blue colour and that is the trick our :target is all about.

This seems so simple but numerous wonders can be achieved with it like photo gallery, modal boxes etc.


Fix ImageMagicK Policy Error

Fix ImageMagicK Policy Error

June 27,2019 by MAhmadZ

Fix ImageMagicK Policy Error

Converting documents from JPG to PDF or vice versa, compressing and scaling images is a relatively common task for me. After installing the required ImageMagick package in Ubuntu, I tried running the convert command but to my surprise, got the following error message:

$ convert source.jpg destination.pdf
convert-im6.q16: attempt to perform an operation not allowed by the security policy `PDF' @ error/constitute.c/IsCoderAuthorized/408.

After little searching I found the resolution as mention below.

Steps to Follow

Open the Terminal on type the command:

$ sudo vim /etc/ImageMagick-6/policy.xml

You will get the output based on the devices attached to you system:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE policymap [
  <!ELEMENT policymap (policy)+>
  <!ATTLIST policymap xmlns CDATA #FIXED ''>
  <!ELEMENT policy EMPTY>
  <!ATTLIST policy xmlns CDATA #FIXED '' domain NMTOKEN #REQUIRED
    name NMTOKEN #IMPLIED pattern CDATA #IMPLIED rights NMTOKEN #IMPLIED
    stealth NMTOKEN #IMPLIED value CDATA #IMPLIED>
]>
<!--
  Configure ImageMagick policies.

  Domains include system, delegate, coder, filter, path, or resource.

  Rights include none, read, write, execute and all.  Use | to combine them,
  for example: "read | write" to permit read from, or write to, a path.
  ......
  Rules are processed in order.  Here we want to restrict ImageMagick to only
  read or write a small subset of proven web-safe image types:

    <policy domain="delegate" rights="none" pattern="*" />
    <policy domain="filter" rights="none" pattern="*" />
    <policy domain="coder" rights="none" pattern="*" />
    <policy domain="coder" rights="read|write" pattern="{GIF,JPEG,PNG,WEBP}" />
-->
<policymap>
  <!-- <policy domain="system" name="shred" value="2"/> -->
  ......
  <policy domain="coder" rights="none" pattern="PS" />
  <policy domain="coder" rights="none" pattern="EPS" />
  <policy domain="coder" rights="read | write" pattern="PDF" />
  <policy domain="coder" rights="none" pattern="XPS" />
</policymap>

The only change is the highlighted line in which none was replaced with read | write and the file was saved. Now running the convert command again worked as expected πŸ‘πŸΌ


Enable/Disable Dell XPS Touchpad with Ubuntu

Enable/Disable Dell XPS Touchpad with Ubuntu

June 23,2019 by MAhmadZ

Enable/Disable Dell XPS Touchpad with Ubuntu

The first time I purchased Dell's XPS 13 notebook was in 2015 and couldn't be more satisfied. Now I own Dell XPS 13 9380 with Ubuntu 18.04 pre-installed. After initial testing the hardware, I immediately installed a fresh 19.04 and everything was well supported.

However there is no proper was of enabling or disabling the Touchpad. In the Knowledge Base provided by Dell, there is no mention of Ubuntu even though the OS is officially supported. Dell had another link to the Linux issue which didn't look easy to follow. So I am sharing a more simpler fix.

Steps to Follow

Open the Terminal on type the command:

$ xinput list

You will get the output based on the devices attached to you system:

⎑ Virtual core pointer                          id=2    [master pointer  (3)]
⎜   ↳ Virtual core XTEST pointer                id=4    [slave  pointer  (2)]
⎜   ↳ ELAN2930:00 04F3:2930                     id=10   [slave  pointer  (2)]
⎜   ↳ Logitech MX Anywhere 2S                   id=21   [slave  pointer  (2)]
⎜   ↳ DELL08AF:00 06CB:76AF Touchpad            id=11   [slave  pointer  (2)]
⎣ Virtual core keyboard                         id=3    [master keyboard (2)]
    ↳ Virtual core XTEST keyboard               id=5    [slave  keyboard (3)]
    ↳ Video Bus                                 id=6    [slave  keyboard (3)]
    ↳ Power Button                              id=7    [slave  keyboard (3)]
    ↳ Sleep Button                              id=8    [slave  keyboard (3)]
    ↳ Integrated_Webcam_HD: Integrate           id=9    [slave  keyboard (3)]
    ↳ Intel HID events                          id=12   [slave  keyboard (3)]
    ↳ Intel HID 5 button array                  id=13   [slave  keyboard (3)]
    ↳ Dell WMI hotkeys                          id=14   [slave  keyboard (3)]
    ↳ AT Translated Set 2 keyboard              id=15   [slave  keyboard (3)]
    ↳ Logitech MX Anywhere 2S                   id=22   [slave  keyboard (3)]

For my case DELL08AF:00 06CB:76AF Touchpad id=11 [slave pointer (2)] is line of which is telling me that the Touchpad is using the ID 11, Perfect!

Now all I have to do is to disable this device using the command:

$ xinput --disable 11

Try using the Touchpad and it will not respond. To enable it again:

$ xinput --enable 11

And its done! Just in case you want to get the details of this device, run the command:

$ xinput list-props 11

What if it didn't work?

In that case look for the Knowledge Base I have shared in the start and following those instructions.


Installing Ubuntu for Devices

Installing Ubuntu for Devices

February 26,2016 by fzfatima

Installing Ubuntu for Devices

I was installing ubuntu-sdk on my device, accidently I run sudo apt-get update and it broke some links and my phone become unusable. So i reinstall ubuntu OS on it.

In order to install ubuntu or to upgrade its channel, follow this tutorial.

Commands to be Executed

Open the Terminal on Ubuntu Desktop.

Install the ubuntu-device-flash package

The ubuntu-device-flash package is main tool for installing Ubuntu for devices. Install the package:

sudo apt-get install ubuntu-device-flash

Install phablet-tools package

The phablet-tools package provides a Desktop tools useful when working with a USB-connected Ubuntu device.

sudo apt-get install phablet-tools

Installing ubuntu-device-flash also adds two important Android tools you frequently use: adb and fastboot

Supply a recovery image with adb enabled, which ubuntu-device-flash will use temporarily while doing its work

  • For BQ Aquaris E5 Ubuntu Edition (aka vegetahd), use recovery-vegetahd.img

    ubuntu-device-flash can then be supplied with the --recovery-image argument, eg:

    ubuntu-device-flash touch --channel ubuntu-touch/stable/bq-aquaris.en --bootstrap --recovery-image path/to/downloaded/recovery.img

    Note that when the command prompts you with:

    Expecting the device to be in the bootloader... waiting

    You can put a Aquaris E5 in the bootloader by holding down Power + Volume Up for a few seconds, releasing the Power button when the red LED lights as the machine reboots, and then selecting fastboot from the device's boot menu.

    And its done !!


Sync UbuntuTouch Contacts & Calendar with ownCloud

Sync UbuntuTouch Contacts & Calendar with ownCloud

November 21,2015 by mahmadz

Sync UbuntuTouch Contacts & Calendar with ownCloud

UbuntuTouch (also called UbuntuPhone) is new and under active development. One usual expectation from any user is to be able to sync data with services. As of today, it comes with the ability sync with Google only. Problem is Google is really deep and evil when it comes to surveillance. So I tried to sync with my ownCloud and here is what I had to do:

Tools Required

  1. ownCloud server running which would be accessible from the Internet with Contacts and Calendar App installed (whichever is required for sync).
  2. SyncEvolution which is now pre-installed in UbuntuTouch.
  3. Terminal App on your device.

Commands to be Executed

  1. Open the Terminal App on your UbuntuTouch device.

  2. Tell SyncEvolution about your ownCloud server and its details:

    syncevolution --configure --keyring=no --template webdav username=USERNAME password='PASSWORD' syncurl="YOURSERVER.COM/owncloud" target-config@owncloud

    If you are using a self signed certificate, you can use the SSLVerifyServer="0" option to ignore its verification (although this is a security risk):

    syncevolution --configure --keyring=no --template webdav username=USERNAME password='PASSWORD' syncurl="YOURSERVER.COM/owncloud" SSLVerifyServer="0" target-config@owncloud

    Another alternate is to download the certificate and place it in on your UbuntuTouch device. Add the SSLServerCertificates switch to specify the location of the certificate:

    syncevolution --configure --keyring=no --template webdav username=USERNAME password='PASSWORD' syncurl="YOURSERVER.COM/owncloud" SSLServerCertificates="/home/phablet/YOURCERTIFICATE.crt" target-config@owncloud
  3. Now tell SyncEvolution about your phone

    syncevolution --configure --template SyncEvolution_Client sync=none syncURL=local://@owncloud username= password= owncloud
  4. To configure synchronization for:

    a. Contacts:

    syncevolution --configure --template webdav database=https://YOURSERVER.COM/owncloud/remote.php/carddav/addressbooks/USERNAME/contacts backend=carddav target-config@owncloud contacts
    syncevolution --configure sync=two-way backend=contacts database=Personal owncloud contacts
    syncevolution --sync slow owncloud contacts

    b. Calendar:

    syncevolution --configure --template webdav database=https://YOURSERVER.COM/owncloud/remote.php/caldav/calendars/USERNAME/personal backend=caldav target-config@owncloud calendar
    syncevolution --configure sync=two-way backend=calendar database=Personal owncloud calendar
    syncevolution --sync slow owncloud calendar
  5. Once the data is synchronized for the first time, you can use the normal commands:

    syncevolution owncloud contacts
    syncevolution owncloud calendar

Note:

I prefer putting all there commands in a script file on my PC and then copy/execute it on the UbuntuTouch device. πŸ‘

I took help from the following links:

  1. http://askubuntu.com/questions/606020/how-to-sync-contacts-and-the-calendar-on-ubuntu-touch-with-owncloud#606021
  2. https://askubuntu.com/questions/616081/ubuntu-touch-add-contact-list-and-calendars/#616296
  3. http://askubuntu.com/questions/601195/how-can-i-add-a-ca-at-an-ubuntu-phone/#603064
  4. http://mitchellreese.id.au/owncloud-sync-on-ubuntu-touch/

Let me know what worked for you 😊


How to execute bash script at upstart

How to execute bash script at upstart

October 29,2015 by fzfatima

How to execute bash script at upstart

In this tutorial, we will learn how to execute a bash script at upstart.

What is Upstart?

Upstart is an event-based replacement for the /sbin/init daemon which handles starting of tasks and services during boot, stopping them during shutdown and supervising them while the system is running.

Commands

Create a Job in /etc/init.

sudo gedit /etc/init/sync_user.conf

Job configuration files are named as <name>.conf

Add the following lines to sync_user.conf

start on filesystem and net-device-up IFACE!=lo
  stop on runlevel [016]

script
  exec bash -c 'path_to_bash_script_file/file_name start'
end script

To ensure that you haven't misused the Upstart syntax, use the init-checkconf command:

init-checkconf sync_user.conf

Then start the job

sudo start sync_user

Understating the code

Start on condition:

start on filesystem and net-device-up IFACE=lo

Job will be started when the filesystem is mounted and net-device-up IFACE=lo event, which signifies the local network (for example, 127.0.0.0 for IPv4) is available.

Stop on conditon:

stop on runlevel [016]

This ensures the job will be stopped on shutdown[0], when switching to single-user mode[1] and on reboot[6].

Runlevels for Debian and Ubuntu systems are generally as follows:

  0 : System halt.
  1 : Single-User mode.
  2 : Graphical multi-user plus networking (DEFAULT)
  3 : Same as "2", but not used.
  4 : Same as "2", but not used.
  5 : Same as "2", but not used.
  6 : System reboot.

Script

All job files must have either an exec or script stanza. This specifies what will be run for the job.

script
  exec bash -c '/opt/local/our-sync-pkg-2.0/sync_users start'
end script

exec gives the path to a binary on the filesystem and optional arguments to pass to it.

Executing bash script

By default, Upstart uses "/bin/sh" to execute script sections. You can change the default shell.

But it can done in simplest way by executing this line:

exec bash -c '/opt/local/our-sync-pkg-2.0/sync_users start'

bashin exec is used because we're executing the bash script.

-c option after bash means that commands are read from string.

end script will terminate the script.

This will work! If you have any suggestions on improving this post, let me know.


Simplest way to create debian package via fpm

Simplest way to create debian package via fpm

September 17,2015 by owaishanif786

Simplest way to create debian package via fpm

Debian Packaging

In this tutorial we will look through how to package some simple hello world script. A quote from debian maintainer's guide:

One thing is certain, though: to properly create and maintain Debian packages takes many hours. Make no mistake, for our system to work the maintainers need to be both technically competent and diligent.

We have many methods to create a Debian package In this tutorial we will use FPM.

VIA FPM

This method requires minimum effort follow this if you don't want to upload to PPA. However it requires ruby gem and package name FPM. check wiki for further details.

mkdir -p ~/via-fpm/debian/usr/bin/
cd ~/via-fpm/debian/
touch ~/via-fpm/debian/usr/bin/hello-via-fpm.sh
gedit ~/via-fpm/debian/usr/bin/hello-via-fpm.sh

Add following lines to script.

#!/bin/bash
echo "hello debian packaging via fpm"

Save and close that file. whatever folder structure you will put in your source folder it will automatically copied into respected folders. There is no need to to copy them. For example if you want to put some sources file in /opt/local/sources then you must have same structure in you application source. Similarly usr/bin/ files will automatically copied to their respected folder in this case that will be /usr/bin.

Next we will come towards the scripts that will automatically run like preinstall , post install , pre un-install and post un-install . If you want to create user, directories, set permissions then these scrips are for you. You can use bash here. In this demo we will use "postinst" script to set permission for ~/via-fpm/debian/usr/bin/hello-via-fpm.sh create postint file in described location and add the following code.

mkdir -p opt/local/
touch opt/local/postinst
gedit opt/local/postinst

Set so that user can execute command from shell.

#!/bin/bash
set -e
sudo chmod +x ~/via-fpm/debian/usr/bin/hello-via-fpm.sh 
exit 0

It't time for packaging.

cd ~/via-fpm
fpm --epoch 1 -s dir -e -C debian \
-a all -m "uncle demo <UncleDemo@example.com>" \
--description "our absurd debian package for demo via fpm" \
-v 1.0  -t deb  -n hello-via-fpm --after-install debian/opt/local/postinst 

Switches that we have used and their meaning

-epoch: Used for epoch value is somehow versioning number
-e: Edit the package spec before building. (default: false)
-C: Change directory to here before searching for files
-a: The architecture name. Usually matches 'uname -m'. For automatic values, you can use '-a all' or '-a: native'. These two strings will be translated into the correct value for your platform and target package type.
-m: The maintainer of this package. (default: "djhaskin987@djhaskin987-S301LA")
--description: add description
-v: specify version number
-t: output type
-n: Name to give to the package
--after-install: file to run after post install

Why FPM:

Because it will automatically create necessary files like control, rules and lot other necessary stuff for you. There are other proper ways to do that using official Debian package management through which you can upload your package to PPA. That we will discuss in next demo.

INSTALLATION:

To install that package either open via Ubuntu software center or run command sudo dpkg -i hello-via-fpm_1.0_all.deb

LAST CHECK:

Now try to run command from shell hello-via-fpm.sh to see that your package is installed now and further you can create your own with customizations.


Installing LibreOffice 5 in Ubuntu

Installing LibreOffice 5 in Ubuntu

August 24,2015 by MAhmadZ

Installing LibreOffice 5 in Ubuntu

The latest version of LibreOffice is here but unfortunately its not going to be available in Ubuntu 14.04 and 12.04 by default. But the good news is that we can upgrade existing version by typing these commands:

sudo add-apt-repository ppa:libreoffice/ppa
sudo apt-get update && sudo apt-get -y dist-upgrade

That should be enough! :-)


Disable Guest Account in Ubuntu

August 24,2015 by MAhmadZ

Ubuntu has a special account, named Guest, which allows access (login) to the system without asking for any password. Although there are limitation applied to this account but maybe its not always desirable to have it. These steps will help in disabling it (tested under 12.04 and 14.04):

Open the file /etc/lightdm/lightdm.conf and add the following line to it at the end:

allow-guest=false

If the file lightdm.conf is missing, then paste the following contents in the blank file:

[SeatDefaults]
allow-guest=false

Once thats done, restart the relevant service:

sudo restart lightdm

This should work!


Fix the Missing Ubuntu One Nautilus Integration in Ubuntu 13.10

Fix the Missing Ubuntu One Nautilus Integration in Ubuntu 13.10

October 29,2013 by MAhmadZ

Fix the Missing Ubuntu One Nautilus Integration in Ubuntu 13.10

If you have made a fresh clean installation of Ubuntu 13.10, you would have noticed one announced missing feature. The Ubuntu One icons and context menu is missing from Nautilis (File Manager). Why is it missing?? Couldn’t find a valid reason even in Launchpad although Ubuntu One was supposed to be important to Ubuntu. Anyway…

To fix, you will need to install to packages from 13.04 and restart Nautilis. Follow these steps:

Download the required two packages:

wget https://launchpad.net/ubuntu/+source/ubuntuone-client-gnome/4.2.0-0ubuntu1/+build/4405128/+files/ubuntuone-client-gnome_4.2.0-0ubuntu1_amd64.deb -O ubuntuone-client-gnome_4.2.0-0ubuntu1_amd64.deb
wget https://launchpad.net/ubuntu/+source/ubuntuone-client/4.2.0-0ubuntu1/+build/4405191/+files/libsyncdaemon-1.0-1_4.2.0-0ubuntu1_amd64.deb -O libsyncdaemon-1.0-1_4.2.0-0ubuntu1_amd64.deb

Install them:

sudo dpkg -i ubuntuone-client-gnome_4.2.0-0ubuntu1_amd64.deb
sudo dpkg -i libsyncdaemon-1.0-1_4.2.0-0ubuntu1_amd64.deb

Restart Nautilus:

nautilus -q

Back to the day and satisfied days πŸ™‚


Turn Off Warning & Error Messages in Drupal

Turn Off Warning & Error Messages in Drupal

September 26,2013 by MAhmadZ

Turn Off Warning & Error Messages in Drupal

Drupal is a popular CMS built in PHP, which is flexible and powerful. Currently in version 7 and the next version 8 is due in some time. Drupal has a way to Log and Report Errors. Like almost all CMS, it also periodically checks for new updates to the core, as well as themes and modules. Once an update is detected, it will Log Report it. It will also report about other errors in your code.

This all helpful in making your there are no bugs and security holes left for your site to be hacked. However you would not like the visitors and viewers of your site to have warning messages shown at the top of every page. To solve this issue, Drupal has a way to turn them Off for the visitors and let it remain On for the admin user.

Just login to your site as admin and navigate to Configuration (at the top), then under Development click on Logging and errors. You can directly go to it by pasting this URL segment at the end of your drupal home page URL: admin/config/development/logging

You will see a screen similar to the picture below. Just select None and click on Save configuration to make it effective.

Drupal Logging and ErrorsDrupal Logging and Errors


Remove Unwanted Audio Tracks from Video Files

Remove Unwanted Audio Tracks from Video Files

August 12,2013 by MAhmadZ

Remove Unwanted Audio Tracks from Video Files

It is now possible to have multiple audio tracks in a single video. This is becoming common for Movies and Documentaries. This way a single video is good for serving people of different lingual backgrounds. However, like me you might not be interested in all those tracks. In this tutorial, we will remove all the unwanted tracks.

The tool we will be using is avconv and in a previous post I have mentioned how to install it in Ubuntu, so I will not be going into the installation part again.

Check how many Tracks are there

First of all we need to check on the track details and for that, run the following command (the extension can be mp4, mov, mkv, avi or any other):

avconv -i file_name.mkv

In my case, I got the following output:

avconv version 0.8.6-6:0.8.6-1ubuntu2, Copyright (c) 2000-2013 the Libav developers
    built on Mar 30 2013 22:20:06 with gcc 4.7.2
[matroska,webm @ 0xc31d40] Estimating duration from bitrate, this may be inaccurate
Input #0, matroska,webm, from 'file_name.mkv':
    Duration: 00:46:15.28, start: 0.000000, bitrate: 768 kb/s
        Stream #0.0(eng): Video: h264 (High), yuv420p, 1280x720, PAR 1:1 DAR 16:9, 25 fps, 25 tbr, 1k tbn, 50 tbc (default)
        Stream #0.1(rus): Audio: ac3, 48000 Hz, 5.1, s16, 384 kb/s (default)
        Stream #0.2(eng): Audio: ac3, 48000 Hz, 5.1, s16, 384 kb/s
At least one output file must be specified

The lines in bold tell us how many tracks are there.

Removing the track

Since I have no interest in Russia audio, I would like to remove it. In my case I would like to keep the second track. Here is the command:

avconv -i file_name.mkv -map 0:0 -map 0:2 -acodec copy -vcodec copy output.mkv

If your track is different, for instance you want to keep the first track, replace -map 0:2 with -map 0:1 and it will work.

Another advantage you will get is a reduction in file size, which is always a good news. πŸ™‚


Change Display/Screen Resolution using Linux Command

Change Display/Screen Resolution using Linux Command

March 28,2013 by MAhmadZ

Change Display/Screen Resolution using Linux Command

To change the Screen Resolution in Ubuntu, simply type Display in the Unity Launcher and run the application. The snapshot of the Display application is taken from Ubuntu 12.10 and is also the same in previous versions also. Similar application is available in other Linux distributions.

But there is a handy command that can do the same thing even faster or can help you create a script (depends how creative and productive you plan to be). The command is simple:

xrandr

This will display all the possible resolution profiles available for the current system (more can also be added and you can find help on https://www.x.org/archive/X11R7.5/doc/man/man1/xrandr.1.html).

To change to a known resolution:

xrandr -s 1024x768

And you have it! πŸ™‚


Install LibreOffice 4.x on Ubuntu 12.04 and 12.10

Install LibreOffice 4.x on Ubuntu 12.04 and 12.10

March 28,2013 by MAhmadZ

Install LibreOffice 4.x on Ubuntu 12.04 and 12.10

Document Foundation, the developers behind LibreOffice released Version 4.0 on 7th February 2013. Ubuntu 12.04 however is still stuck with Version 3.5 and Ubuntu 12.10 with Version 3.6 of LibreOffice. Its always nice to be up-to-date with the latest versions. This is what is covered in this post.

The first step is to install the PPA repository and there are two choices you have.

  1. To Add 4.0 Repository (this will remain limited to 4.0 and its subversions only like 4.0.x):

    sudo add-apt-repository ppa:libreoffice/libreoffice-4-0
  2. To Add Latest Repository (also offers 4.0.x but later will automatically update to 4.x and above):

    sudo add-apt-repository ppa:libreoffice/ppa

Which ever road you take, the next steps are the same. Run the update command and upgrade the distribution (simple upgrade won’t work):

sudo apt-get update
sudo apt-get dist-upgrade

And you have the latest LibreOffice πŸ™‚


Installing Ubuntu Updates on Multiple Systems

Installing Ubuntu Updates on Multiple Systems

February 27,2013 by MAhmadZ

Installing Ubuntu Updates on Multiple Systems

Today I was installing Ubuntu in my Olives School lab. There are 20 systems in total. After installing it in the first PC, I ran the Update and there were 443 of them which amounted for 337MB approx. As it can be imagined it took some time to get the first PC updated. This was clearly not what I was going to do with the rest and I had to come up with a solution.

When Ubuntu downloads these updates, it places them in /var/cache/apt/archives/ folder. In fact even after installing updates, they are not removed from the system. So a solution was simple:

  1. Copy all the downloaded packages to a USB

  2. On the next PC, run the command:

    sudo cp [path-to-usb]/* /var/cache/apt/archives
  3. Once all the files have been pasted, run the Update Manager tool and it will tell you that updates have been downloaded but not yet installed.

  4. Click on Install :-)