[add] new configuration page

[fix] disable thumbnails keep left space in myShaarli theme
2015-07-01 12:20:41 +02:00 · 2015-07-01 12:20:41 +02:00 · 799c92d786
commit 799c92d786
parent d541bf3514
5 changed files with 249 additions and 51 deletions
--- a/inc/styles/myShaarli.css
+++ b/inc/styles/myShaarli.css
@ -311,7 +311,7 @@ a, .linkdescription a {

 #toolsdiv a span {
  color: #ffffff;
-  font-weight :normal;
+  font-weight: normal;
 }

 .linksperpage, .tagfilter, .searchform, .addform {
@ -695,12 +695,6 @@ a, .linkdescription a {
  padding: 10px 5px;
 }

-#configform td {
-  color: #ccc;
-  font-size: 10pt;
-  padding: 10px 5px;
-}
-
 .thumbnail {
  float: left;
  margin: 0;
@ -714,9 +708,8 @@ a, .linkdescription a {
  border-radius: .3em;
 }

-.linkcontainer {
+.linkcontainerThumb {
  margin-left: 130px;
-  position: static;
 }

 .favicon {
@ -934,6 +927,15 @@ a:hover, .linkdescription a:hover, .linktitle a:hover, .linkWallabag a:hover, .l
  padding: 10px 5px;
 }

+#configform {
+  margin: 0 auto;
+  width: 70%;
+}
+
+#configform label {
+  font-weight: bold;
+}
+
 .picwall_pictureframe span.info, .lazyimage {
  display: none;
 }
@ -944,6 +946,71 @@ a:hover, .linkdescription a:hover, .linktitle a:hover, .linkWallabag a:hover, .l
  width: 33%;
 }

+/*
+ * Creating Content Tabs with Pure CSS
+ * http://www.onextrapixel.com/2013/07/31/creating-content-tabs-with-pure-css/
+ */
+
+.tabs input[type=radio] {
+  position: absolute;
+  top: -9999px;
+  left: -9999px;
+}
+
+.tabs {
+  float: none;
+  list-style: none;
+  position: relative;
+  padding: 0;
+}
+
+.tabs li {
+  display: block;
+}
+
+.tabsLabel {
+  background: #333333 linear-gradient(#333333,#000000) repeat scroll 0 0;
+  border-radius: 5px;
+  box-shadow: 0 1px 2px rgba(0,0,0,0.5);
+  color: #a2dd42;
+  display: block;
+  font-size: 1.1em;
+  cursor: pointer;
+  position: relative;
+  top: 3px;
+  transition: all .2s ease-in-out;
+  padding: .3em .6em;
+}
+
+.tabsLabel:hover {
+  color: #ffffc9;
+}
+
+[id^=tab]:checked + .tabsLabel {
+  color: #ffffc9;
+}
+
+[id^=tab]:checked ~
+[id^=tab-content] {
+  display: block;
+}
+
+.tab-content {
+  z-index: 2;
+  display: none;
+  text-align: left;
+  width: 100%;
+  left: 0;
+  box-sizing: border-box;
+  -webkit-animation-duration: .5s;
+  -o-animation-duration: .5s;
+  -moz-animation-duration: .5s;
+  animation-duration: .5s;
+  border: 1px solid #ccc;
+  border-radius: .3em;
+  padding: 15px;
+}
+
@media print {
  html {
    background: #fff !important;
--- a/index.php
+++ b/index.php
@ -40,10 +40,13 @@ $GLOBALS['config']['externalThumbshot'] = ''; // Url for external thumbnailer
 $GLOBALS['config']['ENABLE_MARKDOWN'] = TRUE;
 $GLOBALS['config']['WALLABAG_URL'] = '';
 $GLOBALS['config']['contactLink'] = ''; // Define link for contact Example : http://example.com/contact.php or mailo:contact@example.com
+$GLOBALS['config']['THEME'] = 'myShaarli';
 // -----------------------------------------------------------------------------------------------
 // You should not touch below (or at your own risks !)
 // Optionnal config file.
-if (is_file($GLOBALS['config']['DATADIR'].'/options.php')) require($GLOBALS['config']['DATADIR'].'/options.php');
+if (is_file($GLOBALS['config']['DATADIR'].'/options.php')){
+  require($GLOBALS['config']['DATADIR'].'/options.php');
+}

 define('myShaarli_version','1.0.0 alpha');
 define('PHPPREFIX','<?php /* '); // Prefix to encapsulate data in php code.
@ -373,8 +376,11 @@ function isLoggedIn()
 }

 // Force logout.
-function logout() { if (isset($_SESSION)) { unset($_SESSION['uid']); unset($_SESSION['ip']); unset($_SESSION['username']); unset($_SESSION['privateonly']); }
-setcookie('shaarli_staySignedIn', FALSE, 0, WEB_PATH);
+function logout() {
+  if (isset($_SESSION)) {
+    unset($_SESSION['uid'], $_SESSION['ip'], $_SESSION['username'], $_SESSION['privateonly']);
+  }
+  setcookie('shaarli_staySignedIn', FALSE, 0, WEB_PATH);
 }


@ -680,6 +686,7 @@ class pageBuilder
    private function initialize()
    {
        $this->tpl = new RainTPL;
+        $this->tpl->assign('theme',$GLOBALS['config']['THEME']);
        $this->tpl->assign('newversion',checkUpdate());
        $this->tpl->assign('feedurl',htmlspecialchars(indexUrl()));
        $searchcrits=''; // Search criteria
@ -1460,14 +1467,26 @@ function renderPage()
                if (isTZvalid($_POST['continent'],$_POST['city']))
                    $tz = $_POST['continent'].'/'.$_POST['city'];
            $GLOBALS['timezone'] = $tz;
-            $GLOBALS['title']=$_POST['title'];
-            $GLOBALS['titleLink']=$_POST['titleLink'];
+            $GLOBALS['title']=htmlentities(strip_tags($_POST['title']));
+            $GLOBALS['titleLink']=htmlentities(strip_tags($_POST['titleLink']));
            $GLOBALS['redirector']=$_POST['redirector'];
            $GLOBALS['disablesessionprotection']=!empty($_POST['disablesessionprotection']);
            $GLOBALS['disablejquery']=!empty($_POST['disablejquery']);
            $GLOBALS['privateLinkByDefault']=!empty($_POST['privateLinkByDefault']);
            $GLOBALS['config']['ENABLE_RSS_PERMALINKS']= !empty($_POST['enableRssPermalinks']);
            $GLOBALS['config']['ENABLE_UPDATECHECK'] = !empty($_POST['updateCheck']);
+            $GLOBALS['config']['ENABLE_MARKDOWN'] = !empty($_POST['enableMarkdown']);
+            $GLOBALS['config']['HIDE_TIMESTAMPS'] = !empty($_POST['hideTimestamps']);
+            $GLOBALS['config']['BAN_AFTER'] = (int)$_POST['banAfter'];
+            $GLOBALS['config']['BAN_DURATION'] = (int)$_POST['banDuration'];
+            $GLOBALS['config']['THEME'] = htmlentities(strip_tags($_POST['theme']));
+            $GLOBALS['config']['LINKS_PER_PAGE'] = (int)$_POST['linkPerPage'];
+            $GLOBALS['config']['ENABLE_THUMBNAILS'] = !empty($_POST['enableThumbnails']);
+            $GLOBALS['config']['ENABLE_FAVICON'] = !empty($_POST['enableFavicon']);
+            $GLOBALS['config']['ENABLE_LOCALCACHE'] = !empty($_POST['enableCache']);
+            $GLOBALS['config']['externalThumbshot'] = $_POST['externalThumbshot'];
+            $GLOBALS['config']['contactLink'] = $_POST['contactLink'];
+            $_SESSION['LINKS_PER_PAGE'] = (int)$_POST['linkPerPage'];
            writeConfig();
            echo '<script language="JavaScript">alert("Configuration was saved.");document.location=\'?do=tools\';</script>';
            exit;
@ -1475,6 +1494,7 @@ function renderPage()
        else // Show the configuration form.
        {
            $PAGE = new pageBuilder;
+            $PAGE->assign('themes',getAllTheme());
            $PAGE->assign('linkcount',count($LINKSDB));
            $PAGE->assign('token',getToken());
            $PAGE->assign('title',htmlspecialchars( empty($GLOBALS['title']) ? '' : $GLOBALS['title'] , ENT_QUOTES));
@ -2378,6 +2398,14 @@ function processWS()
    }
 }

+function getAllTheme(){
+  $allTheme = glob('inc/styles/*.css');
+  foreach ($allTheme as $value) {
+	 $themes[] = basename($value, '.css');
+  }
+  return $themes;
+}
+
 // Re-write configuration file according to globals.
 // Requires some $GLOBALS to be set (login,hash,salt,title).
 // If the config file cannot be saved, an error message is dislayed and the user is redirected to "Tools" menu.
@ -2394,6 +2422,17 @@ function writeConfig()
    $config .= '$GLOBALS[\'privateLinkByDefault\']='.var_export($GLOBALS['privateLinkByDefault'],true).'; ';
    $config .= '$GLOBALS[\'config\'][\'ENABLE_RSS_PERMALINKS\']='.var_export($GLOBALS['config']['ENABLE_RSS_PERMALINKS'], true).'; ';
    $config .= '$GLOBALS[\'config\'][\'ENABLE_UPDATECHECK\']='.var_export($GLOBALS['config']['ENABLE_UPDATECHECK'], true).'; ';
+    $config .= '$GLOBALS[\'config\'][\'ENABLE_MARKDOWN\']='.var_export($GLOBALS['config']['ENABLE_MARKDOWN'], true).'; ';
+    $config .= '$GLOBALS[\'config\'][\'BAN_AFTER\']='.var_export($GLOBALS['config']['BAN_AFTER'], true).'; ';
+    $config .= '$GLOBALS[\'config\'][\'BAN_DURATION\']='.var_export($GLOBALS['config']['BAN_DURATION'], true).'; ';
+    $config .= '$GLOBALS[\'config\'][\'THEME\']='.var_export($GLOBALS['config']['THEME'], true).'; ';
+    $config .= '$GLOBALS[\'config\'][\'LINKS_PER_PAGE\']='.var_export($GLOBALS['config']['LINKS_PER_PAGE'], true).'; ';
+    $config .= '$GLOBALS[\'config\'][\'HIDE_TIMESTAMPS\']='.var_export($GLOBALS['config']['HIDE_TIMESTAMPS'], true).'; ';
+    $config .= '$GLOBALS[\'config\'][\'ENABLE_THUMBNAILS\']='.var_export($GLOBALS['config']['ENABLE_THUMBNAILS'], true).'; ';
+    $config .= '$GLOBALS[\'config\'][\'ENABLE_FAVICON\']='.var_export($GLOBALS['config']['ENABLE_FAVICON'], true).'; ';
+    $config .= '$GLOBALS[\'config\'][\'ENABLE_LOCALCACHE\']='.var_export($GLOBALS['config']['ENABLE_LOCALCACHE'], true).'; ';
+    $config .= '$GLOBALS[\'config\'][\'externalThumbshot\']='.var_export($GLOBALS['config']['externalThumbshot'], true).'; ';
+    $config .= '$GLOBALS[\'config\'][\'contactLink\']='.var_export($GLOBALS['config']['contactLink'], true).'; ';
    $config .= ' ?>';
    if (!file_put_contents($GLOBALS['config']['CONFIG_FILE'],$config) || strcmp(file_get_contents($GLOBALS['config']['CONFIG_FILE']),$config)!=0)
    {
--- a/tpl/configure.html
+++ b/tpl/configure.html
@ -1,38 +1,128 @@
 <!DOCTYPE html>
 <html>
-<head>{include="includes"}</head>
-<body onload="document.configform.title.focus();">
-<div id="pageheader">
-	{include="page.header"}
-{$timezone_js}
-    <form method="POST" action="" name="configform" id="configform">
-	<input type="hidden" name="token" value="{$token}">
-	<table border="0" cellpadding="20">
+  <head>
+    {include="includes"}
+  </head>
+  <body>
+    <div id="pageheader">
+      {include="page.header"}
+      {$timezone_js}
+      <form method="POST" action="" name="configform" id="configform">
+        <ul class="tabs">
+          <li>
+            <input type="radio" checked name="tabs" id="tab1">
+            <label class="tabsLabel" for="tab1">&#9658; General</label>
+            <div id="tab-content1" class="tab-content">
+              <p>
+                <label for="title">Page title :</label>
+                <input type="text" name="title" id="title" size="50" value="{$title}" autofocus>
+              </p>
+              <p>
+                <label for="titleLink">Title link :</label>
+                <input type="text" name="titleLink" id="titleLink" size="50" value="{$titleLink}">
+              </p>
+              <p>
+                <label for="contactLink">Contact link in footer: </label>
+                <input type="text" name="contactLink" id="contactLink" value="{$GLOBALS['config']['contactLink']}"/>
+                <span>Example : http://example.com/contact.php or mailo:contact@example.com</span>
+              </p>
+              <p>
+                <label>Timezone : </label>
+                {$timezone_form}
+              </p>
+              <p>
+                <label for="redirector">Redirector : </label>
+                <input type="text" name="redirector" id="redirector" size="50" value="{$redirector}">
+                (e.g. <i>http://anonym.to/?</i> will mask the HTTP_REFERER)
+              </p>
+              <p>
+                <label for="enableCache">Enable local cache : </label>
+                <input type="checkbox" name="enableCache" id="enableCache" {if="!empty($GLOBALS['config']['ENABLE_LOCALCACHE'])"}checked{/if}/>
+              </p>
+            </div>
+          </li>
+          <li>
+            <input type="radio" name="tabs" id="tab2">
+            <label class="tabsLabel" for="tab2" >&#9658; Security</label>
+            <div id="tab-content2" class="tab-content">
+              <p>
+                <label for="disablesessionprotection">Security :</label>
+                <input type="checkbox" name="disablesessionprotection" id="disablesessionprotection" {if="!empty($GLOBALS['disablesessionprotection'])"}checked{/if}>
+                <label for="disablesessionprotection">&nbsp;Disable session cookie hijacking protection (Check this if you get disconnected often or if your IP address changes often.)</label>
+              </p>
+              <p>
+                <label for="banAfter">Ban after : </label>
+                <input type="text" name="banAfter" id="banAfter" value="{$GLOBALS['config']['BAN_AFTER']}"/>
+              </p>
+              <p>
+                <label for="banDuration">Ban time : </label>
+                <input type="text" name="banDuration" id="banDuration" value="{$GLOBALS['config']['BAN_DURATION']}"/>
+                in second
+              </p>
+              <p>
+                <label for="updateCheck">Update :</label>
+                <input type="checkbox" name="updateCheck" id="updateCheck" {if="!empty($GLOBALS['config']['ENABLE_UPDATECHECK'])"}checked{/if}/>
+                <label for="updateCheck">&nbsp;Notify me when a new release is ready</label>
+              </p>

-	    <tr><td><b>Page title:</b></td><td><input type="text" name="title" id="title" size="50" value="{$title}"></td></tr>
-
-	    <tr><td><b>Title link:</b></td><td><input type="text" name="titleLink" id="titleLink" size="50" value="{$titleLink}"></td></tr>
-
-	    <tr><td valign="top"><b>Timezone:</b></td><td valign="top">{$timezone_form}</td></tr>
-
-	    <tr><td valign="top"><b>Redirector</b></td><td><input type="text" name="redirector" id="redirector" size="50" value="{$redirector}"><br>(e.g. <i>http://anonym.to/?</i> will mask the HTTP_REFERER)</td></tr>
-
-        <tr><td valign="top"><b>Security:</b></td><td><input type="checkbox" name="disablesessionprotection" id="disablesessionprotection" {if="!empty($GLOBALS['disablesessionprotection'])"}checked{/if}><label for="disablesessionprotection">&nbsp;Disable session cookie hijacking protection (Check this if you get disconnected often or if your IP address changes often.)</label></td></tr>
-
-        <tr><td valign="top"><b>Features:</b></td><td>
-        	<input type="checkbox" name="disablejquery" id="disablejquery" {if="!empty($GLOBALS['disablejquery'])"}checked{/if}><label for="disablejquery">&nbsp;Disable jQuery and all heavy javascript (for example: Autocomplete in tags. Useful for slow computers.)</label>
-        </td></tr>
-        <tr><td valign="top"><b>New link:</b></td><td>
-        	<input type="checkbox" name="privateLinkByDefault" id="privateLinkByDefault" {if="!empty($GLOBALS['privateLinkByDefault'])"}checked{/if}/><label for="privateLinkByDefault">&nbsp;All new link are private by default</label></td>
-        </tr>
-        <tr><td valign="top"><b>Update:</b></td><td>
-          <input type="checkbox" name="updateCheck" id="updateCheck" {if="!empty($GLOBALS['config']['ENABLE_UPDATECHECK'])"}checked{/if}/>
-          <label for="updateCheck">&nbsp;Notify me when a new release is ready</label></td>
-        </tr>
-	  <tr><td></td><td align="right"><input type="submit" name="Save" value="Save config" class="bigbutton"></td></tr>
-	</table>
-	</form>
-</div>
-{include="page.footer"}
-</body>
+            </div>
+          </li>
+          <li>
+            <input type="radio" name="tabs" id="tab3">
+            <label class="tabsLabel" for="tab3">&#9658; Display</label>
+            <div id="tab-content3" class="tab-content">
+              <p>
+                <label for="theme">Theme : </label>
+                <select name="theme" id="theme">
+                  {loop="themes"}
+                  <option {if="$GLOBALS['config']['THEME']==$value"}selected{/if} value="{$value}">{$value|ucfirst}</option>
+                  {/loop}
+                </select>
+              </p>
+              <p>
+                <label for="linkPerPage">Link per page : </label>
+                <input type="text" name="linkPerPage" id="linkPerPage" value="{$GLOBALS['config']['LINKS_PER_PAGE']}"/>
+              </p>
+              <p>
+                <label for="hideTimestamps">Hide timestamps : </label>
+                <input type="checkbox" name="hideTimestamps" id="hideTimestamps" {if="!empty($GLOBALS['config']['HIDE_TIMESTAMPS'])"}checked{/if}/>
+              </p>
+            </div>
+          </li>
+          <li>
+            <input type="radio" name="tabs" id="tab4">
+            <label class="tabsLabel" for="tab4">&#9658; Extra</label>
+            <div id="tab-content4" class="tab-content">
+              <p>
+                <label for="privateLinkByDefault">New link:</label>
+                <input type="checkbox" name="privateLinkByDefault" id="privateLinkByDefault" {if="!empty($GLOBALS['privateLinkByDefault'])"}checked{/if}/>
+                <label for="privateLinkByDefault">&nbsp;All new link are private by default</label>
+              </p>
+              <p>
+                <label for="enableMarkdown">Enable Markdown : </label>
+                <input type="checkbox" name="enableMarkdown" id="enableMarkdown" {if="!empty($GLOBALS['config']['ENABLE_MARKDOWN'])"}checked{/if}/>
+              </p>
+              <p>
+                <label for="enableThumbnails">Enable thumbnail : </label>
+                <input type="checkbox" name="enableThumbnails" id="enableThumbnails" {if="!empty($GLOBALS['config']['ENABLE_THUMBNAILS'])"}checked{/if}/>
+              </p>
+              <p>
+                <label for="externalThumbshot">External thumbnailer : </label>
+                <input type="text" name="externalThumbshot" id="externalThumbshot" size="50" value="{$GLOBALS['config']['externalThumbshot']}">
+              </p>
+              <p>
+                <label for="enableFavicon">Enable favicon : </label>
+                <input type="checkbox" name="enableFavicon" id="enableFavicon" {if="!empty($GLOBALS['config']['ENABLE_FAVICON'])"}checked{/if}/>
+              </p>
+            </div>
+          </li>
+        </ul>
+        <p>
+          <input type="hidden" name="token" value="{$token}">
+          <input type="submit" name="Save" value="Save config" class="bigbutton">
+        </p>
+      </form>
+    </div>
+    {include="page.footer"}
+  </body>
 </html>
--- a/tpl/includes.html
+++ b/tpl/includes.html
@ -5,5 +5,5 @@
 <link rel="alternate" type="application/rss+xml" href="{$feedurl}?do=rss{$searchcrits}#" title="RSS Feed" />
 <link rel="alternate" type="application/atom+xml" href="{$feedurl}?do=atom{$searchcrits}#" title="ATOM Feed" />
 <link href="images/favicon.ico#" rel="shortcut icon" type="image/x-icon" />
-<link type="text/css" rel="stylesheet" href="inc/styles/myShaarli.css?version={$version|urlencode}#" />
+<link type="text/css" rel="stylesheet" href="inc/styles/{$theme}.css?version={$version|urlencode}#" />
 {if condition="is_file('inc/user.css')"}<link type="text/css" rel="stylesheet" href="inc/user.css?version={$version}#" />{/if}
--- a/tpl/linklist.html
+++ b/tpl/linklist.html
@ -42,8 +42,10 @@
        {loop="links"}
        <li{if="$value.class"} class="{$value.class}"{/if}>
            <a name="{$value.linkdate|smallHash}" id="{$value.linkdate|smallHash}"></a>
-            <div class="thumbnail">{$value.url|thumbnail}</div>
-            <div class="linkcontainer">
+            {if="$GLOBALS['config']['ENABLE_THUMBNAILS']"}
+              <div class="thumbnail">{$value.url|thumbnail}</div>
+            {/if}
+            <div class="linkcontainer {if="$GLOBALS['config']['ENABLE_THUMBNAILS']"}linkcontainerThumb{/if}">
                {if="isLoggedIn()"}
                    <div class="linkeditbuttons">
                        <form method="GET" class="buttoneditform"><input type="hidden" name="edit_link" value="{$value.linkdate}"><input type="image" alt="Edit" src="images/edit_icon.png#" title="Edit" class="button_edit"></form><br>