Code Monkey home page Code Monkey logo

dokuwiki-plugin-switchpanel's Introduction

Dokuwiki Switch Panel Plugin

Coloring networks

Example code :

<switchpanel>
==text
Coloring networks
==line
1,Aa:color=#FF6164
2,B1:color=#FF61ED
3,C1:color=#9361FF
4,D1:color=#6176FF
5,E1:color=#61FCFF
6,note,FO:color=#61FF88
7:case=none
8,A2:color=#C0FF61
9,B2:color=#FFDA61
10,C2:color=red
</switchpanel>

Coloring labels

Example code :

<switchpanel>
==text
Coloring labels
==line
1,A1:labelBgColor=#FF6164
2,B1:labelTxtColor=#FF61ED
3,C1:labelBgColor=#9361FF,labelTxtColor=#61FF88
4,D1:labelBgColor=red
5,E1:labelBgColor=black,labelTxtColor=white
</switchpanel>

Coloured RJ45 LEDs

Example code :

<switchpanel>
==text
Link Speed &emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&nbsp;&nbsp; POE Payload
==line:number=9
1,OFF
2,10M:leftLedColor=red
3,100M:leftLedColor=yellow
4,1G:leftLedColor=lime
5,10G:leftLedColor=blue
6:case=none
7,OFF
8,24V:leftLedColor="#666666",rightLedColor=orange
9,48V:leftLedColor="#666666",rightLedColor=lime
</switchpanel>

Exemple usage :

the leftLedColor is:

  • OFF : โ€œ#666666โ€(default if no value)
  • 10M : red
  • 100M : yellow
  • 1G : lime
  • 10G : blue

And the rightLedColor is :

  • OFF : no POE (default if no value)
  • 24V : orange
  • 48V : lime

All types cases

Example code :

<switchpanel>
==text
All types cases
==line
1,rj45:case=rj45
2,of:case=of
3,2of:case=2of
4,gbic:case=gbic
5,none:case=none
6,serial:case=serial
7,close:case=close
</switchpanel>

No ears display

Example code :

<switchpanel showEars="false">
==text
No ears display
==line:number=8
2,of,of:case=of
==line:number=8
2,foo,bar
</switchpanel>

Height separator

Example code :

<switchpanel showEars="false">
==text
Height separator
==line:number=8
2,of,of:case=of
==line
==heightBar
==line
1:case=none
6:case=none
==heightBar:height=20
==line
</switchpanel>

Popup message information and link

Example code :

<switchpanel>
==text
Popup message information and link
==line:number=8
1,1:text="Hello World",link="https://greenitsolutions.fr/",textlink="GreenITSolutions website"
8,8:text="<b>From:</b> Office Level, Netgear switch port 1<br><b>To:</b> HP switch port 18<br><b>Speed:</b> 10G <hr> Additional information",link="https://greenitsolutions.fr/",textlink="Documentation"
==line
==line
==line
==line
</switchpanel>

You can use HTML tags in the text field for layout :

Text bar information

Example code :

<switchpanel>
==text
Text bar information
==line:number=8
==text:bgColor=#80cc28,color=#fff,size=16,brColor=#1D611F,brRadius=2
By Green IT Solutions
==line
</switchpanel>

Screw style

Example code :

<switchpanel screwHeightSpace="30" screwHeight="8" screwWidth="10" screwColor="#80cc28">
==text
Screw style
==line:number=8
==line
==line
==line
</switchpanel>

Hide logo

Example code :

<switchpanel logo=none>
==text
Hide logo
==line:number=8
==line
</switchpanel>

Group ports

Example code :

<switchpanel group="6">
==line:number=12
1,PC1
2,PC2
3,PC3
6,??
==line
1,AB
</switchpanel>

Label line

Example code :

<switchpanel group="6">
==line:number=12,labelLeft=01,labelRight=A1,colorLabelRight=#FF6164
1,PC1
2,PC2
3,PC3
6,??
==line:labelLeft=02
1,AB
</switchpanel>

All options of "switchpanel"

<switchpanel
    logo="URL OF LOGO"
    logoLink="URL OF LINK"
    labelBgColor="#fff"
    labelTxtColor="#000"
    leftLedColor="#00ff00"
    rightLedColor="#666666"
    target="_blank"
    showEars=true / false
    case="rj45" (case a default)
    group="0"
    groupSeparatorWidth="18"
    color="#ccc" (case color default)
    elementWidth="36"
    elementHeight="45"
    elementSeparatorWidth="5"
    elementSeparatorHeight="5"
    textSize="20"
    textColor="#fff"
    textBgColor="" (no default background color defined)
    textBrColor=""
    textBrRadius=""
    barHeight="5"
    screwHeightSpace=60
    screwHeight=15
    screwWidth=20
    screwColor="#fff"
    switchColor="#808080" (backgroud color default)
    >

==line:number=(number of cases),color=(backgroud color of the line case),case=(type of the line case),labelLeft=(label left of the line),labelRight=(label right of the line),colorLabelLeft=(color of label left),colorLabelRight=(color of label right),labelBgColor=(background color of the case label),labelTxtColor=text color of the case label),leftLedColor=(color of the left LED),rightLedColor(color of the right LED)

==text:bgColor=(backgroud color),color=(text color),size=(text size),brColor=(border color),brRadius=(border radius)

==heightBar:heigth=(height bar)

1,label,title:color=(backgroud color),text=(text of popup message),link=(url of link),case=(type of case),target=(type of link target),labelBgColor=(background color of the case label),labelTxtColor=text color of the case label),leftLedColor=(color of the left LED),rightLedColor(color of the right LED)

# this is a comment

</switchpanel>

dokuwiki-plugin-switchpanel's People

Contributors

amazingbeu avatar gluk00 avatar lpaulsen93 avatar punk-t avatar splitbrain avatar support-green-it-solutions avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

dokuwiki-plugin-switchpanel's Issues

Sizing with last version of dokuwiki

helo,
I have some trouble with the last version of dokuwiki.
with code :

~~NOCACHE~~
<switchpanel>
==text
Coloring networks
==line
1,Aa:color=red
2,B1:color=#FF61ED
3,C1:color=#9361FF
4,D1:color=#6176FF
5,E1:color=#61FCFF
6,note,FO:color=#61FF88
7:case=none
8,A2:color=#C0FF61
9,B2:color=#FFDA61
10,C2:color=red
</switchpanel>

I have
image

If i change the line :
$sSvg = '<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="'.$iHeightSvg.'px" width="'.$iWidthSvg.'px">'.
to :
$sSvg = '<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="height:'.$iHeightSvg.'px; width:'.$iWidthSvg.'px">'.
I have :
image

font size in port label too big

Hi,

With CISCO interfaces names (like GE0/48 or FE0/48) font size is too big to fit in label above port.
Can you resize that or add a parameter to change the font size

Feature Request: scrollable container when panel exceeds page width

Hello!

Switch panels, that exceeds the display width, are not scrollable by now. The former patch panels are. This is useful for large switches like:

<switchpanel logo=none case="rj45">
==line:number=28
  1:
  25:case=none
  26:case=none
  27:case=none
  28:case=none
==line
  1:
  24,Uplink,48:color=#ffffff,text=Alle VLANs; tagged
  25:case=2of
  26:case=2of
  27:case=2of
  28:case=2of
</switchpanel>

The code above is a real life example of a Dell PowerConnect2848 Switch.

Comparing the two generated html outputs of patch panel versus switch panel, I found an explicit width/height information at the surrounding div container in patch panel.

Maybe its just so simple.

Bug: "Popup message information and link"

I'm using "popup message information and link". Those small windows are shown from actual cursor position "upper left corner".
If one of the rightest ports on my displayed 48 Port Switch, I can't see the whole content, 'cause most of the informations are "behind" the right site of my monitor:
switchpanelbug

I am depreciating my version in favor of this

You have done a great job carrying on from my patchpanel plugin.

Obviously, I haven't had time to maintain my version in quite some time, so I am going to switch to using your version, and depreciate my own with links to this project.

One thing I would appreciate, since this is a fork of my project, is if you gave me credit somewhere in the source, as I did with the rack plugin that I originally based mine on.

Add support for USB ports

New devices come with USB ports instead of or in addition to serial ports.

Please add a USB port symbol.

Feature request: CSV export-option

on the old patchpanel-plugin there was an option calles "show CVS" where it was possibe to show an comma-separated list from the defined ports.

i.e.:

Port,Label,Comment
"19","19","Kabel 8M32748 -> imap.example.org"
"41","41","Kabel 15M33319 -> mailgate1.example.orge (IPMI)"
"42","42","Kabel 15M33310 -> cwgate1.example.org (IPMI)"

It were grait, if a similar option could be integrated into switchpanel-plugin.

PHP7 compliance

Hi,

Seems that the plugin is not PHP7 compliant.
Ex : Warning: Declaration of syntax_plugin_switchpanel::render($mode, &$renderer, $opt) should be compatible with DokuWiki_Syntax_Plugin::render($format, Doku_Renderer $renderer, $data) in C:\xampp\htdocs\wiki\lib\plugins\switchpanel\syntax.php on line 432

Thank you

Add support for SFP and QSFP ports

Switches have more difference sockets like:

  • SFP+ (1G, 10G)
  • QSFP+ / QSFP28+ (40G, 100G)
  • LC connector (optical)

While 1G Ethernet might be wide spread, 10G Ethernet is moving into server rooms to connect NAS / SAN units to servers. It's also used to distribute 10G Ethernet to the next switches.

I think an option should be added to display possible link speeds like:

  • 1G
  • 2G / 5G (non IEEE Std. 802.3 conform)
  • 10G
  • 40G
  • 100G

Default logo link should be no link

Currently, if no logo for logoLink is specified, the plugin defaults to http://www.greenitsolutions.fr/

I completely understand why you would want to do that as a plugin author. However, my wiki is running in a corporate environment, so this default behaviour is not deisrable. I can't force users to specify logo, but management will not be pleased to see links to external sites which have nothing to do with our company. For now, I had to hack the plugin, but perhaps you would consider changing the default behaviour...?

Thank you for your work on this useful plugin!

Two switch panels side by side

Hi,

With old patchpanel, we could put two patchpanels side by side.
With switchpanel, this formatting isn't possible anymore in the wiki page.
Can you help me ?

Documenting Server Racks

I like your DokuWiki plugin very much. Is it possible to create a derived plugin to document Racks?

The existing rack plugin is outdated and doesn't look as nice as your plugin.

Feature request: LabelColor and/or LabelBgColor

In my company I deal very intensive with tagged and untagged VLANs. In addition to the possibility of coloring the cases, it might be useful to color the label of a case or its background.

When one uses different case colors for different VLANs there is no fast and visually significant posibility to mark some port as a port of special interest.

As an example:

<switchpanel case=rj45>
==text:size=12
==line:number=8
  1
  2
  3,label:labelBgColor=#ff0000,title:text=brief explantaion
</switchpanel>

Might be cool, maybe :)

Greetings

Popup messages don't work after upgrade

Popup messages don't work after upgrade to the last version of the switch panel plugin.
We tested with Firefox and Chrome.
There have been no changes in versions of Dokuwiki, Apache or PHP.
Is it necessary to make any changes to the server?
Many thanks

How to add a linebreak into the popup message?

For a patch panel port, I would like to have a popup message showing something like this:

From:  Office Level, Netgear switch port 1
To:    HP switch port 18
Speed: 10G

How to add a linebreak or text-wrap into the popup message for a patch panel port?

Label text for different case types

Hello!

First of all: THANK YOU VERY MUCH, I was looking for an extended patch panel plugin like this. I forked the patch panel plugin and tried by my own, but your results are much better.

Now the technical part:
I played with something like

<switchpanel logo=none>
==text
ip-adresse
==line
1,1:color=#FF6164,case=rj45,text="Ein Text-Test"
2,2:color=#FF6164,case=of,text="Ein Text-Test"
3,3:color=#FF6164,case=2of,text="Ein Text-Test"
4,4:color=#FF6164,case=gbic,text="Ein Text-Test"
5,5:color=#FF6164,case=serial,text="Ein Text-Test"
6,6:color=#FF6164,case=close,text="Ein Text-Test"
</switchpanel>

and hoped to get a popup for every case type but the result of example above is: No popup for of, 2of,gbic,none. At least for types of, 2of and gbic an additional text is vitally useful.

Can you confirm this as an issue or did I do something stupid?

Greetings
Punkt

If text="" specified, display broken unless case type also specified

Adding a text, link, or textlink value to a port causes unexpected display issues, unless case type is specified for that port. This makes case type defaulting not very useful.

This code:

<switchpanel>
==line:number=6
1,1,
2,2
3,3
4,4
5,5
6,6
</switchpanel>

displays:
image
which is what I expect.

However, I want to add a hover label to the port. I try this code:

<switchpanel>
==line:number=6
1,1,text="example"
2,2
3,3
4,4
5,5
6,6
</switchpanel>

but this appears to pass the whole text="example" tag through, which is surely not desirable:
image

I can work around that by specifying the case type:

<switchpanel logo="http://www.opensecurityarchitecture.org/cms/images/OSA_images/icon_library/osa_hub.png">
==line:number=6
1,1:case=rj45,text="example"
2,2
3,3
4,4
5,5
6,6
</switchpanel>

which then gives me what I expect:
image

Am I doing something wrong, or is the case type defaulting broken when text is specified?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.