more fields

index.php

@@ -26,7 +26,7 @@
             <input class="prompt" type="text" id="targetsInput" name="targets" required="" oninput="hiddenInput.value=this.value"
             pattern="[a-zA-Z0-9._\/ \-]+" value="<?=$targets; ?>" placeholder="Scanner un réseau..."
             title="Les cibles peuvent être spécifiées par des noms d'hôtes, des adresses IP, des adresses de réseaux, etc.
-Exemples: <?=$_SERVER['REMOTE_ADDR']; ?>/24 <?=$_SERVER['SERVER_NAME']; ?>"/>
+Exemples: <?=$_SERVER['REMOTE_ADDR']; ?>/24 <?=$_SERVER['SERVER_NAME']; ?> 10.0-255.0-255.1-254"/>
             <i class="satellite dish icon"></i>
             <button style="display:none" type="submit" formaction="scan.php" formmethod="get"></button>
           </div>

scan-options.php

@@ -38,51 +38,127 @@
           <input id="targetsInput" type="text" name="targets" placeholder="Cibles" required=""
             pattern="[a-zA-Z0-9._\/ \-]+" value="<?= htmlspecialchars($targets); ?>" list="targetsList"
             title="Les cibles peuvent être spécifiées par des noms d'hôtes, des adresses IP, des adresses de réseaux, etc.
-Exemples: <?=$_SERVER['REMOTE_ADDR']; ?>/24 <?=$_SERVER['SERVER_NAME']; ?>" />
+Exemples: <?=$_SERVER['REMOTE_ADDR']; ?>/24 <?=$_SERVER['SERVER_NAME']; ?> 10.0-255.0-255.1-254" />
         </div>
 
-        <fieldset class="ui segment">
+        <div class="ui styled fluid accordion field">
-          <h3 class="header">Découverte des hôtes</h3>
+          <div class="title"><i class="icon dropdown"></i>Spécification des cibles</div>
-          <div class="inline field">
+          <div class="content">
-            <div class="ui checkbox">
+            <div class="field">
-              <input type="checkbox" id="PnCheckbox" name="Pn"/>
+              <label class="inline field">
-              <label for="PnCheckbox">Tous les hôtes</label>
+                <div class="ui checkbox">
+                  <input type="checkbox" id="excludeCheckbox" onchange="excludeInput.disabled = !this.checked"/>
+                  <label for="excludeCheckbox">Exclure les hôtes ou réseaux</label>
+                </div>
+              </label>
+              <input type="text" id="excludeInput" name="--exclude" placeholder="Hôte/réseau" list="targetsList" disabled
+                pattern="[a-zA-Z0-9._\/,\-]*" value=""
+                title="Les cibles peuvent être spécifiées par des noms d'hôtes, des adresses IP, des adresses de réseaux, etc.
+Exemples: <?=$_SERVER['REMOTE_ADDR']; ?>/24,<?=$_SERVER['SERVER_NAME']; ?>,10.0-255.0-255.1-254">
             </div>
           </div>
-          <div class="field">
-            <label>
-              <div class="ui checkbox">
-                <input type="checkbox" id="PSCheckbox" onchange="PSInput.disabled = !this.checked"/>
-                <label for="PSCheckbox">Ping TCP SYN</label>
-              </div>
-            </label>
-            <input type="text" id="PSInput" name="PS" placeholder="Ports" list="servicesList" disabled
-              pattern="([0-9\-]+|[a-z\-]+)(,[0-9\-]+|,[a-z\-]+)*"
-              title="Liste de ports ex: 22,23,25,80,113,1050,35000">
-          </div>
-        </fieldset>
 
-        <fieldset class="ui segment">
+          <div class="title"><i class="icon dropdown"></i>Découverte des hôtes</div>
-          <h3 class="header">Techniques de scan</h3>
+          <div class="content">
-          <div class="field">
+            <div class="inline field">
-            <label>
               <div class="ui checkbox">
-                <input type="checkbox" id="pCheckbox" onchange="pInput.disabled = !this.checked"/>
+                <input type="checkbox" id="sPCheckbox" name="-sP"/>
-                <label for="pCheckbox">Ne scanner que les ports</label>
+                <label for="sPCheckbox">N'effectuer que la découverte des hôtes actifs</label>
               </div>
-            </label>
+            </div>
-            <input type="text" id="pInput" name="p" placeholder="Ports" list="servicesList" disabled
+            <div class="inline field">
-              pattern="(([TU]:)?[0-9\-]+|[a-z\-]+)(,([TU]:)?[0-9\-]+|,[a-z\-]+)*"
+              <div class="ui checkbox">
-              title="Liste de ports ex: ssh,ftp,U:53,111,137,T:21-25,80,139,8080">
+                <input type="checkbox" id="PECheckbox" name="-PE"/>
-          </div>
+                <label for="PECheckbox">Considérer tous les hôtes comme actifs</label>
-        </fieldset>
+              </div>
+            </div>
+            <div class="field">
+              <label class="inline field">
+                <div class="ui checkbox">
+                  <input type="checkbox" id="PSCheckbox" onchange="PSInput.disabled = !this.checked"/>
+                  <label for="PSCheckbox">Ping TCP SYN</label>
+                </div>
+              </label>
+              <input type="text" id="PSInput" name="-PS" placeholder="Ports" list="servicesList" disabled
+                pattern="([0-9\-]+|[a-z\-]+)(,[0-9\-]+|,[a-z\-]+)*" value="80"
+                title="Liste de ports ex: 22,23,25,80,113,1050,35000">
+            </div>
+            <div class="field">
+              <label>
+                <div class="ui checkbox">
+                  <input type="checkbox" id="PACheckbox" onchange="PAInput.disabled = !this.checked"/>
+                  <label for="PACheckbox">Ping TCP ACK</label>
+                </div>
+              </label>
+              <input type="text" id="PAInput" name="-PA" placeholder="Ports" list="servicesList" disabled
+                pattern="([0-9\-]+|[a-z\-]+)(,[0-9\-]+|,[a-z\-]+)*" value="80"
+                title="Liste de ports ex: 22,23,25,80,113,1050,35000">
+            </div>
+            <div class="field">
+              <label>
+                <div class="ui checkbox">
+                  <input type="checkbox" id="PUCheckbox" onchange="PUInput.disabled = !this.checked"/>
+                  <label for="PUCheckbox">Ping UDP</label>
+                </div>
+              </label>
+              <input type="text" id="PUInput" name="-PU" placeholder="Ports" list="servicesList" disabled
+                pattern="([0-9\-]+|[a-z\-]+)(,[0-9\-]+|,[a-z\-]+)*" value="31338"
+                title="Liste de ports ex: 22,23,25,80,113,1050,35000">
+            </div>
 
-        <button type="submit" class="ui fluid large teal submit button">Démarrer</button>
+            <div class="inline fields">
+              <label>Ping ICMP</label>
+              <div class="field">
+                <div class="ui checkbox">
+                  <input type="checkbox" id="PECheckbox" name="-PE"/>
+                  <label for="PECheckbox">Echo request</label>
+                </div>
+              </div>
+              <div class="field">
+                <div class="ui checkbox">
+                  <input type="checkbox" id="PPCheckbox" name="-PP"/>
+                  <label for="PPCheckbox">Timestamp request</label>
+                </div>
+              </div>
+              <div class="field">
+                <div class="ui checkbox">
+                  <input type="checkbox" id="PMCheckbox" name="-PM"/>
+                  <label for="PMCheckbox">Mask request</label>
+                </div>
+              </div>
+            </div>
+
+            <div class="field">
+              <div class="ui checkbox">
+                <input type="checkbox" id="PRCheckbox" name="-PR"/>
+                <label for="PRCheckbox">Ping ARP</label>
+              </div>
+            </div>
+          </div>
+
+          <div class="title"><i class="icon dropdown"></i>Techniques de scan</div>
+          <div class="content">
+            <div class="field">
+              <label>
+                <div class="ui checkbox">
+                  <input type="checkbox" id="pCheckbox" onchange="pInput.disabled = !this.checked"/>
+                  <label for="pCheckbox">Ne scanner que les ports</label>
+                </div>
+              </label>
+              <input type="text" id="pInput" name="-p" placeholder="Ports" list="servicesList" disabled
+                pattern="(([TU]:)?[0-9\-]+|[a-z\-]+)(,([TU]:)?[0-9\-]+|,[a-z\-]+)*"
+                title="Liste de ports ex: ssh,ftp,U:53,111,137,T:21-25,80,139,8080">
+            </div>
+          </div>
+
+        </div>
+
+        <button type="submit" class="ui fluid teal submit button">Démarrer</button>
       </form>
       
       <datalist id='targetsList'>
         <option value="<?=$_SERVER['REMOTE_ADDR']; ?>"></option>
-        <option value="<?=$_SERVER['REMOTE_ADDR']; ?>/24"></option>
+        <option value="192.168.1.0/24"></option>
         <option value="<?=$_SERVER['SERVER_NAME']; ?>"></option>
       </datalist>
       <datalist id='servicesList'>
@@ -102,46 +178,78 @@ foreach ($services as $name => $port) {
       </datalist>
     </main>
     <script>
-      const targetsWhitelist = Array.from(targetsList.options).map(option => option.value)
+const targetsWhitelist = Array.from(targetsList.options).map(option => option.value)
-      const servicesWhitelist = Array.from(servicesList.options).map(option => option.value)
+const servicesWhitelist = Array.from(servicesList.options).map(option => option.value)
+const joinWithSpaces = tags => tags.map(tag => tag.value).join(' ')
+const joinWithCommas = tags => tags.map(tag => tag.value).join(',')
 
-      var targetsTagify = new Tagify(targetsInput, {
+$('.ui.accordion').accordion()
-        delimiters: " |,",
-        originalInputValueFormat: tags => tags.map(tag => tag.value).join(' '),
-        whitelist: targetsWhitelist,
-      })
 
-      var PSTagify = new Tagify(PSInput, {
+var targetsTagify = new Tagify(targetsInput, {
-        delimiters: " |,",
+  delimiters: " |,",
-        originalInputValueFormat: tags => tags.map(tag => tag.value).join(','),
+  originalInputValueFormat: joinWithSpaces,
-        whitelist: servicesWhitelist,
+  whitelist: targetsWhitelist,
-      })
+})
-      PSCheckbox.onchange = () => {
-        PSInput.disabled = !PSCheckbox.checked
-        PSTagify.setDisabled(!PSCheckbox.checked)
-      }
-      PSCheckbox.onchange()
 
-      var pTagify = new Tagify(pInput, {
+var excludeTagify = new Tagify(excludeInput, {
-        delimiters: " |,",
+  delimiters: " |,",
-        originalInputValueFormat: tags => tags.map(tag => tag.value).join(','),
+  originalInputValueFormat: joinWithCommas,
-        whitelist: servicesWhitelist,
+  whitelist: targetsWhitelist,
-      })
+})
-      pCheckbox.onchange = () => {
+excludeCheckbox.onchange = (event) => {
-        pInput.disabled = !pCheckbox.checked
+  excludeInput.disabled = !excludeCheckbox.checked
-        pTagify.setDisabled(!pCheckbox.checked)
+  excludeTagify.setDisabled(!excludeCheckbox.checked)
-      }
+}
-      pCheckbox.onchange()
 
-      newScanForm.onsubmit = function (event) {
+var PSTagify = new Tagify(PSInput, {
-        if (this.checkValidity()) {
+  delimiters: " |,",
-          newScanForm.classList.add("loading")
+  originalInputValueFormat: joinWithCommas,
-          return true
+  whitelist: servicesWhitelist,
-        } else {
+})
-          event.preventDefault()
+PSCheckbox.onchange = () => {
-          this.reportValidity()
+  PSInput.disabled = !PSCheckbox.checked
-        }
+  PSTagify.setDisabled(!PSCheckbox.checked)
-      }
+}
+
+var PATagify = new Tagify(PAInput, {
+  delimiters: " |,",
+  originalInputValueFormat: joinWithCommas,
+  whitelist: servicesWhitelist,
+})
+PACheckbox.onchange = () => {
+  PAInput.disabled = !PACheckbox.checked
+  PATagify.setDisabled(!PACheckbox.checked)
+}
+
+var PUTagify = new Tagify(PUInput, {
+  delimiters: " |,",
+  originalInputValueFormat: joinWithCommas,
+  whitelist: servicesWhitelist,
+})
+PUCheckbox.onchange = () => {
+  PUInput.disabled = !PUCheckbox.checked
+  PUTagify.setDisabled(!PUCheckbox.checked)
+}
+
+var pTagify = new Tagify(pInput, {
+  delimiters: " |,",
+  originalInputValueFormat: joinWithCommas,
+  whitelist: servicesWhitelist,
+})
+pCheckbox.onchange = () => {
+  pInput.disabled = !pCheckbox.checked
+  pTagify.setDisabled(!pCheckbox.checked)
+}
+
+newScanForm.onsubmit = function (event) {
+  if (this.checkValidity()) {
+    newScanForm.classList.add("loading")
+    return true
+  } else {
+    event.preventDefault()
+    this.reportValidity()
+  }
+}
     </script>
   </body>
 

style.css

@@ -27,6 +27,10 @@
     margin-left: .3em;
 }
 
+.ui.ui.form .field .fields .field:not(:only-child) .ui.checkbox {
+    margin-top: 0;
+}
+
 .share-size {
     --free-ratio: calc(var(--free) / var(--total));
     --used-percent: calc(100% - 100%*var(--free-ratio));

stylesheet.xsl

@@ -89,7 +89,7 @@
                           <input class="prompt" type="text" id="targetsInput" name="targets" required="" oninput="hiddenInput.value=this.value"
                           pattern="[a-zA-Z0-9._\/ \-]+" value="{$targets}" placeholder="Scanner un réseau..."
                           title="Les cibles peuvent être spécifiées par des noms d'hôtes, des adresses IP, des adresses de réseaux, etc.
-Exemples: 192.168.1.0/24 scanme.nmap.org"/>
+Exemples: 192.168.1.0/24 scanme.nmap.org 10.0-255.0-255.1-254"/>
                         <i class="satellite dish icon"></i>
                           <button style="display:none" type="submit" formaction="scan.php" formmethod="get"></button>
                         </div>