Jump to content

Manny

Members
 View Profile  See their activity

  • Posts

    130

  • Joined

  • Last visited

 Content Type 

Posts posted by Manny

    HTML Table - Responsive Colspan (On Window Resize)

    in JavaScript

    Posted · Edited by Manny
    Further feedback

    My issue seems to stem from having the following as part of my CSS: 

    table { table-layout: fixed; }

    colspan="auto" now seems to work as desired, but colspan="0" doesn't alter the default behaviour of <td>. A browse of the web also brings up differing opinions on the browser support of colspan="0".

    EDIT

    colspan="auto" appears to work when the browser window decreases in size, but not once the window size increases. In this instance, a window.onresize could provide a working solution if there is no other pure HTML/CSS alternative for a <table>.

    HTML Table - Responsive Colspan (On Window Resize)

    in JavaScript

    Posted

    I've created a table that works responsively across various screen sizes, with columns appearing and collapsing as desired to suit the different devices on which it can be loaded.

    One issue I'm having, however, regards the `colspan` element. There are instances in which I would like to have a column stretch across an entire row.

    A quick search of Github has found the following piece of jQuery: 

        $(function() {
    
        jQuery.fn.exists = function(){return this.length>0;}
        
        // Dynamic Colspan
        if($('[colspan="auto"]').exists())
        {
            $.each($('[colspan="auto"]'), function( index, value ) {
                var table = $(this).closest('table');    // Get Table
                var siblings = $(this).closest('tr').find('th:visible, td:visible').not('[colspan="auto"]').length; // Count colspan siblings
                var numCols = table.find('tr').first().find('th:visible, td:visible').length; // Count visible columns
                $(this).attr('colspan', numCols.toString()-siblings); // Update colspan attribute
            });
        }
    
    });

    Source: https://gist.github.com/afbora/6c98337a3455d45b6ae4e620d5cfbcf2

    Here is an example of my table structure: 

        <table>
      <thead>
        <tr>
          <th></th>
          <th></th>
          <th></th>
          <th></th>
          <th></th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td colspan="auto">Divider</td>
        </tr>
        <tr>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
        </tr>
      </tbody>
    </table>

    As you can see, I have a row which makes use of `colspan="auto"` and works fantastically well with the jQuery source from above - automatically expanding to the full width of the row on page load.

    Where this breaks down, however, is in any instance where a `<td>` has been selected to be hidden in a responsive stylesheet. Instead of switching from `colspan="6"` to `colspan="5"` behind the scenes (DOM), we end up with one row where the colspan is too large.

    I've looked into `window.onresize`, as I believe the jQuery should run when the browser is made bigger or smaller, but am yet to have any success.

    CSS Vertical Navigation

    in CSS

    Posted

    Hi guys,

     

    I'm developing a CMS for one of my sites and am trying out a vertical navigation to the left of the screen.

     

    I've got it to display as intended, with the exception of one thing.

     

    I basically want one long vertical list with sub-menu below it's parent, with the next parent directly underneath the aforementioned sub-menu.

     

    Here's what I have so far:

    <ul>
    <li>
        <a href="#">Parent</a>
        <ul>
            <li>Sub-item</li>
            <li>Sub-item</li>
        </ul>
    </li>
    <li><a href="#">Parent</a></li>
    <li><a href="#">Parent</a></li>
    <li><a href="#">Parent</a></li>
</ul>

    ul { width: 250px; }
ul > li { position: relative; width: 100%; height: 40px; line-height: 40px; border-bottom: 1px solid #999; }
ul > li > a { display: block; width: 100%; padding: 0 20px; }
ul > li > ul { position: absolute; width: 100%;  background-color: #F00; }

    At present, the sub-menu items do fall below the parent, but the next parent item then goes directly over the top of the aforementioned sub-menu.

     

    Any help would be much appreciated.

    ORDER BY MAX(`field_name`) Using GROUP BY

    in SQL

    Posted

    Hey guys - Happy New Year to all.

     

    I'm currently working on a soccer website. A feature I'm developing goes back through history to see which player(s) scored the most goals in each year. I've found a solution, but think there should be a simpler way of going about it.

     

    Here is some example data:

    -----------------------
year | name    | goals
-----------------------
  1  | player1 |   6
  1  | player2 |   8
  1  | player3 |   4
  2  | player1 |   3
  2  | player2 |   5
  2  | player3 |   2
  3  | player1 |   7
  3  | player2 |   7
  3  | player3 |   3

    What I want to get from a query is the value of 'name' and 'goals', using GROUP BY 'year', but only for the maximum value of 'goals' for each year.

     

    Where I run into trouble is in an instance where there are two 'name' fields with the same number of 'goals' - for instance in 'year' 3, where 'player1' and 'player2' both have 7 goals.

     

    I know I can make use of the GROUP_CONCAT feature, but am unsure how to go about getting the following results:

    -------------------------------
year | name            | goals
-------------------------------
  1  | player2         | 8
  2  | player2         | 5
  3  | player1,player2 | 7

    To get those results, I'm currently using two queries. Basically, I'm finding the value of MAX(`goals`) using GROUP BY `year`. Then, by looping through the results, I'm searching for 'name' separately by using WHERE clauses for both 'year' and 'goals'.

    SELECT `year`, MAX(`goals`) FROM `table` GROUP BY `year`

LOOP RESULTS

SELECT `year`, GROUP_CONCAT(`name`), `goals` FROM `table` WHERE `year` = :year AND `goals` = :goals

    Finding the value of 'year' and 'goals' is relatively simple, but I can't find a way to find GROUP_CONCAT(`name`) without resorting to using a second query within a loop.

     

    Any help combining the two would be very much welcomed as it would help save time with similar queries later in my project.

    DataTables - Hide 'Load More' Button When All Rows Are Visible

    in JavaScript

    Posted · Edited by Manny

    Hi there,

     

    I'm trying to implement an instance of DataTables onto a new site and came across the following link:

     

    https://jsfiddle.net/6k0bshb6/20/

     

    I have edited the JS section to this:

    		$(document).ready(function () {
			var dataTable = $(".datatables").DataTable({
				"autoWidth": false,
				"bLengthChange": false,
				"bFilter": false,
				"bInfo": false,
				"bSort": false,
				"pageLength": 10
			});
			
			// Alternative Pagination
			$("#button").on( 'click', function () {
				var VisibleRows = $('.datatables>tbody>tr:visible').length;
				var i = VisibleRows + 5;
				dataTable.page.len( i ).draw();
			} );
		});

    The script does everything I need, with one exception.

     

    There are 14 rows in total. Once all 14 rows have been loaded, I want the 'button' to disappear so the user can no longer click it. How can I achieve this?

    Crontab - Database Backup

    in Web Servers

    Posted · Edited by Manny

    Hi all,

     

    I've created a script which will take backups of my databases and compress them together in a tar.gz file.

     

    This runs perfectly fine on the command line, but I'm unable to get it working via crontab.

     

    Here is the script that backs up the databases (which has permissions of 755)

    #!/bin/sh

# Create a temporary directory to store the MySQL databases
mkdir /$( date '+%Y-%m-%d' )

# Enter the temporary directory created above
cd /$( date '+%Y-%m-%d' )

# Create a dump of each database
mysql -u user -ppass -e 'show databases' | while read dbname; do mysqldump -u user -ppass -h localhost "$dbname" > "$dbname".sql; done

# Create a tar.gz archive, consisting of all database backups
tar -zcf /$( date '+%Y-%m-%d' ).tar.gz /$( date '+%Y-%m-%d' )

# Transfer the tar.gz archive to Google Drive
gdrive upload --parent XXXXX /$( date '+%Y-%m-%d' ).tar.gz

    Again, this runs perfectly on the command line. However, the following cron does not appear to do anything.

    0 3 * * * /backup-db

    The 'gdrive' command comes from the following Git and is installed at /usr/local/bin/gdrive

    https://github.com/prasmussen/gdrive

     

     

    It is worth noting that the script is located at the highest level of the server (e.g. / )

     

    Any advice on how to get this working would be very much appreciated.

    GROUP BY `column` in Sequence

    in SQL

    Posted

    Hi guys. I am trying to populate a <select> list and came up with the idea of using 'optgroup' labels to split options in the list.

     

    Some sample data in my database (MySQL) looks like this.

    id | league
--------------------
 1 | Championship
 2 | Championship
 3 | Championship
 4 | Premier League
 5 | Division One
 6 | Premiership
 7 | Division One
 8 | Division One
 9 | Premiership
10 | Division One

    If I group the results, this is the information I receive.

    QUERY
SELECT `league` FROM `table` WHERE `league` IS NOT NULL GROUP BY `league` ORDER BY `id` DESC

RESULT
league
---------------
Championship
Premier League
Division One
Premiership

    Unfortunately, this isn't what I want. I know I need something similar to query a sequence of results but I'm unsure how to go about it.

     

    In my first code example, I have three 'Championship' values, one 'Premier League', one 'Division One' and so on...

     

    What I want is for the results to be grouped (if that is the correct terminology), with another row being returned if it is different from the value of the previous row - regardless of whether it has been used before or not.

     

    Here is the data I would expect to be returned.

    league
---------------
Championship
Premier League
Division One
Premiership
Division One
Premiership
Division One

    As you can see, each individual sequence has been grouped but the results aren't restricted to a DISTINCT value - i.e. there are three 'Division One' results and two 'Premiership'.

     

    Is this something MySQL is capable of doing. I've done a search of Google but have so far been unable to find a resolution to my question.

    Parse iTunes RSS

    in PHP

    Posted

    That's done the job. For anybody else who runs into this problem in the future, here is how to get the value of 'im:id'.

    <?php$itunes_feed = "https://itunes.apple.com/gb/rss/topsongs/limit=10/explicit=true/xml";$itunes_feed = file_get_contents($itunes_feed);$itunes_feed = preg_replace("/(</?)(w+)[^>]*>)/", "$1$2$3", $itunes_feed);$itunes_xml = new SimpleXMLElement($itunes_feed);$itunes_entry = $itunes_xml->entry;foreach($itunes_entry as $entry){	    // Get the value of the entry ID, by using the 'im' namespace within the <id> attribute    $entry_id['im'] = $entry->id->attributes('im', TRUE);    echo $entry_id['im']['id'];}?>

    I found a little extra help over at http://stackoverflow.com/questions/12325821/getting-xml-attributes-in-php

     

    Thank you very much, justsomeguy.

    Parse iTunes RSS

    in PHP

    Posted · Edited by Manny

    I'm currently working on a project which involves iTunes RSS feeds.

     

    For example, this is the RSS feed for the current top 10 singles in the UK iTunes store

    https://itunes.apple.com/gb/rss/topsongs/limit=10/explicit=true/xml

     

    Taking a look at the code, here is an example entry from that feed:

    <entry>    <updated>2013-08-09T09:23:18-07:00</updated>    <id im:id="667931604">https://itunes.apple.com/gb/album/wake-me-up/id667931602?i=667931604&uo=2</id>'>https://itunes.apple.com/gb/album/wake-me-up/id667931602?i=667931604&uo=2</id>    <title>Wake Me Up - Avicii</title>    <im:name>Wake Me Up</im:name>    <link rel="alternate" type="text/html" href="https://itunes.apple.com/gb/album/wake-me-up/id667931602?i=667931604&uo=2"/>    <im:contentType term="Music" label="Music"><im:contentType term="Track" label="Track"/></im:contentType>    <category im:id="17" term="Dance" scheme="https://itunes.apple.com/gb/genre/music-dance/id17?uo=2" label="Dance"/>    <link title="Preview" rel="enclosure" type="audio/x-m4a" href="http://a1130.phobos.apple.com/us/r2000/010/Music6/v4/c2/d7/c8/c2d7c88d-9c72-fe8b-bf15-6339bd0d2ed7/mzaf_7989860748510150629.plus.aac.p.m4a" im:assetType="preview"><im:duration>30000</im:duration></link>    <im:artist href="https://itunes.apple.com/gb/artist/avicii/id298496035?uo=2">Avicii</im:artist>    <im:price amount="0.99000" currency="GBP">£0.99</im:price>    <im:image height="55">http://a1697.phobos.apple.com/us/r2000/019/Music6/v4/41/45/93/4145934f-b7b9-76e1-f190-05b50a4588e1/13UAAIM09848.55x55-70.jpg</im:image>    <im:image height="60">http://a419.phobos.apple.com/us/r2000/019/Music6/v4/41/45/93/4145934f-b7b9-76e1-f190-05b50a4588e1/13UAAIM09848.60x60-50.jpg</im:image>    <im:image height="170">http://a1266.phobos.apple.com/us/r2000/019/Music6/v4/41/45/93/4145934f-b7b9-76e1-f190-05b50a4588e1/13UAAIM09848.170x170-75.jpg</im:image>    <rights>℗ 2013 Avicii Music AB, under exclusive license to Universal Music AB</rights>    <im:releaseDate label="25 June 2013">2013-06-25T00:00:00-07:00</im:releaseDate></entry>

    Having followed some advice from elsewhere - http://stackoverflow.com/questions/9965370/parse-itunes-rss-atom-feed-with-php - I have managed to get hold of all data, with the exception of one thing.

     

    Frm the line below, I need to be able to get the value of 'im:id' (i.e. 667931604)

    <id im:id="667931604">https://itunes.apple.com/gb/album/wake-me-up/id667931602?i=667931604&uo=2</id>'>https://itunes.apple.com/gb/album/wake-me-up/id667931602?i=667931604&uo=2</id>

    Here's the code I have so far:

    $itunes_xml = file_get_contents('https://itunes.apple.com/gb/rss/topsongs/limit=10/explicit=true/xml');// Remove the colon ":" in the <xxx:yyy> to be <xxxyyy>$itunes_xml = preg_replace("/(</?)(w+)[^>]*>)/", "$1$2$3", $itunes_xml);$itunes_xml = simplexml_load_string($itunes_xml);foreach ($itunes_xml->entry as $entry) {    echo $entry->id['im:id']; // This doesn't work    echo $entry->imprice['amount']; // This works}

    To me, it looks like the colon in 'im:id' is breaking the script. I'm aware of the preg_replace function that has been used, so maybe that is causing the issue, but if I remove it then I'm unable to retrieve other elements of the feed.

     

    Is anybody aware of a fix for this? I'd appreciate any help.

    htaccess RewriteRule & htpasswd Clash

    in Web Servers

    Posted

    I'm currently trying to build an admin CMS and in order to hide querystrings, I have used htaccess to rewrite the URLs into something a little more user friendly. The rewrites work perfectly. However, I want to use htpasswd to protect the directory from outsiders. The code I have at the moment can be found below. 

    AuthName "Restricted Area"AuthType BasicAuthUserFile /root/to/fileAuthGroupFile /dev/nullrequire valid-user RewriteEngine onRewriteBase /directory/ RewriteRule ^([a-z0-9-]+)/?$ index.php?query=$1 [L]RewriteRule ^([a-z0-9-]+)/([a-z0-9-]+).php$ index.php?query=$1&string=$2 [L]

    When I try to use the admin section, I am being presented with this message:[an error occurred while processing this directive] If I remove the first five lines of the code, the CMS works fine, but is not password protected. If I remove everything from line 6 onwards, the htpasswd script kicks in and you are asked to log in with a username and password. What is causing the clash and how can I get the system to work as it should, but with htpasswd protection enabled?

×
×
  • Create New...